sortable: implemented advanced placeholder functionality - the placeholder option...

diff --git a/ui/source/ui.sortable.js b/ui/source/ui.sortable.js
index ba3d324f4072d1d233157f1b856e98ee89a456f7..cfa2cadb38d1072ebe51924fd6b90282f7598679 100644 (file)
--- a/ui/source/ui.sortable.js
+++ b/ui/source/ui.sortable.js
@@ -214,13 +214,23 @@
                                this.items[i].item.removeData("sortable-item");\r
                },\r
                createPlaceholder: function(that) {\r
-                       (that || this).placeholderElement = this.options.placeholderElement ? $(this.options.placeholderElement, (that || this).currentItem) : (that || this).currentItem;\r
-                       (that || this).placeholder = $('<div></div>')\r
-                               .addClass(this.options.placeholder)\r
-                               .appendTo('body')\r
-                               .css({ position: 'absolute' })\r
-                               .css((that || this).placeholderElement.offset())\r
-                               .css({ width: (that || this).placeholderElement.outerWidth(), height: (that || this).placeholderElement.outerHeight() });\r
+                       \r
+                       var self = that || this, o = self.options;\r
+       \r
+                       if(o.placeholder.constructor == String) {\r
+                               var className = o.placeholder;\r
+                               o.placeholder = {\r
+                                       element: function() {\r
+                                               return $('<div></div>').addClass(className)[0];\r
+                                       },\r
+                                       update: function(i, p) {\r
+                                               p.css(i.offset()).css({ width: i.outerWidth(), height: i.outerHeight() });\r
+                                       }\r
+                               };\r
+                       }\r
+                       \r
+                       self.placeholder = $(o.placeholder.element.call(self.element, self.currentItem)).appendTo('body').css({ position: 'absolute' });\r
+                       o.placeholder.update.call(self.element, self.currentItem, self.placeholder);\r
                },\r
                contactContainers: function(e) {\r
                        for (var i = this.containers.length - 1; i >= 0; i--){\r
@@ -249,7 +259,7 @@
                                                        if(this.containers[i].options.placeholder) {\r
                                                                this.containers[i].createPlaceholder(this);\r
                                                        } else {\r
-                                                               this.placeholder = null; this.placeholderElement = null;\r
+                                                               this.placeholder = null;;\r
                                                        }\r
                                                        \r
                                                        \r
@@ -547,8 +557,7 @@
                rearrange: function(e, i, a) {\r
                        a ? a.append(this.currentItem) : i.item[this.direction == 'down' ? 'before' : 'after'](this.currentItem);\r
                        this.refreshPositions(true); //Precompute after each DOM insertion, NOT on mousemove\r
-                       if(this.placeholderElement) this.placeholder.css(this.placeholderElement.offset());\r
-                       if(this.placeholderElement && this.placeholderElement.is(":visible")) this.placeholder.css({ width: this.placeholderElement.outerWidth(), height: this.placeholderElement.outerHeight() });\r
+                       this.options.placeholder.update.call(this.element, this.currentItem, this.placeholder);\r
                }\r
        }));\r
        \r