Author: jmorliaguet
Date: Mon Mar 13 20:51:49 2006
New Revision: 2633

Modified:
   cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js
   
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_dragdrop_test.html
Log:

- dragged elements can be shifted and moved into containers



Modified: cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js
==============================================================================
--- cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js (original)
+++ cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js Mon Mar 13 
20:51:49 2006
@@ -637,6 +637,26 @@
     return element;
   },
 
+  _getVerticalSpeed: function(y) {
+    if (!this._previousY) this._previousY = y;
+    var speed = y - this._previousY;
+    this._previousY = y;
+    return speed;
+  },
+
+  _findNext: function(el, cls) {
+    while (el) {
+      el = el.nextSibling;
+      if (!el) return null;
+      if (el.nodeType == 1) {
+        if (el.hasClassName(cls)) {
+          return el;
+        }
+      }
+    }
+    return null;
+  },
+
   dragEvent: function(e) {
     var draggable = $(this._findDraggable(e));
     if (!draggable) {
@@ -709,6 +729,26 @@
     var x = Event.pointerX(e);
     var y = Event.pointerY(e);
     this.moved.moveTo({'x': x-this.x1, 'y': y-this.y1});
+
+    var el = Event.element(e);
+
+    var shift = this.def.dragging.shift;
+    if (shift && el.hasClassName(shift)) {
+      var speed = this._getVerticalSpeed(y);
+      if (Math.abs(speed) < 1) return;
+      if (speed > 0) {
+        var target = this._findNext(el, shift);
+      } else {
+        var target = el;
+      }
+      el.parentNode.insertBefore(this.dragged, target);
+    }
+
+    var container = this.def.dragging.container;
+    if (container && el.hasClassName(container)) {
+      el.appendChild(this.dragged)
+    }
+
     Event.stop(e);
   },
 

Modified: 
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_dragdrop_test.html
==============================================================================
--- 
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_dragdrop_test.html
        (original)
+++ 
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_dragdrop_test.html
        Mon Mar 13 20:51:49 2006
@@ -57,6 +57,11 @@
     height: 25px;
     padding: 3px;
   }
+  .container {
+   background-color: #f6f3f3;
+   padding: 0.2em;
+   border: 1px solid #ccc;
+  }
   </style>
 
 </head>
@@ -126,15 +131,16 @@
    "action": "displayInfo",
    "dragging": {
      "sources": [".block"],
-     "shift": [".block"],
+     "shift": "block",
+     "container": "container",
      "feedback": {
        "opacity": 0.7,
        "border": "#000",
        "background": "#fd9"
-     },
-     "revert": {
-       "duration": 800
      }
+   },
+   "dropping": {
+   }
   }}
   </ins>
 
@@ -165,14 +171,14 @@
   <div style="clear:both"></div>
 
   <table style="width: 100%">
-    <tr>
-      <td style="width: 20%">
+    <tr valign="top" style="height: 200px">
+      <td style="width: 20%" class="container">
         <div class="block">A</div>
       </td>
-      <td style="width: 60%">
+      <td style="width: 60%" class="container">
         <div class="block">B</div>
       </td>
-      <td style="width: 20%">
+      <td style="width: 20%" class="container">
         <div class="block">C</div>
       </td>
     </tr>
-- 
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins

Reply via email to