From: Jouni Koivuviita Date: Sun, 17 Jun 2007 09:40:49 +0000 (+0000) Subject: New IPanel implementation with 3 different styles (default, light, strong). New compo... X-Git-Tag: 6.7.0.beta1~6232 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=d91dcd614c506c29c249a7cf2bc8da2a5f8c642f;p=vaadin-framework.git New IPanel implementation with 3 different styles (default, light, strong). New component IComponent for default component implementation. Implemented ITree without a caption (container now takes care of it) and fixed a bug in ITree. svn changeset:1756/svn branch:trunk --- diff --git a/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java b/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java index 6a3043c2cc..8c7d224be0 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java @@ -4,6 +4,7 @@ import com.google.gwt.core.client.GWT; import com.google.gwt.user.client.ui.Widget; import com.itmill.toolkit.terminal.gwt.client.ui.IButton; import com.itmill.toolkit.terminal.gwt.client.ui.ICheckBox; +import com.itmill.toolkit.terminal.gwt.client.ui.IComponent; import com.itmill.toolkit.terminal.gwt.client.ui.ICustomLayout; import com.itmill.toolkit.terminal.gwt.client.ui.IEmbedded; import com.itmill.toolkit.terminal.gwt.client.ui.IGridLayout; @@ -55,8 +56,10 @@ public class DefaultWidgetFactory implements WidgetFactory { return new ITwinColSelect(); return new ISelect(); } - if ("panel".equals(tag) || "component".equals(tag)) + if ("panel".equals(tag)) return new IPanel(); + if ("component".equals(tag)) + return new IComponent(); if ("tabsheet".equals(tag)) return new ITabsheet(); if ("embedded".equals(tag)) diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IComponent.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IComponent.java new file mode 100644 index 0000000000..17a94f91c0 --- /dev/null +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IComponent.java @@ -0,0 +1,18 @@ +package com.itmill.toolkit.terminal.gwt.client.ui; + +import com.itmill.toolkit.terminal.gwt.client.Client; +import com.itmill.toolkit.terminal.gwt.client.UIDL; + +public class IComponent extends IPanel { + + public IComponent() { + super(); + setStyleName("i-component"); + } + + public void updateFromUIDL(UIDL uidl, Client client) { + super.updateFromUIDL(uidl, client); + setStyleName("i-component"); + } + +} diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java index 082ac3c738..4f323efcc2 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java @@ -1,13 +1,55 @@ package com.itmill.toolkit.terminal.gwt.client.ui; +import com.google.gwt.user.client.ui.FlowPanel; +import com.google.gwt.user.client.ui.Label; +import com.google.gwt.user.client.ui.Widget; import com.itmill.toolkit.terminal.gwt.client.Client; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; -public class IPanel extends IVerticalLayout implements Paintable { +public class IPanel extends FlowPanel implements Paintable { + + private static final String CLASSNAME = "i-panel"; + + Client client; + + String id; + + private Label caption; + + public IPanel() { + super(); + setStyleName(CLASSNAME); + caption = new Label(); + caption.setStyleName(CLASSNAME+"-caption"); + } public void updateFromUIDL(UIDL uidl, Client client) { - super.updateFromUIDL(uidl, client); + // Ensure correct implementation + if (client.updateComponent(this, uidl, false)) + return; + + this.client = client; + this.id = uidl.getId(); + + if(uidl.hasAttribute("caption")) + caption.setText(uidl.getStringAttribute("caption")); + else + caption.setText(""); + + if(uidl.hasAttribute("style")) + setStyleName(CLASSNAME + " " + CLASSNAME+"-"+uidl.getStringAttribute("style")); + else + setStyleName(CLASSNAME); + + clear(); + add(caption); + + UIDL layoutUidl = uidl.getChildUIDL(0); + Widget layout = client.getWidget(layoutUidl); + ((Paintable)layout).updateFromUIDL(layoutUidl, client); + add(layout); + } } diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITree.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITree.java index 67582bd287..36878d9525 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITree.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITree.java @@ -4,53 +4,48 @@ import java.util.HashSet; import java.util.Iterator; import java.util.Set; -import com.google.gwt.user.client.ui.Composite; -import com.google.gwt.user.client.ui.Label; import com.google.gwt.user.client.ui.Tree; import com.google.gwt.user.client.ui.TreeItem; import com.google.gwt.user.client.ui.TreeListener; -import com.google.gwt.user.client.ui.VerticalPanel; import com.itmill.toolkit.terminal.gwt.client.Client; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; -public class ITree extends Composite implements Paintable { +public class ITree extends Tree implements Paintable { - Label caption = new Label(); - Tree tree = new Tree(); + private static final String CLASSNAME = "i-tree"; + Set selectedIds = new HashSet(); Client client; String id; - boolean selectable; - boolean multiselect; + private boolean selectable; + private boolean multiselect; public ITree() { - VerticalPanel panel = new VerticalPanel(); - panel.add(caption); - panel.add(tree); - initWidget(panel); + super(); + setStyleName(CLASSNAME); } public void updateFromUIDL(UIDL uidl, Client client) { + // Ensure correct implementation and let container manage caption + if (client.updateComponent(this, uidl, true)) + return; + this.client = client; - id = uidl.getId(); - if (uidl.hasAttribute("caption")) caption.setText(uidl.getStringAttribute("caption")); - tree.clear(); + this.id = uidl.getId(); + + clear(); for (Iterator i = uidl.getChildIterator(); i.hasNext();) { UIDL childUidl = (UIDL)i.next(); - if(childUidl.getTag().equals("leaf")) - tree.addItem(childUidl.getStringAttribute("caption")); - if(childUidl.getTag().equals("node")) { - TreeNode childTree = new TreeNode(); - tree.addItem(childTree); - childTree.updateFromUIDL(childUidl, client); - } + TreeNode childTree = new TreeNode(); + addItem(childTree); + childTree.updateFromUIDL(childUidl, client); } String selectMode = uidl.getStringAttribute("selectmode"); selectable = selectMode != null; multiselect = "multi".equals(selectMode); - tree.addTreeListener(new TreeListener() { + addTreeListener(new TreeListener() { public void onTreeItemStateChanged(TreeItem item) { } @@ -72,6 +67,7 @@ public class ITree extends Composite implements Paintable { selectedIds = uidl.getStringArrayVariableAsSet("selected"); } + private class TreeNode extends TreeItem { String key; diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/collection.css b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/collection.css index 1b08bcd2dc..1a9687e481 100644 --- a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/collection.css +++ b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/collection.css @@ -1,3 +1,4 @@ @import "common/css/common.css"; @import "textfield/css/textfield.css"; -@import "select/css/select.css"; \ No newline at end of file +@import "select/css/select.css"; +@import "panel/css/panel.css"; \ No newline at end of file diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/css/common.css b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/css/common.css index 8f82f870a4..5d8424dca9 100644 --- a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/css/common.css +++ b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/css/common.css @@ -1,5 +1,5 @@ body { - background-color: #fff; + background: #fafafc url(../img/window-bg.png) repeat-x; font-family: helvetica, verdana, tahoma, arial, sans-serif; color: #222; font-size: 62.5%; diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/img/window-bg.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/img/window-bg.png new file mode 100644 index 0000000000..2bcda2dc63 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/common/img/window-bg.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/css/panel.css b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/css/panel.css new file mode 100644 index 0000000000..dce22c82c0 --- /dev/null +++ b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/css/panel.css @@ -0,0 +1,97 @@ +.i-panel { + border: 1px solid #29528a; + padding: 5px; + margin: 5px; + background: #fff url(../img/top-bg.png) repeat-x top left; +} + +.i-panel:before { + display: block; + height: 7px; + overflow: hidden; + background: transparent url(../img/top-right.png) no-repeat right top; + content: url(../img/top-left.png); + margin: -6px -6px 0 -6px; +} + +.i-panel:after { + display: block; + height: 2px; + overflow: hidden; + background: transparent url(../img/bottom-right.png) no-repeat right top; + content: url(../img/bottom-left.png); + margin: 5px -6px -6px -6px; +} + +.i-panel-caption { + font-size: 1.2em; + font-weight: bold; + color: #1c3e6e; + margin: 3px 0 5px 0; +} + + + +/* Strong style */ +.i-panel-strong { + background-image: url(../img/top-bg-strong.png); +} + +.i-panel-strong:before { + height: 28px; + background-image: url(../img/top-right-strong.png); + content: url(../img/top-left-strong.png); +} + +.i-panel-strong .i-panel-caption { + color: #fff; + margin: -22px 0 12px 0; +} + + + +/* Light style */ +.i-panel-light { + background-image: url(../img/top-bg-light.png); + border-color: #b3c2d6; + border-top-color: #2667a2; + margin-top: 23px; +} + +.i-panel-light:before { + height: 6px; + background-image: url(../img/top-right-light.png); + content: url(../img/top-left-light.png); +} + +.i-panel-light:after { + background-image: url(../img/bottom-right-light.png); + content: url(../img/bottom-left-light.png); +} + +.i-panel-light .i-panel-caption { + margin: -23px -5px 18px -5px; + font-size: 1.1em; +} + + + + + +/* IE specific rules (different selectors for IE6 and IE7 */ +* html .i-panel, +*+html .i-panel { + background-position: 0 1px; +} + +* html .i-panel-strong .i-panel-caption, +*+html .i-panel-strong .i-panel-caption { + margin: 1px 0 10px 0; + white-space: nowrap; +} + +* html .i-panel-light .i-panel-caption, +*+html .i-panel-light .i-panel-caption { + margin-bottom: 0; + padding-bottom: 23px; /* Must specify enough space because of wierd clipping bug */ +} \ No newline at end of file diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left-light.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left-light.png new file mode 100644 index 0000000000..9312e5bc03 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left-light.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left.png new file mode 100644 index 0000000000..3fda5f3c51 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-left.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right-light.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right-light.png new file mode 100644 index 0000000000..c542a42629 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right-light.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right.png new file mode 100644 index 0000000000..5f8ff7a3b1 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/bottom-right.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-light.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-light.png new file mode 100644 index 0000000000..0f46520214 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-light.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-strong.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-strong.png new file mode 100644 index 0000000000..5b89dd68c2 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg-strong.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg.png new file mode 100644 index 0000000000..bdfca27107 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-bg.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-light.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-light.png new file mode 100644 index 0000000000..c46f8add3b Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-light.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-strong.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-strong.png new file mode 100644 index 0000000000..4eddbe5b5d Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left-strong.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left.png new file mode 100644 index 0000000000..d16ced131e Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-left.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-light.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-light.png new file mode 100644 index 0000000000..d2bcd46c55 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-light.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-strong.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-strong.png new file mode 100644 index 0000000000..b1d3858f1b Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right-strong.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right.png b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right.png new file mode 100644 index 0000000000..dcf9c5c0dc Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/panel/img/top-right.png differ