Improvements to Ajax pickers - better default height and overridable height property on associated JSF components

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

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

@@ -66,6 +66,9 @@ public abstract class BaseAjaxItemPicker extends UIInput
    /** True for single select mode, false for multi-select mode */
    protected Boolean singleSelect;
    
+   /** Height style override for picker selector area */
+   protected String height = null;
+   
    protected static int ACTION_DONE = 0;
    protected static int ACTION_CANCEL = 1;
    
@@ -93,6 +96,7 @@ public abstract class BaseAjaxItemPicker extends UIInput
       this.singleSelect = (Boolean)values[2];
       this.initialSelectionId = (String)values[3];
       this.disabled = (Boolean)values[4];
+      this.height = (String)values[5];
    }
    
    /**
@@ -106,7 +110,8 @@ public abstract class BaseAjaxItemPicker extends UIInput
          this.label,
          this.singleSelect,
          this.initialSelectionId,
-         this.disabled};
+         this.disabled,
+         this.height};
       return (values);
    }
    
@@ -301,8 +306,19 @@ public abstract class BaseAjaxItemPicker extends UIInput
       out.write("   </div>");
       // container for item selection
       out.write("   <div>");
-      out.write("    <div id='" + divId + "-ajax-wait' class='pickerAjaxWait'></div>");
+      out.write("    <div id='" + divId + "-ajax-wait' class='pickerAjaxWait'");
-      out.write("    <div id='" + divId + "-results-list' class='pickerResultsList'></div>");
+      String height = getHeight();
+      if (height != null)
+      {
+         out.write(" style='height:" + height + "'");
+      }
+      out.write("></div>");
+      out.write("    <div id='" + divId + "-results-list' class='pickerResultsList'");
+      if (height != null)
+      {
+         out.write(" style='height:" + height + "'");
+      }
+      out.write("></div>");
       out.write("   </div>");
       out.write("  </div>");
       // controls (OK & Cancel buttons etc.)
@@ -441,6 +457,28 @@ public abstract class BaseAjaxItemPicker extends UIInput
       this.singleSelect = singleSelect;
    }
       
+   /**
+    * @return Returns the height.
+    */
+   public String getHeight()
+   {
+      ValueBinding vb = getValueBinding("height");
+      if (vb != null)
+      {
+         this.height = (String)vb.getValue(getFacesContext());
+      }
+      
+      return this.height;
+   }
+   
+   /**
+    * @param height The height to set.
+    */
+   public void setHeight(String height)
+   {
+      this.height = height;
+   }
+   
    
    // ------------------------------------------------------------------------------
    // Protected helpers

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

@@ -53,6 +53,9 @@ public abstract class AjaxItemSelectorTag extends HtmlComponentTag
    /** Whether the component is disabled */
    private String disabled;
    
+   /** the height */
+   private String height;
+   
    /**
     * @see javax.faces.webapp.UIComponentTag#getComponentType()
     */
@@ -78,6 +81,7 @@ public abstract class AjaxItemSelectorTag extends HtmlComponentTag
       setStringProperty(component, "label", this.label);
       setBooleanProperty(component, "singleSelect", this.singleSelect);
       setBooleanProperty(component, "disabled", this.disabled);
+      setStringProperty(component, "height", this.height);
    }
    
    /**
@@ -92,6 +96,7 @@ public abstract class AjaxItemSelectorTag extends HtmlComponentTag
       this.singleSelect = null;
       this.initialSelection = null;
       this.disabled = null;
+      this.height = null;
    }
    
    /**
@@ -144,4 +149,14 @@ public abstract class AjaxItemSelectorTag extends HtmlComponentTag
    {
       this.disabled = disabled;
    }
+   
+   /**
+    * Set the height
+    *
+    * @param height     the height
+    */
+   public void setHeight(String height)
+   {
+      this.height = height;
+   }
 }

source/web/WEB-INF/repo.tld

@@ -2268,6 +2268,12 @@
          <required>false</required>
          <rtexprvalue>true</rtexprvalue>
       </attribute>
+      
+      <attribute>
+         <name>height</name>
+         <required>false</required>
+         <rtexprvalue>true</rtexprvalue>
+      </attribute>
    </tag>
    
    <tag>
@@ -2334,6 +2340,12 @@
          <required>false</required>
          <rtexprvalue>true</rtexprvalue>
       </attribute>
+      
+      <attribute>
+         <name>height</name>
+         <required>false</required>
+         <rtexprvalue>true</rtexprvalue>
+      </attribute>
    </tag>
    
    <tag>
@@ -2400,6 +2412,12 @@
          <required>false</required>
          <rtexprvalue>true</rtexprvalue>
       </attribute>
+      
+      <attribute>
+         <name>height</name>
+         <required>false</required>
+         <rtexprvalue>true</rtexprvalue>
+      </attribute>
    </tag>
    
 </taglib>

source/web/css/main.css

@@ -416,6 +416,7 @@ a.topToolbarLinkHighlight, a.topToolbarLinkHighlight:link, a.topToolbarLinkHighl
 {
    padding-right: 20px;
    color: #93a8b2;
+   white-space: nowrap;
 }
 
 .multiValueSelector

source/web/css/picker.css

@@ -60,7 +60,7 @@ div.pickerSelector
 div.pickerResultsList
 {
    *width: 300px;
-   height: 120px;
+   height: 168px;
    overflow: auto;
    clear: both;
 }
@@ -87,7 +87,7 @@ div.pickerAjaxWait
    background-repeat: no-repeat;
    background-position: 50% 65%;
    width: 292px;
-   height: 120px;
+   height: 168px;
    overflow: hidden;
    display: none;
    position: absolute;

source/web/jsp/dialog/advanced-search.jsp

@@ -184,7 +184,7 @@
                                              </tr>
                                              <tr>
                                                 <td style="padding-left:26px">
-                                                   <r:ajaxFolderSelector id="spaceSelector" styleClass="selector" label="#{msg.select_space_prompt}" value="#{SearchProperties.location}" singleSelect="true" initialSelection="#{NavigationBean.currentNode.nodeRefAsString}" />
+                                                   <r:ajaxFolderSelector id="spaceSelector" styleClass="selector" label="#{msg.select_space_prompt}" value="#{SearchProperties.location}" singleSelect="true" initialSelection="#{NavigationBean.currentNode.nodeRefAsString}" height="105px" />
                                                 </td>
                                              </tr>
                                              <tr>
@@ -203,7 +203,7 @@
                                           <table cellpadding="2" cellspacing="2" border="0">
                                              <tr>
                                                 <td style="padding-left:8px;padding-top:8px">
-                                                   <r:ajaxCategorySelector id="catSelector" styleClass="selector" label="#{msg.select_category_prompt}" singleSelect="false" />
+                                                   <r:ajaxCategorySelector id="catSelector" styleClass="selector" label="#{msg.select_category_prompt}" singleSelect="false" height="105px" />
                                                 </td>
                                              </tr>
                                              <tr>