- Improve the movement of the placeholder

- Make sure the thumbgrid will utoscroll when dragging
- And an ordinal attribute to the thumbnail when generated, based on the
current sort order of the album.

3 files changed, 21 insertions, 8 deletions

diff --git a/modules/organize/controllers/organize.php b/modules/organize/controllers/organize.php
index 91b465c5..8ec3f1cf 100644
--- a/modules/organize/controllers/organize.php
+++ b/modules/organize/controllers/organize.php
@@ -48,6 +48,7 @@ class Organize_Controller extends Controller {
     $v->children = $item->children($page_size, $offset);
     $v->thumbsize = self::$_MICRO_THUMB_SIZE;
     $v->padding = self::$_MICRO_THUMB_PADDING;
+    $v->offset = $offset;
 
     print json_encode(array("count" => $v->children->count(),
                             "data" => $v->__toString()));
diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 6a2cc0d6..8f4fe9ed 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -103,7 +103,25 @@ function retrieve_micro_thumbs() {
         $(this).removeClass("ui-selected");
       }
     });
-    $(".gMicroThumbContainer").draggable({
+    $(".gMicroThumbContainer").mousemove(function(event) {
+      if ($("#gDragHelper").length > 0 && $(this).attr("id") != "gPlaceHolder") {
+        if (event.pageX < this.offsetLeft + this.offsetWidth / 2) {
+          $(this).before($("#gPlaceHolder"));
+        } else {
+          $(this).after($("#gPlaceHolder"));
+        }
+        var container = $("#gMicroThumbPanel").get(0);
+        var scrollHeight = container.scrollHeight;
+        var scrollTop = container.scrollTop;
+        var height = $(container).height();
+        if (event.pageY > height + scrollTop) {
+          container.scrollTop = this.offsetTop;
+        } else if (event.pageY < scrollTop) {
+         container.scrollTop -= height;
+        }
+      }
+    });
+   $(".gMicroThumbContainer").draggable({
       cancel: ".gMicroThumbContainer:not(.ui-selected)",
       handle: ".gMicroThumbContainer.ui-selected",
       zindex: 2000,
@@ -151,12 +169,6 @@ function retrieve_micro_thumbs() {
         $("#gPlaceHolder").remove();
       }
     });
-    $(".gMicroThumbContainer").droppable( {
-      tolerance: "pointer",
-      over: function(event, ui) {
-        $(this).after($("#gPlaceHolder"));
-      }
-    });
     $("#gMicroThumbPanel").droppable( {
       tolerance: "pointer",
       drop: function(event, ui) {
diff --git a/modules/organize/views/organize_thumb_grid.html.php b/modules/organize/views/organize_thumb_grid.html.php
index 64d8aaf3..484d1260 100644
--- a/modules/organize/views/organize_thumb_grid.html.php
+++ b/modules/organize/views/organize_thumb_grid.html.php
@@ -4,7 +4,7 @@
 <? if ($child->is_album()): ?>
   <? $item_class = "gAlbum"; ?>
 <? endif ?>
-<li id="thumb_<?= $child->id ?>" class="gMicroThumbContainer" ref="<?= $child->id ?>">
+<li id="thumb_<?= $child->id ?>" class="gMicroThumbContainer" ref="<?= $child->id ?>" ordinal="<?= $offset + $i ?>">
   <div id="gMicroThumb-<?= $child->id ?>" class="gMicroThumb <?= $item_class ?>">
     <?= $child->thumb_tag(array("class" => "gThumbnail"), $thumbsize, true) ?>
   </div>