Author: abelevich Date: 2010-10-21 13:44:09 -0400 (Thu, 21 Oct 2010) New Revision: 19646 Modified: trunk/ui/input/api/src/main/java/org/richfaces/component/InplaceComponent.java trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceInput.java trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceSelect.java trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractSelect.java trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputRendererBase.java trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectRendererBase.java trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectHelper.java trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectRendererBase.java trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js trunk/ui/input/ui/src/main/templates/inplaceSelect.template.xml trunk/ui/input/ui/src/main/templates/select.template.xml Log: fix renderers, add defaultOptions, fix client filtering for the select Modified: trunk/ui/input/api/src/main/java/org/richfaces/component/InplaceComponent.java =================================================================== --- trunk/ui/input/api/src/main/java/org/richfaces/component/InplaceComponent.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/api/src/main/java/org/richfaces/component/InplaceComponent.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -38,5 +38,17 @@ public boolean isSaveOnBlur(); public InplaceState getState(); + + public String getReadyStateCss(); + public String getEditStateCss(); + + public String getChangedStateCss(); + + public String getDisableStateCss(); + + public String getEditCss(); + + public String getNoneCss(); + } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceInput.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceInput.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceInput.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -67,6 +67,24 @@ @Attribute public abstract String getTabIndex(); + @Attribute + public abstract String getReadyStateCss(); + + @Attribute + public abstract String getEditStateCss(); + + @Attribute + public abstract String getChangedStateCss(); + + @Attribute + public abstract String getDisableStateCss(); + + @Attribute + public abstract String getEditCss(); + + @Attribute + public abstract String getNoneCss(); + @Attribute(events=@EventName("blur")) public abstract String getOnblur(); Modified: trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceSelect.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceSelect.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractInplaceSelect.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -57,23 +57,24 @@ public abstract boolean isSaveOnBlur(); @Attribute(defaultValue="false") - public abstract boolean isShowControls(); + public abstract boolean isShowControls(); - @Attribute(defaultValue="click") - public abstract String getEditEvent(); - @Override - @Attribute(defaultValue="rf-is-opt") + @Attribute public abstract String getItemCss(); @Override - @Attribute(defaultValue="rf-is-sel") + @Attribute public abstract String getSelectItemCss(); @Override - @Attribute(defaultValue="rf-is-lst-cord") + @Attribute public abstract String getListCss(); + + @Attribute(defaultValue="click") + public abstract String getEditEvent(); + @Attribute(events=@EventName("inputclick")) public abstract String getOninputclick(); @@ -109,5 +110,11 @@ @Attribute(events=@EventName("inputblur")) public abstract String getOninputblur(); + + @Attribute(events=@EventName("inputselect")) + public abstract String getOninputselect(); + + @Attribute(events=@EventName("inputchange")) + public abstract String getOnchange(); } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractSelect.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractSelect.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/component/AbstractSelect.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -30,7 +30,6 @@ import org.richfaces.cdk.annotations.JsfRenderer; import org.richfaces.cdk.annotations.Tag; - /** * @author abelevich * @@ -57,9 +56,24 @@ @Attribute(defaultValue="true") public abstract boolean isShowButton(); + @Attribute(defaultValue="false") + public abstract boolean isEnableManualInput(); + + @Attribute(defaultValue="true") + public abstract boolean isSelectFirst(); + @Attribute public abstract String getDefaultLabel(); + @Attribute + public abstract String getItemCss(); + + @Attribute + public abstract String getSelectItemCss(); + + @Attribute + public abstract String getListCss(); + @Attribute(events=@EventName("blur")) public abstract String getOnblur(); @@ -131,16 +145,5 @@ @Attribute(events=@EventName("change")) public abstract String getOnchange(); - //TODO: add list event attributes - - @Attribute(defaultValue = "rf-sel-opt") - public abstract String getItemCss(); - - //TODO: rename css class "rf-sel-opt-sel" - @Attribute(defaultValue = "rf-sel-sel") - public abstract String getSelectItemCss(); - - @Attribute(defaultValue = "rf-sel-lst-cord") - public abstract String getListCss(); - + } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputRendererBase.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputRendererBase.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputRendererBase.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -84,8 +84,12 @@ public static final String OPTIONS_INITIAL_VALUE = "initialValue"; public static final String OPTIONS_SAVE_ON_BLUR = "saveOnBlur"; - - protected static final Map<String, ComponentAttribute> INPLACEINPUT_HANDLER_ATTRIBUTES = Collections + + + + + //TODO: anton - move to RenderUtils (we use the same in the calendar base renderer) ? + protected static final Map<String, ComponentAttribute> INPLACE_INPUT_HANDLER_ATTRIBUTES = Collections .unmodifiableMap(ComponentAttribute.createMap( new ComponentAttribute(HtmlConstants.ONCLICK_ATTRIBUTE) .setEventNames("inputclick") @@ -133,7 +137,7 @@ public void renderInputHandlers(FacesContext facesContext, UIComponent component) throws IOException { RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, - component, INPLACEINPUT_HANDLER_ATTRIBUTES); + component, INPLACE_INPUT_HANDLER_ATTRIBUTES); } public InplaceState getInplaceState(UIComponent component) { @@ -158,20 +162,20 @@ return null; } - public String getStateStyleClass(UIComponent component, - InplaceState inplaceState) { - String style = getReadyStateCss(); + public String getStateStyleClass(UIComponent component, InplaceState inplaceState) { + InplaceComponent inplaceComponent = (InplaceComponent)component; + String style = getReadyStateCss(inplaceComponent); switch (inplaceState) { case edit: - style = HtmlUtil.concatClasses(style, getEditStateCss()); + style = HtmlUtil.concatClasses(style, getEditStateCss(inplaceComponent)); break; case changed: - style = HtmlUtil.concatClasses(style, getChangedStateCss()); + style = HtmlUtil.concatClasses(style, getChangedStateCss(inplaceComponent)); break; case disable: - style = getDisableStateCss(); + style = getDisableStateCss(inplaceComponent); break; default: @@ -185,9 +189,9 @@ return (InplaceState.disable == currentState); } - public String getEditStyleClass(UIComponent component, - InplaceState inplaceState) { - return (InplaceState.edit != inplaceState) ? HtmlUtil.concatClasses(getEditCss(), getNoneCss()) : getEditCss(); + public String getEditStyleClass(UIComponent component, InplaceState inplaceState) { + InplaceComponent inplaceComponent = (InplaceComponent)component; + return (InplaceState.edit != inplaceState) ? HtmlUtil.concatClasses(getEditCss(inplaceComponent), getNoneCss(inplaceComponent)) : getEditCss(inplaceComponent); } public void buildScript(ResponseWriter writer, FacesContext facesContext, @@ -214,25 +218,43 @@ private Map<String, Object> createInplaceComponentOptions(String clientId, InplaceComponent inplaceComponent) { Map<String, Object> options = new HashMap<String, Object>(); - options.put(OPTIONS_EDIT_EVENT, inplaceComponent.getEditEvent()); - options.put(OPTIONS_STATE, inplaceComponent.getState()); - options.put(OPTIONS_NONE_CSS, getNoneCss()); - options.put(OPTIONS_CHANGED_CSS, getChangedStateCss()); - options.put(OPTIONS_EDIT_CSS, getEditStateCss()); - options.put(OPTIONS_EDIT_CONTAINER, clientId + "Edit"); - options.put(OPTIONS_INPUT, clientId + "Input"); - options.put(OPTIONS_LABEL, clientId + "Label"); - options.put(OPTIONS_FOCUS, clientId + "Focus"); - options.put(OPTIONS_DEFAULT_LABEL, inplaceComponent.getDefaultLabel()); - options.put(OPTIONS_SAVE_ON_BLUR, inplaceComponent.isSaveOnBlur()); + + if(!"click".equals(inplaceComponent.getEditEvent())){ + options.put(OPTIONS_EDIT_EVENT, inplaceComponent.getEditEvent()); + } + + if(!(InplaceState.ready == inplaceComponent.getState())) { + options.put(OPTIONS_STATE, inplaceComponent.getState()); + } + + String css = inplaceComponent.getNoneCss(); + if(css != null && css.trim().length() > 0) { + options.put(OPTIONS_NONE_CSS, getNoneCss(inplaceComponent)); + } - boolean showControls = inplaceComponent.isShowControls(); - - options.put(OPTIONS_SHOWCONTROLS, showControls); - if (showControls) { - options.put(OPTIONS_BUTTON_OK, clientId + "Okbtn"); - options.put(OPTIONS_BUTTON_CANCEL, clientId + "Cancelbtn"); + css = inplaceComponent.getChangedStateCss(); + if(css != null && css.trim().length() > 0) { + options.put(OPTIONS_CHANGED_CSS, getChangedStateCss(inplaceComponent)); + } + + css = inplaceComponent.getEditStateCss(); + if(css != null && css.trim().length() > 0) { + options.put(OPTIONS_EDIT_CSS, getEditStateCss(inplaceComponent)); } + + String label = inplaceComponent.getDefaultLabel(); + if(label != null && label.trim().length() > 0) { + options.put(OPTIONS_DEFAULT_LABEL, inplaceComponent.getDefaultLabel()); + } + + if(!inplaceComponent.isSaveOnBlur()) { + options.put(OPTIONS_SAVE_ON_BLUR, inplaceComponent.isSaveOnBlur()); + } + + if(inplaceComponent.isShowControls()) { + options.put(OPTIONS_SHOWCONTROLS, inplaceComponent.isShowControls()); + } + return options; } @@ -241,27 +263,33 @@ // override this method if you need additional options } - public String getReadyStateCss() { - return "rf-ii-d-s"; + public String getReadyStateCss(InplaceComponent component) { + String css = component.getReadyStateCss(); + return HtmlUtil.concatClasses("rf-ii-d-s", css); } - public String getEditStateCss() { - return "rf-ii-e-s"; + public String getEditStateCss(InplaceComponent component) { + String css = component.getEditStateCss(); + return HtmlUtil.concatClasses("rf-ii-e-s", css); } - public String getChangedStateCss() { - return "rf-ii-c-s"; + public String getChangedStateCss(InplaceComponent component) { + String css = component.getChangedStateCss(); + return HtmlUtil.concatClasses("rf-ii-c-s", css); } - public String getDisableStateCss() { - return "rf-ii-dis-s"; + public String getDisableStateCss(InplaceComponent component) { + String css = component.getDisableStateCss(); + return HtmlUtil.concatClasses("rf-ii-dis-s", css); } - - public String getEditCss() { - return "rf-ii-edit"; + + public String getEditCss(InplaceComponent component) { + String css = component.getEditCss(); + return HtmlUtil.concatClasses("rf-ii-edit", css); } - public String getNoneCss() { - return "rf-ii-none"; + public String getNoneCss(InplaceComponent component) { + String css = component.getNoneCss(); + return HtmlUtil.concatClasses("rf-ii-none", css); } } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectRendererBase.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectRendererBase.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectRendererBase.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -32,6 +32,9 @@ import javax.faces.context.FacesContext; import org.richfaces.component.AbstractInplaceSelect; +import org.richfaces.component.AbstractSelect; +import org.richfaces.component.InplaceComponent; +import org.richfaces.component.util.HtmlUtil; /** * @author Anton Belevich @@ -41,7 +44,6 @@ @ResourceDependencies({ @ResourceDependency(library = "javax.faces", name = "jsf.js"), @ResourceDependency(name = "jquery.js"), - @ResourceDependency(name = "jquery.position.js"), @ResourceDependency(name = "richfaces.js"), @ResourceDependency(name = "jquery.position.js"), @ResourceDependency(name = "richfaces-event.js"), @@ -57,7 +59,14 @@ public class InplaceSelectRendererBase extends InplaceInputRendererBase { public static final String OPTIONS_VISIBLE = "visible"; + + public static final String ITEM_CSS = "rf-is-opt"; + + public static final String SELECT_ITEM_CSS = "rf-is-sel"; + public static final String LIST_CSS = "rf-is-lst-cord"; + + @Override protected String getScriptName() { return "new RichFaces.ui.InplaceSelect"; @@ -68,7 +77,7 @@ } public void encodeItems(FacesContext facesContext, UIComponent component, List<ClientSelectItem> clientSelectItems) throws IOException { - SelectHelper.encodeItems(facesContext, component, clientSelectItems, HtmlConstants.SPAN_ELEM); + SelectHelper.encodeItems(facesContext, component, clientSelectItems, HtmlConstants.SPAN_ELEM, ITEM_CSS); } public void renderListHandlers(FacesContext facesContext, UIComponent component) throws IOException { @@ -77,7 +86,7 @@ @Override public void renderInputHandlers(FacesContext facesContext, UIComponent component) throws IOException { - RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, component, INPLACEINPUT_HANDLER_ATTRIBUTES); + RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, component, INPLACE_INPUT_HANDLER_ATTRIBUTES); } public String getSelectInputLabel(FacesContext facesContext, UIComponent component) { @@ -86,15 +95,13 @@ @Override public void addToOptions(FacesContext facesContext, UIComponent component, Map<String, Object> options, Object additional) { - options.put(PopupConstants.OPTIONS_ITEM_CLASS, "rf-is-opt"); - options.put(PopupConstants.OPTIONS_SELECT_ITEM_CLASS, "rf-is-sel"); - - String clientId = component.getClientId(facesContext); - options.put(PopupConstants.OPTIONS_LIST_CORD, clientId + "List"); - options.put(PopupConstants.OPTIONS_LIST_CLASS, component.getAttributes().get("listCss")); - options.put(SelectHelper.OPTIONS_SELECT_ITEM_VALUE_INPUT, clientId + "selValue"); + AbstractSelect abstractSelect = (AbstractSelect)component; + SelectHelper.addSelectCssToOptions(abstractSelect, options, new String[] {ITEM_CSS, SELECT_ITEM_CSS, LIST_CSS}); + boolean openOnEdit = (Boolean)component.getAttributes().get("openOnEdit"); + if(openOnEdit) { + options.put(OPTIONS_VISIBLE, openOnEdit); + } options.put(SelectHelper.OPTIONS_LIST_ITEMS, additional); - options.put(OPTIONS_VISIBLE, component.getAttributes().get("openOnEdit")); } public String getSelectLabel(FacesContext facesContext, UIComponent component) { @@ -106,32 +113,33 @@ return label; } - public String getListStyles(FacesContext facesContext, UIComponent component) { - AbstractInplaceSelect inplaceSelect = (AbstractInplaceSelect) component; - return inplaceSelect.isOpenOnEdit() ? "" : "display: none"; + public String getReadyStateCss(InplaceComponent component) { + String css = component.getReadyStateCss(); + return HtmlUtil.concatClasses("rf-is-d-s", css); } - public String getReadyStateCss() { - return "rf-is-d-s"; + public String getEditStateCss(InplaceComponent component) { + String css = component.getEditStateCss(); + return HtmlUtil.concatClasses("rf-is-e-s", css); } - public String getEditStateCss() { - return "rf-is-e-s"; + public String getChangedStateCss(InplaceComponent component) { + String css = component.getChangedStateCss(); + return HtmlUtil.concatClasses("rf-is-c-s", css); } - public String getChangedStateCss() { - return "rf-is-c-s"; + public String getDisableStateCss(InplaceComponent component) { + String css = component.getDisableStateCss(); + return HtmlUtil.concatClasses("rf-is-dis-s", css); } - - public String getDisableStateCss() { - return "rf-is-dis-s"; - } - public String getEditCss() { - return "rf-is-edit"; + public String getEditCss(InplaceComponent component) { + String css = component.getEditCss(); + return HtmlUtil.concatClasses("rf-is-edit", css); } - public String getNoneCss() { - return "rf-is-none"; + public String getNoneCss(InplaceComponent component) { + String css = component.getNoneCss(); + return HtmlUtil.concatClasses("rf-is-none", css); } } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectHelper.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectHelper.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectHelper.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -34,6 +34,7 @@ import javax.faces.model.SelectItem; import org.richfaces.component.AbstractSelect; +import org.richfaces.component.util.HtmlUtil; import org.richfaces.component.util.InputUtils; import org.richfaces.component.util.SelectUtils; @@ -45,11 +46,14 @@ public static final String OPTIONS_SHOWCONTROL = "showControl"; - public static final String OPTIONS_SELECT_ITEM_VALUE_INPUT = "selValueInput"; - public static final String OPTIONS_LIST_ITEMS = "items"; + public static final String OPTIONS_ENABLE_MANUAL_INPUT = "enableManualInput"; + public static final String OPTIONS_LIST_SELECT_FIRST = "selectFirst"; + + public static final String OPTIONS_INPUT_DEFAULT_LABEL = "defaultLabel"; + public static final Map<String, ComponentAttribute> SELECT_LIST_HANDLER_ATTRIBUTES = Collections .unmodifiableMap(ComponentAttribute.createMap( new ComponentAttribute(HtmlConstants.ONCLICK_ATTRIBUTE) @@ -101,7 +105,7 @@ } public static void encodeItems(FacesContext facesContext, UIComponent component, - List<ClientSelectItem> clientSelectItems, String itemHtmlElement) throws IOException { + List<ClientSelectItem> clientSelectItems, String itemHtmlElement, String defaultItemCss) throws IOException { AbstractSelect select = (AbstractSelect) component; if (clientSelectItems != null && !clientSelectItems.isEmpty()) { ResponseWriter writer = facesContext.getResponseWriter(); @@ -114,7 +118,8 @@ writer.startElement(itemHtmlElement, select); writer.writeAttribute(HtmlConstants.ID_ATTRIBUTE, itemClientId, null); - writer.writeAttribute(HtmlConstants.CLASS_ATTRIBUTE, select.getItemCss(), null); + + writer.writeAttribute(HtmlConstants.CLASS_ATTRIBUTE, HtmlUtil.concatClasses(defaultItemCss, select.getItemCss()), null); String label = clientSelectItem.getLabel(); if (label != null && label.trim().length() > 0) { @@ -146,5 +151,21 @@ return label; } - + + public static void addSelectCssToOptions(AbstractSelect abstractSelect, Map<String, Object> options, String [] defaultCss) { + String itemCss = abstractSelect.getItemCss(); + if(itemCss != null && itemCss.trim().length() > 0) { + options.put(PopupConstants.OPTIONS_ITEM_CLASS, HtmlUtil.concatClasses(defaultCss[0], itemCss)); + } + + String selectItemCss = abstractSelect.getSelectItemCss(); + if(selectItemCss != null && selectItemCss.trim().length() > 0) { + options.put(PopupConstants.OPTIONS_SELECT_ITEM_CLASS, HtmlUtil.concatClasses(defaultCss[1], selectItemCss)); + } + + String listCss = abstractSelect.getListCss(); + if(listCss != null && listCss.trim().length() > 0) { + options.put(PopupConstants.OPTIONS_LIST_CLASS, HtmlUtil.concatClasses(defaultCss[2], listCss)); + } + } } Modified: trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectRendererBase.java =================================================================== --- trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectRendererBase.java 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/java/org/richfaces/renderkit/SelectRendererBase.java 2010-10-21 17:44:09 UTC (rev 19646) @@ -36,6 +36,10 @@ import org.ajax4jsf.javascript.JSFunction; import org.richfaces.component.AbstractSelect; +/** + * @author abelevich + * + */ @ResourceDependencies({ @ResourceDependency(library = "javax.faces", name = "jsf.js"), @ResourceDependency(name = "jquery.js"), @ResourceDependency(name = "jquery.position.js"), @ResourceDependency(name = "richfaces.js"), @ResourceDependency(name = "jquery.position.js"), @@ -44,10 +48,18 @@ @ResourceDependency(library = "org.richfaces", name = "inputBase.js"), @ResourceDependency(library = "org.richfaces", name = "popup.js"), @ResourceDependency(library = "org.richfaces", name = "popupList.js"), + @ResourceDependency(library = "org.richfaces", name = "selectList.js"), @ResourceDependency(library = "org.richfaces", name = "select.js"), @ResourceDependency(library = "org.richfaces", name = "select.ecss") }) public class SelectRendererBase extends InputRendererBase { + + public static final String ITEM_CSS = "rf-sel-opt"; + + public static final String SELECT_ITEM_CSS = "rf-sel-sel"; + public static final String LIST_CSS = "rf-sel-lst-cord"; + + public void renderListHandlers(FacesContext facesContext, UIComponent component) throws IOException { RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, component, SelectHelper.SELECT_LIST_HANDLER_ATTRIBUTES); } @@ -71,7 +83,7 @@ public void encodeItems(FacesContext facesContext, UIComponent component, List<ClientSelectItem> clientSelectItems) throws IOException { - SelectHelper.encodeItems(facesContext, component, clientSelectItems, HtmlConstants.DIV_ELEM); + SelectHelper.encodeItems(facesContext, component, clientSelectItems, HtmlConstants.DIV_ELEM, ITEM_CSS); } public void buildScript(ResponseWriter writer, FacesContext facesContext, UIComponent component, List<ClientSelectItem> selectItems) throws IOException { @@ -85,15 +97,27 @@ String clientId = abstractSelect.getClientId(facesContext); Map<String, Object> options = new HashMap<String, Object>(); - options.put(SelectHelper.OPTIONS_SHOWCONTROL, abstractSelect.isShowButton()); options.put(SelectHelper.OPTIONS_LIST_ITEMS, selectItems); - options.put(SelectHelper.OPTIONS_SELECT_ITEM_VALUE_INPUT, clientId + "selValue"); - options.put(PopupConstants.OPTIONS_ITEM_CLASS, abstractSelect.getItemCss()); - options.put(PopupConstants.OPTIONS_SELECT_ITEM_CLASS, abstractSelect.getSelectItemCss()); - options.put(PopupConstants.OPTIONS_LIST_CLASS, abstractSelect.getListCss()); - options.put(PopupConstants.OPTIONS_LIST_CORD, clientId + "List"); + + if(!abstractSelect.isShowButton()) { + options.put(SelectHelper.OPTIONS_SHOWCONTROL, abstractSelect.isShowButton()); + } + + String defaultLabel = abstractSelect.getDefaultLabel(); + if( defaultLabel != null && defaultLabel.trim().length() > 0) { + options.put(SelectHelper.OPTIONS_INPUT_DEFAULT_LABEL, defaultLabel); + } + + if(abstractSelect.isEnableManualInput()) { + options.put(SelectHelper.OPTIONS_ENABLE_MANUAL_INPUT, abstractSelect.isEnableManualInput()); + } + + if(!abstractSelect.isSelectFirst()) { + options.put(SelectHelper.OPTIONS_LIST_SELECT_FIRST, abstractSelect.isSelectFirst()); + } + + SelectHelper.addSelectCssToOptions(abstractSelect, options, new String[] {ITEM_CSS, SELECT_ITEM_CSS, LIST_CSS}); - function.addParameter(clientId); function.addParameter(options); Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -44,27 +44,27 @@ rf.ui.InplaceBase = function(id, options) { $super.constructor.call(this, id); - - this.editEvent = options.editEvent; - this.noneCss = options.noneCss; - this.changedCss = options.changedCss; - this.defaultLabel = options.defaultLabel; - this.state = options.state; - + var mergedOptions = $.extend({}, defaultOptions, options); + this.editEvent = mergedOptions.editEvent; + this.noneCss = mergedOptions.noneCss; + this.changedCss = mergedOptions.changedCss; + this.defaultLabel = mergedOptions.defaultLabel; + this.state = mergedOptions.state; this.element = $(document.getElementById(id)); - this.editContainer = $(document.getElementById(options.editContainer)); - this.state = options.state; - + this.editContainer = $(document.getElementById(id+"Edit")); this.element.bind(this.editEvent, $.proxy(this.__editHandler, this)); - this.isSaved = false; this.useDefaultLabel = false; - }; rf.ui.InputBase.extend(rf.ui.InplaceBase); var $super = rf.ui.InplaceBase.$super; + var defaultOptions = { + editEvent: "click", + state: "ready" + }; + $.extend(rf.ui.InplaceBase.prototype, ( function () { var STATE = { Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -3,33 +3,41 @@ rf.ui = rf.ui || {}; rf.ui.InplaceInput = function(id, options) { - $super.constructor.call(this, id, options); - - //rename input id in template (id + "Input") - - this.label = $(document.getElementById(options.label)); - - var label = this.label.text(); + var mergedOptions = $.extend({}, defaultOptions, options); + $super.constructor.call(this, id, mergedOptions); + this.label = $(document.getElementById(id+"Label")); + var labelText = this.label.text(); var inputLabel = this.getValue(); - this.initialValue = (label == inputLabel) ? label : ""; - this.saveOnBlur = options.saveOnBlur; - this.showControls = options.showControls; - + this.initialValue = (labelText == inputLabel) ? labelText : ""; + this.saveOnBlur = mergedOptions.saveOnBlur; + this.showControls = mergedOptions.showControls; this.getInput().bind("focus", $.proxy(this.__editHandler, this)); if(this.showControls) { - this.okbtn = $(document.getElementById(options.okbtn)); - this.cancelbtn = $(document.getElementById(options.cancelbtn)); + this.okbtn = $(document.getElementById(id+"Okbtn")); + this.cancelbtn = $(document.getElementById(id+"Cancelbtn")); this.okbtn.bind("mousedown", $.proxy(this.__saveBtnHandler, this)); this.cancelbtn.bind("mousedown", $.proxy(this.__cancelBtnHandler, this)); } - - this.focusElement = $(document.getElementById(options.focusElement)); + this.focusElement = $(document.getElementById(id+"Focus")); }; rf.ui.InplaceBase.extend(rf.ui.InplaceInput); var $super = rf.ui.InplaceInput.$super; - + + var defaultOptions = { + defaultLabel: "", + saveOnBlur: true, + showControl: true, + itemCss: "rf-ii-opt", + selectItemCss: "rf-ii-sel", + listCss: "rf-ii-lst-cord", + noneCss: "rf-ii-none", + //not used in inputBase? + editCss: "rf-ii-edit", + changedCss: "rf-ii-c-s" + }; + $.extend(rf.ui.InplaceInput.prototype, ( function () { return { @@ -45,15 +53,7 @@ }, __keydownHandler: function(e) { - var code; - - if(e.keyCode) { - code = e.keyCode; - } else if(e.which) { - code = e.which; - } - - switch(code) { + switch(e.keyCode || e.which) { case 27: e.preventDefault(); this.cancel(); Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -3,21 +3,30 @@ rf.ui = rf.ui || {}; rf.ui.InplaceSelect = function(id, options) { - $super.constructor.call(this, id, options) - - options['attachTo'] = id; - options['attachToBody'] = true; - this.popupList = new rf.ui.PopupList(options.list, this, options); - - this.items = options.items; - this.selValueInput = $(document.getElementById(options.selValueInput)); + var mergedOptions = $.extend({}, defaultOptions, options); + $super.constructor.call(this, id, mergedOptions) + mergedOptions['attachTo'] = id; + this.popupList = new rf.ui.PopupList(id+"List", this, mergedOptions); + this.items = mergedOptions.items; + this.selValueInput = $(document.getElementById(id+"selValue")); this.openPopup = false; - } rf.ui.InplaceInput.extend(rf.ui.InplaceSelect); var $super = rf.ui.InplaceSelect.$super; + var defaultOptions = { + defaultLabel: "", + showControl: false, + itemCss: "rf-is-opt", + selectItemCss: "rf-is-sel", + listCss: "rf-is-lst-cord", + noneCss: "rf-is-none", + editCss: "rf-is-edit", + changedCss: "rf-is-c-s" + }; + + $.extend(rf.ui.InplaceSelect.prototype, ( function () { return{ Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -7,9 +7,12 @@ this.attachToDom(id); this.popup = $(document.getElementById(id)); - this.visible = options.visible; - this.attachTo = options.attachTo; - this.attachToBody = options.attachToBody; + var mergedOptions = $.extend({}, defaultOptions, options); + this.visible = mergedOptions.visible; + this.attachTo = mergedOptions.attachTo; + this.attachToBody = mergedOptions.attachToBody; + this.positionType = mergedOptions.positionType; + this.positionOffset = mergedOptions.positionOffset; this.popup.bind("mouseover", $.proxy(this.__onMouseOver, this)); this.popup.bind("click", $.proxy(this.__onClick, this)); @@ -17,6 +20,11 @@ rf.BaseComponent.extend(rf.ui.Popup); var $super = rf.ui.Popup.$super; + + + var defaultOptions = { + visible: false + }; $.extend(rf.ui.Popup.prototype, (function () { @@ -30,7 +38,7 @@ this.parentElement = this.popup.parent(); this.popup.detach().appendTo("body"); } - this.popup.setPosition({id: this.attachTo}, {type:"DROPDOWN", offset:[0,20]}).show(); + this.popup.setPosition({id: this.attachTo}, {type: this.positionType , offset: this.positionOffset}).show(); this.visible = true; } }, Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -3,17 +3,25 @@ rf.ui = rf.ui || {}; rf.ui.PopupList = function(id, listener, options) { - $super.constructor.call(this, id, options); + var mergedOptions = $.extend({}, defaultOptions, options); + $super.constructor.call(this, id, mergedOptions); this.selectListener = listener; - this.selectItemCss = options.selectItemCss; - this.itemCss = options.itemCss; - this.listCss = options.listCss; + this.selectItemCss = mergedOptions.selectItemCss; + this.itemCss = mergedOptions.itemCss; + this.listCss = mergedOptions.listCss; this.index = -1; this.__updateItemsList(); }; rf.ui.Popup.extend(rf.ui.PopupList); var $super = rf.ui.PopupList.$super; + + var defaultOptions = { + attachToBody: true, + positionType: "DROPDOWN", + positionOffset: [0,20] + }; + $.extend(rf.ui.PopupList.prototype, ( function () { @@ -43,13 +51,23 @@ } }, + resetItemsSelection: function() { + if(this.items) { + var popup = this; + this.items.each(function(i,item){ + popup.unselectItem($(item)); + } + ); + } + }, + isPopupList: function(target) { var parentId = target.parents("." + this.listCss).attr("id"); return (parentId && (parentId == this.getId())); }, __updateItemsList: function () { - this.items = this.popup.find("."+this.itemCss); + return (this.items = this.popup.find("."+this.itemCss)); }, __select: function(item) { @@ -126,7 +144,11 @@ __getItems: function () { return this.items; - } + }, + + __setItems: function(items) { + this.items = items; + } } })()); Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -1,4 +1,4 @@ -//TODO: to the utils? +//TODO: to the utils? <-- (function (rf) { rf.KEYS = { BACKSPACE: 8, @@ -16,30 +16,152 @@ })(RichFaces); +//TODO: remove when cache will be moved to utils <-- (function ($, rf) { + rf.utils = rf.utils || {}; + + rf.utils.Cache = function (key, items, values, useCache) { + this.key = key.toLowerCase(); + this.cache = {} + this.cache[this.key] = items || []; + this.originalValues = typeof values == "function" ? values(items) : values || this.cache[this.key]; + this.values = processValues(this.originalValues); + this.useCache = useCache || checkValuesPrefix.call(this); + }; + var processValues = function (values) { + var processedValues = []; + for (var i = 0; i<values.length; i++) { + processedValues.push(values[i].toLowerCase()); + } + return processedValues; + } + + var checkValuesPrefix = function () { + var result = true; + for (var i = 0; i<this.values.length; i++) { + if (this.values[i].indexOf(this.key)!=0) { + result = false; + break; + } + } + return result; + } + + var getItems = function (key, filterFunction) { + key = key.toLowerCase(); + var newCache = []; + + if (key.length < this.key.length) { + return newCache; + } + + if (this.cache[key]) { + newCache = this.cache[key]; + } else { + var useCustomFilterFunction = typeof filterFunction == "function"; + var itemsCache = this.cache[this.key]; + for (var i = 0; i<this.values.length; i++) { + var value = this.values[i]; + if (useCustomFilterFunction && filterFunction(key, value)) { + newCache.push(itemsCache[i]); + } else { + var p = value.indexOf(key); + if (p == 0) { + newCache.push(itemsCache[i]); + } + } + } + + if ((!this.lastKey || key.indexOf(this.lastKey)!=0) && newCache.length > 0) { + this.cache[key] = newCache; + if (newCache.length==1) { + this.lastKey = key; + } + } + } + + return newCache; + }; + + var getItemValue = function (item) { + return this.originalValues[this.cache[this.key].index(item)]; + }; + + var isCached = function (key) { + key = key.toLowerCase(); + return this.cache[key] || this.useCache && key.indexOf(this.key)==0; + }; + + $.extend(rf.utils.Cache.prototype, (function () { + return { + getItems: getItems, + getItemValue: getItemValue, + isCached: isCached + }; + })()); + + +})(jQuery, RichFaces); + +//--> + +(function ($, rf) { + rf.ui = rf.ui || {}; rf.ui.Select = function(id, options) { $super.constructor.call(this, id); this.id = id; + var mergedOptions = $.extend({}, defaultOptions, options); + mergedOptions['attachTo'] = id; + + this.defaultLabel = mergedOptions.defaultLabel; + var inputLabel = this.getValue() ; + this.initialValue = (inputLabel != this.defaultLabel) ? inputLabel : ""; + + this.selValueInput = $(document.getElementById(id+"selValue")); + this.clientItems = mergedOptions.items; - // TODO: move to defaultOptions ?? - options['attachTo'] = id; - options['attachToBody'] = true; - - this.selValueInput = $(document.getElementById(options.selValueInput)); - this.items = options.items; - - if(options.showControl) { + if(mergedOptions.showControl) { this.btn = $(document.getElementById(id+"Button")); this.btn.bind("click", $.proxy(this.__clickHandler, this)); } - this.popupList = new rf.ui.PopupList(options.list, this, options); + this.selectFirst = mergedOptions.selectFirst; + this.popupList = new rf.ui.SelectList((id+"List"), this, mergedOptions); + + var items = this.popupList.__getItems(); + var enableManualInput = mergedOptions.enableManualInput; + if (items.length>0 && enableManualInput) { + this.cache = new rf.utils.Cache("", items, getData, true); + } + + this.changeDelay = mergedOptions.changeDelay; }; rf.ui.InputBase.extend(rf.ui.Select); var $super = rf.ui.Select.$super; + + var defaultOptions = { + defaultLabel: "", + selectFirst: true, + showControl: true, + enableManualInput: false, + itemCss: "rf-sel-opt", + selectItemCss: "rf-sel-sel", + listCss: "rf-sel-lst-cord", + changeDelay: 8 + }; + + var REGEXP_TRIM = /^[\n\s]*(.*)[\n\s]*$/; + + var getData = function (nodeList) { + var data = []; + nodeList.each(function () {; + data.push($(this).text().replace(REGEXP_TRIM, "$1")); + }); + return data; + } $.extend(rf.ui.Select.prototype, ( function () { @@ -50,12 +172,18 @@ e.preventDefault(); if(!this.popupList.isVisible()) { this.popupList.show(); + this.__setInputFocus(); } else { this.popupList.hide(); } - this.__setInputFocus(); }, - + + __focusHandler: function(e) { + if(this.getValue() == this.defaultLabel) { + this.setValue(""); + } + }, + __keydownHandler: function(e) { var code; @@ -65,33 +193,70 @@ code = e.which; } - if(this.popupList.isVisible()) { - switch(code) { - case rf.KEYS.DOWN: - e.preventDefault(); - this.popupList.__selectNext(); - this.__setInputFocus(); - break; + var visible = this.popupList.isVisible(); + switch(code) { + case rf.KEYS.DOWN: + e.preventDefault(); + if(!visible) { + this.popupList.show(); + } else { + this.popupList.__selectNext() ; + } + break; - case rf.KEYS.UP: - e.preventDefault(); - this.popupList.__selectPrev(); - this.__setInputFocus(); - break; + case rf.KEYS.UP: + e.preventDefault(); + if(visible) { + this.popupList.__selectPrev(); + } + break; - case rf.KEYS.RETURN: - e.preventDefault(); - this.popupList.__selectCurrent(); - this.__setInputFocus(); - return false; - break; - } + case rf.KEYS.RETURN: + e.preventDefault(); + if(visible) { + this.popupList.__selectCurrent(); + } + return false; + break; + + default: + var _this = this; + window.clearTimeout(this.changeTimerId); + this.changeTimerId = window.setTimeout(function(){_this.__onChangeValue(e);}, this.changeDelay); + break; } }, - + + __onChangeValue: function(e) { + this.popupList.__selectByIndex(); + var newValue = this.getValue(); + + if(this.cache && this.cache.isCached(newValue)) { + + if(this.initialValue !=newValue) { + var newItems = this.cache.getItems(newValue); + var items = $(newItems); + this.popupList.__setItems(items); + $(document.getElementById(this.id+"Items")).empty().append(items); + } + + if(!this.popupList.isVisible()) { + this.popupList.show(); + } + + if(this.selectFirst) { + this.popupList.__selectByIndex(0); + } + } + }, + __blurHandler: function(e) { var target = $(e.originalEvent.explicitOriginalTarget); if(!this.popupList.isPopupList(target)) { + var inputLabel = this.getValue(); + if(!inputLabel || inputLabel == "") { + this.setValue(this.defaultLabel); + } this.popupList.hide(); return true; } @@ -109,8 +274,8 @@ }, getItemValue: function(key) { - for(var i in this.items) { - var item = this.items[i]; + for(var i in this.clientItems) { + var item = this.clientItems[i]; if(item && item.id == key) { return item.value; } @@ -118,8 +283,8 @@ }, getItemLabel: function(key) { - for(var i in this.items) { - var item = this.items[i]; + for(var i in this.clientItems) { + var item = this.clientItems[i]; if(item && item.id == key) { return item.label; } Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js 2010-10-21 17:44:09 UTC (rev 19646) @@ -4,15 +4,32 @@ rf.ui.SelectList = function(id, listener, options) { $super.constructor.call(this, id, listener, options); + this.selectFirst = options.selectFirst; }; rf.ui.PopupList.extend(rf.ui.SelectList); var $super = rf.ui.SelectList.$super; - + $.extend(rf.ui.SelectList.prototype,(function () { return{ name : "selectList", + + show: function() { + if(!this.isVisible()) { + $super.show.call(this); + if(this.selectFirst) { + this.__selectByIndex(0); + } + } + }, + + hide: function() { + if(this.isVisible()) { + $super.hide.call(this); + this.__selectByIndex(-1); + } + } } })()); Modified: trunk/ui/input/ui/src/main/templates/inplaceSelect.template.xml =================================================================== --- trunk/ui/input/ui/src/main/templates/inplaceSelect.template.xml 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/templates/inplaceSelect.template.xml 2010-10-21 17:44:09 UTC (rev 19646) @@ -78,7 +78,7 @@ </span> </span> </c:if> - <span id="#{clientId}List" style="#{getListStyles(facesContext, component)}" class="rf-is-lst-cord"> + <span id="#{clientId}List" style="#{component.attributes['openOnEdit'] ? '' : 'display: none'}" class="rf-is-lst-cord"> <cdk:call expression="renderListHandlers(facesContext, component);"/> <span class="rf-is-lst-pos" style="width: #{component.attributes['listWidth']}"> <span class="rf-is-shdw"> Modified: trunk/ui/input/ui/src/main/templates/select.template.xml =================================================================== --- trunk/ui/input/ui/src/main/templates/select.template.xml 2010-10-21 16:57:09 UTC (rev 19645) +++ trunk/ui/input/ui/src/main/templates/select.template.xml 2010-10-21 17:44:09 UTC (rev 19646) @@ -29,7 +29,7 @@ type="text" class="rf-sel-fnt rf-sel-inp" autocomplete="off" - readonly="readonly"/> + readonly="#{component.attributes['enableManualInput'] ? '' : 'readonly'}"/> <c:if test="#{component.attributes['showButton']}"> <c:if test="#{component.attributes['disabled']}"> @@ -54,7 +54,7 @@ <div class="rf-sel-shdw-b"></div> <div class="rf-sel-lst-dcrtn"> - <div class="rf-sel-lst-scrl"> + <div class="rf-sel-lst-scrl" id="#{clientId}Items" > <cdk:call expression="encodeItems(facesContext, component, clientSelectItems);"/> </div> </div>