Author: jmorliaguet
Date: Tue Nov  8 22:58:25 2005
New Revision: 29361

Modified:
   z3lab/cpsskins/branches/jmo-perspectives/engines/authoring/authoring.js
   
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/cell.pt
   
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/pageblock.pt
   
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/portlet.pt
   
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/slot.pt
   
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/portlet.pt
   z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/slot.pt
Log:

- UI improvements when moving cells and pageblocks: they can be moved using
  drag-and-drop.

- removed the "shift" effect which was non-intuitive.



Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/authoring/authoring.js
==============================================================================
--- z3lab/cpsskins/branches/jmo-perspectives/engines/authoring/authoring.js     
(original)
+++ z3lab/cpsskins/branches/jmo-perspectives/engines/authoring/authoring.js     
Tue Nov  8 22:58:25 2005
@@ -5,6 +5,7 @@
 var factory = null;
 var current_elem = null;
 var current_container = null;
+var drag_destination = null;
 
 var context_menu = null;
 var drag_box = null;
@@ -264,6 +265,10 @@
   var moving = pd_selected_item;
   if (moving == el) return;
 
+  if (drag_destination != null) {
+     if (el.getAttribute("destination") != drag_destination) return;
+     }
+
   var moving_class = moving.className
   if (moving_class.indexOf('draggable') < 0) return;
 
@@ -285,35 +290,6 @@
   current_elem = moving;
 }
 
-function shift_element(el, e) {
-  if (!pd_drag_event) return;
-  if (!pd_selected_item) return;
-
-  var moving = pd_selected_item;
-  var moving_class = moving.className;
-  if (moving_class.indexOf('shiftable') < 0) return;
-
-  if (!e) e = event;
-  if (moved.constraint == 'horizontal')
-    var speed = horizontal_speed(e);
-  if (moved.constraint == 'vertical')
-    var speed = vertical_speed(e);
-
-  if (!speed) return;
-  var direction = speed > 0 ? "down" : "up";
-
-  // update the view
-  var container = getTargetElement(el);
-  var new_order = shiftElement(container, direction);
-  current_elem = container;
-  if (new_order == null) return;
-  moved.can_move = false;
-
-  // update the model
-  var id = container.getAttribute("id");
-  model_reorder(id, new_order);
-}
-
 function finish_reorder(resp, err) {
   if (!current_elem) return;
   if (!err) {
@@ -408,10 +384,15 @@
 function setupDraggable(mo) {
   pd_setupDragUI(mo);
   mo.onmousedown = function(e) {
-    moved = new Element(mo);
-    set_dragbox_content(mo);
-    setCursor("default");
-    pd_itemOnMousedown(mo, e);
+    drag_destination = mo.getAttribute("destination");
+    var target = getEventTarget(e);
+    if (!target) return;
+    if (target.getAttribute("grip") || mo.getAttribute("grip")) {
+      moved = new Element(mo);
+      set_dragbox_content(mo);
+      setCursor("default");
+      pd_itemOnMousedown(mo, e);
+    }
   };
   mo.onmousemove = function(e) {
     drag_element(mo, e);
@@ -436,33 +417,6 @@
   }
 }
 
-function setupShiftable(mo) {
-  pd_setupDragUI(mo);
-  mo.onmousedown = function(e) {
-    moved = new Element(mo);
-    var target = getEventTarget(e);
-    var className = target.className;
-    if (className.indexOf('editable') >= 0) return;
-    if (!target.getAttribute("grip")) return;
-    if (moved.constraint == 'horizontal')
-      setCursor("e-resize");
-    if (moved.constraint == 'vertical')
-      setCursor("n-resize");
-    pd_itemOnMousedown(mo, e);
-  }
-  mo.onmousemove = function(e) {
-    if (!moved) return;
-    if (moved.can_move) {
-      var target = getEventTarget(e);
-      if (target.getAttribute("grip"))
-        shift_element(mo, e);
-    }
-  }
-  mo.onmouseup = function(e) {
-    setCursor("default");
-  }
-}
-
 function setupFactory(mo) {
   mo.onmousedown = function(e) {
     factory = new Element(mo);
@@ -569,7 +523,6 @@
 pd_node_setup['factory'] = setupFactory;
 pd_node_setup['container'] = setupContainer;
 pd_node_setup['draggable'] = setupDraggable;
-pd_node_setup['shiftable'] = setupShiftable;
 pd_node_setup['editable'] = setupEditable;
 pd_node_setup['context-menu'] = setupContextMenu;
 pd_node_setup['context-menu-item'] = setupContextMenuItem;

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/cell.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/cell.pt 
    (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/cell.pt 
    Tue Nov  8 22:58:25 2005
@@ -1,4 +1,4 @@
-<td class="editable" style="vertical-align:top"
+<td class="editable draggable" destination="cell" style="vertical-align:top"
   tal:define="
     info options/info;
     globals info/globals;
@@ -17,7 +17,7 @@
     id id;
     width width;">
 
-  <div class="cellEditHeader shiftable" constraint="horizontal">
+  <div class="cellEditHeader">
     <form action="javascript:void(0)" grip="1">
       <input name="title" type="text" size="12" class="editable"
        tal:attributes="value title;
@@ -34,7 +34,7 @@
                     view_id id" />
   </form>
 
-  <div class="container" focus="1"
+  <div class="container" focus="1" destination="cellcontained"
        tal:content="structure options/markup" />
 
 </td>

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/pageblock.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/pageblock.pt
        (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/pageblock.pt
        Tue Nov  8 22:58:25 2005
@@ -11,8 +11,8 @@
     layout_id layout/identifier;
     width layout/width">
 
-  <table cellpadding="0" cellspacing="0"
-   class="pageBlockEdit editable shiftable" constraint="vertical"
+  <table cellpadding="0" cellspacing="0" destination="pageblock"
+   class="pageBlockEdit editable draggable"
    tal:attributes="
      editable python:1;
      formattable python: formats and 1 or 0;
@@ -41,10 +41,11 @@
     <tr>
       <td>
         <table cellpadding="0" cellspacing="0" width="100%"
+          tal:define="markup options/markup"
           tal:attributes="editable python:1;
                           folder_editable python:1;
                           id this_id">
-          <tr tal:content="structure options/markup" />
+          <tr tal:content="structure markup" />
         </table>
       </td>
     </tr>

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/portlet.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/portlet.pt
  (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/portlet.pt
  Tue Nov  8 22:58:25 2005
@@ -1,4 +1,4 @@
-<div class="editable draggable hover"
+<div class="editable draggable hover" grip="1" destination="cellcontained"
   tal:define="
     info options/info;
     globals info/globals;
@@ -12,11 +12,9 @@
     formattable python: formats and 1 or 0;
     formats python: ' '.join(formats);
     id id">
-
-    <div class="portletBoxLayoutMode">
-      <strong tal:condition="title" tal:content="title" />
-      (<tal:block i18n:domain="cpsskins"
-        i18n:translate="" content="context/type:contenttype" />)
-    </div>
-
+  <div class="portletBoxLayoutMode">
+    <strong tal:condition="title" tal:content="title" />
+    (<tal:block i18n:domain="cpsskins"
+      i18n:translate="" content="context/type:contenttype" />)
+  </div>
 </div>

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/slot.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/slot.pt 
    (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/layoutdesigner/filters/slot.pt 
    Tue Nov  8 22:58:25 2005
@@ -8,14 +8,14 @@
   id context/identifier;
   icon context/@@getIcon">
 
-  <div class="slotFrame editable draggable"
+  <div class="slotFrame editable draggable" destination="cellcontained"
    tal:attributes="
      editable python:1;
      formattable python: formats and 1 or 0;
      formats python: ' '.join(formats);
      id id">
-    <div class="title" tal:content="slot_title|slot_name" />
-    <div class="body"><img src="" tal:attributes="src icon" />
+    <div class="title" grip="1" tal:content="slot_title|slot_name" />
+    <div class="body" grip="1"><img src="" tal:attributes="src icon" />
       <tal:block content="slot_name" />
     </div>
   </div>

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/portlet.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/portlet.pt
    (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/portlet.pt
    Tue Nov  8 22:58:25 2005
@@ -1,4 +1,4 @@
-<div class="editable draggable hover"
+<div class="editable draggable hover" grip="1" destination="cellcontained"
   tal:define="
     info options/info;
     globals info/globals;
@@ -11,8 +11,5 @@
     editable python:1;
     formattable python: formats and 1 or 0;
     formats python: ' '.join(formats);
-    id id">
-
-    <div tal:content="structure options/markup" />
-
-</div>
+    id id"
+  tal:content="structure options/markup" />

Modified: 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/slot.pt
==============================================================================
--- 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/slot.pt   
    (original)
+++ 
z3lab/cpsskins/branches/jmo-perspectives/engines/pagedesigner/filters/slot.pt   
    Tue Nov  8 22:58:25 2005
@@ -8,14 +8,14 @@
   id context/identifier;
   icon context/@@getIcon">
 
-  <div class="slotFrame editable draggable"
+  <div class="slotFrame editable draggable" destination="cellcontained"
    tal:attributes="
      editable python:1;
      formattable python: formats and 1 or 0;
      formats python: ' '.join(formats);
      id id">
-    <div class="title" tal:content="slot_title|slot_name" />
-    <div class="body"><img src="" tal:attributes="src icon" />
+    <div class="title" grip="1" tal:content="slot_title|slot_name" />
+    <div class="body" grip="1"><img src="" tal:attributes="src icon" />
       <tal:block content="slot_name" />
     </div>
   </div>
-- 
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins

Reply via email to