Changeset 5109

Timestamp:

07/22/08 05:42:33 (7 weeks ago)

Author:

risto.yrjana@…

Message:

Adds #1946 collapsing + submenu icons.

Location:

trunk/src/com/itmill/toolkit

Files:

• terminal/gwt/client/ui/IMenuBar.java (modified) (11 diffs)
• ui/MenuBar.java (modified) (19 diffs)

trunk/src/com/itmill/toolkit/terminal/gwt/client/ui/IMenuBar.java

@@ -1 +1 @@
 package com.itmill.toolkit.terminal.gwt.client.ui;
 
+import java.util.ArrayList;
 import java.util.Iterator;
 import java.util.Stack;
 
 import com.google.gwt.user.client.Command;
+import com.google.gwt.user.client.DOM;
 import com.google.gwt.user.client.ui.MenuBar;
 import com.google.gwt.user.client.ui.MenuItem;
@@ -16 +18 @@
     public static final String CLASSNAME = "i-menubar";
 
-    /** Component identifier in UIDL communications. */
+    /** For server connections **/
     protected String uidlId;
-
-    /** Reference to the server connection object. */
     protected ApplicationConnection client;
 
-    /** A host reference for the Command objects */
     protected final IMenuBar hostReference = this;
+    protected static final boolean vertical = true;
+    protected String submenuIcon = null;
+    protected boolean collapseItems = true;
+
+    protected MenuItem moreItem = null;
+
+    // Construct an empty command to be used when the item has no command
+    // associated
+    protected static final Command emptyCommand = null;
 
     /**
@@ -30 +38 @@
      */
     public IMenuBar() {
-        // The superclass has a lot of relevant initialization
+        // Create an empty horizontal menubar
         super();
+        DOM.setStyleAttribute(this.getElement(), "white-space", "nowrap");
 
         // This method call of the Paintable interface sets the component
         // style name in DOM tree
         setStyleName(CLASSNAME);
+    }
+
+    public IMenuBar(boolean vertical) {
+        super(vertical);
+        DOM.setStyleAttribute(this.getElement(), "white-space", "nowrap");
+
+        // This method call of the Paintable interface sets the component
+        // style name in DOM tree
+        setStyleName(CLASSNAME + "_submenu");
     }
 
@@ -52 +70 @@
         }
 
-        // Save reference to server connection object to be able to send
-        // user interaction later
+        // For future connections
         this.client = client;
-
-        // Save the UIDL identifier for the component
         uidlId = uidl.getId();
 
@@ -64 +79 @@
         }
 
-        /* Get tree received from server and actualize it in the GWT-MenuBar */
-
+        UIDL options = uidl.getChildUIDL(0);
         // For GWT 1.5
-        // this.setAnimationEnabled(uidl.getBooleanAttribute("animationEnabled"));
+        //this.setAnimationEnabled(options.getBooleanAttribute("animationEnabled"
+        // ))
+        // ;
+
+        if (options.hasAttribute("submenuIcon")) {
+            submenuIcon = client.translateToolkitUri(uidl.getChildUIDL(0)
+                    .getStringAttribute("submenuIcon"));
+        } else {
+            submenuIcon = null;
+        }
+
+        collapseItems = options.getBooleanAttribute("collapseItems");
+
+        if (collapseItems) {
+            UIDL moreItemUIDL = options.getChildUIDL(0);
+            StringBuffer itemHTML = new StringBuffer();
+            itemHTML.append("<p>");
+            if (moreItemUIDL.hasAttribute("icon")) {
+                itemHTML.append("<img src=\""
+                        + client.translateToolkitUri(moreItemUIDL
+                                .getStringAttribute("icon"))
+                        + "\" align=\"left\" />");
+            }
+            itemHTML.append(moreItemUIDL.getStringAttribute("text"));
+            itemHTML.append("</p>");
+            moreItem = new MenuItem(itemHTML.toString(), true, emptyCommand);
+        }
+
         UIDL items = uidl.getChildUIDL(1);
         Iterator itr = items.getChildIterator();
@@ -74 +115 @@
         MenuBar currentMenu = this;
 
-        // Construct an empty command to be used when the item has no command
-        // associated
-        Command emptyCommand = new Command() {
-            public void execute() {
-            }
-        };
+        // int topLevelWidth = 0;
 
         while (itr.hasNext()) {
             UIDL item = (UIDL) itr.next();
-            MenuItem menuItem = null; // For receiving the item
+            MenuItem currentItem = null; // For receiving the item
 
             String itemText = item.getStringAttribute("text");
@@ -91 +127 @@
 
             // Construct html from the text and the optional icon
-            if (!item.hasAttribute("icon")) {
-                itemText = "<p>" + itemText + "</p>";
-            } else {
-                itemText = "<p>"
-                        + "<img src=\""
+            StringBuffer itemHTML = new StringBuffer();
+
+            itemHTML.append("<p>");
+
+            if (item.hasAttribute("icon")) {
+                itemHTML.append("<img src=\""
                         + client.translateToolkitUri(item
-                                .getStringAttribute("icon")) + "\"</img>"
-                        + itemText + "</p>";
-            }
-
-            // Check if we need to attach a command to this item
+                                .getStringAttribute("icon"))
+                        + "\" align=\"left\" />");
+            }
+
+            itemHTML.append(itemText);
+
+            if (currentMenu != this && item.getChildCount() > 0
+                    && submenuIcon != null) {
+                itemHTML.append("<img src=\"" + submenuIcon
+                        + "\" align=\"right\" />");
+            }
+
+            itemHTML.append("</p>");
+
+            Command cmd = null;
+
+            // Check if we need to create a command to this item
             if (itemHasCommand) {
                 // Construct a command that fires onMenuClick(int) with the
                 // item's id-number
-                Command normalCommand = new Command() {
+                cmd = new Command() {
                     public void execute() {
                         hostReference.onMenuClick(itemId);
                     }
                 };
-
-                menuItem = currentMenu.addItem(itemText, true, normalCommand);
-
-            } else {
-                menuItem = currentMenu.addItem(itemText, true, emptyCommand);
-            }
+            }
+
+            currentItem = currentMenu.addItem(itemHTML.toString(), true, cmd);
 
             if (item.getChildCount() > 0) {
@@ -121 +167 @@
                 iteratorStack.push(itr);
                 itr = item.getChildIterator();
-                currentMenu = new MenuBar(true);
-                menuItem.setSubMenu(currentMenu);
-            }
-
-            if (!itr.hasNext() && !iteratorStack.empty()) {
+                currentMenu = new IMenuBar(vertical);
+                currentItem.setSubMenu(currentMenu);
+            }
+
+            while (!itr.hasNext() && !iteratorStack.empty()) {
                 itr = (Iterator) iteratorStack.pop();
                 currentMenu = (MenuBar) menuStack.pop();
@@ -131 +177 @@
         }// while
 
+        // we might need to collapse the top-level menu
+        if (collapseItems) {
+            int topLevelWidth = 0;
+
+            int ourWidth = this.getOffsetWidth();
+
+            int i = 0;
+            for (; i < getItems().size() && topLevelWidth < ourWidth; i++) {
+                MenuItem item = (MenuItem) getItems().get(i);
+                topLevelWidth += item.getOffsetWidth();
+            }
+
+            if (topLevelWidth > this.getOffsetWidth()) {
+                ArrayList toBeCollapsed = new ArrayList();
+                MenuBar collapsed = new IMenuBar(vertical);
+                for (int j = i - 2; j < getItems().size(); j++) {
+                    toBeCollapsed.add(getItems().get(j));
+                }
+
+                for (int j = 0; j < toBeCollapsed.size(); j++) {
+                    MenuItem item = (MenuItem) toBeCollapsed.get(j);
+                    removeItem(item);
+
+                    // it's ugly, but we have to insert the submenu icon
+                    if (item.getSubMenu() != null && submenuIcon != null) {
+                        String itemHTML = item.getHTML();
+                        StringBuffer itemText = new StringBuffer(itemHTML
+                                .substring(0, itemHTML.length() - 4));
+                        itemText.append("<img src=\"" + submenuIcon
+                                + "\" align=\"right\" /></p>");
+                        item.setHTML(itemText.toString());
+                    }
+
+                    collapsed.addItem(item);
+                }
+
+                moreItem.setSubMenu(collapsed);
+                addItem(moreItem);
+            }
+        }
     }// updateFromUIDL
 
@@ -138 +224 @@
      * 
      * @param clickedItemId
-     *                id of the item that was clicked
+     *            id of the item that was clicked
      */
     public void onMenuClick(int clickedItemId) {
@@ -150 +236 @@
         }
     }
+
 }// class IMenuBar

trunk/src/com/itmill/toolkit/ui/MenuBar.java

@@ -25 +25 @@
 
     private boolean animationEnabled;
+    private boolean collapseItems;
+    private Resource submenuIcon;
+    private MenuItem moreItem;
 
     /** Tag is the UIDL element name for client-server communications. */
@@ -42 +45 @@
         target.startTag("options");
         target.addAttribute("animationEnabled", animationEnabled);
+
+        if (submenuIcon != null) {
+            target.addAttribute("submenuIcon", submenuIcon);
+        }
+
+        target.addAttribute("collapseItems", collapseItems);
+
+        if (collapseItems) {
+            target.startTag("moreItem");
+            target.addAttribute("text", moreItem.getText());
+            if (moreItem.getIcon() != null) {
+                target.addAttribute("icon", moreItem.getIcon());
+            }
+            target.endTag("moreItem");
+        }
+
         target.endTag("options");
         target.startTag("items");
@@ -78 +97 @@
             }
 
-            if (!itr.hasNext() && !iteratorStack.empty()) { // The end submenu
+            // The end submenu. More than one submenu may end at once.
+            while (!itr.hasNext() && !iteratorStack.empty()) {
                 itr = (Iterator) iteratorStack.pop();
                 target.endTag("item");
@@ -115 +135 @@
                 }
 
-            }
+            }// while
+
             // If we got the clicked item, launch the command.
             if (found) {
                 tmpItem.getCommand().menuSelected(tmpItem);
-            }// while
+            }
         }// if
     }// changeVariables
@@ -128 +149 @@
     public MenuBar() {
         menuItems = new ArrayList();
-        animationEnabled = false;
+        setAnimation(false);
+        setCollapse(true);
+        setMoreMenuItem(null);
     }
 
@@ -136 +159 @@
      * 
      * @param caption
-     *                the text for the menu item
+     *            the text for the menu item
      * @param icon
-     *                the icon for the menu item
+     *            the icon for the menu item
      * @param command
-     *                the command for the menu item
+     *            the command for the menu item
      * @throws IllegalArgumentException
      */
@@ -162 +185 @@
      * 
      * @param caption
-     *                the text for the menu item
+     *            the text for the menu item
      * @param icon
-     *                the icon for the menu item
+     *            the icon for the menu item
      * @param command
-     *                the command for the menu item
+     *            the command for the menu item
      * @param itemToAddBefore
-     *                the item that will be after the new item
+     *            the item that will be after the new item
      * @throws IllegalArgumentException
      */
@@ -204 +227 @@
      * 
      * @param item
-     *                The item to be removed
+     *            The item to be removed
      */
     public void removeItem(MenuBar.MenuItem item) {
@@ -232 +255 @@
     /**
      * Enable or disable animated menubar appearance. Animation is disabled by
-     * default.
+     * default. Currently does nothing.
      * 
      * @param hasAnimation
@@ -238 +261 @@
     public void setAnimation(boolean animation) {
         animationEnabled = animation;
+        requestRepaint();
     }
 
@@ -252 +276 @@
 
     /**
-     * This interface contains the layer for menu commands of the MenuBar class .
-     * It's method will fire when the user clicks on the containing MenuItem.
+     * Set the icon to be used if a sub-menu has children. Defaults to null;
+     * 
+     * @param icon
+     */
+    public void setSubmenuIcon(Resource icon) {
+        submenuIcon = icon;
+        requestRepaint();
+    }
+
+    /**
+     * Get the icon used for sub-menus. Returns null if no icon is set.
+     * 
+     * @return
+     */
+    public Resource getSubmenuIcon() {
+        return submenuIcon;
+    }
+
+    /**
+     * Enable or disable collapsing top-level items. Top-level items will
+     * collapse to if there is not enough room for them. Items that don't fit
+     * will be placed under the "More" menu item.
+     * 
+     * Collapsing is enabled by default.
+     * 
+     * @param collapse
+     */
+    public void setCollapse(boolean collapse) {
+        collapseItems = collapse;
+        requestRepaint();
+    }
+
+    /**
+     * Collapsing is enabled by default.
+     * 
+     * @return true if the top-level items will be collapsed
+     */
+    public boolean getCollapse() {
+        return collapseItems;
+    }
+
+    /**
+     * Set the item that is used when collapsing the top level menu. The item
+     * command will be ignored. If set to null, the default item with the "More"
+     * text will be used.
+     * 
+     * @param item
+     */
+    public void setMoreMenuItem(MenuItem item) {
+        if (item != null) {
+            moreItem = item;
+        } else {
+            moreItem = new MenuItem("More", null, null);
+        }
+        requestRepaint();
+    }
+
+    /**
+     * Get the MenuItem used as the collapse menu item.
+     * 
+     * @return
+     */
+    public MenuItem getMoreMenuItem() {
+        return moreItem;
+    }
+
+    /**
+     * This interface contains the layer for menu commands of the MenuBar class
+     * . It's method will fire when the user clicks on the containing MenuItem.
      * The selected item is given as an argument.
      */
@@ -281 +372 @@
          * 
          * @param text
-         *                The text associated with the command
+         *            The text associated with the command
          * @param command
-         *                The command to be fired
+         *            The command to be fired
          * @throws IllegalArgumentException
          */
@@ -310 +401 @@
          * 
          * @param caption
-         *                the text for the menu item
+         *            the text for the menu item
          * @param icon
-         *                the icon for the menu item
+         *            the icon for the menu item
          * @param command
-         *                the command for the menu item
+         *            the command for the menu item
          */
         public MenuBar.MenuItem addItem(String caption, Resource icon,
@@ -343 +434 @@
          * 
          * @param caption
-         *                the text for the menu item
+         *            the text for the menu item
          * @param icon
-         *                the icon for the menu item
+         *            the icon for the menu item
          * @param command
-         *                the command for the menu item
+         *            the command for the menu item
          * @param itemToAddBefore
-         *                the item that will be after the new item
+         *            the item that will be after the new item
          * 
          */
@@ -440 +531 @@
          * 
          * @param command
-         *                The MenuCommand of this item
+         *            The MenuCommand of this item
          */
         public void setCommand(MenuBar.Command command) {
@@ -450 +541 @@
          * 
          * @param icon
-         *                The icon for this item
+         *            The icon for this item
          */
         public void setIcon(Resource icon) {
@@ -461 +552 @@
          * 
          * @param text
-         *                Text for this object
+         *            Text for this object
          */
         public void setText(java.lang.String text) {
@@ -474 +565 @@
          * 
          * @param item
-         *                The item to be removed
+         *            The item to be removed
          */
         public void removeChild(MenuBar.MenuItem item) {
@@ -501 +592 @@
          * 
          * @param parent
-         *                The parent item
+         *            The parent item
          */
         protected void setParent(MenuBar.MenuItem parent) {