package com.itmill.toolkit.terminal.gwt.client.ui;
import com.google.gwt.user.client.DOM;
+import com.google.gwt.user.client.Element;
+import com.google.gwt.user.client.Event;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Widget;
import com.itmill.toolkit.terminal.gwt.client.ApplicationConnection;
+import com.itmill.toolkit.terminal.gwt.client.ErrorMessage;
import com.itmill.toolkit.terminal.gwt.client.Paintable;
import com.itmill.toolkit.terminal.gwt.client.UIDL;
private int height;
+ private Element errorIndicatorElement;
+
+ private Element captionElement = DOM.createSpan();
+
+ private ErrorMessage errorMessage;
+
+ private Icon icon;
+
public ILink() {
super();
+ DOM.appendChild(getElement(), captionElement);
addClickListener(this);
setStyleName(CLASSNAME);
}
public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {
+ // Ensure correct implementation,
+ // but don't let container manage caption etc.
if (client.updateComponent(this, uidl, false)) {
return;
}
target = uidl.getStringAttribute(target);
}
if (uidl.hasAttribute("src")) {
- // TODO theme soure
+ // TODO theme source
src = client.translateToolkitUri(uidl.getStringAttribute("src"));
}
: -1;
width = uidl.hasAttribute("width") ? uidl.getIntAttribute("width") : -1;
- DOM.setInnerHTML(getElement(), uidl.getStringAttribute("caption"));
-
+ // Set link caption
+ DOM.setInnerText(captionElement, uidl.getStringAttribute("caption"));
+
+ // handle error
+ if (uidl.hasAttribute("error")) {
+ UIDL errorUidl = uidl.getErrors();
+ if (errorIndicatorElement == null) {
+ errorIndicatorElement = DOM.createDiv();
+ DOM.setElementProperty(errorIndicatorElement, "className",
+ "i-errorindicator");
+ DOM.sinkEvents(errorIndicatorElement, Event.MOUSEEVENTS);
+ sinkEvents(Event.MOUSEEVENTS);
+ }
+ DOM.insertChild(getElement(), errorIndicatorElement, 0);
+ if (errorMessage == null) {
+ errorMessage = new ErrorMessage();
+ }
+ errorMessage.updateFromUIDL(errorUidl);
+
+ } else if (errorIndicatorElement != null) {
+ DOM.setStyleAttribute(errorIndicatorElement, "display", "none");
+ }
+
+ if (uidl.hasAttribute("icon")) {
+ if (icon == null) {
+ icon = new Icon(client);
+ DOM.insertChild(getElement(), icon.getElement(), 0);
+ }
+ icon.setUri(uidl.getStringAttribute("icon"));
+ }
+
+ // handle description
+ if (uidl.hasAttribute("description")) {
+ setTitle(uidl.getStringAttribute("description"));
+ }
+
}
public void onClick(Widget sender) {
Window.open(src, target, features);
}
}
+
+ public void onBrowserEvent(Event event) {
+ Element target = DOM.eventGetTarget(event);
+ if (errorIndicatorElement != null
+ && DOM.compare(target, errorIndicatorElement)) {
+ switch (DOM.eventGetType(event)) {
+ case Event.ONMOUSEOVER:
+ showErrorMessage();
+ break;
+ case Event.ONMOUSEOUT:
+ hideErrorMessage();
+ break;
+ case Event.ONCLICK:
+ ApplicationConnection.getConsole().log(
+ DOM.getInnerHTML(errorMessage.getElement()));
+ return;
+ default:
+ break;
+ }
+ }
+ super.onBrowserEvent(event);
+ }
+
+ private void hideErrorMessage() {
+ errorMessage.hide();
+ }
+
+ private void showErrorMessage() {
+ if (errorMessage != null) {
+ errorMessage.showAt(errorIndicatorElement);
+ }
+ }
}
-.i-tabsheet,\r
-.i-tabsheet-content,\r
-.i-tabsheet-deco {\r
- outline: none; /* Prevent selection outline which might break layouts or cause scrollbars */\r
-}\r
-\r
-\r
-.i-tabsheet-tabs {\r
- empty-cells: hide;\r
- border-collapse: collapse;\r
- height: 48px;\r
+.i-tabsheet,
+.i-tabsheet-content,
+.i-tabsheet-deco {
+ outline: none; /* Prevent selection outline which might break layouts or cause scrollbars */
+}
+
+
+.i-tabsheet-tabs {
+ empty-cells: hide;
+ border-collapse: collapse;
+ height: 48px;
background: transparent url(img/tabs-bg.png) repeat-x bottom left;
- width: 100%;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarFirst {\r
- display: none;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarRest {\r
- border: 1px solid #b6bbbc;\r
- background: #f8f9f9 url(img/tab-bg.png);\r
- height: 37px;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarItem {\r
- border: 1px solid #b6bbbc;\r
- border-right: none;\r
- height: 20px;\r
- padding: 9px 15px 8px 15px;\r
- margin-top: 9px;\r
- color: #777f85;\r
- font-size: 15px;\r
- line-height: 15px;\r
- background: #f8f9f9 url(img/tab-bg.png);\r
- cursor: pointer;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarItem-selected {\r
- border: none;\r
- background: transparent url(../panel/img/top-left.png) no-repeat;\r
- margin-top: -9px;\r
- padding-left: 16px;\r
- height: 30px;\r
- cursor: default;\r
- color: #ee5311;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarItem:hover {\r
- color: #4b5257;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarItem-selected:hover {\r
- color: #ee5311;\r
-}\r
-\r
-.i-tabsheet-tabs .gwt-TabBarItem-selected:before {\r
- display: block;\r
- height: 9px;\r
- background: transparent url(../panel/img/top-right.png) repeat-x right top;\r
- content: "";\r
- margin: -9px -16px 9px -6px;\r
-}\r
-\r
-.i-tabsheet-content {\r
- border: 1px solid #babfc0;\r
- border-top: none;\r
- border-bottom: none;\r
- background-color: #fff;\r
- overflow: auto;\r
-}\r
-\r
-.i-tabsheet-deco {\r
- height: 9px;\r
- background: transparent url(../panel/img/bottom-right.png) repeat-x right top;\r
- margin-left: 9px;\r
-}\r
-\r
-.i-tabsheet-deco:before {\r
- display: block;\r
- content: "";\r
- width: 9px;\r
- height: 9px;\r
- margin-left: -9px;\r
- background: transparent url(../panel/img/bottom-left.png) no-repeat;\r
-}\r
-\r
-\r
-\r
-\r
-/* Fix Safari bug (one pixel table offset) by \r
- adding one extra pixel in every browser */\r
-/* Actually, let Safari be a little different, it's a bug */\r
-/*\r
-.i-tabsheet-content {\r
- margin-left: 1px;\r
-}\r
-.i-tabsheet-tabs .gwt-TabBarFirst {\r
- display: block;\r
- width: 1px;\r
- height: 1px;\r
- overflow: hidden;\r
-}\r
-.i-tabsheet {\r
- margin-left: -1px;\r
-}\r
-*/\r
-\r
-\r
-/* Progress indication */\r
-\r
-.i-tabsheet-loading .i-tabsheet-tabs .gwt-TabBarItem-selected span{\r
- background: transparent url(../common/img/ajax-loader.gif) no-repeat;\r
- display: block;\r
- margin-left: -10px;\r
- padding-left: 10px;\r
- margin-top: -12px;\r
- padding-top: 12px;\r
-}\r
-\r
-.i-tabsheet-loading .i-tabsheet-content * {\r
- visibility: hidden;\r
- overflow: hidden;\r
-}
-
-
-\r
-\r
-/* IE specific styles */\r
-* html .i-tabsheet-content {\r
- border-bottom: 1px solid #babfc0;\r
-}\r
-*+html .i-tabsheet-content {\r
- border-bottom: 1px solid #babfc0;\r
-}\r
-\r
-* html .i-tabsheet-tabs {\r
- height: 46px;\r
-}\r
-*+html .i-tabsheet-tabs {\r
- height: 46px;\r
-}\r
-\r
-* html .i-tabsheet-tabs .gwt-TabBarItem-selected {\r
- border: 1px solid #babfc0;\r
- border-bottom: none;\r
- background: #fff;\r
- margin-top: 0;\r
- height: 23px;\r
- padding: 18px 14px 6px 15px;\r
- cursor: default;\r
- color: #ee5311;\r
-}\r
-*+html .i-tabsheet-tabs .gwt-TabBarItem-selected {\r
- border: 1px solid #babfc0;\r
- border-bottom: none;\r
- background: #fff;\r
- margin-top: 0;\r
- height: 23px;\r
- padding: 18px 14px 6px 15px;\r
- cursor: default;\r
- color: #ee5311;\r
-}\r
-\r
-* html .i-tabsheet-deco {\r
- height: 0;\r
- overflow: hidden;\r
-}\r
-*+html .i-tabsheet-deco {\r
- height: 0;\r
- overflow: hidden;\r
+ width: 100%;
+}
+
+.i-tabsheet-tabs .gwt-TabBarFirst {
+ display: none;
+}
+
+.i-tabsheet-tabs .gwt-TabBarRest {
+ border: 1px solid #b6bbbc;
+ background: #f8f9f9 url(img/tab-bg.png);
+ height: 37px;
+}
+
+.i-tabsheet-tabs .gwt-TabBarItem {
+ border: 1px solid #b6bbbc;
+ border-right: none;
+ height: 20px;
+ padding: 9px 15px 8px 15px;
+ margin-top: 9px;
+ color: #777f85;
+ font-size: 15px;
+ line-height: 15px;
+ background: #f8f9f9 url(img/tab-bg.png);
+ cursor: pointer;
+}
+
+.i-tabsheet-tabs .gwt-TabBarItem-selected {
+ border: none;
+ background: transparent url(../panel/img/top-left.png) no-repeat;
+ margin-top: -9px;
+ padding-left: 16px;
+ height: 30px;
+ cursor: default;
+ color: #ee5311;
+}
+
+.i-tabsheet-tabs .gwt-TabBarItem:hover {
+ color: #4b5257;
+}
+
+.i-tabsheet-tabs .gwt-TabBarItem-selected:hover {
+ color: #ee5311;
+}
+
+.i-tabsheet-tabs .gwt-TabBarItem-selected:before {
+ display: block;
+ height: 9px;
+ background: transparent url(../panel/img/top-right.png) repeat-x right top;
+ content: "";
+ margin: -9px -16px 9px -6px;
+}
+
+.i-tabsheet-content {
+ border: 1px solid #babfc0;
+ border-top: none;
+ border-bottom: none;
+ background-color: #fff;
+}
+
+.i-tabsheet-deco {
+ height: 9px;
+ background: transparent url(../panel/img/bottom-right.png) repeat-x right top;
+ margin-left: 9px;
+}
+
+.i-tabsheet-deco:before {
+ display: block;
+ content: "";
+ width: 9px;
+ height: 9px;
+ margin-left: -9px;
+ background: transparent url(../panel/img/bottom-left.png) no-repeat;
+}
+
+
+
+/* Progress indication */
+
+.i-tabsheet-loading .i-tabsheet-tabs .gwt-TabBarItem-selected span{
+ background: transparent url(../common/img/ajax-loader.gif) no-repeat;
+ display: block;
+ margin-left: -10px;
+ padding-left: 10px;
+ margin-top: -12px;
+ padding-top: 12px;
+}
+
+.i-tabsheet-loading .i-tabsheet-content * {
+ visibility: hidden;
+ overflow: hidden;
+}
+
+
+
+
+/* IE specific styles */
+
+* html .i-tabsheet-tabs {
+ height: 46px;
+}
+*+html .i-tabsheet-tabs {
+ height: 46px;
+}
+
+* html .i-tabsheet-tabs .gwt-TabBarItem-selected {
+ border: 1px solid #babfc0;
+ border-bottom: none;
+ background: #fff;
+ margin-top: 0;
+ height: 23px;
+ padding: 18px 14px 6px 15px;
+ cursor: default;
+ color: #ee5311;
+}
+*+html .i-tabsheet-tabs .gwt-TabBarItem-selected {
+ border: 1px solid #babfc0;
+ border-bottom: none;
+ background: #fff;
+ margin-top: 0;
+ height: 23px;
+ padding: 18px 14px 6px 15px;
+ cursor: default;
+ color: #ee5311;
+}
+
+* html .i-tabsheet-deco {
+ height: 1px;
+ background: #babfc0;
+ overflow: hidden;
+ margin: 0;
+}
+*+html .i-tabsheet-deco {
+ height: 1px;
+ background: #babfc0;
+ overflow: hidden;
+ margin: 0;
}
\ No newline at end of file