Merged from BRANCHES/DEV/KEVINR:

. NodeInfo panel and Ajax client library
 - Rewrite of Node Info panel
 - Alfresco common DOM methods refactored into namespaced object (YUI/Dojo style) Alfresco.Dom
 - Addition of useful DOM and 'smart' alignment method to common.js
 - OpenSearch now uses additional namespace for it's global method handlers: Alfresco.OpenSearchEngine
 - Temporary icons added for pop-up node info panel
. Additional FreeMarker model API method "cropContent(contentprop, length)" to return the first N bytes of a content stream - auto converted to plain/text from all supported transformation mimetypes
. DownloadContentServlet now handles ContentIOException more gracefully
. AbstractContentReader fixed to handle empty file data when requesting N characters from a content stream

. Yahoo scripts move to PageTag rendering as appropriate
. Refactoring of existing ajax components that output Yahoo scripts

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

source/java/org/alfresco/web/app/servlet/BaseDownloadContentServlet.java

@@ -41,6 +41,7 @@ import org.alfresco.error.AlfrescoRuntimeException;
 import org.alfresco.model.ContentModel;
 import org.alfresco.repo.content.filestore.FileContentReader;
 import org.alfresco.service.ServiceRegistry;
+import org.alfresco.service.cmr.repository.ContentIOException;
 import org.alfresco.service.cmr.repository.ContentReader;
 import org.alfresco.service.cmr.repository.ContentService;
 import org.alfresco.service.cmr.repository.MimetypeService;
@@ -260,17 +261,16 @@ public abstract class BaseDownloadContentServlet extends BaseServlet
          {
             reader.getContent( res.getOutputStream() );
          }
-         catch (SocketException e)
+         catch (SocketException e1)
-         {
-            if (e.getMessage().contains("ClientAbortException"))
          {
             // the client cut the connection - our mission was accomplished apart from a little error message
-               logger.error("Client aborted stream read:\n   node: " + nodeRef + "\n   content: " + reader);
+            if (logger.isInfoEnabled())
+               logger.info("Client aborted stream read:\n\tnode: " + nodeRef + "\n\tcontent: " + reader);
          }
-            else
+         catch (ContentIOException e2)
          {
-               throw e;
+            if (logger.isInfoEnabled())
-            }
+               logger.info("Client aborted stream read:\n\tnode: " + nodeRef + "\n\tcontent: " + reader);
          }
       }
       catch (Throwable err)

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

@@ -25,16 +25,22 @@
 package org.alfresco.web.bean.ajax;
 
 import java.io.IOException;
+import java.util.Date;
+import java.util.HashMap;
 import java.util.Map;
 
 import javax.faces.context.FacesContext;
 import javax.faces.context.ResponseWriter;
 
-import org.alfresco.model.ContentModel;
+import org.alfresco.repo.template.AbsoluteUrlMethod;
-import org.alfresco.service.cmr.repository.ContentService;
+import org.alfresco.repo.template.CropContentMethod;
+import org.alfresco.repo.template.UrlEncodeMethod;
 import org.alfresco.service.cmr.repository.NodeRef;
 import org.alfresco.service.cmr.repository.NodeService;
-import org.alfresco.web.bean.repository.Node;
+import org.alfresco.service.cmr.repository.TemplateImageResolver;
+import org.alfresco.service.cmr.repository.TemplateNode;
+import org.alfresco.web.bean.repository.Repository;
+import org.alfresco.web.ui.common.Utils;
 import org.apache.commons.logging.Log;
 import org.apache.commons.logging.LogFactory;
 
@@ -47,7 +53,6 @@ import org.apache.commons.logging.LogFactory;
 public class NodeInfoBean
 {
    private NodeService nodeService;
-   private ContentService contentService;
    
    private static final Log logger = LogFactory.getLog(NodeInfoBean.class);
    
@@ -62,44 +67,17 @@ public class NodeInfoBean
       FacesContext context = FacesContext.getCurrentInstance();
       ResponseWriter out = context.getResponseWriter();
       
-      String nodeRef = (String)context.getExternalContext().getRequestParameterMap().get("noderef");
+      String strNodeRef = (String)context.getExternalContext().getRequestParameterMap().get("noderef");
-      
+      if (strNodeRef == null || strNodeRef.length() == 0)
-      if (nodeRef == null || nodeRef.length() == 0)
       {
          throw new IllegalArgumentException("'noderef' parameter is missing");
       }
       
-      NodeRef repoNode = new NodeRef(nodeRef);
+      NodeRef nodeRef = new NodeRef(strNodeRef);
-      
+      if (this.nodeService.exists(nodeRef))
-      if (this.nodeService.exists(repoNode))
       {
-         // get the client side node representation and its properties
+         Repository.getServiceRegistry(context).getTemplateService().processTemplate(
-         Node clientNode = new Node(repoNode);
+               null, "/alfresco/templates/client/summary_panel.ftl", getModel(nodeRef), out);
-         Map props = clientNode.getProperties();
-         
-         // get the content size
-         Object content = props.get(ContentModel.PROP_CONTENT);
-         
-         // start the containing table
-         out.write("<table cellpadding='3' cellspacing='0'>");
-         
-         // write out information about the node as table rows
-         out.write("<tr><td colspan='2' class='mainSubTitle'>Summary</td></tr>");
-         
-         // add debug information to the summary if debug is enabled
-         if (logger.isDebugEnabled())
-         {
-            writeRow(out, "Id:", clientNode.getId());
-            writeRow(out, "Type:", clientNode.getType().toPrefixString());
-         }
-         
-         writeRow(out, "Description:", (String)props.get(ContentModel.PROP_DESCRIPTION));
-         writeRow(out, "Title:", (String)props.get(ContentModel.PROP_TITLE));
-         writeRow(out, "Created:", props.get("created").toString());
-         writeRow(out, "Modified:", props.get("modified").toString());
-         
-         // close the <table> and <div> tags
-         out.write("<table>");
       }
       else
       {
@@ -107,6 +85,7 @@ public class NodeInfoBean
       }
    }
 
+   
    // ------------------------------------------------------------------------------
    // Bean getters and setters
    
@@ -118,34 +97,33 @@ public class NodeInfoBean
       this.nodeService = nodeService;
    }
    
-   public void setContentService(ContentService contentService)
-   {
-      this.contentService = contentService;
-   }
    
    // ------------------------------------------------------------------------------
    // Helper methods
    
-   /**
+   private Map<String, Object> getModel(NodeRef nodeRef)
-    * Writes a table row with the given data
-    * 
-    * @param nameColumn The name of the data item
-    * @param dataColumn The data
-    */
-   protected void writeRow(ResponseWriter out, String nameColumn, String dataColumn)
-      throws IOException
    {
-      out.write("<tr><td>");
+      FacesContext context = FacesContext.getCurrentInstance();
-      out.write(nameColumn);
+      Map<String, Object> model = new HashMap<String, Object>(7, 1.0f);
-      out.write("</td><td>");
+      
-      if (dataColumn != null)
+      // create api methods
+      model.put("date", new Date());
+      model.put("cropContent", new CropContentMethod());
+      model.put("absurl", new AbsoluteUrlMethod(context.getExternalContext().getRequestContextPath()));
+      model.put("node", new TemplateNode(
+            nodeRef,
+            Repository.getServiceRegistry(context),
+            this.imageResolver));
+      
+      return model;
+   }
+   
+   /** Template Image resolver helper */
+   private TemplateImageResolver imageResolver = new TemplateImageResolver()
    {
-         out.write(dataColumn);
+      public String resolveImagePathForName(String filename, boolean small)
-      }
-      else
       {
-         out.write("&nbsp;");
+         return Utils.getFileTypeImage(FacesContext.getCurrentInstance(), filename, small);
-      }
-      out.write("</td></tr>");
       }
+   };
 }

source/java/org/alfresco/web/ui/common/Utils.java

@@ -96,9 +96,6 @@ public final class Utils
    private static final String DEFAULT_FILE_IMAGE16 = IMAGE_PREFIX16 + "_default" + IMAGE_POSTFIX;
    private static final String DEFAULT_FILE_IMAGE32 = IMAGE_PREFIX32 + "_default" + IMAGE_POSTFIX;
    
-   private static final String DOJO_SCRIPTS_WRITTEN = "_alfDojoScriptsWritten";
-   private static final String YAHOO_SCRIPTS_WRITTEN = "_alfYahooScriptsWritten";
-   
    private static final Map<String, String> s_fileExtensionMap = new HashMap<String, String>(89, 1.0f);
    
    private static Log logger = LogFactory.getLog(Utils.class);
@@ -1291,96 +1288,4 @@ public final class Utils
       
       return description;
    }
-   
-   /**
-    * Writes the script tags for including dojo support, ensuring they
-    * only get written once per page render.
-    *
-    * @param context Faces context
-    * @param out The response writer
-    */
-   @SuppressWarnings("unchecked")
-   public static void writeDojoScripts(FacesContext context, ResponseWriter out)
-      throws IOException
-   {
-      Object present = context.getExternalContext().getRequestMap().get(DOJO_SCRIPTS_WRITTEN);
-      
-      if (present == null)
-      {
-         // write out the scripts
-//         out.write("<script type=\"text/javascript\">");
-//         out.write("var djConfig = {isDebug: true, debugAtAllCosts: true };");
-//         out.write("</script>\n");
-         
-         out.write("\n<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/dojo/dojo.js\"> </script>\n");
-         out.write("<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/common.js\"> </script>\n");
-         
-         // set the context path
-         out.write("<script type=\"text/javascript\">\n");
-         out.write("setContextPath('");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("');\n</script>\n");
-         
-         // add marker to request
-         context.getExternalContext().getRequestMap().put(DOJO_SCRIPTS_WRITTEN, Boolean.TRUE);
-      }
-   }
-   
-   /**
-    * Writes the scripts tags for using the Yahoo UI toolkit, ensuring they
-    * only get written once per page render.
-    * <p>
-    * A comma separated list of scripts can also be passed to determine
-    * which components are to be used, again these are only written once per page.
-    * 
-    * @param context Faces context
-    * @param out The response writer
-    * @param scripts Comma separated list of scripts to include, if null the
-    *                base yahoo.js script only is included.
-    */
-   @SuppressWarnings("unchecked")
-   public static void writeYahooScripts(FacesContext context, ResponseWriter out, 
-         String scripts) throws IOException
-   {
-      Object present = context.getExternalContext().getRequestMap().get(YAHOO_SCRIPTS_WRITTEN);
-      
-      if (present == null)
-      {
-         // TODO: use the scripts parameter to determine which scripts to output
-         //       also add an ajax debug flag to the config and output relevant file
-         
-         // base yahoo file
-         out.write("\n<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/yahoo/yahoo/yahoo-min.js\"> </script>\n");
-         
-         // io handling (AJAX)
-         out.write("\n<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/yahoo/connection/connection-min.js\"> </script>\n");
-         
-         // event handling
-         out.write("\n<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/yahoo/event/event-min.js\"> </script>\n");
-         
-         // common alfresco util methods
-         out.write("<script type=\"text/javascript\" src=\"");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/common.js\"> </script>\n");
-         
-         // set the context path
-         out.write("<script type=\"text/javascript\">\n");
-         out.write("setContextPath('");
-         out.write(context.getExternalContext().getRequestContextPath());
-         out.write("');\n</script>\n");
-         
-         // add marker to request
-         context.getExternalContext().getRequestMap().put(YAHOO_SCRIPTS_WRITTEN, Boolean.TRUE);
-      }
-   }
 }

source/java/org/alfresco/web/ui/repo/component/UINodeInfo.java

@@ -69,10 +69,9 @@ public class UINodeInfo extends SelfRenderingComponent
    @Override
    public Object saveState(FacesContext context)
    {
-      Object values[] = new Object[8];
+      Object values[] = new Object[] {
-      // standard component attributes are saved by the super class
+         super.saveState(context),
-      values[0] = super.saveState(context);
+         this.value};
-      values[1] = this.value;
       return values;
    }
    
@@ -87,19 +86,15 @@ public class UINodeInfo extends SelfRenderingComponent
       {
          ResponseWriter out = context.getResponseWriter();
          
-         // output the scripts required by the component (checks are 
-         // made to make sure the scripts are only written once)
-         Utils.writeDojoScripts(context, out);
-         
          // write out the JavaScript specific to the NodeInfo component,
-         // again, make sure it's only done once
+         // make sure it's only done once
          Object present = context.getExternalContext().getRequestMap().
             get(NODE_INFO_SCRIPTS_WRITTEN);
          if (present == null)
          {
             out.write("<script type=\"text/javascript\" src=\"");
             out.write(context.getExternalContext().getRequestContextPath());
-            out.write("/scripts/ajax/node-info.js\"> </script>\n");
+            out.write("/scripts/ajax/node-info.js\"></script>");
             
             context.getExternalContext().getRequestMap().put(
                   NODE_INFO_SCRIPTS_WRITTEN, Boolean.TRUE);
@@ -107,12 +102,11 @@ public class UINodeInfo extends SelfRenderingComponent
          
          // wrap the child components in a <span> that has the onmouseover
          // event which kicks off the request for node information
-         String id = (String)this.getValue();
+         // we key the node info panel by the noderef string of the current node
-         out.write("<span onmouseover=\"showNodeInfo('");
+         String noderef = Repository.getStoreRef().toString() + '/' + (String)this.getValue();
-         out.write(Repository.getStoreRef().toString());
+         out.write("<span onclick=\"AlfNodeInfoMgr.toggle('");
-         out.write("/");
+         out.write(noderef);
-         out.write(id);
+         out.write("',this);\">");
-         out.write("', this)\" onmouseout=\"hideNodeInfo()\">");
       }
    }
 

source/java/org/alfresco/web/ui/repo/component/UIOpenSearch.java

@@ -81,21 +81,17 @@ public class UIOpenSearch extends SelfRenderingComponent
       
       String clientId = this.getId();
       
-      // output the scripts required by the component (checks are 
-      // made to make sure the scripts are only written once)
-      Utils.writeYahooScripts(context, out, null);
-      
       // write out the JavaScript specific to the OpenSearch component,
-      // again, make sure it's only done once
+      // make sure it's only done once
       Object present = context.getExternalContext().getRequestMap().get(SCRIPTS_WRITTEN);
       if (present == null)
       {
          out.write("<link rel=\"stylesheet\" href=\"");
          out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/css/opensearch.css\" type=\"text/css\">\n");         
+         out.write("/css/opensearch.css\" type=\"text/css\">");         
          out.write("<script type=\"text/javascript\" src=\"");
          out.write(context.getExternalContext().getRequestContextPath());
-         out.write("/scripts/ajax/opensearch.js\"> </script>\n");
+         out.write("/scripts/ajax/opensearch.js\"></script>");
          
          context.getExternalContext().getRequestMap().put(SCRIPTS_WRITTEN, Boolean.TRUE);
       }

source/java/org/alfresco/web/ui/repo/renderer/YahooTreeRenderer.java

@@ -67,27 +67,24 @@ public class YahooTreeRenderer extends BaseRenderer
          ResponseWriter out = context.getResponseWriter();
          String treeContainerId = component.getClientId(context) + "Container";
          
-         // output the scripts required by the component (checks are 
-         // made to make sure the scripts are only written once)
-         Utils.writeYahooScripts(context, out, null);
-         
          // write out the JavaScript specific to the Tree component,
-         // again, make sure it's only done once
+         // make sure it's only done once
          Object present = context.getExternalContext().getRequestMap().
             get(TREE_SCRIPTS_WRITTEN);
          if (present == null)
          {
+            String reqPath = context.getExternalContext().getRequestContextPath();
             out.write("<link rel=\"stylesheet\" href=\"");
-            out.write(context.getExternalContext().getRequestContextPath());
+            out.write(reqPath);
-            out.write("/css/yahoo-tree.css\" type=\"text/css\" />");
+            out.write("/css/yahoo-tree.css\" type=\"text/css\">");
             
             out.write("<script type=\"text/javascript\" src=\"");
-            out.write(context.getExternalContext().getRequestContextPath());
+            out.write(reqPath);
-            out.write("/scripts/ajax/yahoo/treeview/treeview-min.js\"> </script>\n");
+            out.write("/scripts/ajax/yahoo/treeview/treeview-min.js\"></script>");
             
             out.write("<script type=\"text/javascript\" src=\"");
-            out.write(context.getExternalContext().getRequestContextPath());
+            out.write(reqPath);
-            out.write("/scripts/ajax/yahoo-tree.js\"> </script>\n");
+            out.write("/scripts/ajax/yahoo-tree.js\"></script>");
             
             context.getExternalContext().getRequestMap().put(
                   TREE_SCRIPTS_WRITTEN, Boolean.TRUE);

source/java/org/alfresco/web/ui/repo/tag/PageTag.java

@@ -44,9 +44,9 @@ public class PageTag extends TagSupport
 {
    private static final long serialVersionUID = 8142765393181557228L;
    
-   private final static String SCRIPTS_START = "<script language=\"JavaScript1.2\" src=\"";
+   private final static String SCRIPTS_START = "<script type=\"text/javascript\" src=\"";
-   private final static String SCRIPTS_MENU = "/scripts/menu.js\"></script>\n";
+   private final static String SCRIPTS_MENU = "/scripts/menu.js\"></script>";
-   private final static String SCRIPTS_WEBDAV = "/scripts/webdav.js\"></script>\n";
+   private final static String SCRIPTS_WEBDAV = "/scripts/webdav.js\"></script>";
    private final static String STYLES_START  = "<link rel=\"stylesheet\" href=\"";
    private final static String STYLES_MAIN  = "/css/main.css\" TYPE=\"text/css\">\n";
 
@@ -148,15 +148,62 @@ public class PageTag extends TagSupport
          }
          
          String reqPath = ((HttpServletRequest)pageContext.getRequest()).getContextPath();
-         out.write(SCRIPTS_START);
+         
-         out.write(reqPath);
+         // CSS style includes
-         out.write(SCRIPTS_MENU);
-         out.write(SCRIPTS_START);
-         out.write(reqPath);
-         out.write(SCRIPTS_WEBDAV);
          out.write(STYLES_START);
          out.write(reqPath);
          out.write(STYLES_MAIN);
+         
+         // menu javascript
+         out.write(SCRIPTS_START);
+         out.write(reqPath);
+         out.write(SCRIPTS_MENU);
+         
+         // webdav javascript
+         out.write(SCRIPTS_START);
+         out.write(reqPath);
+         out.write(SCRIPTS_WEBDAV);
+         
+         // base yahoo file
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/yahoo/yahoo-min.js\"></script>");
+         
+         // io handling (AJAX)
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/connection/connection-min.js\"></script>");
+         
+         // DOM handling
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/dom/dom-min.js\"></script>");
+         
+         // event handling
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/event/event-min.js\"></script>");
+         
+         // animation
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/animation/animation-min.js\"></script>");
+         
+         // drag-drop
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/yahoo/dragdrop/dragdrop-min.js\"></script>");
+         
+         // common Alfresco util methods
+         out.write("<script type=\"text/javascript\" src=\"");
+         out.write(reqPath);
+         out.write("/scripts/ajax/common.js\"></script>");
+         
+         // set the context path used by some Alfresco script objects
+         out.write("<script type=\"text/javascript\">");
+         out.write("setContextPath('");
+         out.write(reqPath);
+         out.write("');</script>\n");
       }
       catch (IOException ioe)
       {

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

@@ -3120,10 +3120,6 @@
          <property-name>nodeService</property-name>
          <value>#{NodeService}</value>
       </managed-property>
-      <managed-property>
-         <property-name>contentService</property-name>
-         <value>#{ContentService}</value>
-      </managed-property>
    </managed-bean>
    
    <managed-bean>

source/web/css/main.css

@@ -475,10 +475,12 @@ a.topToolbarLinkHighlight, a.topToolbarLinkHighlight:link, a.topToolbarLinkHighl
 
 .summaryPopupPanel
 {
-   background-color: #e9f0f4;
+   background-image: url(../images/parts/popup_bg.gif);
-   border: 1px solid #999999;
+   background-repeat: repeat-x;
+   background-color: #ffffff;
+   border: 1px solid #cacfd3;
    padding: 4px;
-   -moz-border-radius: 4px;
+   max-width: 700px;
 }
 
 .userGroupPickerList

source/web/jsp/browse/browse.jsp

@@ -280,6 +280,9 @@
                            <a:actionLink id="col1-act2" value="#{r.name}" actionListener="#{BrowseBean.clickSpace}">
                               <f:param name="id" value="#{r.id}" />
                            </a:actionLink>
+                           <r:nodeInfo id="col1-info" value="#{r.id}">
+                              <h:graphicImage id="col1-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
+                           </r:nodeInfo>
                         </a:column>
                         
                         <%-- Primary column for icons view mode --%>
@@ -292,6 +295,9 @@
                            <a:actionLink id="col2-act2" value="#{r.name}" actionListener="#{BrowseBean.clickSpace}" styleClass="header">
                               <f:param name="id" value="#{r.id}" />
                            </a:actionLink>
+                           <r:nodeInfo id="col2-info" value="#{r.id}">
+                              <h:graphicImage id="col2-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
+                           </r:nodeInfo>
                         </a:column>
                         
                         <%-- Primary column for list view mode --%>
@@ -301,10 +307,11 @@
                                  <f:param name="id" value="#{r.id}" />
                               </a:actionLink>
                            </f:facet>
-                           <r:nodeInfo id="col3-act2-nodeinfo" value="#{r.id}">
                            <a:actionLink id="col3-act2" value="#{r.name}" actionListener="#{BrowseBean.clickSpace}" styleClass="title">
                               <f:param name="id" value="#{r.id}" />
                            </a:actionLink>
+                           <r:nodeInfo id="col3-info" value="#{r.id}">
+                              <h:graphicImage id="col3-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
                            </r:nodeInfo>
                         </a:column>
                         
@@ -415,6 +422,9 @@
                            </f:facet>
                            <a:actionLink id="col10-act2" value="#{r.name}" href="#{r.url}" target="new" />
                            <r:lockIcon id="col10-lock" value="#{r.nodeRef}" align="absmiddle" />
+                           <r:nodeInfo id="col10-info" value="#{r.id}">
+                              <h:graphicImage id="col10-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
+                           </r:nodeInfo>
                         </a:column>
                         
                         <%-- Primary column for icons view mode --%>
@@ -424,6 +434,9 @@
                            </f:facet>
                            <a:actionLink id="col11-act2" value="#{r.name}" href="#{r.url}" target="new" styleClass="header" />
                            <r:lockIcon id="col11-lock" value="#{r.nodeRef}" align="absmiddle" />
+                           <r:nodeInfo id="col11-info" value="#{r.id}">
+                              <h:graphicImage id="col11-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
+                           </r:nodeInfo>
                         </a:column>
                         
                         <%-- Primary column for list view mode --%>
@@ -433,6 +446,9 @@
                            </f:facet>
                            <a:actionLink id="col12-act2" value="#{r.name}" href="#{r.url}" target="new" styleClass="title" />
                            <r:lockIcon id="col12-lock" value="#{r.nodeRef}" align="absmiddle" />
+                           <r:nodeInfo id="col12-info" value="#{r.id}">
+                              <h:graphicImage id="col12-img" url="/images/icons/popup.gif" style='cursor:pointer' width="16" height="15" />
+                           </r:nodeInfo>
                         </a:column>
                         
                         <%-- Description column for all view modes --%>

source/web/scripts/ajax/common.js

@@ -51,10 +51,10 @@ function handleErrorDojo(type, errObj)
 /**
  * Default handler for errors when using the yahoo toolkit
  */
-function handleErrorYahoo(msg)
+function handleErrorYahoo(e)
 {
 	// TODO: Show a nicer error page, an alert will do for now!
-   alert(msg);
+   alert(e.status + " : " + e.statusText);
 }
 
 /**
@@ -88,13 +88,23 @@ function getContextPath()
    return _alfContextPath;
 }
 
+/**
+ * Alfresco Utility libraries
+ */
+(function()
+{
+   /**
+    * DOM library
+    */
+   Alfresco.Dom = {
+      
       /**
        * Returns a single child element with the given tag
        * name from the given parent. If more than one tag
        * exists the first one is returned, if none exist null
        * is returned.
        */
-function getElementByTagName(elParent, tagName)
+      getElementByTagName: function(elParent, tagName)
       {
          var el = null;
          
@@ -108,7 +118,7 @@ function getElementByTagName(elParent, tagName)
          }
          
          return el;
-}
+      },
       
       /**
        * Returns a single child element with the given tag
@@ -116,7 +126,7 @@ function getElementByTagName(elParent, tagName)
        * If more than one tag exists the first one is returned, 
        * if none exist null is returned.
        */
-function getElementByTagNameNS(elParent, nsUri, nsPrefix, tagName)
+      getElementByTagNameNS: function(elParent, nsUri, nsPrefix, tagName)
       {
          var el = null;
          
@@ -140,12 +150,12 @@ function getElementByTagNameNS(elParent, nsUri, nsPrefix, tagName)
          }
          
          return el;
-}
+      },
       
       /**
        * Returns the text of the given DOM element object
        */
-function getElementText(el)
+      getElementText: function(el)
       {
          var txt = null;
          
@@ -161,7 +171,7 @@ function getElementText(el)
          }
          
          return txt;
-}
+      },
       
       /**
        * Returns the text content of a single child element 
@@ -169,18 +179,18 @@ function getElementText(el)
        * If more than one tag exists the text of the first one 
        * is returned, if none exist null is returned.
        */
-function getElementTextByTagName(elParent, tagName)
+      getElementTextByTagName: function(elParent, tagName)
       {
          var txt = null;
          
-   var el = getElementByTagName(elParent, tagName);
+         var el = this.getElementByTagName(elParent, tagName);
          if (el != null)
          {
-      txt = getElementText(el);
+            txt = this.getElementText(el);
          }
       
          return txt;   
-}
+      },
       
       /**
        * Returns the text a single child element with the given tag
@@ -188,18 +198,64 @@ function getElementTextByTagName(elParent, tagName)
        * If more than one tag exists the text of the first one is returned, 
        * if none exist null is returned.
        */
-function getElementTextByTagNameNS(elParent, nsUri, nsPrefix, tagName)
+      getElementTextByTagNameNS: function(elParent, nsUri, nsPrefix, tagName)
       {
          var txt = null;
          
-   var el = getElementByTagNameNS(elParent, nsUri, nsPrefix, tagName);
+         var el = this.getElementByTagNameNS(elParent, nsUri, nsPrefix, tagName);
          if (el != null)
          {
-      txt = getElementText(el);
+            txt = this.getElementText(el);
          }
       
          return txt;
+      },
+   
+      /**
+       * Aligns an element against the specified element. Automatically adjusts the element above or to
+       * the left of the destination if the element would cause a scrollbar to appear.
+       * 
+       * @param el         Element to align
+       * @param destEl     Destination element to align against
+       * @param maxwidth   Maximum width of the element (assumed max-width CSS applied)
+       */
+      smartAlignElement: function (el, destEl, maxwidth)
+      {
+         // get the position of the element we are aligning against
+         var pos = YAHOO.util.Dom.getXY(destEl);
+         
+         // calculate display position for the element
+         var region = YAHOO.util.Dom.getRegion(el);
+         //log("DIV popup size: Width:" + (region.right-region.left) + ", Height:" + (region.bottom-region.top));
+         var elHeight = region.bottom - region.top;
+         var elWidth = region.right - region.left;
+         //log("elWidth:" + elWidth + " maxwidth:" + maxwidth);
+         if (maxwidth != undefined && maxwidth != null)
+         {
+            if (elWidth > maxwidth) elWidth = maxwidth;
          }
+         var docWidth = YAHOO.util.Dom.getDocumentWidth();
+         if (pos[0] + elWidth < docWidth)
+         {
+            el.style.left = pos[0];
+         }
+         else
+         {
+            el.style.left = pos[0] - ((pos[0] + elWidth) - docWidth);
+         }
+         //log(" Element Y:" + pos[1] + " doc height:" + YAHOO.util.Dom.getDocumentHeight());
+         if (pos[1] + 16 + elHeight < YAHOO.util.Dom.getDocumentHeight())
+         {
+            el.style.top = pos[1] + 12;
+         }
+         else
+         {
+            //log(" ***Changing position - will overflow");
+            el.style.top = pos[1] - elHeight - 4;
+         }
+      }
+   };
+})();
 
 /**
  * Logs a message to a debug log window.
@@ -210,7 +266,7 @@ function log(message)
 {
    if (!log.window_ || log.window_.closed) 
    {
-      var win = window.open("", null, "width=400,height=200," +
+      var win = window.open("", null, "width=600,height=400," +
                               "scrollbars=yes,resizable=yes,status=no," +
                               "location=no,menubar=no,toolbar=no");
       if (!win) return;
@@ -225,8 +281,3 @@ function log(message)
    logLine.appendChild(log.window_.document.createTextNode(message));
    log.window_.document.body.appendChild(logLine);
 }
-
-
-
-
-

source/web/scripts/ajax/node-info.js

@@ -1,75 +1,189 @@
 //
 // Supporting JavaScript for the NodeInfo component
 // Gavin Cornwell 17-07-2006
+// Kevin Roast 21-02-2007 (rewrite to use individual panel objects and convert to YUI)
 //
-// NOTE: This script relies on common.js so therefore needs to be loaded
+// NOTE: This script requires common.js - which needs to be loaded
 //       prior to this one on the containing HTML page.
 
-var _launchElement = null;
-var _popupElement = null;
-
 /**
- * Makes the AJAX request back to the server to get the node info.
+ * Node Info Manager constructor
- *
- * @param nodeRef The node reference to get information for
- * @param launchElement The element that requested the summary panel
  */
-function showNodeInfo(nodeRef, launchElement)
+Alfresco.NodeInfoManager = function()
 {
-   _launchElement = launchElement;
+   //YAHOO.util.Event.addListener(window, "resize", this.resize);
-   
-   dojo.io.bind({
-      method: 'post',
-      url: getContextPath() + '/ajax/invoke/NodeInfoBean.sendNodeInfo',
-      content: { noderef: nodeRef },
-      load: showNodeInfoHandler,
-      error: handleErrorDojo,
-      mimetype: 'text/html'
-   });
 }
 
 /**
- * Fades in the summary panel containing the node information.
+ * Definition of the Node Info Manager class.
- * This function is called back via the dojo bind call above.
+ * Responsible for open/closing NodeInfoPanel dynamic summary panel objects.
  */
-function showNodeInfoHandler(type, data, evt)
+Alfresco.NodeInfoManager.prototype =
 {
+   panels: [],
+   displayed: [],
+   
+   /**
+    * Request toggle of the open/close state of a node info panel
+    */
+   toggle: function(nodeRef, launchElement)
+   {
+      if (this.displayed[nodeRef] == undefined || this.displayed[nodeRef] == null)
+      {
+         var panel = this.panels[nodeRef];
+         if (panel == undefined || panel == null)
+         {
+            panel = new Alfresco.NodeInfoPanel(nodeRef, launchElement);
+            this.panels[nodeRef] = panel;
+         }
+         this.displayed[nodeRef] = true;
+         panel.showNodeInfo();
+      }
+      else
+      {
+         this.close(nodeRef);
+      }
+   },
+   
+   /**
+    * Request a Close of the node info panel
+    */
+   close: function(nodeRef)
+   {
+      var panel = this.panels[nodeRef];
+      if (panel != undefined && panel != null)
+      {
+         this.displayed[nodeRef] = null;
+         panel.hideNodeInfo();
+      }
+   },
+   
+   /**
+    * Return if a given node info panel is currently displayable
+    */
+   displayable: function(nodeRef)
+   {
+      return (this.displayed[nodeRef] != undefined && this.displayed[nodeRef] != null);
+   }
+}
+
+/**
+ * Construct the single Node Info Manager instance
+ */
+var AlfNodeInfoMgr = new Alfresco.NodeInfoManager();
+
+
+/**
+ * Constructor for the Node Info Panel object
+ */
+Alfresco.NodeInfoPanel = function(nodeRef, launchElement)
+{
+   this.nodeRef = nodeRef;
+   this.launchElement = launchElement;
+}
+
+/**
+ * Definition of the Node Info Panel object
+ */
+Alfresco.NodeInfoPanel.prototype = 
+{
+   nodeRef: null,
+   launchElement: null,
+   popupElement: null,
+   visible: false,
+   
+   /**
+    * Makes the AJAX request back to the server to get the node info.
+    */
+   showNodeInfo: function()
+   {
+      if (this.popupElement == null)
+      {
+         YAHOO.util.Connect.asyncRequest(
+            "POST",
+            getContextPath() + '/ajax/invoke/NodeInfoBean.sendNodeInfo',
+            { 
+               success: this.loadNodeInfoHandler,
+               failure: handleErrorYahoo,    // global error handler
+               argument: [this.nodeRef, this]
+            }, 
+            "noderef=" + this.nodeRef);
+      }
+      else
+      {
+         this.displayNodeInfo();
+      }
+   },
+   
+   /**
+    * Callback function for showNodeInfo() above
+    */
+   loadNodeInfoHandler: function(response)
+   {
+      var panel = response.argument[1];
+      
       // create a 'div' to hold the summary table
       var div = document.createElement("div");
       
-   // get the position of the element we are showing info for
-   var pos = dojo.html.getAbsolutePosition(_launchElement, false);
-   
       // setup the div with the correct appearance
-   div.innerHTML = data;
+      div.innerHTML = response.responseText;
       div.setAttribute("class", "summaryPopupPanel");
       // NOTE: use className for IE
       div.setAttribute("className", "summaryPopupPanel");
       div.style.position = "absolute";
-   div.style.left = pos[0];
-   div.style.top = pos[1] + 16;
       div.style.zIndex = 99;
+      div.style.display = "none";
+      div.style.left = 0;
+      div.style.top = 0;
       
-   // is there a better way of doing this, dojo.dom.insertBefore??
       var body = document.getElementsByTagName("body")[0];
-   dojo.html.setOpacity(div, 0);
-   _popupElement = div;
       body.appendChild(div);
       
-   dojo.lfx.html.fadeIn(div, 300).play();
+      // keep track of the div element we created
-}
+      panel.popupElement = div;
+      
+      // display the div for the first time
+      panel.displayNodeInfo();
+   },
    
    /**
- * Fades out the summary panel with the node info
+    * Display the summary info panel for the node
- * and then removes it from the DOM
     */
-function hideNodeInfo()
+   displayNodeInfo: function()
    {
-   // remove the node from the DOM and reset variables
+      if (AlfNodeInfoMgr.displayable(this.nodeRef) == true)
-   dojo.lfx.html.fadeOut(_popupElement, 300, dojo.lfx.easeOut, function(nodes)
       {
-      dojo.lang.forEach(nodes, dojo.dom.removeNode);
+         if (this.popupElement != null && this.visible == false)
-      _popupElement = null;
+         {
-      _launchElement = null;
+            // set opacity in browser independant way
-   }).play();
+            YAHOO.util.Dom.setStyle(this.popupElement, "opacity", 0.0);
+            this.popupElement.style.display = "block";
+            
+            Alfresco.Dom.smartAlignElement(this.popupElement, this.launchElement, 700);
+            
+            var anim = new YAHOO.util.Anim(
+               this.popupElement, { opacity: { to: 1.0 } }, 0.333, YAHOO.util.Easing.easeOut);
+            anim.animate();
+            
+            // drag-drop object
+            new YAHOO.util.DD(this.popupElement);
+            
+            this.visible = true;
+         }
+      }
+   },
+   
+   /**
+    * Hide the summary info panel for the node
+    */
+   hideNodeInfo: function()
+   {
+      if (this.popupElement != null && this.visible == true)
+      {
+         this.visible = false;
+         
+         YAHOO.util.Dom.setStyle(this.popupElement, "opacity", 0.0);
+         this.popupElement.style.display = "none";
+      }
+   }
 }

source/web/scripts/ajax/opensearch.js

@@ -169,8 +169,8 @@ Alfresco.OpenSearchClient.prototype =
       {
          YAHOO.util.Connect.asyncRequest("GET", searchUrl, 
             { 
-               success: Alfresco.processSearchResults,
+               success: Alfresco.OpenSearchEngine.processSearchResults,
-               failure: Alfresco.handleSearchError,
+               failure: Alfresco.OpenSearchEngine.handleSearchError,
                argument: [ose.id, this]
             }, 
             null);
@@ -191,8 +191,8 @@ Alfresco.OpenSearchClient.prototype =
       // execute the query and process the results
       YAHOO.util.Connect.asyncRequest("GET", url, 
          { 
-            success: Alfresco.processShowPageResults,
+            success: Alfresco.OpenSearchEngine.processShowPageResults,
-            failure: Alfresco.handleSearchError,
+            failure: Alfresco.OpenSearchEngine.handleSearchError,
             argument: [engineId, this]
          }, 
          null);
@@ -340,21 +340,21 @@ Alfresco.OpenSearchClient.prototype =
             var elResult = results[x];
             
             // get the title, icon and summary
-            var title = getElementTextByTagName(elResult, "title");
+            var title = Alfresco.Dom.getElementTextByTagName(elResult, "title");
-            var icon = getElementTextByTagName(elResult, "icon");
+            var icon = Alfresco.Dom.getElementTextByTagName(elResult, "icon");
             var summary = null;
             if (isAtom)
             {
-               summary = getElementTextByTagName(elResult, "summary");
+               summary = Alfresco.Dom.getElementTextByTagName(elResult, "summary");
             }
             else
             {
-               summary = getElementTextByTagName(elResult, "description");
+               summary = Alfresco.Dom.getElementTextByTagName(elResult, "description");
             }
             
             // get the link href
             var link = null;
-            var elLink = getElementByTagName(elResult, "link");
+            var elLink = Alfresco.Dom.getElementByTagName(elResult, "link");
             if (elLink != null)
             {
                if (isAtom)
@@ -363,7 +363,7 @@ Alfresco.OpenSearchClient.prototype =
                }
                else
                {
-                  link = getElementText(elLink);
+                  link = Alfresco.Dom.getElementText(elLink);
                }
             }
             
@@ -416,10 +416,10 @@ Alfresco.OpenSearchClient.prototype =
       var startIndex = 0;
       
       // check there are results
-      var elTotalResults = getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "totalResults");
+      var elTotalResults = Alfresco.Dom.getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "totalResults");
       if (elTotalResults != null)
       {
-         totalResults = getElementText(elTotalResults);
+         totalResults = Alfresco.Dom.getElementText(elTotalResults);
       }
       
       // if there are no results return an empty string
@@ -428,16 +428,16 @@ Alfresco.OpenSearchClient.prototype =
          return "";
       }
       
-      var elStartIndex = getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "startIndex");
+      var elStartIndex = Alfresco.Dom.getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "startIndex");
       if (elStartIndex != null)
       {
-         startIndex = getElementText(elStartIndex);
+         startIndex = Alfresco.Dom.getElementText(elStartIndex);
       }
       
-      var elItemsPerPage = getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "itemsPerPage");
+      var elItemsPerPage = Alfresco.Dom.getElementByTagNameNS(feed, _OS_NS_URI, _OS_NS_PREFIX, "itemsPerPage");
       if (elItemsPerPage != null)
       {
-         pageSize = getElementText(elItemsPerPage);
+         pageSize = Alfresco.Dom.getElementText(elItemsPerPage);
       }
       
       // calculate the number of pages the results span
@@ -587,7 +587,7 @@ Alfresco.OpenSearchClient.prototype =
 /**
  * Processes the XML search results
  */
-Alfresco.processSearchResults = function(ajaxResponse)
+Alfresco.OpenSearchEngine.processSearchResults = function(ajaxResponse)
 {
    try
    {
@@ -599,7 +599,7 @@ Alfresco.processSearchResults = function(ajaxResponse)
       // if the name of the feed element is "rss", get the channel child element
       if (feed.tagName == "rss")
       {
-         feed = getElementByTagName(feed, "channel");
+         feed = Alfresco.Dom.getElementByTagName(feed, "channel");
       }
       
       var resultsDiv = clientInstance.renderSearchResults(engineId, feed);
@@ -628,7 +628,7 @@ Alfresco.processSearchResults = function(ajaxResponse)
  * Processes the search results and updates the postion, result list
  * and paging controls.
  */
-Alfresco.processShowPageResults = function(ajaxResponse)
+Alfresco.OpenSearchEngine.processShowPageResults = function(ajaxResponse)
 {
    try
    {
@@ -640,7 +640,7 @@ Alfresco.processShowPageResults = function(ajaxResponse)
       // if the name of the feed element is "rss", get the channel child element
       if (feed.tagName == "rss")
       {
-         feed = getElementByTagName(feed, "channel");
+         feed = Alfresco.Dom.getElementByTagName(feed, "channel");
       }
    
       // append the results list to the results list div
@@ -668,7 +668,7 @@ Alfresco.processShowPageResults = function(ajaxResponse)
 /**
  * Error handler for Ajax call to search engine
  */
-Alfresco.handleSearchError = function(ajaxResponse)
+Alfresco.OpenSearchEngine.handleSearchError = function(ajaxResponse)
 {
    var engineId = ajaxResponse.argument[0];
    var clientInstance = ajaxResponse.argument[1];