Refactoring of Mobile Showcase

qooxdoo · Dec 17, 2013 · 2c20a4b · 2c20a4b
1 parent e478fd8
commit 2c20a4b
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 42 deletions.
diff --git a/application/mobileshowcase/source/class/mobileshowcase/page/Basic.js b/application/mobileshowcase/source/class/mobileshowcase/page/Basic.js
@@ -36,11 +36,15 @@ qx.Class.define("mobileshowcase.page.Basic",
     this.setTitle("Basic Widgets");
     this.setShowBackButton(true);
     this.setBackButtonText("Back");
+    this._widgets = [];
   },
 
 
   members :
   {
+
+    _widgets : null,
+
     // overridden
     _initialize : function()
     {
@@ -53,15 +57,9 @@ qx.Class.define("mobileshowcase.page.Basic",
       var toggleEnableButton = new qx.ui.mobile.form.ToggleButton(true,"Enable","Disable");
 
       toggleEnableButton.addListener("changeValue", function(e) {
-        exImage.toggleEnabled();
-        exToggleButton.toggleEnabled();
-        exLabel.toggleEnabled();
-        exButton.toggleEnabled();
-        exAtomLeft.toggleEnabled();
-        exAtomRight.toggleEnabled();
-        exAtomTop.toggleEnabled();
-        exAtomBottom.toggleEnabled();
-        collapsible.toggleEnabled();
+        for (var i = 0; i < this._widgets.length; i++) {
+          this._widgets[i].toggleEnabled();
+        }
       }, this);
 
 
@@ -71,7 +69,7 @@ qx.Class.define("mobileshowcase.page.Basic",
         exLabel.toggleWrap();
       }, this);
 
-      // WIDGETS 4 EXAMPLE
+      // EXAMPLE WIDGETS
       var exButton = new qx.ui.mobile.form.Button("Button");
 
       var exToggleButton = new qx.ui.mobile.form.ToggleButton(false);
@@ -91,9 +89,16 @@ qx.Class.define("mobileshowcase.page.Basic",
         var atomExample = new qx.ui.mobile.basic.Atom("Icon Position: "+positions[i], iconSrc);
         atomExample.setIconPosition(positions[i]);
         atomGroup.add(atomExample);
+        this._widgets.push(atomExample);
       }
 
-      var collapsible = this._createCollapsible();
+      var exCollapsible = this._createCollapsible();
+
+      this._widgets.push(exButton);
+      this._widgets.push(exToggleButton);
+      this._widgets.push(exLabel);
+      this._widgets.push(exImage);
+      this._widgets.push(exCollapsible);
 
       // BUILD VIEW
 
@@ -111,21 +116,12 @@ qx.Class.define("mobileshowcase.page.Basic",
       this.getContent().add(toggleButtonGroup);
 
       this.getContent().add(new qx.ui.mobile.form.Title("Label"));
-
-      var labelGroup = new qx.ui.mobile.form.Group();
-      labelGroup.add(exLabel);
-      this.getContent().add(labelGroup);
-
+      this.getContent().add(new qx.ui.mobile.form.Group([exLabel]));
       this.getContent().add(new qx.ui.mobile.form.Title("Image"));
-
-      var imageGroup = new qx.ui.mobile.form.Group([exImage],false);
-      this.getContent().add(imageGroup);
-
+      this.getContent().add(new qx.ui.mobile.form.Group([exImage],false));
       this.getContent().add(new qx.ui.mobile.form.Title("Collapsible"));
-      this.getContent().add(new qx.ui.mobile.form.Group([collapsible],false));
-
+      this.getContent().add(new qx.ui.mobile.form.Group([exCollapsible],false));
       this.getContent().add(new qx.ui.mobile.form.Title("Atoms"));
-
       this.getContent().add(atomGroup);
     },
 

diff --git a/application/mobileshowcase/source/class/mobileshowcase/page/Dialog.js b/application/mobileshowcase/source/class/mobileshowcase/page/Dialog.js
@@ -244,9 +244,6 @@ qx.Class.define("mobileshowcase.page.Dialog",
         return this.__anchorPopup;
       }
 
-      var popupWidget = new qx.ui.mobile.container.Composite(new qx.ui.mobile.layout.VBox());
-      popupWidget.add(new qx.ui.mobile.basic.Label("Are you sure?"));
-
       var buttonsWidget = new qx.ui.mobile.container.Composite(new qx.ui.mobile.layout.HBox());
       var okButton = new qx.ui.mobile.form.Button("Yes");
       var cancelButton = new qx.ui.mobile.form.Button("No");
@@ -257,7 +254,6 @@ qx.Class.define("mobileshowcase.page.Dialog",
       buttonsWidget.add(cancelButton, {
         flex: 1
       });
-      popupWidget.add(buttonsWidget);
 
       okButton.addListener("tap", function() {
         this.__anchorPopup.hide();
@@ -266,7 +262,9 @@ qx.Class.define("mobileshowcase.page.Dialog",
         this.__anchorPopup.hide();
       }, this);
 
-      return new qx.ui.mobile.dialog.Popup(popupWidget, anchor);
+      var popup = new qx.ui.mobile.dialog.Popup(buttonsWidget, anchor);
+      popup.setTitle("Are you sure?");
+      return popup;
     },
 
 

diff --git a/application/mobileshowcase/source/class/mobileshowcase/page/Toolbar.js b/application/mobileshowcase/source/class/mobileshowcase/page/Toolbar.js
@@ -112,11 +112,8 @@ qx.Class.define("mobileshowcase.page.Toolbar",
       }, this);
 
       toolbar.add(searchBtn);
-      toolbar.add(new qx.ui.mobile.toolbar.Separator());
       toolbar.add(this.__goBackBtn);
-      toolbar.add(new qx.ui.mobile.toolbar.Separator());
       toolbar.add(this.__loadButton);
-      toolbar.add(new qx.ui.mobile.toolbar.Separator());
       toolbar.add(deleteButton);
     },
 

diff --git a/application/mobileshowcase/source/resource/mobileshowcase/css/styles.css b/application/mobileshowcase/source/resource/mobileshowcase/css/styles.css
@@ -1,10 +1,3 @@
-
-/* BASIC */
-
-.atom + .atom {
-  margin-top: 0.5rem;
-}
-
 /* EVENT */
 
 .eventcontainer {
@@ -70,10 +63,6 @@
   margin-right: 5px;
 }
 
-.toggleButton {
-  margin-top:2px;
-}
-
 /* CAROUSEL */
 
 .carousel-page > .label {