Sampler: changed mode-switch position to top bar, removed unnecessary layout.

svn changeset:6724/svn branch:trunk

diff --git a/WebContent/ITMILL/themes/sampler/sampler/flow.gif b/WebContent/ITMILL/themes/sampler/sampler/flow.gif
index f6dcc1ed0522902508c6f0a42ab65ef3dc51fc26..d6a90f70872519a2bd7ec40347c52460a028a8b0 100644 (file)
Binary files a/WebContent/ITMILL/themes/sampler/sampler/flow.gif and b/WebContent/ITMILL/themes/sampler/sampler/flow.gif differ

diff --git a/WebContent/ITMILL/themes/sampler/sampler/grid.gif b/WebContent/ITMILL/themes/sampler/sampler/grid.gif
index 2500d8d15be20a3825451fbdabb6c1b5a228420c..bbc0565fce8be58c5b7a38c3f47eb9e2f4a63fe1 100644 (file)
Binary files a/WebContent/ITMILL/themes/sampler/sampler/grid.gif and b/WebContent/ITMILL/themes/sampler/sampler/grid.gif differ

diff --git a/WebContent/ITMILL/themes/sampler/sampler/info-bubble-bottom.png b/WebContent/ITMILL/themes/sampler/sampler/info-bubble-bottom.png
index e168b8be238fbbafd58ed8eadcf643b0172ad4af..f15888ec0e3024b00ee4f6c8d6b323094d6c4fb2 100644 (file)
Binary files a/WebContent/ITMILL/themes/sampler/sampler/info-bubble-bottom.png and b/WebContent/ITMILL/themes/sampler/sampler/info-bubble-bottom.png differ

diff --git a/WebContent/ITMILL/themes/sampler/sampler/list.gif b/WebContent/ITMILL/themes/sampler/sampler/list.gif
index 9f4641bc9a4b29d4c9af36527aae932cedf6de3a..f0b610f70091c2176a9588f9a1503dfd11fdfb04 100644 (file)
Binary files a/WebContent/ITMILL/themes/sampler/sampler/list.gif and b/WebContent/ITMILL/themes/sampler/sampler/list.gif differ

diff --git a/WebContent/ITMILL/themes/sampler/sampler/styles.css b/WebContent/ITMILL/themes/sampler/sampler/styles.css
index e97058fb496eb2d49bc4146b6bf7e32a098b8a18..9dbfc7691797302fb2b7efa17fbc2c4e93120542 100644 (file)
--- a/WebContent/ITMILL/themes/sampler/sampler/styles.css
+++ b/WebContent/ITMILL/themes/sampler/sampler/styles.css
@@ -221,7 +221,7 @@
 }
 .i-app-SamplerApplication .feature-info {
        background: #1e2123 url(info-bubble-bg.png) repeat-y;
-       color: #9d9ea0;
+       color: #b8bbbe;
        font-family: helvetica, arial, verdana, sans-serif;
        font-size: 12px;
        line-height: 19px;
@@ -233,8 +233,15 @@
        background: transparent url(bullet.png) no-repeat 2px 60%;
        padding-left: 8px;
 }
+.i-app-SamplerApplication .feature-info div.i-link a:hover {
+       color: #dcebf6;
+}
 .i-app-SamplerApplication .feature-info div.i-link a span {
        text-decoration: none;
+       border-bottom: 1px dotted #495964;
+}
+.i-app-SamplerApplication .feature-info div.i-link a:hover span {
+       border-bottom: 1px solid #dcebf6;
 }
 .i-app-SamplerApplication .feature-info .i-panel-caption {
        color: #fff;
@@ -298,27 +305,31 @@
 }
 
 .i-customcomponent-ModeSwitch .i-button {
-       height: 28px;
+       height: 24px;
+       width: 30px;
        border: none;
-       font-size: 6px;
+       background: transparent url(segment.png) no-repeat;
+       cursor: default;
+       padding: 0;
 }
-.i-customcomponent-ModeSwitch .i-button-first-on {
-       background: transparent url(left-on.gif) no-repeat;
+.i-customcomponent-ModeSwitch .i-button-first-on,
+.i-customcomponent-ModeSwitch .i-button-first:active {
+       background-position: left bottom;
 }
 .i-customcomponent-ModeSwitch .i-button-first {
-       background: transparent url(left.gif) no-repeat;
+       background-position: left top;
 }
+/*
 .i-customcomponent-ModeSwitch .i-button-mid-on {
        background: transparent url(mid-on.gif) no-repeat;
 }
 .i-customcomponent-ModeSwitch .i-button-mid {
        background: transparent url(mid.gif) no-repeat;
-}
-.i-customcomponent-ModeSwitch .i-button-last-on {
-       border: none;
-       background: transparent url(right-on.gif) no-repeat right top;
+}*/
+.i-customcomponent-ModeSwitch .i-button-last-on,
+.i-customcomponent-ModeSwitch .i-button-last:active {
+       background-position: right bottom;
 }
 .i-customcomponent-ModeSwitch .i-button-last {
-       border: none;
-       background: transparent url(right.gif) no-repeat right top;
+       background-position: right top;
 }

diff --git a/src/com/itmill/toolkit/demo/sampler/FeatureView.java b/src/com/itmill/toolkit/demo/sampler/FeatureView.java
index 2c37b398945bc03957a77197f3a316a5dae10408..caae305e86c7f1cc5f8d85e97fa1032744a25e60 100644 (file)
--- a/src/com/itmill/toolkit/demo/sampler/FeatureView.java
+++ b/src/com/itmill/toolkit/demo/sampler/FeatureView.java
@@ -43,7 +43,7 @@ public class FeatureView extends HorizontalLayout {
         left = new Panel();
         left.setStyleName(Panel.STYLE_LIGHT);
         left.addStyleName("feature-main");
-        left.setSizeFull();
+
         ((VerticalLayout) left.getLayout()).setSpacing(true);
         ((VerticalLayout) left.getLayout()).setMargin(false);
         addComponent(left);

diff --git a/src/com/itmill/toolkit/demo/sampler/SamplerApplication.java b/src/com/itmill/toolkit/demo/sampler/SamplerApplication.java
index 0bd2e372e90fbb0785e49f6d5bf8eb6f0b58c0dc..7bc9ff3d53adbbb4bb41ee19ddc230bfa5f0a8a4 100644 (file)
--- a/src/com/itmill/toolkit/demo/sampler/SamplerApplication.java
+++ b/src/com/itmill/toolkit/demo/sampler/SamplerApplication.java
@@ -136,10 +136,10 @@ public class SamplerApplication extends Application {
         private ObjectProperty currentFeature = new ObjectProperty(null,
                 Feature.class);
 
-        private HorizontalLayout toggleBar = new HorizontalLayout();
-
         private MainArea mainArea = new MainArea();
 
+        private ModeSwitch mode;
+
         private SplitPanel mainSplit;
         private Tree navigationTree;
         // itmill: UA-658457-6
@@ -192,15 +192,21 @@ public class SamplerApplication extends Application {
                 }
             });
 
+            // List/grid/coverflow
+            mode = createModeSwitch();
+            mode.setMode(currentList);
+            nav.addComponent(mode);
+            nav.setComponentAlignment(mode, Alignment.MIDDLE_LEFT);
+
             // Layouts for top area buttons
             HorizontalLayout quicknav = new HorizontalLayout();
             HorizontalLayout arrows = new HorizontalLayout();
             nav.addComponent(quicknav);
             nav.addComponent(arrows);
+            nav.setComponentAlignment(quicknav, Alignment.MIDDLE_LEFT);
+            nav.setComponentAlignment(arrows, Alignment.MIDDLE_LEFT);
             quicknav.setStyleName("segment");
             arrows.setStyleName("segment");
-            nav.setComponentAlignment(quicknav, "middle");
-            nav.setComponentAlignment(arrows, "middle");
 
             // Previous sample
             previousSample = createPrevButton();
@@ -213,14 +219,6 @@ public class SamplerApplication extends Application {
             Component search = createSearch();
             quicknav.addComponent(search);
 
-            // togglebar
-            // mainExpand.addComponent(toggleBar);
-            toggleBar.setHeight("40px");
-            toggleBar.setWidth("100%");
-            toggleBar.setStyleName("togglebar");
-            toggleBar.setSpacing(true);
-            toggleBar.setMargin(false, true, false, true);
-
             // Main left/right split; hidden menu tree
             mainSplit = new SplitPanel(SplitPanel.ORIENTATION_HORIZONTAL);
             mainSplit.setSizeFull();
@@ -228,24 +226,12 @@ public class SamplerApplication extends Application {
             mainExpand.addComponent(mainSplit);
             mainExpand.setExpandRatio(mainSplit, 1);
 
-            VerticalLayout rightLayout = new VerticalLayout();
-            rightLayout.setSizeFull();
-            rightLayout.addComponent(toggleBar);
-
             // Menu tree, initially hidden
             navigationTree = createMenuTree();
-            mainSplit.addComponent(navigationTree);
+            mainSplit.setFirstComponent(navigationTree);
 
             // Main Area
-            mainSplit.addComponent(rightLayout);
-
-            rightLayout.addComponent(mainArea);
-            rightLayout.setExpandRatio(mainArea, 1);
-
-            // List/grid/coverflow
-            Component mode = createModeSwitch();
-            toggleBar.addComponent(mode);
-            toggleBar.setComponentAlignment(mode, Alignment.MIDDLE_RIGHT);
+            mainSplit.setSecondComponent(mainArea);
 
             // Show / hide tree
             Component treeSwitch = createTreeSwitch();
@@ -397,6 +383,7 @@ public class SamplerApplication extends Application {
         private Component createTreeSwitch() {
             final Button b = new Button();
             b.setStyleName("tree-switch");
+            b.setDescription("Toggle sample tree visibility");
             b.addListener(new Button.ClickListener() {
                 public void buttonClick(ClickEvent event) {
                     if (b.getStyleName().contains("down")) {
@@ -418,7 +405,7 @@ public class SamplerApplication extends Application {
             return b;
         }
 
-        private Component createModeSwitch() {
+        private ModeSwitch createModeSwitch() {
             ModeSwitch m = new ModeSwitch();
             m.addMode(currentList, "", "View as Icons", new ThemeResource(
                     "sampler/grid.gif"));
@@ -436,7 +423,6 @@ public class SamplerApplication extends Application {
                     }
                 }
             });
-            m.setMode(currentList);
             return m;
         }
 
@@ -475,16 +461,16 @@ public class SamplerApplication extends Application {
             if (val == null) {
                 currentList.setFeatureContainer(allFeatures);
                 mainArea.show(currentList);
-                toggleBar.setVisible(true);
+                mode.setVisible(true);
             } else if (val instanceof FeatureSet) {
                 currentList.setFeatureContainer(((FeatureSet) val)
                         .getContainer(true));
                 mainArea.show(currentList);
-                toggleBar.setVisible(true);
+                mode.setVisible(true);
             } else {
                 mainArea.show(featureView);
                 featureView.setFeature(val);
-                toggleBar.setVisible(false);
+                mode.setVisible(false);
             }
 
         }