From 11b4af7568a5156095a7f7388bec35e6979cd314 Mon Sep 17 00:00:00 2001
From: Dan Helfman <dan@luminotes.com>
Date: Mon, 9 Feb 2009 15:01:44 -0800
Subject: [PATCH] Changed drop targets from boxes to just lines so as not to
 screw up drag positioning. Also added drop target before first note.

---
 static/css/style.css | 11 ++++++++---
 static/js/Editor.js  | 18 ++++++++++++------
 2 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/static/css/style.css b/static/css/style.css
index b0561bf..6148ac8 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -564,14 +564,19 @@ h1 {
   z-index: 2;
 }
 
+.note_drag_source_area {
+  margin-bottom: 0.75em;
+}
+
 .note_drop_target {
   -moz-border-radius: 5px;
-  height: 2em;
-  margin-bottom: 0.75em;
-  border: 2px dashed #ffcc66;
+  position: relative;
+  top: -0.5em;
+  border-top: 2px dashed #999999;
 }
 
 .note_drop_target_hover {
+  height: 2em;
   border: 2px dashed #000000;
 }
 
diff --git a/static/js/Editor.js b/static/js/Editor.js
index 1c7687e..bc8959c 100644
--- a/static/js/Editor.js
+++ b/static/js/Editor.js
@@ -691,14 +691,20 @@ Editor.prototype.start_drag = function ( event ) {
 
   // add a blank div to the area where the editor is popping out from. this lets the user easily
   // see where the editor came from
-  var drop_target = createDOM( "div", { "class": "note_drop_target" } );
+  var drop_target = createDOM( "div", { "class": "note_drag_source_area", "id": "note_drag_source_area" } );
   insertSiblingNodesAfter( this.holder, drop_target );
   var div_size = getElementDimensions( this.div );
   div_size.w -= FRAME_BORDER_WIDTH * 2;
   setElementDimensions( drop_target, div_size );
 
-  // add drop target divs between every note
+  // add drop target divs between every note and before the first note
   var holders = getElementsByTagAndClassName( "table", "note_holder" );
+  if ( holders[ 0 ] != this.holder ) {
+    drop_target = createDOM( "div", { "class": "note_drop_target" } );
+    insertSiblingNodesBefore( holders[ 0 ], drop_target );
+    setElementDimensions( drop_target, { "w": div_size.w } );
+  }
+
   for ( var i in holders ) {
     var holder = holders[ i ];
     i = parseInt( i );
@@ -806,12 +812,12 @@ Editor.prototype.drop = function( event ) {
   this.drag_mouse_position = null;
 
   var drop_targets = getElementsByTagAndClassName( "div", "note_drop_target" );
-  var target_position = getElementPosition( drop_targets[ 0 ] );
-  for ( var i in drop_targets ) {
+  for ( var i in drop_targets )
     removeElement( drop_targets[ i ] );
-  }
 
-  setElementPosition( this.holder, target_position );
+  var drag_source_area = getElement( "note_drag_source_area" );
+  setElementPosition( this.holder, getElementPosition( drag_source_area ) );
+  removeElement( drag_source_area );
 }
 
 Editor.prototype.key_pressed = function ( event ) {