Monotone-Parent: ebd8557fae4ef7c0656a9eae753c68207fc9c60b

Monotone-Revision: 4688dea10443d333b15ccb3db6b63dd630673d16

Monotone-Author: crobert@inverse.ca
Monotone-Date: 2009-06-29T18:25:29
Monotone-Branch: ca.inverse.sogo

ChangeLog

@@ -1,3 +1,7 @@
+2009-06-29  Cyril Robert <crobert@inverse.ca>
+
+	* UI/WebServerResources/ContactsUI.js: Added drag & drop support!
+
 2009-06-26  Francis Lachapelle  <flachapelle@inverse.ca>
 
 	* UI/Contacts/UIxContactsListViewContainer.[hm]: this class was

UI/Templates/UIxPageFrame.wox

@@ -128,6 +128,7 @@
 	  <script type="text/javascript" rsrc:src="generic.js"><!-- space --></script>
 	  <script type="text/javascript" rsrc:src="SOGoDragAndDrop.js"><!-- space --></script>
 	  <script type="text/javascript" rsrc:src="SOGoDragHandles.js"><!-- space --></script>
+    <script type="text/javascript" rsrc:src="scriptaculous/scriptaculous.js"><!-- space --></script>
 	  <var:if condition="hasProductSpecificJavaScript"><script type="text/javascript"
 	      var:src="productJavaScriptURL"><!-- space --></script></var:if>
 	  <var:if condition="hasPageSpecificJavaScript"><script type="text/javascript"

UI/WebServerResources/ContactsUI.css

@@ -344,3 +344,20 @@ DIV.contactSelection INPUT.button
 
 DIV.contactSelection SPAN#selectionLabel
 { float: left; }
+
+DIV#dragDropVisual
+{
+  background-image: url(/SOGo.woa/WebServerResources/abcard.gif);
+  background-repeat: no-repeat;
+  background-position: 4px 2px;
+  width: 5px;
+  height: 20px;
+  padding-left: 24px;
+  padding-top: 5px;
+}
+
+DIV.copy
+{
+  background-image: url(/SOGo.woa/WebServerResources/add-contact.gif) !important; 
+  background-position: 1px -2px !important;
+}

UI/WebServerResources/ContactsUI.js

@@ -106,6 +106,7 @@ function contactsListCallback(http) {
 				table.observe("mousedown", onContactSelectionChange);
 				configureSortableTableHeaders(table);
 				TableKit.Resizable.init(table, {'trueResize' : true, 'keepWidth' : true});
+        configureDragAndDrop ();
       }
       
 			var rows = table.tBodies[0].rows;
@@ -221,8 +222,9 @@ function _onContactMenuAction(folderItem, action, refresh) {
 				return row.getAttribute("id");
       });
 
-    var url = ApplicationBaseURL + selectedFolderId + "/" + action + "?folder=" + folderId + "&uid="
-      + contactIds.join("&uid=");
+    var url = ApplicationBaseURL + selectedFolderId + "/" + action 
+              + "?folder=" + folderId + "&uid="
+              + contactIds.join("&uid=");
     
     if (refresh)
       triggerAjaxRequest(url, actionContactCallback, selectedFolderId);
@@ -1061,4 +1063,90 @@ function initContacts(event) {
   sorting["ascending"] = true;
 }
 
+function configureDragAndDrop () {
+  var mainElement = new Element ("div", {id: "dragDropVisual"});
+  document.body.appendChild(mainElement);
+  log ("1");
+  mainElement.absolutize ();
+  mainElement.style.display = "none";
+
+  new Draggable ("dragDropVisual", 
+                 { 
+                   handle: "contactsList", 
+                   onStart: startDragging,
+                   onEnd: stopDragging,
+                   onDrag: whileDragging
+                 });
+  log ("2");
+
+  var drops = $$("ul#contactFolders li");
+  drops.each (function (drop) {
+              log ("3");
+                if (!drop.hasClassName ("remote"))
+                  Droppables.add (drop.id, 
+                                  {
+                                    hoverclass: "genericHoverClass",
+                                    onDrop: dropAction
+                                  });
+              });
+
+}
+
+function currentFolderIsRemote () {
+  rc = false;
+  var selectedFolders = $("contactFolders").getSelectedNodes();
+  if (selectedFolders.length > 0) {
+    var fromObject = $(selectedFolders[0]);
+    rc = fromObject.hasClassName ("remote");
+  }
+  return rc;
+}
+
+function startDragging (itm, e) {
+  var handle = $("dragDropVisual");
+  var count = $('contactsList').getSelectedRowsId().length;
+  handle.style.display = "block";
+  handle.update (count);
+  if (e.shiftKey || currentFolderIsRemote ())
+    handle.addClassName ("copy");
+}
+
+function whileDragging (itm, e) {
+  var handle = $("dragDropVisual");
+  if (e.shiftKey || currentFolderIsRemote ())
+    handle.addClassName ("copy");
+  else if (handle.hasClassName ("copy"))
+    handle.removeClassName ("copy");
+}
+
+function stopDragging () {
+  var handle = $("dragDropVisual");
+  handle.style.display = "none";
+  if (handle.hasClassName ("copy"))
+    handle.removeClassName ("copy");
+}
+
+function dropAction (dropped, zone, e) {
+  var action = "move";
+  if ($("dragDropVisual").hasClassName ("copy"))
+    action = "copy";
+  dropSelectedContacts (action, zone.id.substr (1));
+}
+
+function dropSelectedContacts (action, toId) {
+  var selectedFolders = $("contactFolders").getSelectedNodes();
+  if (selectedFolders.length > 0) {
+    var contactIds = $('contactsList').getSelectedRowsId();
+    var fromId = $(selectedFolders[0]).id;
+    if (!currentFolderIsRemote () || action != "move") {
+      var url = ApplicationBaseURL + fromId + "/" + action 
+                + "?folder=" + toId + "&uid="
+                + contactIds.join("&uid=");
+    
+      triggerAjaxRequest(url, actionContactCallback, fromId);
+    }
+  }
+}
+
+
 document.observe("dom:loaded", initContacts);

UI/WebServerResources/generic.css

@@ -776,3 +776,9 @@ DIV.resize-handle
   DIV.tabsContainer
   { display: none; }
 }
+
+.genericHoverClass
+{
+  background-color: #f0f0f0 !important;
+  color: #000000 !important;
+}