From 5f2c40c6251f01ad4b04bbaaf348afb437750ef3 Mon Sep 17 00:00:00 2001 From: Jouni Koivuviita Date: Sat, 16 Jun 2007 08:25:22 +0000 Subject: [PATCH] ISelect component now supports "twincol" style as well. Tweaks to ITextfield (setColumns, setRows) and IButton (classname "i-button"). svn changeset:1755/svn branch:trunk --- .../gwt/client/DefaultWidgetFactory.java | 3 + .../terminal/gwt/client/ui/IButton.java | 6 +- .../terminal/gwt/client/ui/IOptionGroup.java | 12 +- .../gwt/client/ui/IOptionGroupBase.java | 34 +++-- .../terminal/gwt/client/ui/ISelect.java | 13 +- .../terminal/gwt/client/ui/ITextArea.java | 2 +- .../terminal/gwt/client/ui/ITextField.java | 31 ++++- .../gwt/client/ui/ITwinColSelect.java | 116 ++++++++++++++++++ .../component-themes/select/css/select.css | 39 ++++++ .../textfield/css/textfield.css | 1 + 10 files changed, 231 insertions(+), 26 deletions(-) create mode 100644 src/com/itmill/toolkit/terminal/gwt/client/ui/ITwinColSelect.java diff --git a/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java b/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java index 08a58fa62a..6a3043c2cc 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/DefaultWidgetFactory.java @@ -18,6 +18,7 @@ import com.itmill.toolkit.terminal.gwt.client.ui.ITabsheet; import com.itmill.toolkit.terminal.gwt.client.ui.ITextArea; import com.itmill.toolkit.terminal.gwt.client.ui.ITextField; import com.itmill.toolkit.terminal.gwt.client.ui.ITree; +import com.itmill.toolkit.terminal.gwt.client.ui.ITwinColSelect; import com.itmill.toolkit.terminal.gwt.client.ui.IUnknownComponent; import com.itmill.toolkit.terminal.gwt.client.ui.IVerticalLayout; import com.itmill.toolkit.terminal.gwt.client.ui.IWindow; @@ -50,6 +51,8 @@ public class DefaultWidgetFactory implements WidgetFactory { if ("select".equals(tag)) { if("optiongroup".equals(uidl.getStringAttribute("style"))) return new IOptionGroup(); + else if("twincol".equals(uidl.getStringAttribute("style"))) + return new ITwinColSelect(); return new ISelect(); } if ("panel".equals(tag) || "component".equals(tag)) diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IButton.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IButton.java index 8273a75366..7868f9e63c 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IButton.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IButton.java @@ -8,12 +8,15 @@ import com.itmill.toolkit.terminal.gwt.client.Paintable; import com.itmill.toolkit.terminal.gwt.client.UIDL; public class IButton extends Button implements Paintable { + + private static final String CLASSNAME = "i-button"; String id; Client client; public IButton() { + setStyleName(CLASSNAME); addClickListener(new ClickListener() { public void onClick(Widget sender) { @@ -26,7 +29,8 @@ public class IButton extends Button implements Paintable { public void updateFromUIDL(UIDL uidl, Client client) { - // Ensure correct implementation + // Ensure correct implementation, + // but don't let container manage caption etc. if (client.updateComponent(this, uidl, false)) return; diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroup.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroup.java index b85368ff8f..64d59a6d41 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroup.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroup.java @@ -1,6 +1,8 @@ package com.itmill.toolkit.terminal.gwt.client.ui; +import java.util.HashMap; import java.util.Iterator; +import java.util.Map; import com.google.gwt.user.client.ui.CheckBox; import com.google.gwt.user.client.ui.Panel; @@ -14,9 +16,12 @@ public class IOptionGroup extends IOptionGroupBase { private Panel panel; + private Map optionsToKeys; + public IOptionGroup() { super(CLASSNAME); panel = (Panel) optionsContainer; + optionsToKeys = new HashMap(); } /* @@ -42,13 +47,6 @@ public class IOptionGroup extends IOptionGroupBase { } } - protected Object getSelectedItem() { - if(getSelectedItems().length > 0) - return getSelectedItems()[0]; - else - return null; - } - protected Object[] getSelectedItems() { return selectedKeys.toArray(); } 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 571a803e96..dad379e166 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOptionGroupBase.java @@ -1,20 +1,19 @@ package com.itmill.toolkit.terminal.gwt.client.ui; -import java.util.HashMap; -import java.util.Map; import java.util.Set; import com.google.gwt.user.client.ui.ChangeListener; import com.google.gwt.user.client.ui.ClickListener; import com.google.gwt.user.client.ui.Composite; import com.google.gwt.user.client.ui.FlowPanel; +import com.google.gwt.user.client.ui.KeyboardListener; import com.google.gwt.user.client.ui.Panel; 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; -abstract class IOptionGroupBase extends Composite implements Paintable, ClickListener, ChangeListener { +abstract class IOptionGroupBase extends Composite implements Paintable, ClickListener, ChangeListener, KeyboardListener { static final String CLASSNAME_OPTION = "i-select-option"; @@ -24,8 +23,6 @@ abstract class IOptionGroupBase extends Composite implements Paintable, ClickLis protected boolean immediate; - protected Map optionsToKeys; - protected Set selectedKeys; protected boolean multiselect; @@ -57,7 +54,6 @@ abstract class IOptionGroupBase extends Composite implements Paintable, ClickLis container.setStyleName(classname); immediate = false; multiselect = false; - optionsToKeys = new HashMap(); } /* Call this if you wish to specify your own container @@ -92,6 +88,8 @@ abstract class IOptionGroupBase extends Composite implements Paintable, ClickLis newItemButton.setText("+"); newItemButton.addClickListener(this); newItemField = new ITextField(); + newItemField.addKeyboardListener(this); + newItemField.setColumns(16); } newItemField.setEnabled(!disabled && !readonly); newItemButton.setEnabled(!disabled && !readonly); @@ -108,8 +106,10 @@ abstract class IOptionGroupBase extends Composite implements Paintable, ClickLis } public void onClick(Widget sender) { - if(sender == newItemButton && !newItemField.getText().equals("")) + if(sender == newItemButton && !newItemField.getText().equals("")) { client.updateVariable(id, "newitem", newItemField.getText(), true); + newItemField.setText(""); + } } public void onChange(Widget sender) { @@ -120,10 +120,28 @@ abstract class IOptionGroupBase extends Composite implements Paintable, ClickLis } } + public void onKeyPress(Widget sender, char keyCode, int modifiers) { + if(sender == newItemField && keyCode==KeyboardListener.KEY_ENTER) + newItemButton.click(); + } + + public void onKeyUp(Widget sender, char keyCode, int modifiers) { + // Ignore, subclasses may override + } + + public void onKeyDown(Widget sender, char keyCode, int modifiers) { + // Ignore, subclasses may override + } + protected abstract void buildOptions(UIDL uidl); protected abstract Object[] getSelectedItems(); - protected abstract Object getSelectedItem(); + protected Object getSelectedItem() { + if(getSelectedItems().length > 0) + return getSelectedItems()[0]; + else + return null; + } } diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ISelect.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ISelect.java index 18a398dba2..4e8228a6e2 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ISelect.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ISelect.java @@ -11,16 +11,20 @@ public class ISelect extends IOptionGroupBase { private static final String CLASSNAME = "i-select"; + private static final int VISIBLE_COUNT = 10; + private ListBox select; public ISelect() { super(new ListBox(), CLASSNAME); select = (ListBox) optionsContainer; select.addChangeListener(this); + select.setStyleName(CLASSNAME+"-select"); } protected void buildOptions(UIDL uidl) { select.setMultipleSelect(multiselect); + if(multiselect) select.setVisibleItemCount(VISIBLE_COUNT); select.setEnabled(!disabled && !readonly); select.clear(); for (Iterator i = uidl.getChildIterator(); i.hasNext();) { @@ -33,20 +37,13 @@ public class ISelect extends IOptionGroupBase { protected Object[] getSelectedItems() { Vector selectedItemKeys = new Vector(); - for(int i = 0; i < select.getItemCount();i++) { + for(int i = 0; i < select.getItemCount(); i++) { if(select.isItemSelected(i)) selectedItemKeys.add(select.getValue(i)); } return selectedItemKeys.toArray(); } - protected Object getSelectedItem() { - if(getSelectedItems().length > 0) - return getSelectedItems()[0]; - else - return null; - } - public void onChange(Widget sender) { if(select.isMultipleSelect()) client.updateVariable(id, "selected", getSelectedItems(), immediate); diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextArea.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextArea.java index 66e0b3a4b6..ca7aef3a09 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextArea.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextArea.java @@ -21,7 +21,7 @@ public class ITextArea extends ITextField { super.updateFromUIDL(uidl, client); if(uidl.hasAttribute("rows")) - setHeight(uidl.getStringAttribute("rows")+"em"); + setRows(new Integer(uidl.getStringAttribute("rows")).intValue()); } } 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 711fb3da06..abdab4a21d 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITextField.java @@ -56,7 +56,7 @@ public class ITextField extends TextBoxBase implements immediate = uidl.getBooleanAttribute("immediate"); if(uidl.hasAttribute("cols")) - setWidth(uidl.getStringAttribute("cols")+"em"); + setColumns(new Integer(uidl.getStringAttribute("cols")).intValue()); setText(uidl.getStringVariable("text")); @@ -75,4 +75,33 @@ public class ITextField extends TextBoxBase implements public void onLostFocus(Widget sender) { removeStyleName(CLASSNAME_FOCUS); } + + public void setColumns(int columns) { + setColumns(getElement(), columns); + } + + public void setRows(int rows) { + setRows(getElement(), rows); + } + + private native void setColumns(Element e, int c) /*-{ + try { + switch(e.tagName.toLowerCase()) { + case "input": + e.size = c; + break; + case "textarea": + e.cols = c; + break; + default:; + } + } catch (e) {} + }-*/; + + private native void setRows(Element e, int r) /*-{ + try { + if(e.tagName.toLowerCase() == "textarea") + e.rows = r; + } catch (e) {} +}-*/; } diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITwinColSelect.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITwinColSelect.java new file mode 100644 index 0000000000..2b9e2f3f44 --- /dev/null +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITwinColSelect.java @@ -0,0 +1,116 @@ +package com.itmill.toolkit.terminal.gwt.client.ui; + +import java.util.Iterator; +import java.util.Vector; + +import com.google.gwt.user.client.ui.FlowPanel; +import com.google.gwt.user.client.ui.HTML; +import com.google.gwt.user.client.ui.ListBox; +import com.google.gwt.user.client.ui.Panel; +import com.google.gwt.user.client.ui.Widget; +import com.itmill.toolkit.terminal.gwt.client.UIDL; + +public class ITwinColSelect extends IOptionGroupBase { + + private static final String CLASSNAME = "i-select-twincol"; + + private static final int VISIBLE_COUNT = 10; + + private ListBox options; + + private ListBox selections; + + private IButton add; + + private IButton remove; + + public ITwinColSelect() { + super(CLASSNAME); + options = new ListBox(); + selections = new ListBox(); + options.setVisibleItemCount(VISIBLE_COUNT); + selections.setVisibleItemCount(VISIBLE_COUNT); + options.setStyleName(CLASSNAME+"-options"); + selections.setStyleName(CLASSNAME+"-selections"); + Panel buttons = new FlowPanel(); + buttons.setStyleName(CLASSNAME+"-buttons"); + add = new IButton(); + remove = new IButton(); + add.setText(">>"); + remove.setText("<<"); + add.addClickListener(this); + remove.addClickListener(this); + Panel p = ((Panel)optionsContainer); + p.add(options); + buttons.add(add); + HTML br = new HTML(" "); + br.setStyleName(CLASSNAME+"-deco"); + buttons.add(br); + buttons.add(remove); + p.add(buttons); + p.add(selections); + } + + protected void buildOptions(UIDL uidl) { + boolean enabled = !disabled && !readonly; + options.setMultipleSelect(multiselect); + selections.setMultipleSelect(multiselect); + options.setEnabled(enabled); + selections.setEnabled(enabled); + add.setEnabled(enabled); + remove.setEnabled(enabled); + options.clear(); + selections.clear(); + for (Iterator i = uidl.getChildIterator(); i.hasNext();) { + UIDL optionUidl = (UIDL)i.next(); + if(optionUidl.hasAttribute("selected")) { + selections.addItem(optionUidl.getStringAttribute("caption"), optionUidl.getStringAttribute("key")); + } else + options.addItem(optionUidl.getStringAttribute("caption"), optionUidl.getStringAttribute("key")); + } + } + + protected Object[] getSelectedItems() { + Vector selectedItemKeys = new Vector(); + for(int i = 0; i < selections.getItemCount(); i++) { + selectedItemKeys.add(selections.getValue(i)); + } + return selectedItemKeys.toArray(); + } + + private String[] getItemsToAdd() { + String[] selectedIndexes = new String[options.getItemCount()]; + for(int i = 0; i < options.getItemCount(); i++) { + if(options.isItemSelected(i)) + selectedIndexes[i] = options.getValue(i); + } + return selectedIndexes; + } + + private String[] getItemsToRemove() { + String[] selectedIndexes = new String[selections.getItemCount()]; + for(int i = 0; i < selections.getItemCount(); i++) { + if(selections.isItemSelected(i)) + selectedIndexes[i] = selections.getValue(i); + } + return selectedIndexes; + } + + public void onClick(Widget sender) { + super.onClick(sender); + if(sender == add) { + String[] sel = getItemsToAdd(); + for(int i=0; i < sel.length; i++) { + if(sel[i]!=null) selectedKeys.add(sel[i]); + } + client.updateVariable(id, "selected", selectedKeys.toArray(), true); // Immediate + } else if(sender == remove) { + String[] sel = getItemsToRemove(); + for(int i=0; i < sel.length; i++) { + if(sel[i]!=null) selectedKeys.remove(sel[i]); + } + client.updateVariable(id, "selected", selectedKeys.toArray(), true); // Immediate + } + } + +} diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/select/css/select.css b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/select/css/select.css index 710bfa1de5..c53569dcf2 100644 --- a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/select/css/select.css +++ b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/select/css/select.css @@ -12,4 +12,43 @@ .i-select-optiongroup .i-select-option { display: block; +} + +.i-select-select { + border: 1px solid #b6b6b6; + border-top-color: #9d9d9d; + border-bottom-color: #d6d6d6; + border-right-color: #d6d6d6; + display: block; +} + +/* Twincol style */ +.i-select-twincol-options { + float: left; +} + +.i-select-twincol-buttons { + float: left; + width: 40px; + text-align: center; +} + +.i-select-twincol-buttons .i-select-twincol-deco { + display: inline; /* Needed to push the two buttons in stack */ +} + +.i-select-twincol .i-textfield { + display: block; + float: left; + clear: left; +} + +.i-select-twincol .i-button { + display: block; + float: left; +} + +.i-select-twincol-buttons .i-button { + display: inline; + float: none; } \ No newline at end of file diff --git a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/textfield/css/textfield.css b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/textfield/css/textfield.css index c1cf6d8334..45f2b8dde3 100644 --- a/src/com/itmill/toolkit/terminal/gwt/public/component-themes/textfield/css/textfield.css +++ b/src/com/itmill/toolkit/terminal/gwt/public/component-themes/textfield/css/textfield.css @@ -4,6 +4,7 @@ background: #fff url(../img/bg.png) repeat-x; padding: 2px; border: 1px solid #b6b6b6; + border-top-color: #9d9d9d; border-bottom-color: #d6d6d6; border-right-color: #d6d6d6; margin: 0; -- 2.39.5