From 63ac2329282b227a191f418b6e11a83de57cfaa1 Mon Sep 17 00:00:00 2001 From: John Ahlroos Date: Thu, 11 Oct 2012 14:16:29 +0300 Subject: [PATCH] Fixed primary stylenames for combobox #9901 Change-Id: Id4f75b1630b621a0c81b405a0cab2c9262b93549 --- .../client/ui/combobox/VFilterSelect.java | 107 ++++++++------ .../combobox/ComboboxPrimaryStyleName.html | 131 ++++++++++++++++++ .../combobox/ComboboxPrimaryStyleNames.java | 49 +++++++ 3 files changed, 245 insertions(+), 42 deletions(-) create mode 100644 uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleName.html create mode 100644 uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleNames.java diff --git a/client/src/com/vaadin/client/ui/combobox/VFilterSelect.java b/client/src/com/vaadin/client/ui/combobox/VFilterSelect.java index 3e8cf396d7..4ce651cde0 100644 --- a/client/src/com/vaadin/client/ui/combobox/VFilterSelect.java +++ b/client/src/com/vaadin/client/ui/combobox/VFilterSelect.java @@ -26,6 +26,7 @@ import java.util.Set; import com.google.gwt.core.client.Scheduler.ScheduledCommand; import com.google.gwt.dom.client.Style; +import com.google.gwt.dom.client.Style.Display; import com.google.gwt.dom.client.Style.Unit; import com.google.gwt.event.dom.client.BlurEvent; import com.google.gwt.event.dom.client.BlurHandler; @@ -179,7 +180,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, public class SuggestionPopup extends VOverlay implements PositionCallback, CloseHandler { - private static final String Z_INDEX = "30000"; + private static final int Z_INDEX = 30000; protected final SuggestionMenu menu; @@ -202,19 +203,22 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, super(true, false, true); menu = new SuggestionMenu(); setWidget(menu); - setStyleName(CLASSNAME + "-suggestpopup"); - DOM.setStyleAttribute(getElement(), "zIndex", Z_INDEX); + + getElement().getStyle().setZIndex(Z_INDEX); final Element root = getContainerElement(); - DOM.setInnerHTML(up, "Prev"); + up.setInnerHTML("Prev"); DOM.sinkEvents(up, Event.ONCLICK); - DOM.setInnerHTML(down, "Next"); + + down.setInnerHTML("Next"); DOM.sinkEvents(down, Event.ONCLICK); - DOM.insertChild(root, up, 0); - DOM.appendChild(root, down); - DOM.appendChild(root, status); - DOM.setElementProperty(status, "className", CLASSNAME + "-status"); + + root.insertFirst(up); + root.appendChild(down); + root.appendChild(status); + + DOM.sinkEvents(root, Event.ONMOUSEDOWN | Event.ONMOUSEWHEEL); addCloseHandler(this); } @@ -234,8 +238,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, int currentPage, int totalSuggestions) { // Add TT anchor point - DOM.setElementProperty(getElement(), "id", - "VAADIN_COMBOBOX_OPTIONLIST"); + getElement().setId("VAADIN_COMBOBOX_OPTIONLIST"); menu.setSuggestions(currentSuggestions); final int x = VFilterSelect.this.getAbsoluteLeft(); @@ -253,10 +256,10 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, final int matches = totalSuggestions - nullOffset; if (last > 0) { // nullsel not counted, as requested by user - DOM.setInnerText(status, (matches == 0 ? 0 : first) + "-" - + last + "/" + matches); + status.setInnerText((matches == 0 ? 0 : first) + "-" + last + + "/" + matches); } else { - DOM.setInnerText(status, ""); + status.setInnerText(""); } // We don't need to show arrows or statusbar if there is only one // page @@ -270,8 +273,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, // clear previously fixed width menu.setWidth(""); - DOM.setStyleAttribute(DOM.getFirstChild(menu.getElement()), - "width", ""); + menu.getElement().getFirstChildElement().getStyle().clearWidth(); setPopupPositionAndShow(this); @@ -285,11 +287,11 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, private void setNextButtonActive(boolean active) { if (active) { DOM.sinkEvents(down, Event.ONCLICK); - DOM.setElementProperty(down, "className", CLASSNAME + down.setClassName(VFilterSelect.this.getStylePrimaryName() + "-nextpage"); } else { DOM.sinkEvents(down, 0); - DOM.setElementProperty(down, "className", CLASSNAME + down.setClassName(VFilterSelect.this.getStylePrimaryName() + "-nextpage-off"); } } @@ -302,10 +304,11 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, private void setPrevButtonActive(boolean active) { if (active) { DOM.sinkEvents(up, Event.ONCLICK); - DOM.setElementProperty(up, "className", CLASSNAME + "-prevpage"); + up.setClassName(VFilterSelect.this.getStylePrimaryName() + + "-prevpage"); } else { DOM.sinkEvents(up, 0); - DOM.setElementProperty(up, "className", CLASSNAME + up.setClassName(VFilterSelect.this.getStylePrimaryName() + "-prevpage-off"); } @@ -452,13 +455,13 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, return; } if (paging) { - DOM.setStyleAttribute(down, "display", ""); - DOM.setStyleAttribute(up, "display", ""); - DOM.setStyleAttribute(status, "display", ""); + down.getStyle().clearDisplay(); + up.getStyle().clearDisplay(); + status.getStyle().clearDisplay(); } else { - DOM.setStyleAttribute(down, "display", "none"); - DOM.setStyleAttribute(up, "display", "none"); - DOM.setStyleAttribute(status, "display", "none"); + down.getStyle().setDisplay(Display.NONE); + up.getStyle().setDisplay(Display.NONE); + status.getStyle().setDisplay(Display.NONE); } isPagingEnabled = paging; } @@ -486,8 +489,9 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, offsetHeight = getOffsetHeight(); final int desiredWidth = getMainWidth(); - int naturalMenuWidth = DOM.getElementPropertyInt( - DOM.getFirstChild(menu.getElement()), "offsetWidth"); + Element menuFirstChild = menu.getElement().getFirstChildElement() + .cast(); + int naturalMenuWidth = menuFirstChild.getOffsetWidth(); if (popupOuterPadding == -1) { popupOuterPadding = Util.measureHorizontalPaddingAndBorder( @@ -496,8 +500,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, if (naturalMenuWidth < desiredWidth) { menu.setWidth((desiredWidth - popupOuterPadding) + "px"); - DOM.setStyleAttribute(DOM.getFirstChild(menu.getElement()), - "width", "100%"); + menuFirstChild.getStyle().setWidth(100, Unit.PCT); naturalMenuWidth = desiredWidth; } @@ -507,8 +510,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, * element. Otherwise it will be 100% wide */ int rootWidth = naturalMenuWidth - popupOuterPadding; - DOM.setStyleAttribute(getContainerElement(), "width", rootWidth - + "px"); + getContainerElement().getStyle().setWidth(rootWidth, Unit.PX); } if (offsetHeight + getPopupTop() > Window.getClientHeight() @@ -531,8 +533,7 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, } // fetch real width (mac FF bugs here due GWT popups overflow:auto ) - offsetWidth = DOM.getElementPropertyInt( - DOM.getFirstChild(menu.getElement()), "offsetWidth"); + offsetWidth = menuFirstChild.getOffsetWidth(); if (offsetWidth + getPopupLeft() > Window.getClientWidth() + Window.getScrollLeft()) { left = VFilterSelect.this.getAbsoluteLeft() @@ -581,7 +582,12 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, * shared state of the combo box */ public void updateStyleNames(UIDL uidl, ComponentState componentState) { - setStyleName(CLASSNAME + "-suggestpopup"); + setStyleName(VFilterSelect.this.getStylePrimaryName() + + "-suggestpopup"); + menu.setStyleName(VFilterSelect.this.getStylePrimaryName() + + "-suggestmenu"); + status.setClassName(VFilterSelect.this.getStylePrimaryName() + + "-status"); if (ComponentStateUtil.hasStyles(componentState)) { for (String style : componentState.styles) { if (!"".equals(style)) { @@ -614,9 +620,8 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, if (suggestionPopup.isVisible() && suggestionPopup.isAttached()) { setWidth(""); - DOM.setStyleAttribute( - DOM.getFirstChild(getElement()), "width", - ""); + getElement().getFirstChildElement().getStyle() + .clearWidth(); suggestionPopup .setPopupPositionAndShow(suggestionPopup); } @@ -629,7 +634,6 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, */ SuggestionMenu() { super(true); - setStyleName(CLASSNAME + "-suggestmenu"); addDomHandler(this, LoadEvent.getType()); } @@ -981,15 +985,34 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler, panel.add(tb); panel.add(popupOpener); initWidget(panel); - setStyleName(CLASSNAME); tb.addKeyDownHandler(this); tb.addKeyUpHandler(this); - tb.setStyleName(CLASSNAME + "-input"); + tb.addFocusHandler(this); tb.addBlurHandler(this); tb.addClickHandler(this); - popupOpener.setStyleName(CLASSNAME + "-button"); + popupOpener.addClickHandler(this); + + setStyleName(CLASSNAME); + } + + @Override + public void setStyleName(String style) { + super.setStyleName(style); + updateStyleNames(); + } + + @Override + public void setStylePrimaryName(String style) { + super.setStylePrimaryName(style); + updateStyleNames(); + } + + protected void updateStyleNames() { + tb.setStyleName(getStylePrimaryName() + "-input"); + popupOpener.setStyleName(getStylePrimaryName() + "-button"); + suggestionPopup.setStyleName(getStylePrimaryName() + "-suggestpopup"); } /** diff --git a/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleName.html b/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleName.html new file mode 100644 index 0000000000..649dda72f8 --- /dev/null +++ b/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleName.html @@ -0,0 +1,131 @@ + + + + + + +New Test + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
New Test
open/run/com.vaadin.tests.components.combobox.ComboboxPrimaryStyleNames?restartApplication
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]my-combobox
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]/domChild[0]my-combobox-input
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]/domChild[1]my-combobox-button
mouseClickvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]#textbox98,8
pressSpecialKeyvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]#textboxdown
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']my-combobox-suggestpopup
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[1]my-combobox-prevpage-off
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[2]my-combobox-suggestmenu
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[3]my-combobox-nextpage-off
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[4]my-combobox-status
mouseClickvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]#textbox98,8
clickvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VButton[0]/domChild[0]/domChild[0]
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]my-second-combobox
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]/domChild[0]my-second-combobox-input
assertCSSClassvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]/domChild[1]my-second-combobox-button
mouseClickvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]#textbox98,8
pressSpecialKeyvaadin=runcomvaadintestscomponentscomboboxComboboxPrimaryStyleNames::/VVerticalLayout[0]/VOrderedLayout$Slot[1]/VVerticalLayout[0]/VOrderedLayout$Slot[0]/VFilterSelect[0]#textboxdown
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']my-second-combobox-suggestpopup
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[1]my-second-combobox-prevpage-off
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[2]my-second-combobox-suggestmenu
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[3]my-second-combobox-nextpage-off
assertCSSClass//div[@id='VAADIN_COMBOBOX_OPTIONLIST']/div/div[4]my-second-combobox-status
+ + diff --git a/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleNames.java b/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleNames.java new file mode 100644 index 0000000000..375b417407 --- /dev/null +++ b/uitest/src/com/vaadin/tests/components/combobox/ComboboxPrimaryStyleNames.java @@ -0,0 +1,49 @@ +package com.vaadin.tests.components.combobox; + +import com.vaadin.tests.components.TestBase; +import com.vaadin.ui.Button; +import com.vaadin.ui.Button.ClickEvent; +import com.vaadin.ui.ComboBox; + +public class ComboboxPrimaryStyleNames extends TestBase { + + @Override + protected void setup() { + final ComboBox box = new ComboBox(); + box.setImmediate(true); + box.addContainerProperty("caption", String.class, ""); + box.setItemCaptionPropertyId("caption"); + box.setPrimaryStyleName("my-combobox"); + + addItem(box, "Value 1"); + addItem(box, "Value 2"); + addItem(box, "Value 3"); + addItem(box, "Value 4"); + + addComponent(box); + addComponent(new Button("Set primary style", + new Button.ClickListener() { + @Override + public void buttonClick(ClickEvent event) { + box.setPrimaryStyleName("my-second-combobox"); + } + })); + + } + + @Override + protected String getDescription() { + return "Combobox should work with primary stylenames both initially and dynamically"; + } + + @Override + protected Integer getTicketNumber() { + return 9901; + } + + private void addItem(ComboBox s, String string) { + Object id = s.addItem(); + s.getItem(id).getItemProperty("caption").setValue(string); + } + +} -- 2.39.5