]> git.sur5r.net Git - contagged/blobdiff - scripts/interface/idrop.js
JavaScript updates (migration to JQuery + Interface)
[contagged] / scripts / interface / idrop.js
diff --git a/scripts/interface/idrop.js b/scripts/interface/idrop.js
new file mode 100644 (file)
index 0000000..ede4e64
--- /dev/null
@@ -0,0 +1,323 @@
+/**\r
+ * Interface Elements for jQuery\r
+ * Droppables\r
+ * \r
+ * http://interface.eyecon.ro\r
+ * \r
+ * Copyright (c) 2006 Stefan Petre\r
+ * Dual licensed under the MIT (MIT-LICENSE.txt) \r
+ * and GPL (GPL-LICENSE.txt) licenses.\r
+ *   \r
+ *\r
+ */\r
+\r
+/**\r
+ * With the Draggables plugin, Droppable allows you to create drop zones for draggable elements.\r
+ *\r
+ * @name Droppable\r
+ * @cat Plugins/Interface\r
+ * @param Hash options A hash of options\r
+ * @option String accept The class name for draggables to get accepted by the droppable (mandatory)\r
+ * @option String activeclass When an acceptable draggable is moved, the droppable gets this class\r
+ * @option String hoverclass When an acceptable draggable is inside the droppable, the droppable gets\r
+ *                           this class\r
+ * @option String tolerance  Choose from 'pointer', 'intersect', or 'fit'. The pointer options means\r
+ *                           that the pointer must be inside the droppable in order for the draggable\r
+ *                           to be dropped. The intersect option means that the draggable must intersect\r
+ *                           the droppable. The fit option means that the entire draggable must be\r
+ *                           inside the droppable.\r
+ * @option Function onDrop   When an acceptable draggable is dropped on a droppable, this callback is\r
+ *                           called. It passes the draggable DOMElement as a parameter.\r
+ * @option Function onHover  When an acceptable draggable is hovered over a droppable, this callback\r
+ *                           is called. It passes the draggable DOMElement as a parameter.\r
+ * @option Function onOut    When an acceptable draggable leaves a droppable, this callback is called.\r
+ *                           It passes the draggable DOMElement as a parameter.\r
+ * @example                  $('#dropzone1').Droppable(\r
+ *                             {\r
+ *                               accept : 'dropaccept', \r
+ *                               activeclass: 'dropzoneactive', \r
+ *                               hoverclass:   'dropzonehover',\r
+ *                               ondrop:       function (drag) {\r
+ *                                              alert(this); //the droppable\r
+ *                                              alert(drag); //the draggable\r
+ *                                        },\r
+ *                               fit: true\r
+ *                             }\r
+ *                           )\r
+ */\r
+\r
+jQuery.iDrop = {\r
+       fit : function (zonex, zoney, zonew, zoneh)\r
+       {\r
+               return  zonex <= jQuery.iDrag.dragged.dragCfg.nx && \r
+                               (zonex + zonew) >= (jQuery.iDrag.dragged.dragCfg.nx + jQuery.iDrag.dragged.dragCfg.oC.w) &&\r
+                               zoney <= jQuery.iDrag.dragged.dragCfg.ny && \r
+                               (zoney + zoneh) >= (jQuery.iDrag.dragged.dragCfg.ny + jQuery.iDrag.dragged.dragCfg.oC.h) ? true :false;\r
+       },\r
+       intersect : function (zonex, zoney, zonew, zoneh)\r
+       {\r
+               return  ! ( zonex > (jQuery.iDrag.dragged.dragCfg.nx + jQuery.iDrag.dragged.dragCfg.oC.w)\r
+                               || (zonex + zonew) < jQuery.iDrag.dragged.dragCfg.nx \r
+                               || zoney > (jQuery.iDrag.dragged.dragCfg.ny + jQuery.iDrag.dragged.dragCfg.oC.h) \r
+                               || (zoney + zoneh) < jQuery.iDrag.dragged.dragCfg.ny\r
+                               ) ? true :false;\r
+       },\r
+       pointer : function (zonex, zoney, zonew, zoneh)\r
+       {\r
+               return  zonex < jQuery.iDrag.dragged.dragCfg.currentPointer.x\r
+                               && (zonex + zonew) > jQuery.iDrag.dragged.dragCfg.currentPointer.x \r
+                               && zoney < jQuery.iDrag.dragged.dragCfg.currentPointer.y \r
+                               && (zoney + zoneh) > jQuery.iDrag.dragged.dragCfg.currentPointer.y\r
+                               ? true :false;\r
+       },\r
+       overzone : false,\r
+       highlighted : {},\r
+       count : 0,\r
+       zones : {},\r
+       \r
+       highlight : function (elm)\r
+       {\r
+               if (jQuery.iDrag.dragged == null) {\r
+                       return;\r
+               }\r
+               var i;\r
+               jQuery.iDrop.highlighted = {};\r
+               var oneIsSortable = false;\r
+               for (i in jQuery.iDrop.zones) {\r
+                       if (jQuery.iDrop.zones[i] != null) {\r
+                               var iEL = jQuery.iDrop.zones[i].get(0);\r
+                               if (jQuery(jQuery.iDrag.dragged).is('.' + iEL.dropCfg.a)) {\r
+                                       if (iEL.dropCfg.m == false) {\r
+                                               iEL.dropCfg.p = jQuery.extend(\r
+                                                       jQuery.iUtil.getPositionLite(iEL),\r
+                                                       jQuery.iUtil.getSizeLite(iEL)\r
+                                               );//jQuery.iUtil.getPos(iEL);\r
+                                               iEL.dropCfg.m = true;\r
+                                       }\r
+                                       if (iEL.dropCfg.ac) {\r
+                                               jQuery.iDrop.zones[i].addClass(iEL.dropCfg.ac);\r
+                                       }\r
+                                       jQuery.iDrop.highlighted[i] = jQuery.iDrop.zones[i];\r
+                                       //if (jQuery.iSort && jQuery.iDrag.dragged.dragCfg.so) {\r
+                                       if (jQuery.iSort && iEL.dropCfg.s && jQuery.iDrag.dragged.dragCfg.so) {\r
+                                               iEL.dropCfg.el = jQuery('.' + iEL.dropCfg.a, iEL);\r
+                                               elm.style.display = 'none';\r
+                                               jQuery.iSort.measure(iEL);\r
+                                               iEL.dropCfg.os = jQuery.iSort.serialize(jQuery.attr(iEL, 'id')).hash;\r
+                                               elm.style.display = elm.dragCfg.oD;\r
+                                               oneIsSortable = true;\r
+                                       }\r
+                                       if (iEL.dropCfg.onActivate) {\r
+                                               iEL.dropCfg.onActivate.apply(jQuery.iDrop.zones[i].get(0), [jQuery.iDrag.dragged]);\r
+                                       }\r
+                               }\r
+                       }\r
+               }\r
+               //if (jQuery.iSort && jQuery.iDrag.dragged.dragCfg.so) {\r
+               if (oneIsSortable) {\r
+                       jQuery.iSort.start();\r
+               }\r
+       },\r
+       /**\r
+        * remeasure the droppable\r
+        * \r
+        * useful when the positions/dimensions for droppables \r
+        * are changed while dragging a element\r
+        * \r
+        * this works for sortables too but with a greate processor \r
+        * penality because remeasures each sort items too\r
+        */\r
+       remeasure : function()\r
+       {\r
+               jQuery.iDrop.highlighted = {};\r
+               for (i in jQuery.iDrop.zones) {\r
+                       if (jQuery.iDrop.zones[i] != null) {\r
+                               var iEL = jQuery.iDrop.zones[i].get(0);\r
+                               if (jQuery(jQuery.iDrag.dragged).is('.' + iEL.dropCfg.a)) {\r
+                                       iEL.dropCfg.p = jQuery.extend(\r
+                                               jQuery.iUtil.getPositionLite(iEL),\r
+                                               jQuery.iUtil.getSizeLite(iEL)\r
+                                       );\r
+                                       if (iEL.dropCfg.ac) {\r
+                                               jQuery.iDrop.zones[i].addClass(iEL.dropCfg.ac);\r
+                                       }\r
+                                       jQuery.iDrop.highlighted[i] = jQuery.iDrop.zones[i];\r
+                                       \r
+                                       if (jQuery.iSort && iEL.dropCfg.s && jQuery.iDrag.dragged.dragCfg.so) {\r
+                                               iEL.dropCfg.el = jQuery('.' + iEL.dropCfg.a, iEL);\r
+                                               elm.style.display = 'none';\r
+                                               jQuery.iSort.measure(iEL);\r
+                                               elm.style.display = elm.dragCfg.oD;\r
+                                       }\r
+                               }\r
+                       }\r
+               }\r
+       },\r
+       \r
+       checkhover : function (e)\r
+       {\r
+               if (jQuery.iDrag.dragged == null) {\r
+                       return;\r
+               }\r
+               jQuery.iDrop.overzone = false;\r
+               var i;\r
+               var applyOnHover = false;\r
+               var hlt = 0;\r
+               for (i in jQuery.iDrop.highlighted)\r
+               {\r
+                       var iEL = jQuery.iDrop.highlighted[i].get(0);\r
+                       if ( \r
+                                       jQuery.iDrop.overzone == false\r
+                                        && \r
+                                       jQuery.iDrop[iEL.dropCfg.t](\r
+                                               iEL.dropCfg.p.x, \r
+                                               iEL.dropCfg.p.y, \r
+                                               iEL.dropCfg.p.wb, \r
+                                               iEL.dropCfg.p.hb\r
+                                       )\r
+                                        \r
+                       ) {\r
+                               if (iEL.dropCfg.hc && iEL.dropCfg.h == false) {\r
+                                       jQuery.iDrop.highlighted[i].addClass(iEL.dropCfg.hc);\r
+                               }\r
+                               //chec if onHover function has to be called\r
+                               if (iEL.dropCfg.h == false &&iEL.dropCfg.onHover) {\r
+                                       applyOnHover = true;\r
+                               }\r
+                               iEL.dropCfg.h = true;\r
+                               jQuery.iDrop.overzone = iEL;\r
+                               //if(jQuery.iSort && jQuery.iDrag.dragged.dragCfg.so) {\r
+                               if(jQuery.iSort && iEL.dropCfg.s && jQuery.iDrag.dragged.dragCfg.so) {\r
+                                       jQuery.iSort.helper.get(0).className = iEL.dropCfg.shc;\r
+                                       jQuery.iSort.checkhover(iEL);\r
+                               }\r
+                               hlt ++;\r
+                       } else if(iEL.dropCfg.h == true) {\r
+                               //onOut function\r
+                               if (iEL.dropCfg.onOut) {\r
+                                       iEL.dropCfg.onOut.apply(iEL, [e, jQuery.iDrag.helper.get(0).firstChild, iEL.dropCfg.fx]);\r
+                               }\r
+                               if (iEL.dropCfg.hc) {\r
+                                       jQuery.iDrop.highlighted[i].removeClass(iEL.dropCfg.hc);\r
+                               }\r
+                               iEL.dropCfg.h = false;\r
+                       }\r
+               }\r
+               if (jQuery.iSort && !jQuery.iDrop.overzone && jQuery.iDrag.dragged.so) {\r
+                       jQuery.iSort.helper.get(0).style.display = 'none';\r
+                       //jQuery('body').append(jQuery.iSort.helper.get(0));\r
+               }\r
+               //call onhover\r
+               if(applyOnHover) {\r
+                       jQuery.iDrop.overzone.dropCfg.onHover.apply(jQuery.iDrop.overzone, [e, jQuery.iDrag.helper.get(0).firstChild]);\r
+               }\r
+       },\r
+       checkdrop : function (e)\r
+       {\r
+               var i;\r
+               for (i in jQuery.iDrop.highlighted) {\r
+                       var iEL = jQuery.iDrop.highlighted[i].get(0);\r
+                       if (iEL.dropCfg.ac) {\r
+                               jQuery.iDrop.highlighted[i].removeClass(iEL.dropCfg.ac);\r
+                       }\r
+                       if (iEL.dropCfg.hc) {\r
+                               jQuery.iDrop.highlighted[i].removeClass(iEL.dropCfg.hc);\r
+                       }\r
+                       if(iEL.dropCfg.s) {\r
+                               jQuery.iSort.changed[jQuery.iSort.changed.length] = i;\r
+                       }\r
+                       if (iEL.dropCfg.onDrop && iEL.dropCfg.h == true) {\r
+                               iEL.dropCfg.h = false;\r
+                               iEL.dropCfg.onDrop.apply(iEL, [e, iEL.dropCfg.fx]);\r
+                       }\r
+                       iEL.dropCfg.m = false;\r
+                       iEL.dropCfg.h  = false;\r
+               }\r
+               jQuery.iDrop.highlighted = {};\r
+       },\r
+       destroy : function()\r
+       {\r
+               return this.each(\r
+                       function()\r
+                       {\r
+                               if (this.isDroppable) {\r
+                                       if (this.dropCfg.s) {\r
+                                               id = jQuery.attr(this,'id');\r
+                                               jQuery.iSort.collected[id] = null;\r
+                                               jQuery('.' + this.dropCfg.a, this).DraggableDestroy();\r
+                                       }\r
+                                       jQuery.iDrop.zones['d' + this.idsa] = null;\r
+                                       this.isDroppable = false;\r
+                                       this.f = null;\r
+                               }\r
+                       }\r
+               );\r
+       },\r
+       build : function (o)\r
+       {\r
+               return this.each(\r
+                       function()\r
+                       {\r
+                               if (this.isDroppable == true || !o.accept || !jQuery.iUtil || !jQuery.iDrag){\r
+                                       return;\r
+                               }\r
+                               this.dropCfg = {\r
+                                       a : o.accept,\r
+                                       ac: o.activeclass||false, \r
+                                       hc:     o.hoverclass||false,\r
+                                       shc: o.helperclass||false,\r
+                                       onDrop: o.ondrop||o.onDrop||false,\r
+                                       onHover: o.onHover||o.onhover||false,\r
+                                       onOut: o.onOut||o.onout||false,\r
+                                       onActivate: o.onActivate||false,\r
+                                       t: o.tolerance && ( o.tolerance == 'fit' || o.tolerance == 'intersect') ? o.tolerance : 'pointer',\r
+                                       fx: o.fx ? o.fx : false,\r
+                                       m: false,\r
+                                       h: false\r
+                               };\r
+                               if (o.sortable == true && jQuery.iSort) {\r
+                                       id = jQuery.attr(this,'id');\r
+                                       jQuery.iSort.collected[id] = this.dropCfg.a;\r
+                                       this.dropCfg.s = true;\r
+                                       if(o.onChange) {\r
+                                               this.dropCfg.onChange = o.onChange;\r
+                                               this.dropCfg.os = jQuery.iSort.serialize(id).hash;\r
+                                       }\r
+                               }\r
+                               this.isDroppable = true;\r
+                               this.idsa = parseInt(Math.random() * 10000);\r
+                               jQuery.iDrop.zones['d' + this.idsa] = jQuery(this);\r
+                               jQuery.iDrop.count ++;\r
+                       }\r
+               );\r
+       }\r
+};\r
+\r
+/**\r
+ * Destroy an existing droppable on a collection of elements\r
+ * \r
+ * @name DroppableDestroy\r
+ * @descr Destroy a droppable\r
+ * @type jQuery\r
+ * @cat Plugins/Interface\r
+ * @example $('#drag2').DroppableDestroy();\r
+ */\r
+\r
+jQuery.fn.extend(\r
+       {\r
+               DroppableDestroy : jQuery.iDrop.destroy,\r
+               Droppable : jQuery.iDrop.build\r
+       }\r
+);\r
+\r
\r
+/**\r
+ * Recalculate all Droppables\r
+ *\r
+ * @name $.recallDroppables\r
+ * @type jQuery\r
+ * @cat Plugins/Interface\r
+ * @example $.recallDroppable();\r
+ */\r
+\r
+jQuery.recallDroppables = jQuery.iDrop.remeasure;
\ No newline at end of file