Office add-in collaboration updates

git-svn-id: https://svn.alfresco.com/repos/alfresco-enterprise/alfresco/HEAD/root@7512 c4b6b30b-aa2e-2d43-bbcb-ca4b014f7261

source/web/css/office.css

@@ -63,31 +63,31 @@ input.button {
    overflow-x: hidden;
 }
 
-#tabBar {
+.tabBar {
    float: left;
    width: 100%;
    background: #efefef;
    border-bottom: 1px solid #ccc;
 }
-#tabBar ul {
+.tabBar ul {
    margin: 0px;
    padding: 4px 10px 0px 4px;
    list-style: none;
 }
-#tabBar li {
+.tabBar li {
    display: inline;
    margin: 0px;
    padding: 0px;
    height: 18px;
 }
-#tabBar a {
+.tabBar a {
    background: url("../images/office/tab_left.gif") no-repeat left top;
    float:left;
    margin: 0px;
    padding: 0px 0px 0px 4px;
    text-decoration: none;
 }
-#tabBar a span {
+.tabBar a span {
    background: url("../images/office/tab_right.gif") no-repeat right top;
    color: #666;
    display: block;
@@ -95,23 +95,79 @@ input.button {
    padding: 5px 15px 4px 6px;
 }
 
-#tabBar a:hover span {
+.tabBar a:hover span {
    color: #FFF;
 }
-#tabBar a:hover {
+.tabBar a:hover {
    background-position: 0% -42px;
 }
-#tabBar a:hover span {
+.tabBar a:hover span {
    background-position: 100% -42px;
 }
 
-#tabBar #current a {
+.tabBar #current a {
    background-position: 0% -42px;
 }
-#tabBar #current a span {
+.tabBar #current a span {
    background-position: 100% -42px;
 }
 
+.tabBarInline {
+   clear: left;
+   float: left;
+   margin: 0px 4px;
+   width: 284px;
+}
+.tabBarInline ul {
+   margin: 0px;
+   padding: 4px 10px 0px 4px;
+   list-style: none;
+}
+.tabBarInline li {
+   display: inline;
+   margin: 0px;
+   padding: 0px;
+   height: 18px;
+}
+.tabBarInline a {
+   background: url("../images/office/tab_left.gif") no-repeat left top;
+   float:left;
+   margin: 0px;
+   padding: 0px 0px 0px 4px;
+   text-decoration: none;
+}
+.tabBarInline a span {
+   background: url("../images/office/tab_right.gif") no-repeat right top;
+   color: #666;
+   display: block;
+   float: none;
+   padding: 5px 15px 4px 6px;
+}
+
+.tabBarInline a:hover span {
+   color: #FFF;
+}
+.tabBarInline a:hover {
+   background-position: 0% -42px;
+}
+.tabBarInline a:hover span {
+   background-position: 100% -42px;
+}
+
+.tabBarInline .current a {
+   background-position: 0% -42px;
+}
+.tabBarInline .current a span {
+   background-position: 100% -42px;
+}
+
+.tabPanel {
+}
+
+.tabPanelHidden {
+   display: none;
+}
+
 .header {
    clear: both;
    font-weight: bold;
@@ -124,6 +180,22 @@ input.button {
    white-space:nowrap;
 }
 
+.tabHeader {
+   background: #ffffff;
+   border: 1px solid #cccccc;
+   border-bottom: none;
+   clear: both;
+   font-weight: bold;
+   float: left;
+   margin: 0px 4px;
+   padding: 2px;
+   height: 13px;
+   width: 278px;
+   overflow: hidden;
+   text-overflow: ellipsis;
+   white-space: nowrap;
+}
+
 .headerExtra {
    font-weight: normal;
    float: right;
@@ -174,13 +246,23 @@ input.button {
    clear: both;
    float: left;
    width: 282px;
-   height: 76px;
+   height: 89px;
    overflow: auto;
    border: 1px solid #cccccc;
    margin: 0px 4px 0px 4px;
    background: #fff;
 }
 
+.containerSearchTerms {
+   clear: both;
+   float: left;
+   width: 282px;
+   height: 76px;
+   overflow: auto;
+   border: 1px solid #cccccc;
+   margin: 0px 4px 0px 4px;
+   background: #fff;
+}
 .containerSearchResults {
    clear: both;
    float: left;
@@ -191,8 +273,20 @@ input.button {
    margin: 0px 4px 0px 4px;
    background: #fff;
 }
+.containerTabMedium {
+   clear: both;
+   float: left;
+   width: 282px;
+   height: 174px;
+   overflow: auto;
+   border: 1px solid #cccccc;
+   border-top: none;
+   margin: 0px 4px 0px 4px;
+   background: #fff;
+}
 
-#checkedoutList, #taskList, #spaceList, #documentList, #versionList, #resultsList {
+
+#checkedoutList, #taskList, #spaceList, #documentList, #versionList, #taggedList, #resultsList {
    overflow-y: scroll;
 }
 
@@ -307,46 +401,35 @@ input.button {
    width: 226px;
 }
 
-#documentActions {
+.actionsPanel {
    clear: both;
    background-color: #ffffcc;
    border: 1px solid #ccc;
    float: left;
    margin: 0px 4px;
-   height: 150px;
    width: 282px;
 }
-#documentActions ul {
+.actionsPanel ul {
    padding: 2px 0px 0px 24px;
 }
-#documentActions li a {
+.actionsPanel li a {
    font-weight: bold;
    margin: 0px 0px 0px -22px;
 }
-#documentActions li a img {
+.actionsPanel li a img {
    margin: 0px 0px -2px 0px;
    padding: 0px 3px 0px 0px;
 }
 
-#documentActionsNavigation {
-   clear: both;
-   background-color: #ffffcc;
-   border: 1px solid #ccc;
-   float: left;
-   margin: 0px 4px;
+
+#myAlfrescoActions {
+   height: 150px;
+}
+#documentActions {
+   height: 149px;
+}
+#navigationActions {
    height: 89px;
-   width: 282px;
-}
-#documentActionsNavigation ul {
-   padding: 2px 0px 0px 24px;
-}
-#documentActionsNavigation li a {
-   font-weight: bold;
-   margin: 0px 0px 0px -22px;
-}
-#documentActionsNavigation li a img {
-   margin: 0px 0px -2px 0px;
-   padding: 0px 3px 0px 0px;
 }
 
 #saveDetailsPanel
@@ -638,3 +721,119 @@ ul.autocompleter-choices li.autocompleter-selected span.autocompleter-queried
    background-color: #0073e6;
    color: #fff;
 }
+
+/* Document tags */
+.addTagIcon {
+   background: url("../images/office/new_tag.gif") no-repeat;
+   float: left;
+   height: 16px;
+   width: 16px;
+   margin: 2px 4px;
+}
+
+#addTagLinkContainer {
+   height: 16px;
+   margin: 3px 0px;
+}
+
+#addTagFormContainer {
+   display: none;
+}
+
+#addTagForm {
+   margin: 1px;
+}
+
+#addTagBox {
+   border: 1px solid #cccccc;
+   height: 14px;
+   margin: 0px 0px 0px;
+   padding: 1px;
+   color: #0073e6;
+   font-family: tahoma, sans-serif;
+   font-size: 11px;
+}
+
+.addTagImage {
+   margin: 0px 0px -2px;
+   outline: none;
+}
+
+.tagListEntry {
+   cursor: pointer;
+   margin: 1px 0px;
+   padding: 0px 4px;
+}
+
+.tagDelete {
+   color: #ccc;
+   font-size: 11px;
+}
+
+.tagName {
+}
+
+/* Tag cloud */
+#tagCloud {
+   line-height: 2em;
+   padding: 4px;
+}
+
+#tagCloud .tagContainer {
+   float: left;
+   padding: 2px;
+}
+
+#tagCloud a {
+   cursor: pointer;
+}
+
+#tagCloud .tagName0 {
+   font-size: 11px;
+}
+#tagCloud .tagName1 {
+   font-size: 12px;
+}
+#tagCloud .tagName2 {
+   font-size: 13px;
+}
+#tagCloud .tagName3 {
+   font-size: 14px;
+}
+#tagCloud .tagName4 {
+   font-size: 15px;
+}
+#tagCloud .tagName5 {
+   font-size: 16px;
+}
+
+#tagCloud .tagCount {
+   color: #cccccc;
+   font-size: 11px;
+   padding-left: 0.1em;
+}
+
+#taggedList {
+   border-top: none;
+   float: left;
+   height: 356px !important;
+}
+
+.taggedFound {
+   background: #ffffff;
+   border: 1px solid #cccccc;
+   border-bottom: none;
+   clear: both;
+   float: left;
+   margin: 0px 4px;
+   padding: 2px;
+   height: 13px;
+   width: 278px;
+   overflow: hidden;
+   text-overflow: ellipsis;
+   white-space: nowrap;
+}
+
+.taggedFound {
+   float: left;
+}

source/web/css/office_ie6.css

@@ -10,7 +10,7 @@
    top: -2px;
 }
 
-.containerBig, .containerMedium, .containerSmall, .containerSearchResults, #currentSpaceInfo, #documentActions, #documentActionsNavigation {
+.containerBig, .containerBigAlt, .containerMedium, .containerSmall, .containerSearchTerms, .containerSearchResults, .containerTabMedium, #currentSpaceInfo, #myAlfrescoActions, #navigationActions, #documentActions {
    margin: 0px 4px 0px 1px;
 }
 

source/web/scripts/office/doc_details.js

@@ -0,0 +1,108 @@
+/*
+ * Prerequisites: mootools.v1.11.js
+ *                office_addin.js
+ */
+var OfficeDocDetails =
+{
+   init: function()
+   {
+      OfficeDocDetails.setupTabs();
+      OfficeDocDetails.setupTags();
+   },
+
+   setupTabs: function()
+   {
+      var tabs = $$('.tabBarInline li');
+      var tablinks = $$('.tabBarInline li a'); 
+      var panels = $$('.tabPanel');
+      
+      tabs.each(function(tab, i)
+      {
+         // register 'click' event for each tab
+         tablinks[i].addEvent('click', function(e)
+         {
+            // highlight the current tab
+            tab.addClass('current');
+            // show the tab panel
+            panels[i].removeClass('tabPanelHidden');
+
+            // reset styles on all closed tasks
+            tabs.each(function(otherTab, j)
+            {
+               if (otherTab != tab)
+               {
+                  // reset selected class
+                  otherTab.removeClass('current');
+                  // hide the tab panel
+                  panels[j].addClass('tabPanelHidden');
+               }
+            });
+         });
+      });
+   },
+   
+   setupTags: function()
+   {
+      var tags = $$('#panelTags .tagName');
+      
+      tags.each(function(tag, i)
+      {
+         tag.addEvent('click', function(e)
+         {
+            window.location.href = window.serviceContextPath + "/office/tags?p=" + window.queryObject.p + "&tag=" + tag.innerHTML;
+         });
+      });
+   },
+
+   showAddTagForm: function()
+   {
+      $("addTagLinkContainer").setStyle("display", "none");
+      $("addTagFormContainer").setStyle("display", "block");
+      $("addTagBox").focus();
+   },
+   
+   hideAddTagForm: function()
+   {
+      $("addTagFormContainer").setStyle("display", "none");
+      $("addTagLinkContainer").setStyle("display", "block");
+      return false;
+   },
+   
+   addTag: function(nodeId, tagName)
+   {
+      OfficeAddin.postAction(window.serviceContextPath + "/collaboration/tagActions", "add", nodeId, null, "&t=" + tagName);
+      return false;
+   },
+   
+   tagAction: function(action, nodeId, tagName, msg)
+   {
+      if (msg != "" && !confirm(msg))
+      {
+         return;
+      }
+   
+      OfficeAddin.showStatusText("Processing...", "ajax_anim.gif", false);
+      var actionURL = window.serviceContextPath + "/collaboration/tagActions?a=" + action + "&n=" + nodeId + "&t=" + tagName;
+      var myAjax = new Ajax(actionURL, {
+         method: 'post',
+         headers: {'If-Modified-Since': 'Sat, 1 Jan 2000 00:00:00 GMT'},
+         onComplete: function(textResponse, xmlResponse)
+         {
+            // Optionally add a status string
+            if (textResponse != "")
+            {
+               var objResponse = Json.evaluate(textResponse);
+               var imgSuccess = (objResponse.statusCode ? "action_successful.gif" : "action_failed.gif");
+               var colBackground = (objResponse.statusCode ? "#50ff50" : "#ff5050");
+               OfficeAddin.showStatusText(objResponse.statusString, imgSuccess, true, colBackground);
+            }
+         },
+         onFailure: function()
+         {
+            OfficeAddin.showStatusText("Action failed", "action_failed.gif", true);
+         }
+      }).request();
+   }
+};
+
+window.addEvent('domready', OfficeDocDetails.init);

source/web/scripts/office/my_tasks.js

@@ -113,8 +113,7 @@ var OfficeMyTasks =
                      OfficeAddin.hideStatusText();
                      $("taskDetails").innerHTML = textResponse;
                   }
-               });
-               myAjax.request();
+               }).request();
                
                // close other open tasks
                tasks.each(function(otherTask, j)
@@ -180,8 +179,7 @@ var OfficeMyTasks =
          {
             OfficeAddin.showStatusText("Couldn't run workflow", "action_failed.gif", true);
          }
-      });
-      myAjax.request();
+      }).request();
    },
    
    startWorkflow: function(commandURL, Doc)
@@ -229,18 +227,18 @@ var OfficeMyTasks =
    },
    
    /* AJAX call to perform server-side actions */
-   runAction: function(useTemplate, Action, Doc, Msg)
+   runAction: function(useTemplate, action, nodeId, confirmMsg)
    {
       // Re-select a selected task after reload
       var taskSel = $E('#taskList .taskItemSelected');
-      var extraParams = "";
+      var outParams = null;
       if (taskSel != null)
       {
          var taskId = taskSel.id;
-         extraParams = "t=" + encodeURI(taskId);
+         outParams = "t=" + encodeURI(taskId);
       }
       
-      OfficeAddin.runAction(useTemplate, Action, Doc, Msg, extraParams);
+      return OfficeAddin.getAction(useTemplate, action, nodeId, confirmMsg, null, outParams);
    },
 
    refreshPage: function()

source/web/scripts/office/office_addin.js

@@ -91,17 +91,32 @@ var OfficeAddin =
    },
    
    /* AJAX call to perform server-side actions */
-   runAction: function(useTemplate, Action, Doc, Msg, extraParams)
+   getAction: function(useTemplate, action, nodeId, confirmMsg, inParams, outParams)
    {
-      if (Msg != "" && !confirm(Msg))
+      return OfficeAddin.runAction("get", useTemplate, action, nodeId, confirmMsg, inParams, outParams)
+   },
+   postAction: function(useTemplate, action, nodeId, confirmMsg, inParams, outParams)
+   {
+      return OfficeAddin.runAction("post", useTemplate, action, nodeId, confirmMsg, inParams, outParams)
+   },
+   runAction: function(httpMethod, useTemplate, action, nodeId, confirmMsg, inParams, outParams)
+   {
+      if ((confirmMsg != null) && (confirmMsg != ""))
       {
-         return;
+         if (!confirm(confirmMsg))
+         {
+            return;
+         }
       }
    
       OfficeAddin.showStatusText("Running action...", "ajax_anim.gif", false);
-      var actionURL = useTemplate + "?a=" + Action + "&d=" + Doc;
+      var actionURL = useTemplate + "?a=" + action + "&n=" + nodeId;
+      if ((inParams != null) && (inParams != ""))
+      {
+         actionURL += "&" + inParams;
+      }
       var myAjax = new Ajax(actionURL, {
-         method: 'get',
+         method: httpMethod,
          headers: {'If-Modified-Since': 'Sat, 1 Jan 2000 00:00:00 GMT'},
          onComplete: function(textResponse, xmlResponse)
          {
@@ -114,12 +129,14 @@ var OfficeAddin =
             {
                href += (href.indexOf("?") == -1) ? "?" : "&";
                href += "st=" + encodeURI(textResponse);
-               href += "&" + extraParams;
+               if ((outParams != null) && (outParams != ""))
+               {
+                  href += "&" + outParams;
+               }
             }
             window.location.href = href;
          }
-      });
-      myAjax.request();
+      }).request();
    },
 
    /* Calculates and returns the context path for the current page */

source/web/scripts/office/tags.js

@@ -0,0 +1,115 @@
+/*
+ * Prerequisites: mootools.v1.11.js
+ *                office_addin.js
+ */
+var OfficeTags =
+{
+   /* Scaling for tag clouds - must have supporting CSS classes defined */
+   SCALE_FACTOR: 5,
+   
+   /* Manadatory params for searchResults component */
+   searchParams: "",
+   
+   init: function()
+   {
+      OfficeTags.getTagCloud();
+   },
+   
+   setParams: function(params)
+   {
+      OfficeTags.searchParams = params;
+   },
+   
+   getTagCloud: function()
+   {
+      OfficeAddin.showStatusText("Loading tag cloud...", "ajax_anim.gif", false);
+
+      // ajax call to get repository tag data
+      var actionURL = window.serviceContextPath + "/collaboration/tagQuery";
+      var myJsonRequest = new Json.Remote(actionURL, {
+         method: 'get',
+         headers: {'If-Modified-Since': 'Sat, 1 Jan 2000 00:00:00 GMT'},
+         onComplete: function(tagQuery)
+         {
+            OfficeAddin.hideStatusText();
+            OfficeTags.populateTagCloud(tagQuery);
+         }
+      }).send();
+   },
+   
+   populateTagCloud: function(tagQuery)
+   {
+      var tagCloud = $("tagCloud");
+      var range = tagQuery.countMax - tagQuery.countMin;
+      var scale = (range / OfficeTags.SCALE_FACTOR);
+      
+      var tagContainer, tagName, tagNameClass, tagCount;
+
+      tagCloud.empty();      
+      tagQuery.tags.each(function(tag, i)
+      {
+         tagNameClass = "tagName" + Math.round((tag.count - tagQuery.countMin) / scale);         
+         tagName = new Element("a", {"class": tagNameClass});
+         tagName.appendText(tag.name);
+         tagName.injectInside(tagCloud);
+         tagName.addEvent('click', function(e)
+         {
+            OfficeTags.selectTag(tag.name);
+         });
+         tagCloud.appendText(" ");
+         
+         tagCount = new Element("span", {"class": "tagCount"});
+         tagCount.appendText("(" + tag.count + ")");
+         tagCount.injectInside(tagName);
+      });
+      
+      // $("tagCloud").innerHTML = Json.toString(tagQuery);
+   },
+
+   /* AJAX call to perform server-side tag search */
+   selectTag: function(tagName)
+   {
+      OfficeAddin.showStatusText("Searching tags...", "ajax_anim.gif", false);
+
+      // var maxResults = $('maxResults').value;
+      var maxResults = 100;
+      
+      var args = OfficeTags.searchParams + "&type=tag";
+      var actionURL = window.serviceContextPath + "/office/searchResults?p=" + args + "&search=" + tagName.replace(" ", "_x0020_") + "&maxresults=" + maxResults;
+      var myAjax = new Ajax(actionURL, {
+         method: 'get',
+         headers: {'If-Modified-Since': 'Sat, 1 Jan 2000 00:00:00 GMT'},
+         evalScripts: true,
+         onComplete: function(textResponse, xmlResponse)
+         {
+            OfficeAddin.hideStatusText();
+            $('taggedList').innerHTML = textResponse;
+            $('taggedHeader').innerHTML = "Tagged with \"" + tagName + "\"";
+         }
+      }).request();
+   }
+};
+
+/* Search Results expects this class */
+var OfficeSearch = 
+{
+   itemsFound: function(shownResults, totalResults)
+   {
+      var strFound;
+      if (totalResults == 0)
+      {
+         strFound = "No items found";
+      }
+      else if (shownResults < totalResults)
+      {
+         strFound = "Showing first " + shownResults + " of " + totalResults + " total items found";
+      }
+      else
+      {
+         strFound = "Showing all " + shownResults + " items found";
+      }
+      $('itemsFound').innerHTML = strFound;
+   }
+};
+
+window.addEvent('domready', OfficeTags.init);