1. Christian Scholz
  2. quantumbuster.assets

Commits

Christian Scholz  committed 865f189

cleanups

  • Participants
  • Parent commits 1216044
  • Branches default

Comments (0)

Files changed (2)

File quantumbuster/assets/design/src/screen.sass

View file
  • Ignore whitespace
   padding: 10px
   width: 100%
   
+// ASSET VIEW
 
+#asset
+  z-index: 2
+  position: relative
 
 // marker display
 
   background: #f33
 
 .marker
-  border: 3px solid #fff
+  border: 1px solid #fff
   +box-shadow(0px,0px,2px,rgba(0,0,0,1))
+  z-index: 99
+  position: absolute
+  
+.marker.highlight
+  border: 3px solid #fd0
 
-// asset container
-
+.marker-info
+  display: none
+  z-index: 99
+  position: absolute
+  background: #fe0
+  color: black
+  font-weight: bold
+  +border-radius(5px)
+  +box-shadow(2px,1px,2px, rgba(0,0,0,0.1))
+  width: 200px
+  padding: 5px
 
 // comment box
 
   margin: 8px 0px
 
 .comment-item.comment-highlight
-  background: #fa0
+  background: #fe0
   
 .comment-author
   font-weight: bold

File quantumbuster/assets/static/js/comments.js

View file
  • Ignore whitespace
         $("#add-note-button").click(commentapp.on_add_clicked);
         commentapp.load_comments();
     },
-    
-    on_comments_loaded: function(data, textStatus) {
-        commentapp.comments = data;
-        commentapp.show_comments();
-        commentapp.show_comment_listing();
-        
-        // start new poll 
-        //commentapp.poll_timer = window.setTimeout(commentapp.load_comments, 
-        //                    commentapp.poll_interval)
-    },
-    
-    
+
     // load the comments
     load_comments: function() {
         if (commentapp.active_comment) {
         });
     },
     
+    on_comments_loaded: function(data, textStatus) {
+        commentapp.comments = data;
+        commentapp.show_comments();
+        
+        // start new poll 
+        commentapp.poll_timer = window.setTimeout(commentapp.load_comments, 
+                            commentapp.poll_interval)
+    },
+    
     // display the comments we have
     show_comments: function() {
         // clear all notes
         $(".marker").each(function() {$(this).remove(); })
+        $(".marker-info").each(function() {$(this).remove(); })
         $(".entrybox").each(function() {$(this).remove(); })
-
-        $("#asset").css({'z-index': 2, 'position': 'relative'});
-        
+        $(".comment-item").each(function() {$(this).remove(); })
+                
         // iterate over all comments and display them
         for (i=0; i<this.comments.length; i++) {
             var comment = this.comments[i];
         }
         commentapp.active_comment = null;
     },
-    
-    // display the whole comment listing
-    show_comment_listing: function() {
-        $(".comment-item").each(function() {$(this).remove(); })
-        for (i=0; i<this.comments.length; i++) {
-            var comment = this.comments[i];
-            commentapp.create_comment(comment); // TODO: rename
-        }        
-    },
-    
+        
     // creates a new marker inside the notes area
     create_marker: function(comment) {
+        var id = comment['_id'];
         $('<div class="marker" id="n-'+comment['_id']+'"></div>')
         .css({
             width: comment.box.width,
             height: comment.box.height,
             top: comment.box.y,
             left: comment.box.x,
-            "z-index": 99,
-            position: "absolute"
         })
         .click(commentapp.on_comment_clicked)
+        .hover(commentapp.on_comment_hover_in, commentapp.on_comment_hover_out)
         .appendTo("#notes");
+        $('<div class="marker-info" id="info-'+id+'">'+comment.comment+'</div>')
+        .css({
+            top: comment.box.y + comment.box.height+10,
+            left: comment.box.x
+        })
+        .appendTo("#notes");
+            
+        // create comment in comment list
+        $(comment_jst.expand(comment))
+        .hover(commentapp.on_comment_hover_in, commentapp.on_comment_hover_out)        
+        .appendTo("#comments");
+        
     },
     
-    // display comment in comment box
-    create_comment: function(comment) {
-        var html = comment_jst.expand(comment);
-        $("#comments").append(html);
+    on_comment_hover_in: function() {
+        if (commentapp.active_comment) {
+            return;
+        }
+        var id = $(this).attr('id');
+        id = id.slice(2,id.length);
+        $("#info-"+id).show();
+        $("#n-"+id).addClass("highlight");
+        $("#c-"+id).addClass("comment-highlight");
+        
+    },
+
+    on_comment_hover_out: function() {
+        var id = $(this).attr('id');
+        id = id.slice(2,id.length);
+        $("#info-"+id).hide();
+        $("#n-"+id).removeClass("highlight");
+        $("#c-"+id).removeClass("comment-highlight");
+        
     },
     
     // create a new empty comment
         if (commentapp.poll_timer) {
             window.clearTimeout(commentapp.poll_timer);            
         }
+        if (commentapp.active_comment) {
+            return false;
+        }
         
         // first we need to create a dummy marker
         var comment = {
         
         var id = $(this).attr('id');
         id = id.slice(2,id.length);
+
+        $("#info-"+id).hide(); // hide info
+        
         if (commentapp.active_comment) {
             return; // if something is active already, don't make another one
         };
-        
         commentapp.active_comment = id;        
         commentapp.enable_edit(commentapp.find_comment(id));
         return false;
             success: commentapp.on_comments_loaded,
         });
         return false;
-        
     },
     
     // save a note