package com.itmill.toolkit.terminal.gwt.client.ui;
import java.util.ArrayList;
-import java.util.HashMap;
import java.util.Iterator;
import com.google.gwt.user.client.ui.DeckPanel;
+import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.SourcesTabEvents;
import com.google.gwt.user.client.ui.TabBar;
import com.itmill.toolkit.terminal.gwt.client.UIDL;
public class ITabsheet extends TabPanel implements Paintable {
+
+ private static final String CLASSNAME = "i-tabsheet";
String id;
};
public ITabsheet() {
+ setStyleName(CLASSNAME);
+
addTabListener(new TabListener() {
public void onTabSelected(SourcesTabEvents sender, int tabIndex) {
public void updateFromUIDL(UIDL uidl, Client client) {
this.client = client;
id = uidl.getId();
+
+ DeckPanel dp = getDeckPanel();
+ dp.setStyleName(CLASSNAME+"-content");
+
+ TabBar tb = getTabBar();
+ tb.setStyleName(CLASSNAME+"-tabs");
UIDL tabs = uidl.getChildUIDL(0);
boolean keepCurrentTabs = tabKeys.size() == tabs.getNumberOfChildren();
activeTabIndex = index;
Widget content = client.getWidget(tab
.getChildUIDL(0));
- getTabBar().selectTab(index);
- DeckPanel dp = getDeckPanel();
+ tb.selectTab(index);
dp.remove(index);
dp.insert(content, index);
((Paintable)content).updateFromUIDL(tab
@import "common/css/common.css";\r
@import "textfield/css/textfield.css";\r
@import "select/css/select.css";\r
-@import "panel/css/panel.css";
\ No newline at end of file
+@import "panel/css/panel.css";\r
+@import "tabsheet/css/tabsheet.css";
\ No newline at end of file
body {\r
background: #fafafc url(../img/window-bg.png) repeat-x;\r
- font-family: helvetica, verdana, tahoma, arial, sans-serif;\r
+ font-family: helvetica, arial, tahoma, verdana, sans-serif;\r
color: #222;\r
font-size: 68.75%;\r
line-height: 1.4em;\r
}\r
\r
input, select, textarea, button {\r
- font-family: helvetica, verdana, tahoma, arial, sans-serif;\r
+ font-family: helvetica, arial, tahoma, verdana, sans-serif;\r
font-size: 1em;\r
}\r
\r
\r
\r
\r
-/* IE specific rules (different selectors for IE6 and IE7 */\r
-* html .i-panel,\r
+/* IE specific rules (different selectors for IE6 and IE7.\r
+ * These selectors must be separate because IE6 won't \r
+ * apply them if they are grouped together.\r
+ */\r
+ \r
+* html .i-panel {\r
+ background-position: 0 1px;\r
+}\r
*+html .i-panel {\r
background-position: 0 1px;\r
}\r
\r
-* html .i-panel .i-panel-caption,\r
+* html .i-panel .i-panel-caption {\r
+ margin-top: 3px;\r
+}\r
*+html .i-panel .i-panel-caption {\r
margin-top: 3px;\r
}\r
\r
-* html .i-panel-strong .i-panel-caption,\r
+\r
+* html .i-panel-strong .i-panel-caption {\r
+ margin: 1px 0 10px 0;\r
+}\r
*+html .i-panel-strong .i-panel-caption {\r
margin: 1px 0 10px 0;\r
}\r
\r
-* html .i-panel-light .i-panel-caption,\r
-*+html .i-panel-light .i-panel-caption {\r
+* html .i-panel-light .i-panel-caption {\r
margin-top: -23px;\r
margin-bottom: 0;\r
padding-bottom: 23px; /* Must specify enough space because of wierd clipping bug */\r
+}\r
+*+html .i-panel-light .i-panel-caption {\r
+ margin-top: -23px;\r
+ margin-bottom: 0;\r
+ padding-bottom: 23px;\r
}
\ No newline at end of file
}\r
\r
.i-select-select {\r
+ /*\r
border: 1px solid #b6b6b6;\r
- border-top-color: #9d9d9d;\r
- border-bottom-color: #d6d6d6;\r
- border-right-color: #d6d6d6;\r
+ border-bottom-color: #9d9d9d;\r
+ border-top-color: #d6d6d6;\r
+ border-left-color: #d6d6d6;\r
+ */\r
display: block;\r
}\r
\r
--- /dev/null
+.i-tabsheet {\r
+ margin: 5px;\r
+}\r
+\r
+.i-tabsheet-tabs {\r
+ empty-cells: hide;\r
+ border-collapse: collapse;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarFirst {\r
+ display: none;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarRest {\r
+ border-bottom: solid 1px #29528a;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem {\r
+ border: solid 1px #6082b0;\r
+ border-bottom-color: #29528a;\r
+ height: 17px;\r
+ padding: 4px 8px;\r
+ color: #1c3e6e;\r
+ background: #e6ebf0 url(../img/tab-bg.png) repeat-x;\r
+ margin-right: 1px;\r
+ cursor: pointer;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem-selected {\r
+ border-color: #29528a;\r
+ border-bottom-color: #fff;\r
+ background: #fff url(../img/tab-selected-bg.png) repeat-x;\r
+ padding-top: 7px;\r
+ padding-bottom: 5px;\r
+ margin-bottom: -1px;\r
+ font-weight: bold;\r
+ cursor: default;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem:hover {\r
+ border-color: #29528a;\r
+ background: #3a639b url(../img/tab-hover-bg.png) repeat-x;\r
+ color: #fff;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem-selected:hover {\r
+ background: #fff url(../img/tab-selected-bg.png) repeat-x;\r
+ color: #1c3e6e;\r
+}\r
+\r
+/* Rounded corners effects */\r
+.i-tabsheet-tabs .gwt-TabBarItem:before {\r
+ display: block;\r
+ height: 2px;\r
+ overflow: hidden;\r
+ background: transparent url(../img/tab-right.png) no-repeat right top;\r
+ content: url(../img/tab-left.png);\r
+ margin: -5px -9px 3px -9px;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem-selected:before {\r
+ height: 7px;\r
+ background-image: url(../img/tab-selected-right.png);\r
+ content: url(../img/tab-selected-left.png);\r
+ margin: -8px -9px 0 -9px;\r
+}\r
+\r
+.i-tabsheet-tabs .gwt-TabBarItem:hover:before {\r
+ background-image: url(../img/tab-hover-right.png);\r
+ content: url(../img/tab-hover-left.png);\r
+}\r
+\r
+.i-tabsheet-content:after {\r
+ display: block;\r
+ height: 2px;\r
+ overflow: hidden;\r
+ background: transparent url(../../panel/img/bottom-right.png) no-repeat right top;\r
+ content: url(../../panel/img/bottom-left.png);\r
+ margin: 5px -6px -6px -6px;\r
+}\r
+\r
+\r
+\r
+\r
+\r
+\r
+.i-tabsheet-content {\r
+ background-color: #fff;\r
+ border: solid 1px #29528a;\r
+ border-top: none;\r
+ padding: 5px;\r
+}
\ No newline at end of file