Author: alexsmirnov Date: 2010-10-13 14:43:22 -0400 (Wed, 13 Oct 2010) New Revision: 19558 Added: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js Modified: branches/RF-8742/ branches/RF-8742/ui/input/api/src/main/java/org/richfaces/component/InplaceState.java branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectBaseRenderer.java branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.ecss branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.ecss branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js branches/RF-8742/ui/input/ui/src/main/templates/inplaceInput.template.xml branches/RF-8742/ui/input/ui/src/main/templates/inplaceSelect.template.xml branches/RF-8742/ui/input/ui/src/test/java/org/richfaces/renderkit/InplaceInputRendererTest.java Log: Merged revisions 19525,19542-19543 via svnmerge from https://svn.jboss.org/repos/richfaces/trunk ....... r19525 | abelevich | 2010-10-11 11:04:10 -0700 (Mon, 11 Oct 2010) | 1 line add disable state (RF-9348) ....... r19542 | abelevich | 2010-10-12 08:37:45 -0700 (Tue, 12 Oct 2010) | 1 line keyboard keys proccess ....... r19543 | abelevich | 2010-10-12 08:40:14 -0700 (Tue, 12 Oct 2010) | 1 line initial for the RF-9340 ....... Property changes on: branches/RF-8742 ___________________________________________________________________ Name: svnmerge-integrated - /trunk:1-19522 + /trunk:1-19546 Modified: branches/RF-8742/ui/input/api/src/main/java/org/richfaces/component/InplaceState.java =================================================================== --- branches/RF-8742/ui/input/api/src/main/java/org/richfaces/component/InplaceState.java 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/api/src/main/java/org/richfaces/component/InplaceState.java 2010-10-13 18:43:22 UTC (rev 19558) @@ -31,5 +31,6 @@ public enum InplaceState { ready, edit, - changed + changed, + disable } Modified: branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java =================================================================== --- branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java 2010-10-13 18:43:22 UTC (rev 19558) @@ -43,148 +43,202 @@ * @author Anton Belevich * */ -@ResourceDependencies({ @ResourceDependency(library = "javax.faces", name = "jsf.js"), - @ResourceDependency(name = "jquery.js"), @ResourceDependency(name = "richfaces.js"), - @ResourceDependency(name = "richfaces-event.js"), - @ResourceDependency(name = "richfaces-base-component.js"), - @ResourceDependency(library="org.richfaces", name = "inplaceBase.js"), - @ResourceDependency(library="org.richfaces", name = "inplaceInput.js"), - @ResourceDependency(library="org.richfaces", name = "inplaceInput.ecss") }) +@ResourceDependencies({ + @ResourceDependency(library = "javax.faces", name = "jsf.js"), + @ResourceDependency(name = "jquery.js"), + @ResourceDependency(name = "richfaces.js"), + @ResourceDependency(name = "richfaces-event.js"), + @ResourceDependency(name = "richfaces-base-component.js"), + @ResourceDependency(library = "org.richfaces", name = "inplaceBase.js"), + @ResourceDependency(library = "org.richfaces", name = "inplaceInput.js"), + @ResourceDependency(library = "org.richfaces", name = "inplaceInput.ecss") }) public class InplaceInputBaseRenderer extends InputRendererBase { - + public static final String OPTIONS_EDIT_EVENT = "editEvent"; + public static final String OPTIONS_STATE = "state"; + public static final String OPTIONS_EDIT_CONTAINER = "editContainer"; - + public static final String OPTIONS_INPUT = "input"; - + public static final String OPTIONS_FOCUS = "focusElement"; - + public static final String OPTIONS_BUTTON_OK = "okbtn"; - + public static final String OPTIONS_LABEL = "label"; - + public static final String OPTIONS_DEFAULT_LABEL = "defaultLabel"; - + public static final String OPTIONS_BUTTON_CANCEL = "cancelbtn"; - + public static final String OPTIONS_SHOWCONTROLS = "showControls"; - + public static final String OPTIONS_NONE_CSS = "noneCss"; - + public static final String OPTIONS_CHANGED_CSS = "changedCss"; + public static final String OPTIONS_EDIT_CSS = "editCss"; + public static final String OPTIONS_INITIAL_VALUE = "initialValue"; - + public static final String OPTIONS_SAVE_ON_BLUR = "saveOnBlur"; - private static final Map<String, ComponentAttribute> INPLACEINPUT_HANDLER_ATTRIBUTES = Collections - .unmodifiableMap(ComponentAttribute.createMap( - new ComponentAttribute(HtmlConstants.ONCLICK_ATTRIBUTE).setEventNames("inputclick"). - setComponentAttributeName("oninputclick"), - new ComponentAttribute(HtmlConstants.ONDBLCLICK_ATTRIBUTE).setEventNames("inputdblclick"). - setComponentAttributeName("oninputdblclick"), - new ComponentAttribute(HtmlConstants.ONMOUSEDOWN_ATTRIBUTE).setEventNames("inputmousedown"). - setComponentAttributeName("oninputmousedown"), - new ComponentAttribute(HtmlConstants.ONMOUSEUP_ATTRIBUTE).setEventNames("inputmouseup"). - setComponentAttributeName("oninputmouseup"), - new ComponentAttribute(HtmlConstants.ONMOUSEOVER_ATTRIBUTE).setEventNames("inputmouseover"). - setComponentAttributeName("oninputmouseover"), - new ComponentAttribute(HtmlConstants.ONMOUSEMOVE_ATTRIBUTE).setEventNames("inputmousemove"). - setComponentAttributeName("oninputmousemove"), - new ComponentAttribute(HtmlConstants.ONMOUSEOUT_ATTRIBUTE).setEventNames("inputmouseout"). - setComponentAttributeName("oninputmouseout"), - new ComponentAttribute(HtmlConstants.ONKEYPRESS_ATTRIBUTE).setEventNames("inputkeypress"). - setComponentAttributeName("oninputkeypress"), - new ComponentAttribute(HtmlConstants.ONKEYDOWN_ATTRIBUTE).setEventNames("inputkeydown"). - setComponentAttributeName("oninputkeydown"), - new ComponentAttribute(HtmlConstants.ONKEYUP_ATTRIBUTE).setEventNames("inputkeyup"). - setComponentAttributeName("oninputkeyup"), - new ComponentAttribute(HtmlConstants.ONBLUR_ATTRIBUTE).setEventNames("inputblur"). - setComponentAttributeName("oninputblur"), - new ComponentAttribute(HtmlConstants.ONFOCUS_ATTRIBUTE).setEventNames("inputfocus"). - setComponentAttributeName("oninputfocus"), - new ComponentAttribute(HtmlConstants.ONCHANGE_ATTRIBUTE).setEventNames("change"). - setComponentAttributeName("onchange"), - new ComponentAttribute(HtmlConstants.ONSELECT_ATTRIBUTE).setEventNames("select"). - setComponentAttributeName("onselect") - )); + .unmodifiableMap(ComponentAttribute.createMap( + new ComponentAttribute(HtmlConstants.ONCLICK_ATTRIBUTE) + .setEventNames("inputclick") + .setComponentAttributeName("oninputclick"), + new ComponentAttribute(HtmlConstants.ONDBLCLICK_ATTRIBUTE) + .setEventNames("inputdblclick") + .setComponentAttributeName("oninputdblclick"), + new ComponentAttribute(HtmlConstants.ONMOUSEDOWN_ATTRIBUTE) + .setEventNames("inputmousedown") + .setComponentAttributeName("oninputmousedown"), + new ComponentAttribute(HtmlConstants.ONMOUSEUP_ATTRIBUTE) + .setEventNames("inputmouseup") + .setComponentAttributeName("oninputmouseup"), + new ComponentAttribute(HtmlConstants.ONMOUSEOVER_ATTRIBUTE) + .setEventNames("inputmouseover") + .setComponentAttributeName("oninputmouseover"), + new ComponentAttribute(HtmlConstants.ONMOUSEMOVE_ATTRIBUTE) + .setEventNames("inputmousemove") + .setComponentAttributeName("oninputmousemove"), + new ComponentAttribute(HtmlConstants.ONMOUSEOUT_ATTRIBUTE) + .setEventNames("inputmouseout") + .setComponentAttributeName("oninputmouseout"), + new ComponentAttribute(HtmlConstants.ONKEYPRESS_ATTRIBUTE) + .setEventNames("inputkeypress") + .setComponentAttributeName("oninputkeypress"), + new ComponentAttribute(HtmlConstants.ONKEYDOWN_ATTRIBUTE) + .setEventNames("inputkeydown") + .setComponentAttributeName("oninputkeydown"), + new ComponentAttribute(HtmlConstants.ONKEYUP_ATTRIBUTE) + .setEventNames("inputkeyup") + .setComponentAttributeName("oninputkeyup"), + new ComponentAttribute(HtmlConstants.ONBLUR_ATTRIBUTE) + .setEventNames("inputblur") + .setComponentAttributeName("oninputblur"), + new ComponentAttribute(HtmlConstants.ONFOCUS_ATTRIBUTE) + .setEventNames("inputfocus") + .setComponentAttributeName("oninputfocus"), + new ComponentAttribute(HtmlConstants.ONCHANGE_ATTRIBUTE) + .setEventNames("change").setComponentAttributeName( + "onchange"), + new ComponentAttribute(HtmlConstants.ONSELECT_ATTRIBUTE) + .setEventNames("select").setComponentAttributeName( + "onselect"))); - protected void renderInputHandlers(FacesContext facesContext, UIComponent component) throws IOException { - RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, component, INPLACEINPUT_HANDLER_ATTRIBUTES); + protected void renderInputHandlers(FacesContext facesContext, + UIComponent component) throws IOException { + RenderKitUtils.renderPassThroughAttributesOptimized(facesContext, + component, INPLACEINPUT_HANDLER_ATTRIBUTES); } - + public InplaceState getInplaceState(UIComponent component) { return ((InplaceComponent) component).getState(); } public String getValue(FacesContext facesContext, UIComponent component) throws IOException { String value = getInputValue(facesContext, component); - if(value == null || "".equals(value)) { - value = ((InplaceComponent)component).getDefaultLabel(); + if (!isDisable(getInplaceState(component)) && (value == null || "".equals(value)) ) { + value = ((InplaceComponent) component).getDefaultLabel(); } return value; } - + public String getResourcePath(FacesContext context, String resourceName) { if (resourceName != null) { - ResourceHandler resourceHandler = context.getApplication().getResourceHandler(); + ResourceHandler resourceHandler = context.getApplication() + .getResourceHandler(); Resource resource = resourceHandler.createResource(resourceName); return resource.getRequestPath(); } return null; } - public String getReadyStyleClass(UIComponent component, InplaceState inplaceState) { - return (InplaceState.changed != inplaceState) ? getReadyStateCss() : HtmlUtil.concatClasses(getReadyStateCss(), getChangedStateCss()); + public String getStateStyleClass(UIComponent component, + InplaceState inplaceState) { + String style = getReadyStateCss(); + switch (inplaceState) { + case edit: + style = HtmlUtil.concatClasses(style, getEditStateCss()); + break; + + case changed: + style = HtmlUtil.concatClasses(style, getChangedStateCss()); + break; + + case disable: + style = getDisableStateCss(); + break; + + default: + break; + } + + return style; } - public String getEditStyleClass(UIComponent component, InplaceState inplaceState) { - return (InplaceState.edit != inplaceState)? HtmlUtil.concatClasses(getEditStateCss(), getNoneCss()) : getEditStateCss(); + public boolean isDisable(InplaceState currentState) { + return (InplaceState.disable == currentState); } - public String getReadyClientId(FacesContext facesContext, UIComponent component, InplaceState inplaceState) { + + public String getEditStyleClass(UIComponent component, + InplaceState inplaceState) { + return (InplaceState.edit != inplaceState) ? HtmlUtil.concatClasses(getEditCss(), getNoneCss()) : getEditCss(); + } + + public String getReadyClientId(FacesContext facesContext, + UIComponent component, InplaceState inplaceState) { String clientId = component.getClientId(facesContext); return getId(clientId, InplaceState.ready, inplaceState); } - public String getChangedClientId(FacesContext facesContext, UIComponent component, InplaceState inplaceState) { + public String getChangedClientId(FacesContext facesContext, + UIComponent component, InplaceState inplaceState) { String clientId = component.getClientId(facesContext); return getId(clientId, InplaceState.changed, inplaceState); } - private String getId(String clientId, InplaceState expect, InplaceState current) { + private String getId(String clientId, InplaceState expect, + InplaceState current) { String result = clientId; if (expect != current) { result = clientId + ":" + expect; } return result; } - - public void buildScript(ResponseWriter writer, FacesContext facesContext, UIComponent component, Object additional) throws IOException { - if(!(component instanceof InplaceComponent)) { + + public void buildScript(ResponseWriter writer, FacesContext facesContext, + UIComponent component, Object additional) throws IOException { + if (!(component instanceof InplaceComponent)) { return; } String scriptName = getScriptName(); JSFunction function = new JSFunction(scriptName); String clientId = component.getClientId(facesContext); - Map<String, Object> options = createInplaceComponentOptions(clientId, (InplaceComponent)component); + Map<String, Object> options = createInplaceComponentOptions(clientId, + (InplaceComponent) component); addToOptions(facesContext, component, options, additional); function.addParameter(clientId); function.addParameter(options); writer.write(function.toString()); } - + protected String getScriptName() { return "new RichFaces.ui.InplaceInput"; } - - private Map<String, Object> createInplaceComponentOptions(String clientId, InplaceComponent inplaceComponent) { + + 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"); @@ -193,31 +247,40 @@ options.put(OPTIONS_SAVE_ON_BLUR, inplaceComponent.isSaveOnBlur()); boolean showControls = inplaceComponent.isShowControls(); - + options.put(OPTIONS_SHOWCONTROLS, showControls); - if(showControls) { + if (showControls) { options.put(OPTIONS_BUTTON_OK, clientId + ":okbtn"); options.put(OPTIONS_BUTTON_CANCEL, clientId + ":cancelbtn"); } return options; } - public void addToOptions(FacesContext facesContext, UIComponent component, Map<String, Object> options, Object additional) { - //override this method if you need additional options + public void addToOptions(FacesContext facesContext, UIComponent component, + Map<String, Object> options, Object additional) { + // override this method if you need additional options } - + public String getReadyStateCss() { return "rf-ii-d-s"; } - + public String getEditStateCss() { return "rf-ii-e-s"; } - + public String getChangedStateCss() { return "rf-ii-c-s"; } - + + public String getDisableStateCss() { + return "rf-ii-dis-s"; + } + + public String getEditCss() { + return "rf-ii-edit"; + } + public String getNoneCss() { return "rf-ii-none"; } Modified: branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectBaseRenderer.java =================================================================== --- branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectBaseRenderer.java 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/java/org/richfaces/renderkit/InplaceSelectBaseRenderer.java 2010-10-13 18:43:22 UTC (rev 19558) @@ -198,7 +198,7 @@ UIComponent component) { AbstractInplaceSelect select = (AbstractInplaceSelect) component; String label = getSelectInputLabel(facesContext, select); - if (label == null) { + if (!isDisable(getInplaceState(component)) && (label == null)) { label = select.getDefaultLabel(); } return label; @@ -240,6 +240,14 @@ return "rf-is-c-s"; } + public String getDisableStateCss() { + return "rf-is-dis-s"; + } + + public String getEditCss() { + return "rf-is-edit"; + } + public String getNoneCss() { return "rf-is-none"; } Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceBase.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -1,4 +1,22 @@ // TODO: remove when these functions will be moved to the RichFaces.Event <!-- + +(function (rf) { + rf.KEYS = { + BACKSPACE: 8, + TAB: 9, + RETURN: 13, + ESC: 27, + PAGEUP: 33, + PAGEDOWN: 34, + LEFT: 37, + UP: 38, + RIGHT: 39, + DOWN: 40, + DEL: 46 + }; +})(RichFaces); + + $.extend(RichFaces.Event, { bindScrollEventHandlers: function(element, handler, component) { var elements = []; @@ -33,13 +51,15 @@ this.noneCss = options.noneCss; this.changedCss = options.changedCss; this.defaultLabel = options.defaultLabel; + this.state = options.state; this.element = $(document.getElementById(id)); this.editContainer = $(document.getElementById(options.editContainer)); + this.state = options.state; - this.element.bind(this.editEvent, $.proxy(this.__editHandler, this)); - - this.isSaved = false; + this.element.bind(this.editEvent, $.proxy(this.__editHandler, this)); + + this.isSaved = false; this.useDefaultLabel = false; }; @@ -48,7 +68,14 @@ var $super = rf.ui.InplaceBase.$super; $.extend(rf.ui.InplaceBase.prototype, ( function () { - + + var STATE = { + READY : 'ready', + CHANGED: 'changed', + DISABLE: 'disable', + EDIT: 'edit' + }; + return { getName: function() { }, Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.ecss =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.ecss 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.ecss 2010-10-13 18:43:22 UTC (rev 19558) @@ -14,6 +14,17 @@ font-size : inherit; } +.rf-ii-edit { + position : absolute; + top : 0px; + left : 0px; + display : inline-block; + width: 100%; +} + +.rf-ii-dis-s { +} + .rf-ii-lbl { white-space : nowrap; } @@ -39,11 +50,6 @@ } .rf-ii-e-s { - position : absolute; - top : 0px; - left : 0px; - display : inline-block; - width: 100%; } .rf-ii-fld { Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceInput.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -47,7 +47,15 @@ }, __keydownHandler: function(e) { - switch(e.keyCode) { + var code; + + if(e.keyCode) { + code = e.keyCode; + } else if(e.which) { + code = e.which; + } + + switch(code) { case 27: this.cancel(); break; Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.ecss =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.ecss 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.ecss 2010-10-13 18:43:22 UTC (rev 19558) @@ -19,6 +19,17 @@ clip: rect(0px, 0px, 1px, 1px); } +.rf-is-dis-s { +} + +.rf-is-edit { + position : absolute; + top : 0px; + left : 0px; + width : 100px; + background-color : '#{richSkin.editBackgroundColor}'; +} + .rf-is-fnt { } @@ -42,11 +53,6 @@ } .rf-is-e-s { - position : absolute; - top : 0px; - left : 0px; - width : 100px; - background-color : '#{richSkin.editBackgroundColor}'; } .rf-is-fld { Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/inplaceSelect.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -79,6 +79,30 @@ } } }, + + __keydownHandler: function(e) { + $super.__keydownHandler(e); + + var code; + + if(e.keyCode) { + code = e.keyCode; + } else if(e.which) { + code = e.which; + } + + switch(code) { + case rf.KEYS.DOWN: + e.preventDefault(); + this.select.__onKeyDown(e); + break; + + case rf.KEYS.UP: + e.preventDefault(); + this.select.__onKeyUp(e); + break; + } + }, __blurHandler: function(e) { var target = $(e.originalEvent.explicitOriginalTarget); Copied: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js (from rev 19543, trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js) =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js (rev 0) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popup.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -0,0 +1,55 @@ +(function ($, rf) { + + rf.ui = rf.ui || {}; + + rf.ui.Popup = function(id, options) { + this.id = id; + this.popup = $(document.getElementById(id)); + this.visible = options.visible; + + //TODO: remove this? + this.popup.bind("blur", $.proxy(this.__onBlur, this)); + + this.popup.bind("mouseover", $.proxy(this.__onMouseOver, this)); + this.popup.bind("click", $.proxy(this.__onClick, this)); + }; + + rf.BaseComponent.extend(rf.ui.Popup); + var $super = rf.ui.Popup.$super; + + $.extend(rf.ui.Popup.prototype, (function () { + + return{ + + name : "popup", + + show: function() { + this.select.css("display", ""); + this.visible = true; + }, + + hide: function() { + this.select.css("display", "none"); + this.visible = false; + }, + + isVisible: function() { + return this.visible; + }, + + getId: function() { + return this.id; + }, + + __onMouseOver: function(e) { + }, + + __onClick: function(e) { + }, + + __onBlurHandler: function(e) { + } + + })()); + +})(jQuery, window.RichFaces); \ No newline at end of file Copied: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js (from rev 19543, trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js) =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js (rev 0) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -0,0 +1,114 @@ +(function ($, rf) { + + rf.ui = rf.ui || {}; + + var INTERFACE = { + SelectListener : { + processItem: function(e, element){} + } + }; + + rf.ui.PopupList = function(id, listener, options) { + $super.constructor.call(this, id, options); + this.selectListener = listener; + this.selectItemCss = options.selectItemCss; + this.itemCss = options.itemCss; + + //TODO: from option map? + this.index = -1; + this.visible = false; + this.__updateItemsList(); + }; + + rf.ui.Popup.extend(rf.ui.PopupList); + var $super = rf.ui.PopupList.$super; + + $.extend(rf.ui.PopupList.prototype, ( function () { + + var isSelectListener = function(obj) { + for (var method in INTERFACE.SelectListener) { + if ( (typeof obj[method] != typeof INTERFACE.SelectListener[method]) ) { + return false; + } + } + return true; + }; + + return{ + + name : "popupList", + + processItem: function(e, element) { + if(isSelectListener(this.selectListener)) { + this.selectListener.processItem(e, element); + } + }, + + __updateItemsList: function () { + this.items = this.popup.find("."+this.itemCss); + }, + + __select: function(index) { + var item; + + if (this.index != -1) { + item = this.items.eq(this.index); + this.__unSelectItem(item); + } + + this.index += index; + if (this.index < 0 ) { + this.index = this.items.length - 1; + } else if (this.index >= this.items.length) { + this.index = 0; + } + + item = this.items.eq(this.index); + this.__selectItem(item); + }, + + __selectItem: function(item) { + item.addClass(this.selectItemCss); + }, + + __unSelectItem: function(item) { + item.removeClass(this.selectItemCss); + }, + + __onEnter: function(e) { + }, + + //remove event, rename + __onKeyUp: function(e) { + this.__select(-1); + }, + + //remove event, rename + __onKeyDown: function(e) { + this.__select(1); + }, + + __onMouseOver: function(e) { + var item = this.__getItem(e); + var index = this.items.index(item); + this.__select(index); + }, + + __onClick: function(e) { + var item = this.__getItem(e); + var index = this.items.index(item); + this.__select(index); + this.processItem(e, item); + }, + + __getItem: function(e) { + return $(e.target).closest("."+this.itemCss, e.currentTarget); + }, + + __getItems: function () { + return this.items; + } + } + })()); + +})(jQuery, window.RichFaces); \ No newline at end of file Modified: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -1,3 +1,20 @@ +//TODO: utils? +(function (rf) { + rf.KEYS = { + BACKSPACE: 8, + TAB: 9, + RETURN: 13, + ESC: 27, + PAGEUP: 33, + PAGEDOWN: 34, + LEFT: 37, + UP: 38, + RIGHT: 39, + DOWN: 40, + DEL: 46 + }; +})(RichFaces); + (function ($, rf) { rf.ui = rf.ui || {}; @@ -4,7 +21,7 @@ var INTERFACE = { SelectListener : { - processItem: function(event, element){} + processItem: function(e, element){} } }; @@ -19,6 +36,11 @@ this.select.bind("blur", $.proxy(this.__blurHandler, this)); this.itemsCord.bind("mouseover", $.proxy(this.__mouseHandler, this)); this.itemsCord.bind("click", $.proxy(this.__mouseHandler, this)); + + this.index = -1; + //TODO: from option map? + this.visible = false; + this.updateItemsList(); }; rf.BaseComponent.extend(rf.ui.Select); @@ -42,18 +64,55 @@ show: function() { this.select.css("display", ""); + this.visible = true; }, hide: function() { this.select.css("display", "none"); + this.visible = false; }, - processItem: function(event, element) { + processItem: function(e, element) { if(isSelectListener(this.selectListener)) { - this.selectListener.processItem(event, element); + this.selectListener.processItem(e, element); } }, + isVisible: function() { + return this.visible; + }, + + __selectItem: function(e, index) { + var item; + + if (this.index != -1) { + item = this.items.eq(this.index); + item.removeClass(this.selectItemCss); + } + + this.index += index; + if ( this.index < 0 ) { + this.index = this.items.length - 1; + } else if (this.index >= this.items.length) { + this.index = 0; + } + + item = this.items.eq(this.index); + item.addClass(this.selectItemCss); + }, + + __onEnter: function(e) { + + }, + + __onKeyUp: function(e) { + this.__selectItem(e, -1); + }, + + __onKeyDown: function(e) { + this.__selectItem(e, 1); + }, + __getCurrentElement: function() { return processed; }, @@ -63,10 +122,10 @@ return false; }, - __mouseHandler: function(event) { - var element = $(event.target).closest("."+this.itemCss, event.currentTarget); - if (event&& element) { - if(event.type == 'mouseover') { + __mouseHandler: function(e) { + var element = $(e.target).closest("."+this.itemCss, e.currentTarget); + if (e && element) { + if(e.type == 'mouseover') { if(processed) { processed.removeClass(this.selectItemCss); } @@ -74,13 +133,21 @@ processed = element; } - if(event.type == 'click') { - this.processItem(event, element); + if(e.type == 'click') { + this.processItem(e, element); } } return false; - }, + }, + updateItemsList: function () { + this.items = this.itemsCord.find("."+this.itemCss); + }, + + __getItems: function () { + return this.items; + }, + __getId: function() { return this.id; } Copied: branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js (from rev 19543, trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js) =================================================================== --- branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js (rev 0) +++ branches/RF-8742/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/selectList.js 2010-10-13 18:43:22 UTC (rev 19558) @@ -0,0 +1,20 @@ +(function ($, rf) { + + rf.ui = rf.ui || {}; + + rf.ui.SelectList = function(id, listener, options) { + $super.constructor.call(this, id, options); + }; + + rf.ui.PopupList.extend(rf.ui.SelectList); + var $super = rf.ui.SelectList.$super; + + $.extend(rf.ui.SelectList.prototype,(function () { + + return{ + name : "selectList", + } + + })()); + +})(jQuery, window.RichFaces); \ No newline at end of file Modified: branches/RF-8742/ui/input/ui/src/main/templates/inplaceInput.template.xml =================================================================== --- branches/RF-8742/ui/input/ui/src/main/templates/inplaceInput.template.xml 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/templates/inplaceInput.template.xml 2010-10-13 18:43:22 UTC (rev 19558) @@ -41,47 +41,50 @@ <cc:implementation> <cdk:object type="org.richfaces.component.InplaceState" name="inplaceState" value="#{getInplaceState(component)}" /> <cdk:object type="java.lang.String" name="inplaceValue" value="#{getValue(facesContext, component)}" /> - - <span id="#{clientId}" class="#{getReadyStyleClass(component, inplaceState)}" cdk:passThroughWithExclusions="id class"> + + <span id="#{clientId}" class="#{getStateStyleClass(component, inplaceState)}" cdk:passThroughWithExclusions="id class"> <span id="#{clientId}:label" class="rf-ii-lbl"> #{inplaceValue} </span> - <input id="#{clientId}:focus" type="image" style="position: absolute; top: 0px; left: 0px; outline-style: none;" class="rf-ii-none"/> - <span id="#{clientId}:edit" class="#{getEditStyleClass(component, inplaceState)}"> - <input id="#{clientId}:input" autocomplete="off" name="#{clientId}" - type="text" value="#{getInputValue(facesContext, component)}" class="rf-ii-fld" style="width: #{component.attributes['inputWidth']};" cdk:passThrough="tabIndex"> - <cdk:call expression="renderInputHandlers(facesContext, component);"/> - </input> - <c:if test="#{component.attributes['showControls']}"> - <span class="rf-ii-btn-prepos"> - <span class="rf-ii-btn-pos"> - <span id="#{clientId}:btnshadow" class="rf-ii-btn-shadow"> - <span class="rf-ii-btn-shdw-t"></span> - <span class="rf-ii-btn-shdw-l"></span> - <span class="rf-ii-btn-shdw-r"></span> - <span class="rf-ii-btn-shdw-b"></span> - - <span id="#{clientId}:btn" style="position : relative"> - <input type="image" - id="#{clientId}:okbtn" - src="#{getResourcePath(facesContext, 'org.richfaces/ico_ok.gif')}" - class="rf-ii-btn" onmousedown="this.className='rf-ii-btn-p'" - onmouseout="this.className='rf-ii-btn'" onmouseup="this.className='rf-ii-btn'" /> - <input type="image" - id="#{clientId}:cancelbtn" - src="#{getResourcePath(facesContext,'org.richfaces/ico_cancel.gif')}" - class="rf-ii-btn" onmousedown="this.className='rf-ii-btn-press'" - onmouseout="this.className='rf-ii-btn'" onmouseup="this.className='rf-ii-btn'" /> - <br /> + + <c:if test="#{!isDisable(inplaceState)}"> + <input id="#{clientId}:focus" type="image" style="position: absolute; top: 0px; left: 0px; outline-style: none;" class="rf-ii-none"/> + <span id="#{clientId}:edit" class="#{getEditStyleClass(component, inplaceState)}"> + <input id="#{clientId}:input" autocomplete="off" name="#{clientId}" + type="text" value="#{getInputValue(facesContext, component)}" class="rf-ii-fld" style="width: #{component.attributes['inputWidth']};" cdk:passThrough="tabIndex"> + <cdk:call expression="renderInputHandlers(facesContext, component);"/> + </input> + <c:if test="#{component.attributes['showControls']}"> + <span class="rf-ii-btn-prepos"> + <span class="rf-ii-btn-pos"> + <span id="#{clientId}:btnshadow" class="rf-ii-btn-shadow"> + <span class="rf-ii-btn-shdw-t"></span> + <span class="rf-ii-btn-shdw-l"></span> + <span class="rf-ii-btn-shdw-r"></span> + <span class="rf-ii-btn-shdw-b"></span> + + <span id="#{clientId}:btn" style="position : relative"> + <input type="image" + id="#{clientId}:okbtn" + src="#{getResourcePath(facesContext, 'org.richfaces/ico_ok.gif')}" + class="rf-ii-btn" onmousedown="this.className='rf-ii-btn-p'" + onmouseout="this.className='rf-ii-btn'" onmouseup="this.className='rf-ii-btn'" /> + <input type="image" + id="#{clientId}:cancelbtn" + src="#{getResourcePath(facesContext,'org.richfaces/ico_cancel.gif')}" + class="rf-ii-btn" onmousedown="this.className='rf-ii-btn-press'" + onmouseout="this.className='rf-ii-btn'" onmouseup="this.className='rf-ii-btn'" /> + <br /> + </span> </span> </span> </span> - </span> - </c:if> - </span> - <script type="text/javascript"> - <cdk:call expression="buildScript(responseWriter, facesContext, component, null);"/> - </script> + </c:if> + </span> + <script type="text/javascript"> + <cdk:call expression="buildScript(responseWriter, facesContext, component, null);"/> + </script> + </c:if> </span> </cc:implementation> </cdk:root> \ No newline at end of file Modified: branches/RF-8742/ui/input/ui/src/main/templates/inplaceSelect.template.xml =================================================================== --- branches/RF-8742/ui/input/ui/src/main/templates/inplaceSelect.template.xml 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/main/templates/inplaceSelect.template.xml 2010-10-13 18:43:22 UTC (rev 19558) @@ -37,66 +37,68 @@ <cdk:object type="java.util.List" type-arguments="InplaceSelectBaseRenderer.ClientSelectItem" name="clientSelectItems" value="#{getConvertedSelectItems(facesContext, component)}" /> - <span id="#{clientId}" class="#{getReadyStyleClass(component, inplaceState)}" + <span id="#{clientId}" class="#{getStateStyleClass(component, inplaceState)}" cdk:passThroughWithExclusions="id class"> <span id="#{clientId}:label" class="rf-is-lbl"> #{inplaceValue} </span> - <input id="#{clientId}:focus" type="image" style="position: absolute; top: 0px; left: 0px; outline-style: none;" class="rf-is-none" /> - - <span id="#{clientId}:edit" class="#{getEditStyleClass(component, inplaceState)}"> - <input id="#{clientId}selValue" name="#{clientId}" type="hidden" value="#{getValue(facesContext, component)}"/> - <input id="#{clientId}:input" autocomplete="off" - type="text" value="#{getSelectInputLabel(facesContext, component)}" - class="rf-is-fld" style="width: #{component.attributes['inputWidth']};" readonly="readonly" - cdk:passThrough="tabIndex"> - <cdk:call expression="renderInputHandlers(facesContext, component);" /> - </input> - <c:if test="#{component.attributes['showControls']}"> - <span class="rf-is-btn-prepos"> - <span class="rf-is-btn-pos"> - <span id="#{clientId}:btnshadow" class="rf-is-shdw"> + <c:if test="#{!isDisable(inplaceState)}"> + <input id="#{clientId}:focus" type="image" style="position: absolute; top: 0px; left: 0px; outline-style: none;" class="rf-is-none" /> + + <span id="#{clientId}:edit" class="#{getEditStyleClass(component, inplaceState)}"> + <input id="#{clientId}selValue" name="#{clientId}" type="hidden" value="#{getValue(facesContext, component)}"/> + <input id="#{clientId}:input" autocomplete="off" + type="text" value="#{getSelectInputLabel(facesContext, component)}" + class="rf-is-fld" style="width: #{component.attributes['inputWidth']};" readonly="readonly" + cdk:passThrough="tabIndex"> + <cdk:call expression="renderInputHandlers(facesContext, component);" /> + </input> + <c:if test="#{component.attributes['showControls']}"> + <span class="rf-is-btn-prepos"> + <span class="rf-is-btn-pos"> + <span id="#{clientId}:btnshadow" class="rf-is-shdw"> + <span class="rf-is-shdw-t"></span> + <span class="rf-is-shdw-l"></span> + <span class="rf-is-shdw-r"></span> + <span class="rf-is-shdw-b"></span> + + <span id="#{clientId}:btn" style="position : relative;"> + <input type="image" id="#{clientId}:okbtn" + src="#{getResourcePath(facesContext, 'org.richfaces/ico_ok.gif')}" + class="rf-is-btn" onmousedown="this.className='rf-is-btn-press'" + onmouseout="this.className='rf-is-btn'" onmouseup="this.className='rf-is-btn'" /> + <input type="image" id="#{clientId}:cancelbtn" + src="#{getResourcePath(facesContext,'org.richfaces/ico_cancel.gif')}" + class="rf-is-btn" onmousedown="this.className='rf-is-btn-press'" + onmouseout="this.className='rf-is-btn'" onmouseup="this.className='rf-is-btn'" /> + <br /> + </span> + </span> + </span> + </span> + </c:if> + <span id="#{clientId}List" class="rf-is-none rf-is-lst-cord"> + <span class="rf-is-lst-pos" style="width: #{component.attributes['listWidth']}"> + <span class="rf-is-shdw"> <span class="rf-is-shdw-t"></span> <span class="rf-is-shdw-l"></span> <span class="rf-is-shdw-r"></span> <span class="rf-is-shdw-b"></span> - - <span id="#{clientId}:btn" style="position : relative;"> - <input type="image" id="#{clientId}:okbtn" - src="#{getResourcePath(facesContext, 'org.richfaces/ico_ok.gif')}" - class="rf-is-btn" onmousedown="this.className='rf-is-btn-press'" - onmouseout="this.className='rf-is-btn'" onmouseup="this.className='rf-is-btn'" /> - <input type="image" id="#{clientId}:cancelbtn" - src="#{getResourcePath(facesContext,'org.richfaces/ico_cancel.gif')}" - class="rf-is-btn" onmousedown="this.className='rf-is-btn-press'" - onmouseout="this.className='rf-is-btn'" onmouseup="this.className='rf-is-btn'" /> - <br /> + <span class="rf-is-lst-dec"> + <span class="rf-is-lst-scrl" id="#{clientId}Items" style="height: #{component.attributes['listHeight']}"> + <cdk:call expression="encodeOptions(facesContext, component, clientSelectItems);"/> + </span> </span> </span> </span> </span> - </c:if> - <span id="#{clientId}List" class="rf-is-none rf-is-lst-cord"> - <span class="rf-is-lst-pos" style="width: #{component.attributes['listWidth']}"> - <span class="rf-is-shdw"> - <span class="rf-is-shdw-t"></span> - <span class="rf-is-shdw-l"></span> - <span class="rf-is-shdw-r"></span> - <span class="rf-is-shdw-b"></span> - <span class="rf-is-lst-dec"> - <span class="rf-is-lst-scrl" id="#{clientId}Items" style="height: #{component.attributes['listHeight']}"> - <cdk:call expression="encodeOptions(facesContext, component, clientSelectItems);"/> - </span> - </span> - </span> - </span> </span> - </span> - <script type="text/javascript"> - <cdk:call expression="buildScript(responseWriter, facesContext, component, clientSelectItems);" /> - </script> + <script type="text/javascript"> + <cdk:call expression="buildScript(responseWriter, facesContext, component, clientSelectItems);" /> + </script> + </c:if> </span> </cc:implementation> </cdk:root> \ No newline at end of file Modified: branches/RF-8742/ui/input/ui/src/test/java/org/richfaces/renderkit/InplaceInputRendererTest.java =================================================================== --- branches/RF-8742/ui/input/ui/src/test/java/org/richfaces/renderkit/InplaceInputRendererTest.java 2010-10-13 17:50:11 UTC (rev 19557) +++ branches/RF-8742/ui/input/ui/src/test/java/org/richfaces/renderkit/InplaceInputRendererTest.java 2010-10-13 18:43:22 UTC (rev 19558) @@ -69,7 +69,7 @@ HtmlElement edit = page.getFirstByXPath("//*[@id = 'form:input_default:edit']"); assertEquals("span", edit.getNodeName()); - assertEquals("rf-ii-e-s rf-ii-none", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); + assertEquals("rf-ii-edit rf-ii-none", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); HtmlElement input = (HtmlElement)edit.getFirstChild(); assertEquals("input", input.getNodeName()); @@ -87,7 +87,7 @@ HtmlElement span = page.getFirstByXPath("//*[@id = 'form:input_edit']"); assertEquals("span", span.getNodeName()); - assertEquals("rf-ii-d-s", span.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); + assertEquals("rf-ii-d-s rf-ii-e-s", span.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); HtmlElement label = (HtmlElement)span.getFirstChild(); assertEquals("span", label.getNodeName()); @@ -97,7 +97,7 @@ HtmlElement edit = page.getFirstByXPath("//*[@id = 'form:input_edit:edit']"); assertEquals("span", edit.getNodeName()); - assertEquals("rf-ii-e-s", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); + assertEquals("rf-ii-edit", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); HtmlElement input = (HtmlElement)edit.getFirstChild(); assertEquals("input", input.getNodeName()); @@ -145,7 +145,7 @@ HtmlElement span = page.getFirstByXPath("//*[@id = 'form:" + inplaceInputId + "']"); span.click(); HtmlElement edit = page.getFirstByXPath("//*[@id = 'form:" + inplaceInputId + ":edit']"); - assertEquals("rf-ii-e-s", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); + assertEquals("rf-ii-edit", edit.getAttribute(HtmlConstants.CLASS_ATTRIBUTE)); typeNewValue(page, inplaceInputId, value); }