Support moving an item before or after the target.

3 files changed, 31 insertions, 10 deletions

diff --git a/modules/organize/controllers/organize.php b/modules/organize/controllers/organize.php
index 18e6054b..c23d6d61 100644
--- a/modules/organize/controllers/organize.php
+++ b/modules/organize/controllers/organize.php
@@ -103,7 +103,7 @@ class Organize_Controller extends Controller {
     json::reply(null);
   }
 
-  function move_before() {
+  function rearrange() {
     access::verify_csrf();
 
     $input = Input::instance();
@@ -125,20 +125,25 @@ class Organize_Controller extends Controller {
     }
 
     $source_ids = explode(",", $input->post("source_ids"));
+    $base_weight = $target->weight;
+    if ($input->post("relative") == "after") {
+      $base_weight++;
+    }
+
     if ($source_ids) {
       // Make a hole the right size
       db::build()
         ->update("items")
         ->set("weight", db::expr("`weight` + " . count($source_ids)))
         ->where("parent_id", "=", $album->id)
-        ->where("weight", ">=", $target->weight)
+        ->where("weight", ">=", $base_weight)
         ->execute();
 
       // Move all the source items to the right spots.
       for ($i = 0; $i < count($source_ids); $i++) {
         $source = ORM::factory("item", $source_ids[$i]);
         if ($source->parent_id = $album->id) {
-          $source->weight = $target->weight + $i;
+          $source->weight = $base_weight + $i;
           $source->save();
         }
       }
diff --git a/modules/organize/css/organize.css b/modules/organize/css/organize.css
index be449138..82de9ad7 100644
--- a/modules/organize/css/organize.css
+++ b/modules/organize/css/organize.css
@@ -45,11 +45,16 @@
   background: #eee;
 }
 
-.g-organize div.active {
+.g-organize div.active-left {
   border-left: 4px solid #C9D8EB;
   margin-left: 4px;
 }
 
+.g-organize div.active-right {
+  border-right: 4px solid #C9D8EB;
+  margin-right: 4px;
+}
+
 div.multi-proxy div {
   display: inline-block;
 }
diff --git a/modules/organize/views/organize_dialog.html.php b/modules/organize/views/organize_dialog.html.php
index 773e1955..a482fb92 100644
--- a/modules/organize/views/organize_dialog.html.php
+++ b/modules/organize/views/organize_dialog.html.php
@@ -131,13 +131,22 @@
             getTargetFromEvent: function(e) {
               return e.getTarget("div.thumb", 10);
             },
-            onNodeEnter: function(target, dd, e, data) {
-              Ext.fly(target).addClass("active");
-            },
             onNodeOut: function(target, dd, e, data) {
-              Ext.fly(target).removeClass("active");
+              Ext.fly(target).removeClass("active-left");
+              Ext.fly(target).removeClass("active-right");
             },
             onNodeOver: function(target, dd, e, data) {
+              var target_x = Ext.lib.Dom.getX(target);
+              var target_center = target_x + (target.offsetWidth / 2);
+              if (Ext.lib.Event.getPageX(e) < target_center) {
+                Ext.fly(target).addClass("active-left");
+                Ext.fly(target).removeClass("active-right");
+                this.drop_side = "before";
+              } else {
+                Ext.fly(target).removeClass("active-left");
+                Ext.fly(target).addClass("active-right");
+                this.drop_side = "after";
+              }
               return Ext.dd.DropZone.prototype.dropAllowed;
             },
             onNodeDrop: function(target, dd, e, data) {
@@ -147,8 +156,9 @@
                 source_ids.push(Ext.fly(nodes[i]).getAttribute("rel"));
               }
               start_busy(<?= t("Rearranging...")->for_js() ?>);
+              target = Ext.fly(target);
               Ext.Ajax.request({
-                url: '<?= url::site("organize/move_before") ?>',
+                url: '<?= url::site("organize/rearrange") ?>',
                 method: "post",
                 success: function() {
                   stop_busy();
@@ -161,7 +171,8 @@
                 },
                 params: {
                   source_ids: source_ids.join(","),
-                  target_id: Ext.fly(target).getAttribute("rel"),
+                  target_id: target.getAttribute("rel"),
+                  relative: this.drop_side, // calculated in onNodeOver
                   csrf: '<?= access::csrf_token() ?>'
                 }
               });