]> source.dussan.org Git - vaadin-framework.git/commitdiff
fixes #1668, #1669
authorMatti Tahvonen <matti.tahvonen@itmill.com>
Tue, 20 May 2008 09:52:32 +0000 (09:52 +0000)
committerMatti Tahvonen <matti.tahvonen@itmill.com>
Tue, 20 May 2008 09:52:32 +0000 (09:52 +0000)
svn changeset:4561/svn branch:trunk

12 files changed:
WebContent/ITMILL/themes/default/button/button.css
WebContent/ITMILL/themes/default/common/common.css
WebContent/ITMILL/themes/default/datefield/datefield.css
WebContent/ITMILL/themes/default/formlayout/formlayout.css [new file with mode: 0644]
WebContent/ITMILL/themes/default/select/select.css
WebContent/ITMILL/themes/default/slider/slider.css
WebContent/ITMILL/themes/default/styles.css
WebContent/ITMILL/themes/default/textfield/textfield.css
src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java
src/com/itmill/toolkit/terminal/gwt/client/Caption.java
src/com/itmill/toolkit/terminal/gwt/client/ui/IFormLayout.java
src/com/itmill/toolkit/terminal/gwt/client/ui/ITextualDate.java

index 2f8ffe0d28e711f5479c498e411ad47f9d2e00aa..30fdff6618c7eaf64d2fd52d7a3ba697f3405017 100644 (file)
@@ -17,3 +17,8 @@
 .i-button-link span {
        text-decoration: underline;
 }
+
+.i-checkbox-error {
+       background:transparent;
+       background-color: #FFE0E0;
+}
index 99e386b8ae889c20a7d8119b4a5668e9fbb45526..c68d18a625f262726969d79fc1956bea778ffc9e 100644 (file)
@@ -72,16 +72,12 @@ input.i-modified,
        background-color: #FFFFE0;\r
 }\r
 
-input.i-error,\r
-.i-richtextarea.i-error iframe.gwt-RichTextArea,\r
-.i-checkbox.i-error,\r
-.i-error .i-select-option,\r
-.i-error .i-textfield,\r
-.i-error .i-datefield-calendarpanel,\r
-.i-error .i-select-select,\r
-.i-error .i-select-twincol-selections,\r
-.i-error .i-select-twincol-options,\r
-.i-error .i-slider-base {\r
+.i-checkbox-error,
+.i-select-error .i-select-option,
+.i-select-error .i-select-select,
+.i-select-error .i-select-twincol-selections,
+.i-select-error .i-select-twincol-options,
+.i-slider-error .i-slider-base {\r
        background:transparent;
        background-color: #FFE0E0;\r
 }
index 7ddf948f5ac3d7083f8cebba76520c1fe0da38d1..834945e7fc36442c8e530196aab6b3c95ce275bf 100644 (file)
        margin: 0;\r
 }
 
-.i-datefield-error .i-textfield {
+.i-datefield-error .i-textfield,
+.i-datefield-error .i-datefield-calendarpanel {
+       background:transparent;
+       background-color: #FFE0E0;
+}
+
+.i-datefield-rendererror .i-textfield {
        background: #ff9999;
 }
diff --git a/WebContent/ITMILL/themes/default/formlayout/formlayout.css b/WebContent/ITMILL/themes/default/formlayout/formlayout.css
new file mode 100644 (file)
index 0000000..a27cada
--- /dev/null
@@ -0,0 +1,6 @@
+.i-formlayout-cell .i-errorindicator {
+       width: 10px;
+       height: 16px;
+       display: block;
+       background: transparent url(../icons/16/error.png) no-repeat top right;
+}
\ No newline at end of file
index 54064221bbc05e5e87ac25093f2bcffeeb8c0408..9d7eeaca52646e787b65bcc2bfa528bcd14e779f 100644 (file)
        border-top: 1px solid #b6bbbc;
 }
 
+.i-filterselect-error {
+       background: transparent url(img/bg-left-filter-error.png) no-repeat;
+}
+
+.i-filterselect-error .i-filterselect-button {
+       background: transparent url(img/bg-right-filter-error.png);
+}
+
+.i-select-error .i-select-option,
+.i-select-error .i-select-select,
+.i-select-error .i-select-twincol-selections,
+.i-select-error .i-select-twincol-options {
+       background:transparent;
+       background-color: #FFE0E0;
+}
+
 /* IE specific styles */
 
 * html .i-filterselect {
index 5b10e6a110075c0aa15b39f9353226bc6ffcc547..92497700177005fccac5f32e4b8f1b2d9ecccc48 100644 (file)
 
 }
 
+.i-slider-error .i-slider-base {
+       background:transparent;
+       background-color: #FFE0E0;
+}
 
 
 /* IE specific styles */
index 79aed3f7ade0592a35b1d2bda397ad4031f51d68..d48d9e80fcd4493695651e4c3570f982f878955c 100644 (file)
 .i-button-link span {
        text-decoration: underline;
 }
+
+.i-checkbox-error {
+       background:transparent;
+       background-color: #FFE0E0;
+}
 /* Provide some extra whitespace for wrapped elements
    (these elements usually need the extra space, since 
    they aren't even handling their own caption) */
@@ -158,16 +163,12 @@ input.i-modified,
        background-color: #FFFFE0;
 }
 
-input.i-error,
-.i-richtextarea.i-error iframe.gwt-RichTextArea,
-.i-checkbox.i-error,
-.i-error .i-select-option,
-.i-error .i-textfield,
-.i-error .i-datefield-calendarpanel,
-.i-error .i-select-select,
-.i-error .i-select-twincol-selections,
-.i-error .i-select-twincol-options,
-.i-error .i-slider-base {
+.i-checkbox-error,
+.i-select-error .i-select-option,
+.i-select-error .i-select-select,
+.i-select-error .i-select-twincol-selections,
+.i-select-error .i-select-twincol-options,
+.i-slider-error .i-slider-base {
        background:transparent;
        background-color: #FFE0E0;
 }
@@ -425,7 +426,13 @@ input.i-error,
        margin: 0;
 }
 
-.i-datefield-error .i-textfield {
+.i-datefield-error .i-textfield,
+.i-datefield-error .i-datefield-calendarpanel {
+       background:transparent;
+       background-color: #FFE0E0;
+}
+
+.i-datefield-rendererror .i-textfield {
        background: #ff9999;
 }
 .i-expandlayout-lo-table {
@@ -471,6 +478,12 @@ input.i-error,
 .i-expandlayout-hspacing {
        margin-left: 8px;
 }
+.i-formlayout-cell .i-errorindicator {
+       width: 10px;
+       height: 16px;
+       display: block;
+       background: transparent url(icons/16/error.png) no-repeat top right;
+}
 
 .i-Notification {
        font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
@@ -952,6 +965,22 @@ input.i-error,
        border-top: 1px solid #b6bbbc;
 }
 
+.i-filterselect-error {
+       background: transparent url(select/img/bg-left-filter-error.png) no-repeat;
+}
+
+.i-filterselect-error .i-filterselect-button {
+       background: transparent url(select/img/bg-right-filter-error.png);
+}
+
+.i-select-error .i-select-option,
+.i-select-error .i-select-select,
+.i-select-error .i-select-twincol-selections,
+.i-select-error .i-select-twincol-options {
+       background:transparent;
+       background-color: #FFE0E0;
+}
+
 /* IE specific styles */
 
 * html .i-filterselect {
@@ -1061,6 +1090,10 @@ input.i-error,
 
 }
 
+.i-slider-error .i-slider-base {
+       background:transparent;
+       background-color: #FFE0E0;
+}
 
 
 /* IE specific styles */
@@ -1540,6 +1573,13 @@ input.i-error,
 .i-richtextarea iframe {
        border: 0;
 }
+
+.i-textarea-error,
+.i-textfield-error,
+.i-richtextarea-error iframe.gwt-RichTextArea {
+       background:transparent;
+       background-color: #FFE0E0;      
+}
 .i-tree {
        text-align: left /* Force default alignment */
 }
index 9f3191dc753820e0dc705fc23cb9211f687ffa7a..da549b4c66d12ff6917054741eee57d684550f50 100644 (file)
 }
 .i-richtextarea iframe {
        border: 0;
-}
\ No newline at end of file
+}
+
+.i-textarea-error,
+.i-textfield-error,
+.i-richtextarea-error iframe.gwt-RichTextArea {
+       background:transparent;
+       background-color: #FFE0E0;      
+}
index 0f9cbbeb28594cb3249e8c12aa55ec21aeb649ce..bb7436a6aa8b24f54a5b9ec4e49ca83999592b60 100755 (executable)
@@ -41,8 +41,8 @@ import com.itmill.toolkit.terminal.gwt.client.ui.Notification.HideEvent;
  * Entry point classes define <code>onModuleLoad()</code>.
  */
 public class ApplicationConnection {
-    public static final String MODIFIED_CLASSNAME = "i-modified";
-    public static final String ERROR_CLASSNAME = "i-error";
+    private static final String MODIFIED_CLASSNAME = "i-modified";
+    private static final String ERROR_CLASSNAME_EXT = "-error";
 
     public static final String VAR_RECORD_SEPARATOR = "\u001e";
 
@@ -754,7 +754,7 @@ public class ApplicationConnection {
         }
 
         StringBuffer styleBuf = new StringBuffer();
-        String primaryName = component.getStylePrimaryName();
+        final String primaryName = component.getStylePrimaryName();
         styleBuf.append(primaryName);
 
         // first disabling and read-only status
@@ -783,7 +783,8 @@ public class ApplicationConnection {
         // add error classname to components w/ error
         if (uidl.hasAttribute("error")) {
             styleBuf.append(" ");
-            styleBuf.append(ERROR_CLASSNAME);
+            styleBuf.append(primaryName);
+            styleBuf.append(ERROR_CLASSNAME_EXT);
         }
 
         // Styles + disabled & readonly
index 4421d7050fa1f8a96cf09f0d13e8e29eebbeb478..1d3be76a71f4f0d114cd682792db931deb93f2f3 100644 (file)
@@ -110,8 +110,10 @@ public class Caption extends HTML {
             if (captionText != null) {
                 DOM.setElementProperty(captionText, "title", uidl
                         .getStringAttribute("description"));
+                addStyleDependentName("hasdescription");
             } else {
                 setTitle(uidl.getStringAttribute("description"));
+                removeStyleDependentName("hasdescription");
             }
         }
 
index 79e5773fd91fa0fb77240a6e17e8673c160c597f..fc1d6c3b80f4f1b60ff08f686afc3df2fa35a843 100644 (file)
@@ -7,13 +7,18 @@ package com.itmill.toolkit.terminal.gwt.client.ui;
 import java.util.HashMap;
 import java.util.Iterator;
 
+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.ui.FlexTable;
+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.Caption;
 import com.itmill.toolkit.terminal.gwt.client.Container;
+import com.itmill.toolkit.terminal.gwt.client.ErrorMessage;
 import com.itmill.toolkit.terminal.gwt.client.Paintable;
 import com.itmill.toolkit.terminal.gwt.client.UIDL;
+import com.itmill.toolkit.terminal.gwt.client.Util;
 
 /**
  * Two col Layout that places caption on left col and field on right col
@@ -49,6 +54,15 @@ public class IFormLayout extends FlexTable implements Container {
             }
             setWidget(i, 0, c);
             p.updateFromUIDL(childUidl, client);
+
+            prepareCell(i, 2);
+            getCellFormatter().setStyleName(i, 2, "i-formlayout-errorcell");
+            ErrorFlag error = (ErrorFlag) getWidget(i, 2);
+            if (error == null) {
+                error = new ErrorFlag();
+                setWidget(i, 2, error);
+            }
+            error.updateFromUIDL(childUidl);
         }
 
         while (getRowCount() > i) {
@@ -83,4 +97,194 @@ public class IFormLayout extends FlexTable implements Container {
             c.updateCaption(uidl);
         }
     }
+
+    public class Caption extends HTML {
+
+        public static final String CLASSNAME = "i-caption";
+
+        private final Paintable owner;
+
+        private Element requiredFieldIndicator;
+
+        private Icon icon;
+
+        private Element captionText;
+
+        private final ApplicationConnection client;
+
+        /**
+         * 
+         * @param component
+         *                optional owner of caption. If not set, getOwner will
+         *                return null
+         * @param client
+         */
+        public Caption(Paintable component, ApplicationConnection client) {
+            super();
+            this.client = client;
+            owner = component;
+            setStyleName(CLASSNAME);
+        }
+
+        public void updateCaption(UIDL uidl) {
+            setVisible(!uidl.getBooleanAttribute("invisible"));
+
+            setStyleName(getElement(), "i-disabled", uidl
+                    .hasAttribute("disabled"));
+
+            boolean isEmpty = true;
+
+            if (uidl.hasAttribute("icon")) {
+                if (icon == null) {
+                    icon = new Icon(client);
+
+                    DOM.insertChild(getElement(), icon.getElement(), 0);
+                }
+                icon.setUri(uidl.getStringAttribute("icon"));
+                isEmpty = false;
+            } else {
+                if (icon != null) {
+                    DOM.removeChild(getElement(), icon.getElement());
+                    icon = null;
+                }
+
+            }
+
+            if (uidl.hasAttribute("caption")) {
+                if (captionText == null) {
+                    captionText = DOM.createSpan();
+                    DOM.insertChild(getElement(), captionText, icon == null ? 0
+                            : 1);
+                }
+                String c = uidl.getStringAttribute("caption");
+                if (c == null) {
+                    c = "";
+                } else {
+                    isEmpty = false;
+                }
+                DOM.setInnerText(captionText, c);
+            } else {
+                // TODO should span also be removed
+            }
+
+            if (uidl.hasAttribute("description")) {
+                if (captionText != null) {
+                    DOM.setElementProperty(captionText, "title", uidl
+                            .getStringAttribute("description"));
+                    addStyleDependentName("hasdescription");
+                } else {
+                    setTitle(uidl.getStringAttribute("description"));
+                    removeStyleDependentName("hasdescription");
+                }
+            }
+
+            if (uidl.getBooleanAttribute("required")) {
+                if (requiredFieldIndicator == null) {
+                    requiredFieldIndicator = DOM.createSpan();
+                    DOM.setInnerText(requiredFieldIndicator, "*");
+                    DOM.setElementProperty(requiredFieldIndicator, "className",
+                            "i-required-field-indicator");
+                    DOM.appendChild(getElement(), requiredFieldIndicator);
+                }
+            } else {
+                if (requiredFieldIndicator != null) {
+                    DOM.removeChild(getElement(), requiredFieldIndicator);
+                    requiredFieldIndicator = null;
+                }
+            }
+
+            // Workaround for IE weirdness, sometimes returns bad height in some
+            // circumstances when Caption is empty. See #1444
+            // IE7 bugs more often. I wonder what happens when IE8 arrives...
+            if (Util.isIE()) {
+                if (isEmpty) {
+                    setHeight("0px");
+                    DOM.setStyleAttribute(getElement(), "overflow", "hidden");
+                } else {
+                    setHeight("");
+                    DOM.setStyleAttribute(getElement(), "overflow", "");
+                }
+
+            }
+
+        }
+
+        /**
+         * Returns Paintable for which this Caption belongs to.
+         * 
+         * @return owner Widget
+         */
+        public Paintable getOwner() {
+            return owner;
+        }
+    }
+
+    private class ErrorFlag extends HTML {
+        private static final String CLASSNAME = ".i-form-layout-error-indicator";
+        Element errorIndicatorElement;
+        private ErrorMessage errorMessage;
+
+        public ErrorFlag() {
+            setStyleName(CLASSNAME);
+        }
+
+        public void updateFromUIDL(UIDL uidl) {
+            if (uidl.hasAttribute("error")) {
+                final UIDL errorUidl = uidl.getErrors();
+
+                if (errorIndicatorElement == null) {
+                    errorIndicatorElement = DOM.createDiv();
+                    if (Util.isIE()) {
+                        DOM.setInnerHTML(errorIndicatorElement, "&nbsp;");
+                    }
+                    DOM.setElementProperty(errorIndicatorElement, "className",
+                            "i-errorindicator");
+                    DOM.appendChild(getElement(), errorIndicatorElement);
+                }
+                if (errorMessage == null) {
+                    errorMessage = new ErrorMessage();
+                }
+                errorMessage.updateFromUIDL(errorUidl);
+
+            } else if (errorIndicatorElement != null) {
+                DOM.removeChild(getElement(), errorIndicatorElement);
+                errorIndicatorElement = null;
+            }
+        }
+
+        public void onBrowserEvent(Event event) {
+            final 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()));
+                default:
+                    break;
+                }
+            } else {
+                super.onBrowserEvent(event);
+            }
+        }
+
+        private void hideErrorMessage() {
+            if (errorMessage != null) {
+                errorMessage.hide();
+            }
+        }
+
+        private void showErrorMessage() {
+            if (errorMessage != null) {
+                errorMessage.showAt(errorIndicatorElement);
+            }
+        }
+
+    }
 }
index d4091e9cfb422233bf2d9394bd149b5cb1231098..5a841caebced56743c0098b39992d7b667afe1c6 100644 (file)
@@ -19,7 +19,8 @@ import com.itmill.toolkit.terminal.gwt.client.Util;
 public class ITextualDate extends IDateField implements Paintable, Field,\r
         ChangeListener, ContainerResizedListener, Focusable {\r
 \r
-    private static final String ERROR_CLASSNAME = CLASSNAME + "-error";\r
+    private static final String PARSE_ERROR_CLASSNAME = CLASSNAME\r
+            + "-parseerror";\r
 \r
     private final ITextField text;\r
 \r
@@ -97,7 +98,7 @@ public class ITextualDate extends IDateField implements Paintable, Field,
      * \r
      */\r
     protected void buildDate() {\r
-        removeStyleName(ERROR_CLASSNAME);\r
+        removeStyleName(PARSE_ERROR_CLASSNAME);\r
         // Create the initial text for the textfield\r
         String dateText;\r
         if (date != null) {\r
@@ -124,10 +125,10 @@ public class ITextualDate extends IDateField implements Paintable, Field,
                     date = DateTimeFormat.getFormat(getFormatString()).parse(\r
                             text.getText());\r
                     // remove possibly added invalid value indication\r
-                    removeStyleName(ERROR_CLASSNAME);\r
+                    removeStyleName(PARSE_ERROR_CLASSNAME);\r
                 } catch (final Exception e) {\r
                     ApplicationConnection.getConsole().log(e.getMessage());\r
-                    addStyleName(ERROR_CLASSNAME);\r
+                    addStyleName(PARSE_ERROR_CLASSNAME);\r
                     client.updateVariable(id, "lastInvalidDateString", text\r
                             .getText(), false);\r
                     date = null;\r
@@ -135,7 +136,7 @@ public class ITextualDate extends IDateField implements Paintable, Field,
             } else {\r
                 date = null;\r
                 // remove possibly added invalid value indication\r
-                removeStyleName(ERROR_CLASSNAME);\r
+                removeStyleName(PARSE_ERROR_CLASSNAME);\r
             }\r
 \r
             // Update variables\r