Doclist portlet - ContentUpdateBean to replace content of existing item. Web script updates to support content update and launch Edit Properties web client dialog. Doclist header background gradient.

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

config/alfresco/templates/client/doclist_preview_panel.ftl

@@ -18,16 +18,24 @@
          <table width="100%" cellpadding="0" cellspacing="0">
             <tr>
 <#if node.isLocked >
-               <td class="docAction docActionLocked">(Locked)</td>
+               <td class="docAction docActionCheckout docActionLocked">(Locked)</td>
 <#elseif hasAspect(node, "cm:workingcopy") == 1>
                <td class="docAction docActionCheckin" <#if node.hasPermission("CheckIn")>onclick='event.cancelBubble=true;MyDocs.checkinItem("${node.name}", "${node.nodeRef}");'</#if>>Check In</td>
 <#else>
                <td class="docAction docActionCheckout" <#if node.hasPermission("CheckOut")>onclick='event.cancelBubble=true;MyDocs.checkoutItem("${node.name}", "${node.nodeRef}");'</#if>>Check Out</td>
 </#if>
-               <td class="docAction docActionEditDetails">Edit Details</td>
+<#if node.isLocked >
+               <td class="docAction docActionEditDetails docActionLocked">Edit Details</td>
+<#else>
+               <td class="docAction docActionEditDetails" onclick="window.open('${url.context}/command/ui/editcontentprops?container=plain&amp;noderef=${node.nodeRef}', '_blank');">Edit Details</td>
+</#if>
             </tr>
             <tr>
-               <td class="docAction docActionUpdate">Update</td>
+<#if node.isLocked >
+               <td class="docAction docActionUpdate docActionLocked">Update</td>
+<#else>
+               <td class="docAction docActionUpdate" onclick="event.cancelBubble=true;MyDocs.updateItem(this, '${node.nodeRef}');">Update</td>
+</#if>
                <td class="docAction docActionViewContent" onclick="window.open('${url.context}${node.downloadUrl}', '_blank');">View Content</td>
             </tr>
             <tr>

config/alfresco/templates/webscripts/org/alfresco/portlets/doclist.get.html.ftl

@@ -42,8 +42,8 @@
 
 <table border=0 cellspacing=0 cellpadding=0 class="docTable">
 <tr>
-   <td height=40>
+   <td height="30" class="docHeader">
-      <table border=0 cellspacing=8 cellpadding=0 width=100%>
+      <table border="0" cellspacing="6" cellpadding="0" width="100%">
          <tr>
             <th><a id="docFilter0" class="docfilterLink <#if filter=0>docfilterLinkSelected</#if>" href="#" onclick="MyDocs.filter(0); return false;">All Items</a></th>
             <th><a id="docFilter1" class="docfilterLink <#if filter=1>docfilterLinkSelected</#if>" href="#" onclick="MyDocs.filter(1); return false;">Word Documents</a></th>
@@ -58,7 +58,13 @@
    </td>
 </tr>
 <tr><td>
+   <div id="docUpdatePanel">
+      <#-- Url encode the path value, and encode any single quotes to generate valid string -->
+      <input class="docFormItem" type="button" value="OK" onclick='MyDocs.updateOK(this, "${path?url?replace("'","_%_")}");'>
+      <input class="docFormItem" type="button" value="Cancel" onclick="MyDocs.closePopupPanel();">
+   </div>
    <div id="docPanelOverlay"></div>
+   <div id="docPanelOverlayAjax"></div>
    <div id="docPanel">
       <#-- populated via an AJAX call to 'doclistpanel' webscript -->
       <#-- resolved path, filter and home.noderef required as arguments -->
@@ -85,7 +91,7 @@ a.docfilterLink:link, a.docfilterLink:visited
 {
    color: #8EA1B3;
    font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
-   font-size: 13px;
+   font-size: 12px;
    font-weight: bold;
    text-decoration: none;
    padding-left: 4px;
@@ -122,6 +128,15 @@ a.docfilterLinkSelected:link, a.docfilterLinkSelected:visited
 }
 
 #docPanelOverlay
+{
+   background-color: #fff;
+   position: absolute;
+   height: 320px;
+   width: 716px;
+   overflow: hidden;
+}
+
+#docPanelOverlayAjax
 {
    background-color: #fff;
    background-image: url(${url.context}/images/icons/ajax_anim.gif);
@@ -139,6 +154,20 @@ a.docfilterLinkSelected:link, a.docfilterLinkSelected:visited
    border-top: 1px solid #F8FCFD;
    border-bottom: 1px solid #CCD4DB;
 }
+.docRowOdd
+{
+   background-color: #EEF7FB;
+}
+.docRowEven
+{
+   background-color: #F8FCFD;
+}
+
+.docHeader
+{
+   background-image: url(${url.context}/images/parts/doclist_headerbg.png);
+}
+
 
 .docFooter
 {
@@ -259,9 +288,7 @@ a.docfilterLinkSelected:link, a.docfilterLinkSelected:visited
 
 .docActionLocked
 {
-   background-image: url(${url.context}/images/icons/doclist_action_locked.png);
+   background-image: url(${url.context}/images/icons/doclist_action_locked.png) !important;
-   border-bottom: none;
-   border-right: none;
    cursor: default !important;
 }
 
@@ -314,4 +341,26 @@ a.refreshViewLink:link, a.refreshViewLink:visited, a.refreshViewLink:hover
    text-decoration: none;
 }
 
+#docUpdatePanel
+{
+   position: absolute;
+   border: 1px solid #CCD4DB;
+   background-color: #EEF7FB;
+   width: 24em;
+   height: 5em;
+   padding: 8px;
+   margin: 8px;
+   display: none;
+   z-index: 1;
+   -moz-border-radius: 5px;
+}
+
+.docFormItem
+{
+   margin: 4px;
+   padding: 2px;
+   background-color: #F8FCFD;
+   border: 1px solid #CCD4DB;
+}
+
 </STYLE>

config/alfresco/templates/webscripts/org/alfresco/portlets/doclistpanel.get.html.ftl

@@ -16,7 +16,7 @@
            (filter=3 && d.mimetype="application/pdf") ||
            (filter=4 && (dateCompare(d.properties["cm:modified"],date,weekms) == 1 || dateCompare(d.properties["cm:created"], date, weekms) == 1))>
       <#assign count=count+1>
-      <div class="docRow">
+      <div class="docRow docRow${(count % 2 = 0)?string("Odd", "wEven")}">
          <div class="docIcon">
             <a href="${url.context}${d.url}" target="new"><img class="docIconImage" alt="" width="16" height="16" src="${url.context}${d.icon16?replace(".gif",".png")}" border=0></a>
          </div>

source/java/org/alfresco/web/bean/ajax/ContentUpdateBean.java

@@ -0,0 +1,157 @@
+/*
+ * Copyright (C) 2005-2007 Alfresco Software Limited.
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License
+ * as published by the Free Software Foundation; either version 2
+ * of the License, or (at your option) any later version.
+
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+
+ * As a special exception to the terms and conditions of version 2.0 of 
+ * the GPL, you may redistribute this Program in connection with Free/Libre 
+ * and Open Source Software ("FLOSS") applications as described in Alfresco's 
+ * FLOSS exception.  You should have recieved a copy of the text describing 
+ * the FLOSS exception, and it is also available here: 
+ * http://www.alfresco.com/legal/licensing
+ */
+package org.alfresco.web.bean.ajax;
+
+import java.io.File;
+import java.io.Serializable;
+import java.net.URLDecoder;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.StringTokenizer;
+
+import javax.faces.context.ExternalContext;
+import javax.faces.context.FacesContext;
+import javax.faces.context.ResponseWriter;
+import javax.servlet.http.HttpServletRequest;
+
+import org.alfresco.model.ContentModel;
+import org.alfresco.repo.content.MimetypeMap;
+import org.alfresco.repo.content.filestore.FileContentReader;
+import org.alfresco.service.ServiceRegistry;
+import org.alfresco.service.cmr.model.FileInfo;
+import org.alfresco.service.cmr.repository.ContentReader;
+import org.alfresco.service.cmr.repository.ContentWriter;
+import org.alfresco.service.cmr.repository.NodeRef;
+import org.alfresco.service.namespace.QName;
+import org.alfresco.util.TempFileProvider;
+import org.alfresco.web.app.servlet.BaseServlet;
+import org.alfresco.web.app.servlet.ajax.InvokeCommand;
+import org.alfresco.web.bean.repository.Repository;
+import org.alfresco.web.forms.XMLUtil;
+import org.apache.commons.fileupload.FileItem;
+import org.apache.commons.fileupload.disk.DiskFileItemFactory;
+import org.apache.commons.fileupload.servlet.ServletFileUpload;
+import org.apache.commons.io.FilenameUtils;
+import org.apache.commons.logging.Log;
+import org.apache.commons.logging.LogFactory;
+import org.w3c.dom.Document;
+import org.w3c.dom.Element;
+import org.w3c.dom.Node;
+
+/**
+ * Bean managing the ajax servlet upload of a multi-part form containing file content
+ * to replace the content of a node within the repository. 
+ * 
+ * @author Mike Hatfield
+ */
+public class ContentUpdateBean
+{
+   private static Log logger = LogFactory.getLog(ContentUpdateBean.class);
+   
+   /**
+    * Ajax method to update file content. A multi-part form is required as the input.
+    * 
+    * "return-page" = javascript to execute on return from the upload request
+    * "nodeRef" = the nodeRef of the item to update the content of
+    * 
+    * @throws Exception
+    */
+   @InvokeCommand.ResponseMimetype(value=MimetypeMap.MIMETYPE_HTML)
+   public void updateFile() throws Exception
+   {
+      FacesContext fc = FacesContext.getCurrentInstance();
+      ExternalContext externalContext = fc.getExternalContext();
+      HttpServletRequest request = (HttpServletRequest)externalContext.getRequest();
+      
+      ServletFileUpload upload = new ServletFileUpload(new DiskFileItemFactory());
+      upload.setHeaderEncoding("UTF-8");
+      
+      List<FileItem> fileItems = upload.parseRequest(request);
+      String strNodeRef = null;
+      String strFilename = null;
+      String strReturnPage = null;
+      File file = null;
+      
+      for (FileItem item : fileItems)
+      {
+         if (item.isFormField() && item.getFieldName().equals("return-page"))
+         {
+            strReturnPage = item.getString();
+         }
+         else if (item.isFormField() && item.getFieldName().equals("nodeRef"))
+         {
+            strNodeRef = item.getString();
+         }
+         else
+         {
+            strFilename = FilenameUtils.getName(item.getName());
+            file = TempFileProvider.createTempFile("alfresco", ".upload");
+            item.write(file);
+         }
+      }
+      
+      if (logger.isDebugEnabled())
+         logger.debug("Ajax content update request: " + strFilename + " to nodeRef: " + strNodeRef + " return page: " + strReturnPage);
+      
+      try
+      {
+         if (file != null && strNodeRef != null && strNodeRef.length() != 0)
+         {
+            NodeRef nodeRef = new NodeRef(strNodeRef);
+            if (nodeRef != null)
+            {
+               ServiceRegistry services = Repository.getServiceRegistry(fc);
+               
+               // get a writer for the content and put the file
+               ContentWriter writer = services.getContentService().getWriter(nodeRef, ContentModel.PROP_CONTENT, true);
+               writer.putContent(file);
+            }
+         }
+      }
+      catch (Exception e)
+      {
+         strReturnPage = strReturnPage.replace("${UPLOAD_ERROR}", e.getMessage());
+      }
+
+      Document result = XMLUtil.newDocument();
+      Element htmlEl = result.createElement("html");
+      result.appendChild(htmlEl);
+      Element bodyEl = result.createElement("body");
+      htmlEl.appendChild(bodyEl);
+
+      Element scriptEl = result.createElement("script");
+      bodyEl.appendChild(scriptEl);
+      scriptEl.setAttribute("type", "text/javascript");
+      Node scriptText = result.createTextNode(strReturnPage);
+      scriptEl.appendChild(scriptText);
+
+      if (logger.isDebugEnabled())
+         logger.debug("Content update request complete.");
+      
+      ResponseWriter out = fc.getResponseWriter();
+      XMLUtil.print(result, out);
+   }
+}

source/web/WEB-INF/faces-config-beans.xml

@@ -3829,6 +3829,15 @@
       <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
 
+   <managed-bean>
+      <description>
+         Bean that accepts Content updates for the repository
+      </description>
+      <managed-bean-name>ContentUpdateBean</managed-bean-name>
+      <managed-bean-class>org.alfresco.web.bean.ajax.ContentUpdateBean</managed-bean-class>
+      <managed-bean-scope>request</managed-bean-scope>
+   </managed-bean>
+
    <managed-bean>
       <description>
          Bean backing ajax calls for the MySpaces portlet

source/web/scripts/ajax/doclist.js

@@ -14,8 +14,9 @@ var MyDocs = {
    {
       if ($('docPanel'))
       {
+         $('docPanelOverlay').setStyle('opacity', 0);
          // show AJAX loading overlay
-         $('docPanelOverlay').setStyle('visibility', 'visible');
+         $('docPanelOverlayAjax').setStyle('visibility', 'visible');
          $('docPanel').setStyle('visibility', 'hidden');
          // fire off the ajax request to populate the doc list - the 'doclistpanel' webscript
          // is responsible for rendering just the contents of the main panel div
@@ -40,7 +41,7 @@ var MyDocs = {
                   $('docPanel').setHTML("Sorry, data currently unavailable.");
                   
                   // hide the ajax wait panel and show the main doc panel
-                  $('docPanelOverlay').setStyle('visibility', 'hidden');
+                  $('docPanelOverlayAjax').setStyle('visibility', 'hidden');
                   $('docPanel').setStyle('visibility', 'visible');
                }
             }
@@ -53,7 +54,7 @@ var MyDocs = {
       MyDocs.parseDocPanels();
       // hide the ajax wait panel and show the main doc panel
       $('docPanel').setStyle('visibility', 'visible');
-      $('docPanelOverlay').setStyle('visibility', 'hidden');
+      $('docPanelOverlayAjax').setStyle('visibility', 'hidden');
    },
 
    parseDocPanels: function()
@@ -452,6 +453,8 @@ var MyDocs = {
     */
    filter: function(filter)
    {
+      if (this.popupPanel != null) return;
+
       $$('.docfilterLink').each(function(filterLink, i)
       {
          if (i == filter)
@@ -558,7 +561,100 @@ var MyDocs = {
          }, 
          "noderef=" + noderef
       );
+   },
+
+   /**
+    * Display the Update File pop-up panel
+    */
+   updateItem: function(actionEl, nodeRef)
+   {
+      if (this.popupPanel != null) return;
+      
+      this.fxOverlay = $("docPanelOverlay").effect('opacity', {duration: MyDocs.ANIM_LENGTH});
+      
+      var panel = $("docUpdatePanel");
+      panel.setStyle("opacity", 0);
+      panel.setStyle("display", "inline");
+      Alfresco.Dom.smartAlignElement(panel, actionEl);
+      // make into a dragable panel
+      new Drag.Move(panel);
+      
+      // Generate a file upload element
+      // To perform the actual upload, the element is moved to a hidden iframe
+      // from which the upload is performed - this is required as javascript cannot
+      // set the important properties on a file upload element for security reasons.
+      // <input size="35" style="width:100%" type="file" value="" id="_upload" name="_upload">
+      if (this.fileInput == null)
+      {
+         var fileInput = $(document.createElement("input"));
+         fileInput.type = "file";
+         fileInput.name = "_upload";
+         fileInput.size = "35";
+         fileInput.setStyle("width", "100%");
+         fileInput.addClass("docFormItem");
+         fileInput.injectTop(panel);
+         this.fileInput = fileInput;
+      }
+      
+      var anim = new Fx.Styles(panel, {duration: MyDocs.ANIM_LENGTH, transition: Fx.Transitions.linear});
+      anim.start({'opacity': 1});
+      this.fxOverlay.start(0.5);
+      
+      this.popupPanel = panel;
+      this.popupPanel.nodeRef = nodeRef;
+   },
+   
+   /**
+    * OK button click handler for the Update Content pop-up panel
+    */
+   updateOK: function(actionEl, nodeRef)
+   {
+      if (this.fileInput.value.length > 0)
+      {
+         // call the upload help to perform the upload
+         handleUploadHelper(this.fileInput,
+                         "1",   // TODO: generate unique ID? (parent space noderef?)
+                         MyDocs.updateCompleteHandler,
+                         getContextPath(),
+                         "/ajax/invoke/ContentUpdateBean.updateFile",
+                         {nodeRef: this.popupPanel.nodeRef});
+         this.fileInput = null;
+      }      
+      this.closePopupPanel();
+   },
+   
+   /**
+    * Callback function executed after the upload of a new file is complete
+    */
+   updateCompleteHandler: function(id, path, fileName, error)
+   {
+      if (error == null)
+      {
+         MyDocs.start();
+      }
+      else
+      {
+         alert("ERROR: " + error);
+      }
+      if (this.fxOverlay)
+      {
+         this.fxOverlay.start(0);
+      }
+   },
+
+   /**
+    * Cancel button click handler for various pop-up panels
+    */
+   closePopupPanel: function()
+   {
+      if (this.popupPanel != null)
+      {
+         this.popupPanel.setStyle("display", "none");
+         this.popupPanel = null;
+      }
+      this.fxOverlay.start(0);
    }
+   
 };
 
 window.addEvent('load', MyDocs.start);