Handle "toggle" command, clean modal layout, handle separators in submenus.

git-svn-id: https://svn.argeo.org/slc/trunk@1977 4cfe0d0a-d680-48aa-b62c-e0a02a3f76cc

diff --git a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/Application.js b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/Application.js
index 5544aa9aea6646608d46475fff6669f7e6d7a6a7..ce299c444ea7ef0404c887f17a99aface1e9eb8b 100644 (file)
--- a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/Application.js
+++ b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/Application.js
@@ -93,13 +93,7 @@ qx.Class.define("org.argeo.ria.Application",
       }\r
       var perspective = new perspectiveClass;\r
       perspective.initViewPanes(viewsManager);\r
-      perspective.initViews(viewsManager);\r
-\r
-         // Test\r
-         org.argeo.ria.remote.RequestManager.getInstance().addListener("reload", function(e){\r
-               qx.log.Logger.info("Received reload event for data type : "+ e.getDataType());\r
-         });      \r
-      \r
+      perspective.initViews(viewsManager);      \r
     }\r
                \r
   }\r

diff --git a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/components/Modal.js b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/components/Modal.js
index 810431d044b44b1745ce2cd2bc28214868f31cb7..b69c1580f36b749be49051da2d3defbf32d3ee0a 100644 (file)
--- a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/components/Modal.js
+++ b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/components/Modal.js
@@ -23,7 +23,6 @@ qx.Class.define("org.argeo.ria.components.Modal",
                });\r
                this.setLayout(new qx.ui.layout.Dock());\r
                this.setModal(true);\r
-               this.addCloseButton();\r
                this.center();\r
                if(text){\r
                        this.addLabel(text);\r
@@ -37,6 +36,7 @@ qx.Class.define("org.argeo.ria.components.Modal",
                 */\r
                addLabel:function(text){\r
                        this.add(new qx.ui.basic.Label(text), {edge:'center', width:'100%'});           \r
+                       this.addCloseButton();\r
                },\r
                /**\r
                 * Display a component (panel) in the center of the popup\r
@@ -44,6 +44,7 @@ qx.Class.define("org.argeo.ria.components.Modal",
                 */\r
                addContent: function(panel){\r
                        this.add(panel, {edge:'center', width:'100%'});\r
+                       this.addCloseButton();\r
                },\r
                /**\r
                 * Automatically attach to the application root, then show.\r
@@ -57,15 +58,26 @@ qx.Class.define("org.argeo.ria.components.Modal",
                        this.closeButton.addListener("execute", this._closeAndDestroy, this);\r
                        this.add(this.closeButton, {edge:'south'});                     \r
                },\r
+               addOkCancel : function(){\r
+                       var buttonPane = new qx.ui.container.Composite(new qx.ui.layout.HBox(5, 'right'));\r
+                       buttonPane.setAlignX("center");\r
+                       this.add(buttonPane, {edge:"south"});\r
+                       this.okButton = new qx.ui.form.Button("Ok");\r
+                       this.cancelButton = new qx.ui.form.Button("Cancel");\r
+                       this.cancelButton.addListener("execute", this._closeAndDestroy, this);\r
+                       buttonPane.add(this.cancelButton);\r
+                       buttonPane.add(this.okButton);\r
+               },\r
                makePromptForm:function(questionString, validationCallback, callbackContext){\r
                        this.add(new qx.ui.basic.Label(questionString), {edge:'north'});\r
                        var textField = new qx.ui.form.TextField();\r
+                       textField.setMarginTop(20);\r
                        this.add(textField, {edge:'center'});\r
-                       this.closeButton.removeListener("execute", this._closeAndDestroy, this);\r
+                       this.addOkCancel();\r
                        if(callbackContext){\r
                                validationCallback = qx.lang.Function.bind(validationCallback, callbackContext);\r
                        }\r
-                       this.closeButton.addListener("execute", function(e){\r
+                       this.okButton.addListener("execute", function(e){\r
                                var valid = validationCallback(textField.getValue());\r
                                if(valid) this._closeAndDestroy();\r
                        }, this);\r

diff --git a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/Command.js b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/Command.js
index 83641c416a987c123263a93a791a464bd8a82669..2579d2c4d8ae83d3e31321a1cfa94c248696ff16 100644 (file)
--- a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/Command.js
+++ b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/Command.js
@@ -21,6 +21,10 @@
         * Icon of the command \r
         */\r
        icon : {init:""},\r
+       /**\r
+        * Weather this command is a true/false state \r
+        */\r
+       toggle : {init:false},\r
        /**\r
         * Sub menu if needed \r
         */\r
@@ -59,18 +63,23 @@
         * @return {qx.ui.menu.Button}\r
         */\r
        getMenuButton : function(){\r
-               var button = new qx.ui.menu.Button(\r
-                       this.getLabel(), \r
-                       this.getIcon(), \r
-                       this, \r
-                       this.getMenuClone()\r
-               );\r
-               this.addTooltip(button);\r
-               if(this.getMenu()){\r
-                       this.addListener("changeMenu", function(event){\r
-                               button.setMenu(this.getMenuClone());\r
-                       }, this);                       \r
+               if(this.getToggle()){\r
+                       button = new qx.ui.menu.CheckBox(this.getLabel());\r
+                       this._registerToggleButtonListeners(button);\r
+               }else{\r
+                       var button = new qx.ui.menu.Button(\r
+                               this.getLabel(), \r
+                               this.getIcon(), \r
+                               this, \r
+                               this.getMenuClone()\r
+                       );\r
+                       if(this.getMenu()){\r
+                               this.addListener("changeMenu", function(event){\r
+                                       button.setMenu(this.getMenuClone());\r
+                               }, this);                       \r
+                       }\r
                }\r
+               this.addTooltip(button);\r
                return button;\r
        },\r
        \r
@@ -93,6 +102,9 @@
                                this.setEnabled(e.getData());\r
                        }, button);\r
                        button.setEnabled(this.getEnabled());\r
+               }else if(this.getToggle()){\r
+                       button = new qx.ui.toolbar.CheckBox(this.getLabel(), this.getIcon());\r
+                       this._registerToggleButtonListeners(button);\r
                }else{\r
                        button = new qx.ui.toolbar.Button(\r
                                this.getLabel(),\r
@@ -104,19 +116,43 @@
                return button;\r
        },\r
                \r
+       /**\r
+        * Special tricks using UserData to enable/disable listeners to avoid loops...\r
+        * @param button {qx.ui.core.Widget} toolbar Checkbox or menu Checkbox button.\r
+        */\r
+       _registerToggleButtonListeners : function(button){\r
+               button.addListener("changeChecked", function(event){\r
+                       if(button.getUserData("disableListener")) return;\r
+                       this.setUserData("slc.command.toggleState", event.getData());\r
+                       this.setUserData("slc.command.toggleStateSource", button);\r
+                       this.fireEvent("execute");\r
+               }, this);\r
+               this.addListener("execute", function(event){\r
+                       if(this.getUserData("slc;command.toggleStateSource") == button) return;\r
+                       button.setUserData("disableListener", true);\r
+                       button.setChecked(this.getUserData("slc.command.toggleState"));\r
+                       button.setUserData("disableListener", false);\r
+               }, this);               \r
+       },\r
+       \r
        /**\r
         * Clones the command menu\r
         * @return {qx.ui.menu.Menu}\r
         */\r
        getMenuClone : function(){\r
                var menuClone = new qx.ui.menu.Menu();\r
+               menuClone.setMinWidth(100);\r
                var submenus = this.getMenu();\r
                if(!submenus) return;\r
                for(var i=0;i<submenus.length;i++){\r
-                       var button = new qx.ui.menu.Button(submenus[i].label, submenus[i].icon);\r
-                       button.setUserData("commandId", submenus[i].commandId);\r
-                       button.addListener("execute", this.executeSubMenuCallback, this);\r
-                       menuClone.add(button);\r
+                       if(submenus[i].separator){\r
+                               menuClone.add(new qx.ui.menu.Separator());\r
+                       }else{\r
+                               var button = new qx.ui.menu.Button(submenus[i].label, submenus[i].icon);\r
+                               button.setUserData("commandId", submenus[i].commandId);\r
+                               button.addListener("execute", this.executeSubMenuCallback, this);\r
+                               menuClone.add(button);\r
+                       }\r
                }\r
                this.menuClones.push(menuClone);\r
                return menuClone;\r

diff --git a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/CommandsManager.js b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/CommandsManager.js
index bf6f6a3f713d25572dd1868e16ba66f89c0aaeb7..0f6f1182a9817b3df28e04edc9b632222be533f6 100644 (file)
--- a/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/CommandsManager.js
+++ b/org.argeo.slc.webapp/src/main/webapp/source/class/org/argeo/ria/event/CommandsManager.js
@@ -35,6 +35,7 @@ qx.Class.define("org.argeo.ria.event.CommandsManager",
                                callback        : function(e){},\r
                                command         : null\r
                        },\r
+                       /*\r
                        "quit" : {\r
                                label           : "Quit", \r
                                icon            : "resource/slc/system-shutdown.png",\r
@@ -45,6 +46,7 @@ qx.Class.define("org.argeo.ria.event.CommandsManager",
                                callback        : function(e){}, \r
                                command         : null\r
                        },\r
+                       */\r
                        "log" : {\r
                                label           : "Show Console", \r
                                icon            : "resource/slc/help-contents.png",\r
@@ -116,6 +118,9 @@ qx.Class.define("org.argeo.ria.event.CommandsManager",
                                        }\r
                                }\r
                                command.setEnabled(definition.enabled);\r
+                               if(definition.toggle){\r
+                                       command.setToggle(true);\r
+                               }\r
                                command.addListener("execute", definition.callback, (definition.callbackContext?definition.callbackContext:this));\r
                                if(definition.init){\r
                                        var binded = qx.lang.Function.bind(definition.init, command);\r
@@ -306,6 +311,7 @@ qx.Class.define("org.argeo.ria.event.CommandsManager",
                menu.add(icon);\r
                menu.add(text);\r
                menu.add(both);\r
+               mgr.setSelected(both);\r
                toolbar.setContextMenu(menu);           \r
                mgr.addListener("changeValue", function(e){\r
                        this.setShow(e.getData());\r