From 95b26db82c3f835f66cdb32aef13aa84a6a206e5 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Wed, 3 Feb 2010 13:56:04 -0800
Subject: 1) Simplify the layout of the organize dialog content. 2) Use CSS to
 layout the thmbnail grid to the full dialog size.  Fixes ticker #848. 3)
 Separate css that can be themed into organize_theme.css.  This isolates the
 themed components into a separate file for easy of overriding by a theme.

---
 modules/organize/js/organize.js | 30 ++++++++++++++----------------
 1 file changed, 14 insertions(+), 16 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 76eadf85..a89305f6 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -4,15 +4,15 @@
       handle: ".ui-selected",
       distance: 10,
       cursorAt: { left: -10, top: -10},
-      appendTo: "#g-organize-microthumb-panel",
+      appendTo: "#g-organize",
       helper: function(event, ui) {
         var selected = $(".ui-draggable.ui-selected img");
         if (selected.length) {
           var set = $('<div class="g-drag-helper"></div>')
 		      .css({
-            zIndex: 2000,
-            width: 80,
-            height: Math.ceil(selected.length / 5) * 16
+                        zIndex: 2000,
+                        width: 80,
+                        height: Math.ceil(selected.length / 5) * 16
 		      });
           var offset = $(this).offset();
           var click = {left: event.pageX - offset.left, top: event.pageY - offset.top};
@@ -37,16 +37,16 @@
       },
 
       start: function(event, ui) {
-        $("#g-organize-microthumb-panel .ui-selected").hide();
+        $("#g-organize-microthumb-grid .ui-selected").hide();
       },
 
       drag: function(event, ui) {
-        var top = $("#g-organize-microthumb-panel").offset().top;
-        var height = $("#g-organize-microthumb-panel").height();
+        var top = $("#g-organize-microthumb-grid").offset().top;
+        var height = $("#g-organize-microthumb-grid").height();
         if (ui.offset.top > height + top - 20) {
-          $("#g-organize-microthumb-panel").get(0).scrollTop += 100;
+          $("#g-organize-microthumb-grid").get(0).scrollTop += 100;
         } else if (ui.offset.top < top + 20) {
-          $("#g-organize-microthumb-panel").get(0).scrollTop = Math.max(0, $("#g-organize-microthumb-panel").get(0).scrollTop - 100);
+          $("#g-organize-microthumb-grid").get(0).scrollTop = Math.max(0, $("#g-organize-microthumb-grid").get(0).scrollTop - 100);
         }
       }
     },
@@ -63,7 +63,7 @@
           target_id = $(".currentDropTarget").attr("ref");
         } else {
           before_or_after = "after";
-          target_id = $("#g-organize-microthumb-grid li:last").attr("ref");
+          target_id = $("#g-organize-microthumb-grid div:last").attr("ref");
         }
         $.organize.do_drop({
           url: rearrange_url
@@ -92,7 +92,7 @@
     },
 
     do_drop: function(options) {
-      $("#g-organize-microthumb-panel").selectable("destroy");
+      $("#g-organize-microthumb-grid").selectable("destroy");
       var source_ids = [];
       $(options.source).each(function(i) {
         source_ids.push($(this).attr("ref"));
@@ -102,7 +102,7 @@
         $.post(options.url,
 	        { "source_ids[]": source_ids },
 	        function(data) {
-            $.organize._refresh(data);
+                  $.organize._refresh(data);
 	        },
 	      "json");
       }
@@ -141,8 +141,6 @@
       $("#g-dialog").dialog("option", "zIndex", 70);
       $("#g-dialog").bind("dialogopen", function(event, ui) {
         $("#g-organize").height($("#g-dialog").innerHeight() - 20);
-        $("#g-organize-microthumb-grid").height($("#g-dialog").innerHeight() - 91);
-        $("#g-organize-tree-container").height($("#g-dialog").innerHeight() - 60);
       });
 
       $("#g-dialog").bind("dialogclose", function(event, ui) {
@@ -210,11 +208,11 @@
       if ($(parent).hasClass("g-view-only")) {
         return;
       }
-      $("#g-organize-microthumb-panel").selectable("destroy");
+      $("#g-organize-microthumb-grid").selectable("destroy");
       var id = $(event.currentTarget).attr("ref");
       $(".g-organize-album-text.ui-state-focus").removeClass("ui-state-focus");
       $(".g-organize-album-text[ref=" + id + "]").addClass("ui-state-focus");
-      var url = $("#g-organize-microthumb-panel").attr("ref").replace("__ITEM_ID__", id).replace("__OFFSET__", 0);
+      var url = $("#g-organize-microthumb-grid").attr("ref").replace("__ITEM_ID__", id).replace("__OFFSET__", 0);
       $.get(url, {},
         function(data) {
           $("#g-organize-microthumb-grid").html(data.grid);
-- 
cgit v1.2.3


From a8d30dcecf40210096a4adaea0f5d231b69ead6a Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Fri, 5 Feb 2010 08:08:12 -0800
Subject: Improve the handling of the drop target marker when dragging items
 within the grid. Originally the borders disappeared not they don't. A single
 element is used to contain the drop target marker. This element contains all
 the position information for the drop handler to determine where the item
 should be positioned.

In addition, the drop target marker is removed when the drag extends outside
the grid and is re shown, when the cursor re-enters the thumbnail grid.
---
 modules/organize/css/organize_theme.css |   5 ++
 modules/organize/js/organize.js         | 100 +++++++++++++++++++++++---------
 2 files changed, 77 insertions(+), 28 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/css/organize_theme.css b/modules/organize/css/organize_theme.css
index 4248f095..3d289755 100644
--- a/modules/organize/css/organize_theme.css
+++ b/modules/organize/css/organize_theme.css
@@ -6,6 +6,11 @@
 }
 
 #g-organize-microthumb-grid,
+#g-organize-drop-target-marker,
 .g-organize-album-text:hover {
   border-color: #79B7E7;
 }
+
+#g-organize-drop-target-marker {
+ background-color: #79B7E7;
+}
diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index a89305f6..56377ce3 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -56,19 +56,11 @@
       tolerance: "pointer",
       greedy: true,
       drop: function(event, ui) {
-        var before_or_after = null;
-        var target_id = null;
-        if ($(".currentDropTarget").length) {
-          before_or_after = $(".currentDropTarget").css("borderLeftStyle") == "solid" ? "before" : "after";
-          target_id = $(".currentDropTarget").attr("ref");
-        } else {
-          before_or_after = "after";
-          target_id = $("#g-organize-microthumb-grid div:last").attr("ref");
-        }
+        var target = $("#g-organize-drop-target-marker").data("drop_position");
         $.organize.do_drop({
           url: rearrange_url
-          .replace("__TARGET_ID__", target_id)
-          .replace("__BEFORE__", before_or_after),
+          .replace("__TARGET_ID__", target.id)
+          .replace("__BEFORE__", target.before ? "before" : "after"),
           source: $(ui.helper).children("img")
         });
       }
@@ -120,14 +112,58 @@
       $.organize.set_handlers();
     },
 
-    mouse_move_handler: function(event) {
+    grid_mouse_leave_handler: function(event) {
+      if ($(".g-drag-helper").length && $("#g-organize-drop-target-marker").length) {
+        $("#g-organize-drop-target-marker").remove();
+      }
+    },
+
+    grid_mouse_move_handler: function(event) {
       if ($(".g-drag-helper").length) {
-        $(".g-organize-microthumb-grid-cell").css({borderStyle: "hidden", margin: "6px"});
-        $(".currentDropTarget").removeClass("currentDropTarget");
-        var borderStyle = event.pageX < $(this).offset().left + $(this).width() / 2 ?
-          {borderLeftStyle: "solid", marginLeft: "2px"} : {borderRightStyle: "solid", marginRight: "2px"};
-        $(this).addClass("currentDropTarget")
-          .css(borderStyle);
+        var cellSize = $("#g-organize").data("cellSize");
+        var thumbnailCount = $(".g-organize-microthumb-grid-cell:visible").length;
+        var rows = Math.ceil(thumbnailCount / cellSize.columns);
+
+
+        var itemPos = {
+          col: Math.floor((event.pageX - $(this).offset().left) / cellSize.width),
+          row: Math.floor((event.pageY - $(this).offset().top) / cellSize.height)
+        };
+        var itemIndex = itemPos.row * cellSize.columns + itemPos.col;
+
+        var item;
+        if (itemIndex < thumbnailCount) {
+          item = $(".g-organize-microthumb-grid-cell:visible").get(itemIndex);
+        } else {
+          item = $(".g-organize-microthumb-grid-cell:visible:last");
+        }
+
+        var old_position = {top: 0, left: 0};
+        if ($("#g-organize-drop-target-marker").length) {
+          old_position = $("#g-organize-drop-target-marker").position();
+        }
+        var before = event.pageX < ($(item).offset().left + $(item).width() / 2);
+
+        var left = (before && itemIndex < thumbnailCount ? $(item).position().left : $(item).position().left + cellSize.width) - 3;
+        var top = $(item).position().top + 6;
+
+        if (old_position.top != top || old_position.left != left) {
+          if ($("#g-organize-drop-target-marker").length) {
+            $("#g-organize-drop-target-marker").remove();
+          }
+          var set = $('<div id="g-organize-drop-target-marker"></div>')
+	    .css({zIndex: 2000,
+                  width: 2,
+                  height: 112,
+                  borderWidth: 1,
+                  borderStyle: "solid",
+                  position: "absolute",
+                  top: top,
+                  left: left
+	         })
+            .data("drop_position", {id: $(item).attr("ref"), position: before});
+          $("#g-organize-microthumb-grid").append(set);
+        }
       }
     },
 
@@ -140,7 +176,15 @@
       $(".sf-menu li.sfHover ul").css("z-index", 68);
       $("#g-dialog").dialog("option", "zIndex", 70);
       $("#g-dialog").bind("dialogopen", function(event, ui) {
-        $("#g-organize").height($("#g-dialog").innerHeight() - 20);
+        var outerHeight = $(".g-organize-microthumb-grid-cell").outerHeight(true);
+        var outerWidth = $(".g-organize-microthumb-grid-cell").outerWidth(true);
+        $("#g-organize")
+          .height($("#g-dialog").innerHeight() - 20)
+          .data("cellSize", {
+                  height: outerHeight,
+                  width: outerWidth,
+                  columns: Math.floor($("#g-organize-microthumb-grid").innerWidth() / outerWidth)
+          });
       });
 
       $("#g-dialog").bind("dialogclose", function(event, ui) {
@@ -162,11 +206,11 @@
     set_handlers: function() {
       $("#g-organize-microthumb-grid")
         .selectable({filter: ".g-organize-microthumb-grid-cell"})
+        .mousemove($.organize.grid_mouse_move_handler)
+        .mouseleave($.organize.grid_mouse_leave_handler)
         .droppable($.organize.content_droppable);
       $(".g-organize-microthumb-grid-cell")
-        .draggable($.organize.micro_thumb_draggable)
-        .mouseleave($.organize.mouse_leave_handler)
-        .mousemove($.organize.mouse_move_handler);
+        .draggable($.organize.micro_thumb_draggable);
       $(".g-organize-album").droppable($.organize.branch_droppable);
       $(".g-organize-album-text").click($.organize.show_album);
       $("#g-organize-album-tree .ui-icon-plus,#g-organize-album-tree .ui-icon-minus").click($.organize.toggle_branch);
@@ -214,12 +258,12 @@
       $(".g-organize-album-text[ref=" + id + "]").addClass("ui-state-focus");
       var url = $("#g-organize-microthumb-grid").attr("ref").replace("__ITEM_ID__", id).replace("__OFFSET__", 0);
       $.get(url, {},
-        function(data) {
-          $("#g-organize-microthumb-grid").html(data.grid);
-          $("#g-organize-sort-column").attr("value", data.sort_column);
-          $("#g-organize-sort-order").attr("value", data.sort_order);
-          $.organize.set_handlers();
-        },
+            function(data) {
+              $("#g-organize-microthumb-grid").html(data.grid);
+              $("#g-organize-sort-column").attr("value", data.sort_column);
+              $("#g-organize-sort-order").attr("value", data.sort_order);
+              $.organize.set_handlers();
+            },
 	    "json");
     },
 
-- 
cgit v1.2.3


From 8518fb267404c16fff54492b3e37fb03c64f0455 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Fri, 5 Feb 2010 08:53:38 -0800
Subject: Add busy animation when doing the drop.

---
 modules/organize/js/organize.js | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 56377ce3..9b9b6495 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -91,12 +91,24 @@
       });
 
       if (source_ids.length) {
+        var loading = $('<div class="g-dialog-loading-large">&nbsp;</div>')
+	  .css({bottom: 5,
+                opacity: .5,
+                left: 0,
+                position: "absolute",
+                right: 0,
+                top: 0,
+                zIndex: 2000
+	    });
+        $("#g-organize-microthumb-grid").append(loading);
+
         $.post(options.url,
-	        { "source_ids[]": source_ids },
-	        function(data) {
-                  $.organize._refresh(data);
-	        },
-	      "json");
+               { "source_ids[]": source_ids },
+	       function(data) {
+                 $.organize._refresh(data);
+                 $(".g-dialog-loading-large").remove();
+	       },
+	       "json");
       }
     },
 
-- 
cgit v1.2.3


From bc14f33ae134dd9c93bf35ad90c91d84fdac587f Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Fri, 5 Feb 2010 11:15:28 -0800
Subject: Fix an issue where the dragged item was always inserted after the
 target image.

---
 modules/organize/js/organize.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 9b9b6495..f85e02b5 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -60,7 +60,7 @@
         $.organize.do_drop({
           url: rearrange_url
           .replace("__TARGET_ID__", target.id)
-          .replace("__BEFORE__", target.before ? "before" : "after"),
+          .replace("__BEFORE__", target.position ? "before" : "after"),
           source: $(ui.helper).children("img")
         });
       }
-- 
cgit v1.2.3


From 64c37aed0787ee01c89df382f9645f35a7e6ba14 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Fri, 5 Feb 2010 14:38:24 -0800
Subject: continuing cleaninup organize javascript especially the drag and drop
 functionality.

---
 modules/organize/js/organize.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 9b9b6495..6f581208 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -4,7 +4,7 @@
       handle: ".ui-selected",
       distance: 10,
       cursorAt: { left: -10, top: -10},
-      appendTo: "#g-organize",
+      appendTo: "#g-organize-content-pane",
       helper: function(event, ui) {
         var selected = $(".ui-draggable.ui-selected img");
         if (selected.length) {
@@ -14,8 +14,6 @@
                         width: 80,
                         height: Math.ceil(selected.length / 5) * 16
 		      });
-          var offset = $(this).offset();
-          var click = {left: event.pageX - offset.left, top: event.pageY - offset.top};
 
           selected.each(function(i) {
             var row = parseInt(i / 5);
@@ -43,11 +41,13 @@
       drag: function(event, ui) {
         var top = $("#g-organize-microthumb-grid").offset().top;
         var height = $("#g-organize-microthumb-grid").height();
+        var scrollTop = $("#g-organize-microthumb-grid").scrollTop();
         if (ui.offset.top > height + top - 20) {
-          $("#g-organize-microthumb-grid").get(0).scrollTop += 100;
+          scrollTop += 100;
         } else if (ui.offset.top < top + 20) {
-          $("#g-organize-microthumb-grid").get(0).scrollTop = Math.max(0, $("#g-organize-microthumb-grid").get(0).scrollTop - 100);
+          scrollTop = Math.max(0,  scrollTop - 100);
         }
+        $("#g-organize-microthumb-grid").scrollTop(scrollTop);
       }
     },
 
-- 
cgit v1.2.3


From 73527fba611d7d441c6fd2e988510cb0c4e46f99 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Fri, 5 Feb 2010 23:38:06 -0800
Subject: 1) Manually added the .selectee class on subsequent downloads. fixes
 ticket #970 2) Reworked the calculated of the drop target marker to account
 for scrolling.

---
 modules/organize/js/organize.js | 64 +++++++++++++++++------------------------
 1 file changed, 27 insertions(+), 37 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index fd8a0fff..276fc3fa 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -59,8 +59,8 @@
         var target = $("#g-organize-drop-target-marker").data("drop_position");
         $.organize.do_drop({
           url: rearrange_url
-          .replace("__TARGET_ID__", target.id)
-          .replace("__BEFORE__", target.position ? "before" : "after"),
+            .replace("__TARGET_ID__", target.id)
+            .replace("__BEFORE__", target.position ? "before" : "after"),
           source: $(ui.helper).children("img")
         });
       }
@@ -72,8 +72,8 @@
       greedy: true,
       drop: function(event, ui) {
         if ($(event.target).hasClass("g-view-only")) {
+          $("#g-organize-drop-target-marker").remove();
           $(".ui-selected").show();
-          $(".g-organize-microthumb-grid-cell").css("borderStyle", "none");
         } else {
           $.organize.do_drop({
             url: move_url.replace("__ALBUM_ID__", $(event.target).attr("ref")),
@@ -134,48 +134,35 @@
       if ($(".g-drag-helper").length) {
         var cellSize = $("#g-organize").data("cellSize");
         var thumbnailCount = $(".g-organize-microthumb-grid-cell:visible").length;
-        var rows = Math.ceil(thumbnailCount / cellSize.columns);
-
 
+        var scrollTop = $("#g-organize-microthumb-grid").scrollTop();
         var itemPos = {
-          col: Math.floor((event.pageX - $(this).offset().left) / cellSize.width),
-          row: Math.floor((event.pageY - $(this).offset().top) / cellSize.height)
+          col: Math.floor((event.pageX - $("#g-organize-microthumb-grid").offset().left) / cellSize.width),
+          row: Math.floor((event.pageY + scrollTop - $("#g-organize-microthumb-grid").offset().top) / cellSize.height)
         };
-        var itemIndex = itemPos.row * cellSize.columns + itemPos.col;
 
-        var item;
-        if (itemIndex < thumbnailCount) {
-          item = $(".g-organize-microthumb-grid-cell:visible").get(itemIndex);
-        } else {
-          item = $(".g-organize-microthumb-grid-cell:visible:last");
-        }
+        var itemIndex = itemPos.row * cellSize.columns + itemPos.col;
+        var item = itemIndex < thumbnailCount ? $(".g-organize-microthumb-grid-cell:visible").get(itemIndex) :
+                                                $(".g-organize-microthumb-grid-cell:visible:last");
 
-        var old_position = {top: 0, left: 0};
-        if ($("#g-organize-drop-target-marker").length) {
-          old_position = $("#g-organize-drop-target-marker").position();
-        }
         var before = event.pageX < ($(item).offset().left + $(item).width() / 2);
-
         var left = (before && itemIndex < thumbnailCount ? $(item).position().left : $(item).position().left + cellSize.width) - 3;
-        var top = $(item).position().top + 6;
+        var top = $(item).position().top + 6 + scrollTop;
 
-        if (old_position.top != top || old_position.left != left) {
-          if ($("#g-organize-drop-target-marker").length) {
-            $("#g-organize-drop-target-marker").remove();
-          }
-          var set = $('<div id="g-organize-drop-target-marker"></div>')
-	    .css({zIndex: 2000,
-                  width: 2,
-                  height: 112,
-                  borderWidth: 1,
-                  borderStyle: "solid",
-                  position: "absolute",
-                  top: top,
-                  left: left
-	         })
-            .data("drop_position", {id: $(item).attr("ref"), position: before});
-          $("#g-organize-microthumb-grid").append(set);
+        if ($("#g-organize-drop-target-marker").length) {
+          $("#g-organize-drop-target-marker").remove();
         }
+        var set = $('<div id="g-organize-drop-target-marker"></div>')
+	  .css({zIndex: 2000,
+                width: 2,
+                height: 112,
+                borderWidth: 1,
+                borderStyle: "solid",
+                position: "absolute",
+                top: top, left: left
+	       })
+          .data("drop_position", {id: $(item).attr("ref"), position: before});
+        $("#g-organize-microthumb-grid").append(set);
       }
     },
 
@@ -190,12 +177,13 @@
       $("#g-dialog").bind("dialogopen", function(event, ui) {
         var outerHeight = $(".g-organize-microthumb-grid-cell").outerHeight(true);
         var outerWidth = $(".g-organize-microthumb-grid-cell").outerWidth(true);
+        var gridInnerWidth = $("#g-organize-microthumb-grid").innerWidth() - 2 * parseFloat($("#g-organize-microthumb-grid").css("paddingLeft"));
         $("#g-organize")
           .height($("#g-dialog").innerHeight() - 20)
           .data("cellSize", {
                   height: outerHeight,
                   width: outerWidth,
-                  columns: Math.floor($("#g-organize-microthumb-grid").innerWidth() / outerWidth)
+                  columns: Math.floor(gridInnerWidth / outerWidth)
           });
       });
 
@@ -222,6 +210,8 @@
         .mouseleave($.organize.grid_mouse_leave_handler)
         .droppable($.organize.content_droppable);
       $(".g-organize-microthumb-grid-cell")
+        // need to manually add this class in case we care calling with additional elements
+        .addClass("ui-selectee")
         .draggable($.organize.micro_thumb_draggable);
       $(".g-organize-album").droppable($.organize.branch_droppable);
       $(".g-organize-album-text").click($.organize.show_album);
-- 
cgit v1.2.3


From 0f9d23d074c81eafab05ce5d64909da624a86422 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Sat, 6 Feb 2010 10:34:57 -0800
Subject: Cleanup the position of the drop marker.

---
 modules/organize/js/organize.js | 27 +++++++++++++--------------
 1 file changed, 13 insertions(+), 14 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 276fc3fa..2a18cb40 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -132,21 +132,19 @@
 
     grid_mouse_move_handler: function(event) {
       if ($(".g-drag-helper").length) {
-        var cellSize = $("#g-organize").data("cellSize");
-        var thumbnailCount = $(".g-organize-microthumb-grid-cell:visible").length;
+        var organizeData = $("#g-organize").data("organizeData");
+        var thumbGrid = $("#g-organize-microthumb-grid");
+        var visibleCells = $(".g-organize-microthumb-grid-cell:visible");
+        var scrollTop = thumbGrid.scrollTop();
 
-        var scrollTop = $("#g-organize-microthumb-grid").scrollTop();
-        var itemPos = {
-          col: Math.floor((event.pageX - $("#g-organize-microthumb-grid").offset().left) / cellSize.width),
-          row: Math.floor((event.pageY + scrollTop - $("#g-organize-microthumb-grid").offset().top) / cellSize.height)
-        };
-
-        var itemIndex = itemPos.row * cellSize.columns + itemPos.col;
-        var item = itemIndex < thumbnailCount ? $(".g-organize-microthumb-grid-cell:visible").get(itemIndex) :
-                                                $(".g-organize-microthumb-grid-cell:visible:last");
+        var itemColumn = Math.floor((event.pageX - thumbGrid.offset().left) / organizeData.width);
+        var itemRow = Math.floor((event.pageY + scrollTop - thumbGrid.offset().top) / organizeData.height);
+        var itemIndex = Math.min(itemRow * organizeData.columns + itemColumn, visibleCells.length - 1);
+        var item = visibleCells.get(itemIndex);
 
         var before = event.pageX < ($(item).offset().left + $(item).width() / 2);
-        var left = (before && itemIndex < thumbnailCount ? $(item).position().left : $(item).position().left + cellSize.width) - 3;
+        var left = (before && itemIndex < visibleCells.length ?
+                      $(item).position().left : $(item).position().left + organizeData.width) - 3;
         var top = $(item).position().top + 6 + scrollTop;
 
         if ($("#g-organize-drop-target-marker").length) {
@@ -162,7 +160,7 @@
                 top: top, left: left
 	       })
           .data("drop_position", {id: $(item).attr("ref"), position: before});
-        $("#g-organize-microthumb-grid").append(set);
+        thumbGrid.append(set);
       }
     },
 
@@ -180,7 +178,8 @@
         var gridInnerWidth = $("#g-organize-microthumb-grid").innerWidth() - 2 * parseFloat($("#g-organize-microthumb-grid").css("paddingLeft"));
         $("#g-organize")
           .height($("#g-dialog").innerHeight() - 20)
-          .data("cellSize", {
+          .data("organizeData", {
+                  leftright: !$("body").hasClass("rtl"),
                   height: outerHeight,
                   width: outerWidth,
                   columns: Math.floor(gridInnerWidth / outerWidth)
-- 
cgit v1.2.3


From d6beef86132f1c73170a3957db84b716c538c07e Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Sun, 7 Feb 2010 15:05:39 -0800
Subject: The drop target marker appears in the correct spot whether we are in
 ltr or rtl mode.

---
 modules/organize/js/organize.js | 56 ++++++++++++++++++++++++++++-------------
 1 file changed, 38 insertions(+), 18 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 2a18cb40..5fc0084c 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -56,6 +56,7 @@
       tolerance: "pointer",
       greedy: true,
       drop: function(event, ui) {
+        $(".g-mouse-drag-over").removeClass("g-mouse-drag-over");
         var target = $("#g-organize-drop-target-marker").data("drop_position");
         $.organize.do_drop({
           url: rearrange_url
@@ -137,19 +138,25 @@
         var visibleCells = $(".g-organize-microthumb-grid-cell:visible");
         var scrollTop = thumbGrid.scrollTop();
 
-        var itemColumn = Math.floor((event.pageX - thumbGrid.offset().left) / organizeData.width);
-        var itemRow = Math.floor((event.pageY + scrollTop - thumbGrid.offset().top) / organizeData.height);
-        var itemIndex = Math.min(itemRow * organizeData.columns + itemColumn, visibleCells.length - 1);
-        var item = visibleCells.get(itemIndex);
+        var item = $(".g-mouse-drag-over");
+        if (item.length == 0) {
+          console.log("no item");
+
+          var itemColumn = Math.floor((event.pageX - thumbGrid.offset().left) / organizeData.width);
+          itemColumn = organizeData.rtl ? organizeData.width - itemColumn : itemColumn;
+          var itemRow = Math.floor((event.pageY + scrollTop - thumbGrid.offset().top) / organizeData.height);
+          var itemIndex = Math.min(itemRow * organizeData.columns + itemColumn, visibleCells.length - 1);
+          item = visibleCells.get(itemIndex);
+        }
 
         var before = event.pageX < ($(item).offset().left + $(item).width() / 2);
-        var left = (before && itemIndex < visibleCells.length ?
-                      $(item).position().left : $(item).position().left + organizeData.width) - 3;
+        var left = $(item).position().left + (before ? 0 : organizeData.width) - 3;
         var top = $(item).position().top + 6 + scrollTop;
 
         if ($("#g-organize-drop-target-marker").length) {
           $("#g-organize-drop-target-marker").remove();
         }
+
         var set = $('<div id="g-organize-drop-target-marker"></div>')
 	  .css({zIndex: 2000,
                 width: 2,
@@ -159,9 +166,11 @@
                 position: "absolute",
                 top: top, left: left
 	       })
-          .data("drop_position", {id: $(item).attr("ref"), position: before});
+          .data("drop_position", {id: $(item).attr("ref"),
+                                  position: organizeData.rtl ? !before : before});
         thumbGrid.append(set);
       }
+      return true;
     },
 
     /**
@@ -173,17 +182,17 @@
       $(".sf-menu li.sfHover ul").css("z-index", 68);
       $("#g-dialog").dialog("option", "zIndex", 70);
       $("#g-dialog").bind("dialogopen", function(event, ui) {
-        var outerHeight = $(".g-organize-microthumb-grid-cell").outerHeight(true);
-        var outerWidth = $(".g-organize-microthumb-grid-cell").outerWidth(true);
-        var gridInnerWidth = $("#g-organize-microthumb-grid").innerWidth() - 2 * parseFloat($("#g-organize-microthumb-grid").css("paddingLeft"));
-        $("#g-organize")
-          .height($("#g-dialog").innerHeight() - 20)
-          .data("organizeData", {
-                  leftright: !$("body").hasClass("rtl"),
-                  height: outerHeight,
-                  width: outerWidth,
-                  columns: Math.floor(gridInnerWidth / outerWidth)
-          });
+      var outerHeight = $(".g-organize-microthumb-grid-cell").outerHeight(true);
+      var outerWidth = $(".g-organize-microthumb-grid-cell").outerWidth(true);
+      var gridInnerWidth = $("#g-organize-microthumb-grid").innerWidth() - 2 * parseFloat($("#g-organize-microthumb-grid").css("paddingLeft"));
+      $("#g-organize")
+        .height($("#g-dialog").innerHeight() - 20)
+        .data("organizeData", {
+          rtl: $("body").hasClass("rtl"),
+          height: outerHeight,
+          width: outerWidth,
+          columns: Math.floor(gridInnerWidth / outerWidth)
+        });
       });
 
       $("#g-dialog").bind("dialogclose", function(event, ui) {
@@ -211,6 +220,17 @@
       $(".g-organize-microthumb-grid-cell")
         // need to manually add this class in case we care calling with additional elements
         .addClass("ui-selectee")
+        .mouseleave(function(event) {
+          if ($(".g-drag-helper").length) {
+            $(this).removeClass("g-mouse-drag-over");
+          }
+        })
+        .mouseenter(function(event) {
+          $(".g-mouse-drag-over").removeClass("g-mouse-drag-over");
+          if ($(".g-drag-helper").length) {
+            $(this).addClass("g-mouse-drag-over");
+          }
+        })
         .draggable($.organize.micro_thumb_draggable);
       $(".g-organize-album").droppable($.organize.branch_droppable);
       $(".g-organize-album-text").click($.organize.show_album);
-- 
cgit v1.2.3


From 2337fa93e6f5da3dd89454235d76a61b9181f0ab Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Sun, 7 Feb 2010 15:13:13 -0800
Subject: remove debudding statement and if no target is found then assume the
 insert position is after the last element.

---
 modules/organize/js/organize.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 5fc0084c..942e49e5 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -58,6 +58,12 @@
       drop: function(event, ui) {
         $(".g-mouse-drag-over").removeClass("g-mouse-drag-over");
         var target = $("#g-organize-drop-target-marker").data("drop_position");
+        if (target == null) {
+          target = {
+            position: false,
+            id: $(".g-organize-microthumb-grid-cell:visible:last").attr("ref")
+          };
+        }
         $.organize.do_drop({
           url: rearrange_url
             .replace("__TARGET_ID__", target.id)
@@ -140,8 +146,6 @@
 
         var item = $(".g-mouse-drag-over");
         if (item.length == 0) {
-          console.log("no item");
-
           var itemColumn = Math.floor((event.pageX - thumbGrid.offset().left) / organizeData.width);
           itemColumn = organizeData.rtl ? organizeData.width - itemColumn : itemColumn;
           var itemRow = Math.floor((event.pageY + scrollTop - thumbGrid.offset().top) / organizeData.height);
-- 
cgit v1.2.3


From afdb98412e5611894ca96659e1db452d9e7330c2 Mon Sep 17 00:00:00 2001
From: Tim Almdal <tnalmdal@shaw.ca>
Date: Mon, 8 Feb 2010 11:26:40 -0800
Subject: Fix the missing object problem in ie7. Fixes ticket: 1003. There is
 still issues with selectables and draggables working together in IEx

---
 modules/organize/js/organize.js | 45 +++++++++++++++++++----------------------
 1 file changed, 21 insertions(+), 24 deletions(-)

(limited to 'modules/organize/js/organize.js')

diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 942e49e5..5b90f402 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -7,31 +7,28 @@
       appendTo: "#g-organize-content-pane",
       helper: function(event, ui) {
         var selected = $(".ui-draggable.ui-selected img");
-        if (selected.length) {
-          var set = $('<div class="g-drag-helper"></div>')
-		      .css({
-                        zIndex: 2000,
-                        width: 80,
-                        height: Math.ceil(selected.length / 5) * 16
-		      });
+        var set = $('<div class="g-drag-helper"></div>')
+          .css({
+            zIndex: 2000,
+            width: 80,
+            height: Math.ceil(selected.length / 5) * 16
+	  });
 
-          selected.each(function(i) {
-            var row = parseInt(i / 5);
-            var j = i - (row * 5);
-            var o = $(this).offset();
-            var copy = $(this).clone()
-              .css({
-                width: $(this).width(), height: $(this).height(), display: "block",
-                margin: 0, position: 'absolute', outline: '5px solid #fff',
-                left: o.left - event.pageX, top: o.top - event.pageY
-              })
-              .appendTo(set)
-              .animate({ width: 10, height: 10, outlineWidth: 1, margin: 1,
-                left: (20 * j), top: (row * 20) }, 500);
-          });
-          return set;
-        }
-        return null;
+        selected.each(function(i) {
+          var row = parseInt(i / 5);
+          var j = i - (row * 5);
+          var o = $(this).offset();
+          var copy = $(this).clone()
+            .css({
+              width: $(this).width(), height: $(this).height(), display: "block",
+              margin: 0, position: 'absolute', outline: '5px solid #fff',
+              left: o.left - event.pageX, top: o.top - event.pageY
+            })
+            .appendTo(set)
+            .animate({ width: 10, height: 10, outlineWidth: 1, margin: 1,
+              left: (20 * j), top: (row * 20) }, 500);
+        });
+        return set;
       },
 
       start: function(event, ui) {
-- 
cgit v1.2.3