[Z3lab-checkins] r2590 - in cpsskins/branches/jmo-perspectives/ui/framework: . tests/functional

[jmorliaguet]

Author: jmorliaguet
Date: Sat Mar 11 23:24:54 2006
New Revision: 2590

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

- reorganized drag-and-drop options



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 Sat Mar 11 
23:24:54 2006
@@ -597,7 +597,7 @@
     this.cancelEvent = new Function("return false");
 
     var dropzones = this._dropzones = [];
-    (this.def.droppable || []).each(function(d) {
+    (this.def.dropping.targets || []).each(function(d) {
       $$(d).each(function(el) { dropzones.push(el); });
     });
 
@@ -608,17 +608,21 @@
 
   register: function(view) {
     var dragEvent = this.dragEvent;
-    var handle = this.def.handle;
-    var draggable = this.def.draggable || [];
+    var dragging = this.def.dragging;
+    if (!dragging) {
+      return;
+    }
+    var handle = dragging.handle;
+    var sources = dragging.sources || [];
 
-    if (!handle) { handle = draggable; }
+    if (!handle) { handle = sources; }
     handle.each(function(h) {
       $$(h).each(function(el) {
         Event.observe(el, "mousedown", dragEvent);
         el.setStyle({'cursor': 'move'});
       });
     });
-    draggable.each(function(d) {
+    sources.each(function(d) {
       $$(d).each(function(el) { el._cpsskins_draggable = true; });
     });
   },
@@ -636,7 +640,7 @@
     if (!draggable) {
       return false;
     }
-    if (this.def.ghosting) {
+    if (this.def.dragging.clone) {
       var dim = draggable.getDimensions();
       var clone = CPSSkins.Canvas.createNode({"tag": "div"});
       clone.setStyle({
@@ -646,7 +650,7 @@
         'height': '' + dim.height + 'px'
       });
       clone.appendChild(draggable.cloneNode(true));
-      clone.setOpacity(0.8);
+      clone.setOpacity(this.def.dragging.clone.opacity);
       draggable.parentNode.insertBefore(clone, draggable);
       this.moved = clone;
     } else {
@@ -679,19 +683,19 @@
       if (Position.within(d, x, y)) { inTarget = true; }
     });
 
-    var revert = this.def.revert;
+    var revert = this.def.dragging.revert;
     if (inTarget) {
       revert = false;
       /* TODO: handle action */
       alert('NotImplemented');
     }
 
-    if (this.def.ghosting) {
+    if (this.def.dragging.clone) {
       if (revert) {
         this.moved.moveTo({
           'x': this.x0,
           'y': this.y0,
-          'duration': 400,
+          'duration': revert.duration || 400,
           'onComplete': function() { this.parentNode.removeChild(this); }
         });
       } else {

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
        Sat Mar 11 23:24:54 2006
@@ -17,12 +17,19 @@
     border: 1px solid #999;
     padding: 1em;
     width: 200px;
+    margin: 10px;
   }
   div.drop {
     background-color: #ffe;
     border: 1px solid #999;
     padding: 2em;
     width: 200px;
+    margin: 10px;
+  }
+  #dragthis {
+    padding: 1em;
+    border: 1px solid #fc0;
+    background-color: #ffc;
   }
   </style>
 
@@ -33,9 +40,9 @@
 
   <div class="drag">DRAG ME</div>
 
-  <div class="drag">DRAG ME</div>
-
-  <div id="dragthis">DRAG ME</div>
+  <div class="drag">DRAG ME
+    <div id="dragthis">DRAG ME</div>
+  </div>
 
   <div class="drop">DROP ZONE</div>
 
@@ -43,9 +50,20 @@
   {"id": "dnd",
    "type": "drag-and-drop",
    "action": "displayInfo",
-   "draggable": ["div.drag", "#dragthis"],
-   "droppable": ["div.drop"]
-  }
+   "dragging": {
+     "sources": ["div.drag", "#dragthis"],
+     "clone": {
+       "opacity": 0.7
+     },
+     "revert": {
+       "duration": 500
+     }
+   },
+   "dropping": {
+     "targets": ["div.drop"],
+     "highlight": {
+     }
+  }}
   </ins>
 
   <ins class="model">
-- 
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins