From: Marc Englund Date: Fri, 16 May 2008 14:13:09 +0000 (+0000) Subject: Partial fix for #1656 (modified and error styles to fields) X-Git-Tag: 6.7.0.beta1~4753 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=5559cb1142d8d49d21212a081c2d032658d2db45;p=vaadin-framework.git Partial fix for #1656 (modified and error styles to fields) svn changeset:4531/svn branch:trunk --- diff --git a/WebContent/ITMILL/themes/default/caption/caption.css b/WebContent/ITMILL/themes/default/caption/caption.css index 22dad5bd31..7407033d53 100644 --- a/WebContent/ITMILL/themes/default/caption/caption.css +++ b/WebContent/ITMILL/themes/default/caption/caption.css @@ -21,8 +21,8 @@ vertical-align: middle; } -.i-error { - padding-left: 15px; - background: #fff; - border: 1px solid red; +.i-errormessage { + padding: 7px; + background-color: #FFE0E0; + border: 1px solid #FFB0B0; } \ No newline at end of file diff --git a/WebContent/ITMILL/themes/default/common/common.css b/WebContent/ITMILL/themes/default/common/common.css index 55f2a78b08..2ffb82d6ce 100644 --- a/WebContent/ITMILL/themes/default/common/common.css +++ b/WebContent/ITMILL/themes/default/common/common.css @@ -48,11 +48,37 @@ opacity: 0.3; filter: Alpha(opacity=30); } - .i-required-field-indicator { padding-left:2px; color: red; } + +/* Field modified & error */ +input.i-modified, +.i-richtextarea.i-modified iframe.gwt-RichTextArea, +.i-checkbox.i-modified, +.i-modified .i-select-option, +.i-modified .i-textfield, +.i-modified .i-datefield-calendarpanel, +.i-modified .i-select-select, +.i-modified .i-select-twincol-selections, +.i-modified .i-select-twincol-options, +.i-modified .i-slider-base { + 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 { + background-color: #FFE0E0; +} /** * Context menu styles diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css index c8454d7218..32e1f2dd98 100644 --- a/WebContent/ITMILL/themes/default/styles.css +++ b/WebContent/ITMILL/themes/default/styles.css @@ -71,10 +71,10 @@ vertical-align: middle; } -.i-error { - padding-left: 15px; - background: #fff; - border: 1px solid red; +.i-errormessage { + padding: 7px; + background-color: #FFE0E0; + border: 1px solid #FFB0B0; } /* body tag created by servlet */ .i-generated-body { @@ -126,12 +126,38 @@ opacity: 0.3; filter: Alpha(opacity=30); } - .i-required-field-indicator { padding-left:2px; color: red; } +/* Field modified & error */ +input.i-modified, +.i-richtextarea.i-modified iframe.gwt-RichTextArea, +.i-checkbox.i-modified, +.i-modified .i-select-option, +.i-modified .i-textfield, +.i-modified .i-datefield-calendarpanel, +.i-modified .i-select-select, +.i-modified .i-select-twincol-selections, +.i-modified .i-select-twincol-options, +.i-modified .i-slider-base { + 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 { + background-color: #FFE0E0; +} + /** * Context menu styles */ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java b/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java index b9f1b9b868..330f8595c1 100755 --- a/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java @@ -32,6 +32,7 @@ import com.google.gwt.user.client.ui.HasFocus; import com.google.gwt.user.client.ui.HasWidgets; import com.google.gwt.user.client.ui.Widget; import com.itmill.toolkit.terminal.gwt.client.ui.ContextMenu; +import com.itmill.toolkit.terminal.gwt.client.ui.Field; import com.itmill.toolkit.terminal.gwt.client.ui.IView; import com.itmill.toolkit.terminal.gwt.client.ui.Notification; import com.itmill.toolkit.terminal.gwt.client.ui.Notification.HideEvent; @@ -40,6 +41,8 @@ import com.itmill.toolkit.terminal.gwt.client.ui.Notification.HideEvent; * Entry point classes define onModuleLoad(). */ public class ApplicationConnection { + public static final String MODIFIED_CLASSNAME = "i-modified"; + public static final String ERROR_CLASSNAME = "i-error"; public static final String VAR_RECORD_SEPARATOR = "\u001e"; @@ -555,6 +558,11 @@ public class ApplicationConnection { private void addVariableToQueue(String paintableId, String variableName, String encodedValue, boolean immediate, char type) { + Paintable p = getPaintable(paintableId); + if (p instanceof Widget && p instanceof Field) { + // Mark as modified if it's a Field + ((Widget) p).addStyleName(MODIFIED_CLASSNAME); + } final String id = paintableId + VAR_FIELD_SEPARATOR + variableName + VAR_FIELD_SEPARATOR + type; for (int i = 1; i < pendingVariables.size(); i += 2) { @@ -771,10 +779,22 @@ public class ApplicationConnection { } } + // add modified classname to Fields + if (component instanceof Field && uidl.hasAttribute("modified")) { + component.addStyleName(MODIFIED_CLASSNAME); + } + // add error classname to components w/ error + if (uidl.hasAttribute("error")) { + component.addStyleName(ERROR_CLASSNAME); + } + if (usePaintableIdsInDOM) { DOM.setElementProperty(component.getElement(), "id", uidl.getId()); } + // TODO this should really build one string with all the classnames + // and setStyleName() once + return false; } diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ErrorMessage.java b/src/com/itmill/toolkit/terminal/gwt/client/ErrorMessage.java index a90a00807d..80b170a09a 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ErrorMessage.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ErrorMessage.java @@ -13,7 +13,7 @@ import com.google.gwt.user.client.ui.HTML; import com.itmill.toolkit.terminal.gwt.client.ui.ToolkitOverlay; public class ErrorMessage extends FlowPanel { - public static final String CLASSNAME = "i-error"; + public static final String CLASSNAME = "i-errormessage"; public ErrorMessage() { super(); diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/Field.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/Field.java new file mode 100644 index 0000000000..d0e1d0b666 --- /dev/null +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/Field.java @@ -0,0 +1,13 @@ +/** + * + */ +package com.itmill.toolkit.terminal.gwt.client.ui; + +/** + * This interface indicates that the component is a Field (serverside), and + * wants (for instance) to automatically get the i-modified classname. + * + */ +public interface Field { + +} diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ICheckBox.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ICheckBox.java index b326e6e42d..46ce4eeaa2 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ICheckBox.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ICheckBox.java @@ -15,7 +15,7 @@ import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; public class ICheckBox extends com.google.gwt.user.client.ui.CheckBox implements - Paintable { + Paintable, Field { public static final String CLASSNAME = "i-checkbox"; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateField.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateField.java index c064164035..eac7e5c740 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateField.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateField.java @@ -13,7 +13,7 @@ import com.itmill.toolkit.terminal.gwt.client.LocaleNotLoadedException; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; -public class IDateField extends FlowPanel implements Paintable { +public class IDateField extends FlowPanel implements Paintable, Field { public static final String CLASSNAME = "i-datefield"; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IFilterSelect.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IFilterSelect.java index 1d416642f7..8b84dd6f59 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IFilterSelect.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IFilterSelect.java @@ -37,7 +37,7 @@ import com.itmill.toolkit.terminal.gwt.client.Util; * * TODO needs major refactoring (to be extensible etc) */ -public class IFilterSelect extends Composite implements Paintable, +public class IFilterSelect extends Composite implements Paintable, Field, KeyboardListener, ClickListener, FocusListener, Focusable { public class FilterSelectSuggestion implements Suggestion, Command { diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/INativeSelect.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/INativeSelect.java index 24ee76c503..9d536ba8b3 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/INativeSelect.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/INativeSelect.java @@ -11,7 +11,7 @@ import com.google.gwt.user.client.ui.ListBox; import com.google.gwt.user.client.ui.Widget; import com.itmill.toolkit.terminal.gwt.client.UIDL; -public class INativeSelect extends IOptionGroupBase { +public class INativeSelect extends IOptionGroupBase implements Field { public static final String CLASSNAME = "i-select"; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java index 5c77ac33c4..d639c075e8 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java @@ -17,7 +17,7 @@ import com.itmill.toolkit.terminal.gwt.client.ApplicationConnection; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; -abstract class IOptionGroupBase extends Composite implements Paintable, +abstract class IOptionGroupBase extends Composite implements Paintable, Field, ClickListener, ChangeListener, KeyboardListener { public static final String CLASSNAME_OPTION = "i-select-option"; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java index c398c1b742..3bc0a9a03c 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java @@ -16,7 +16,7 @@ import com.itmill.toolkit.terminal.gwt.client.ApplicationConnection; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; -public class IPopupCalendar extends ITextualDate implements Paintable, +public class IPopupCalendar extends ITextualDate implements Paintable, Field, ClickListener, PopupListener { private final IButton calendarToggle; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ISlider.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ISlider.java index dc8f18ee67..a7e5ef02d1 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ISlider.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ISlider.java @@ -17,7 +17,7 @@ import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; import com.itmill.toolkit.terminal.gwt.client.Util; -public class ISlider extends Widget implements Paintable, +public class ISlider extends Widget implements Paintable, Field, ContainerResizedListener { public static final String CLASSNAME = "i-slider"; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java index 94a893b106..d1aa4c1769 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java @@ -20,14 +20,13 @@ import com.itmill.toolkit.terminal.gwt.client.UIDL; * @author IT Mill Ltd. * */ -public class ITextField extends TextBoxBase implements Paintable, +public class ITextField extends TextBoxBase implements Paintable, Field, ChangeListener, FocusListener { /** * The input node CSS classname. */ public static final String CLASSNAME = "i-textfield"; - /** * This CSS classname is added to the input node on hover. */ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextualDate.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextualDate.java index 560e02f822..29013f422f 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextualDate.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextualDate.java @@ -16,7 +16,7 @@ import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; import com.itmill.toolkit.terminal.gwt.client.Util; -public class ITextualDate extends IDateField implements Paintable, +public class ITextualDate extends IDateField implements Paintable, Field, ChangeListener, ContainerResizedListener, Focusable { private final ITextField text; @@ -38,7 +38,7 @@ public class ITextualDate extends IDateField implements Paintable, public void updateFromUIDL(UIDL uidl, ApplicationConnection client) { // remove possibly added invalid value indication - text.removeStyleName(ITextField.CLASSNAME + "-error"); + removeStyleName("i-error"); int origRes = currentResolution; super.updateFromUIDL(uidl, client); @@ -97,7 +97,7 @@ public class ITextualDate extends IDateField implements Paintable, * */ protected void buildDate() { - + removeStyleName("i-error"); // Create the initial text for the textfield String dateText; if (date != null) { @@ -114,6 +114,7 @@ public class ITextualDate extends IDateField implements Paintable, } else { text.removeStyleName("i-readonly"); } + } public void onChange(Widget sender) { @@ -123,10 +124,10 @@ public class ITextualDate extends IDateField implements Paintable, date = DateTimeFormat.getFormat(getFormatString()).parse( text.getText()); // remove possibly added invalid value indication - text.removeStyleName(ITextField.CLASSNAME + "-error"); + removeStyleName("i-error"); } catch (final Exception e) { ApplicationConnection.getConsole().log(e.getMessage()); - text.addStyleName(ITextField.CLASSNAME + "-error"); + addStyleName("i-error"); client.updateVariable(id, "lastInvalidDateString", text .getText(), false); date = null; @@ -134,7 +135,7 @@ public class ITextualDate extends IDateField implements Paintable, } else { date = null; // remove possibly added invalid value indication - text.removeStyleName(ITextField.CLASSNAME + "-error"); + removeStyleName("i-error"); } // Update variables diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextArea.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextArea.java index 2eaeed723d..f0ea0c07d8 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextArea.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextArea.java @@ -14,6 +14,7 @@ import com.google.gwt.user.client.ui.Widget; import com.itmill.toolkit.terminal.gwt.client.ApplicationConnection; import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; +import com.itmill.toolkit.terminal.gwt.client.ui.Field; /** * This class represents a basic text input field with one row. @@ -21,7 +22,7 @@ import com.itmill.toolkit.terminal.gwt.client.UIDL; * @author IT Mill Ltd. * */ -public class IRichTextArea extends Composite implements Paintable, +public class IRichTextArea extends Composite implements Paintable, Field, ChangeListener, FocusListener { /**