Author: abelevich Date: 2008-09-26 11:03:07 -0400 (Fri, 26 Sep 2008) New Revision: 10581 Modified: trunk/ui/inplaceInput/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java trunk/ui/inplaceInput/src/main/resources/org/richfaces/renderkit/html/scripts/inplaceinput.js trunk/ui/inplaceInput/src/main/templates/inplaceinput.jspx Log: https://jira.jboss.org/jira/browse/RF-4280 Modified: trunk/ui/inplaceInput/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java =================================================================== --- trunk/ui/inplaceInput/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java 2008-09-26 15:02:46 UTC (rev 10580) +++ trunk/ui/inplaceInput/src/main/java/org/richfaces/renderkit/InplaceInputBaseRenderer.java 2008-09-26 15:03:07 UTC (rev 10581) @@ -27,71 +27,10 @@ private static Log logger = LogFactory.getLog(InplaceInputBaseRenderer.class); private static final String CONTROLS_FACET = "controls"; - - private static final String INPLACE_COMPONENT = "COMPONENT"; - - private static final String INPLACE_CHANGED = "CHANGED"; - - private static final String INPLACE_VIEW = "VIEW"; - - private static final String INPLACE_EDITABLE = "EDITABLE"; - - private static final String INPLACE_NORMAL = "NORMAL"; - - private static final String INPLACE_HOVERED = "HOVERED"; - - private static final String INPLACE_CSS_PUBLIC = "rich-inplace"; - - private static final String INPLACE_CSS_VIEW = "view"; - - private static final String INPLACE_CSS_EDITABLE = "edit"; - - private static final String INPLACE_CSS_CHANGE = "changed"; - - private static final String INPLACE_CSS_HOVER = "hover"; - + private static final String EMPTY_DEFAULT_LABEL = "\u00a0\u00a0\u00a0"; - private static enum States { - NORMAL {String createCss(UIComponent component, String suffix){ - StringBuilder builder = new StringBuilder(); - builder.append(INPLACE_CSS_PUBLIC); - builder.append(" "); - builder.append(INPLACE_CSS_PUBLIC + "-" + suffix); - Object value = component.getAttributes().get(suffix + "Class"); - if (value != null) { - builder.append(" "); - builder.append(value); - } - return builder.toString(); - };}, - HOVERED {String createCss(UIComponent component , String suffix){ - StringBuilder builder = new StringBuilder(); - builder.append(INPLACE_CSS_PUBLIC + "-" + "input-" + suffix + "-" + INPLACE_CSS_HOVER); - Object value = component.getAttributes().get(suffix + "HoverClass"); - if (value != null) { - builder.append(" "); - builder.append(value); - } - return builder.toString(); - }}, - EDIT {String createCss(UIComponent component, String suffix){ - StringBuilder builder = new StringBuilder(); - builder.append(INPLACE_CSS_PUBLIC); - builder.append(" "); - builder.append(INPLACE_CSS_PUBLIC + "-" + suffix); - Object value = component.getAttributes().get(suffix + "Class"); - if (value != null) { - builder.append(" "); - builder.append(value); - } - return builder.toString(); - }}; - abstract String createCss(UIComponent component, String suffix); - }; - - - + protected Class<? extends UIComponent> getComponentClass() { return UIInplaceInput.class; } @@ -190,34 +129,6 @@ return events.toString(); } - public String encodeInplaceInputCss(FacesContext context, UIComponent component) { - StringBuilder cssMap = new StringBuilder(); - cssMap.append("var classes = "); - - ScriptOptions mainMap = new ScriptOptions(component); - ScriptOptions componentClasses = new ScriptOptions(component); - ScriptOptions changedClasses = new ScriptOptions(component); - ScriptOptions viewClasses = new ScriptOptions(component); - - changedClasses.addOption(INPLACE_NORMAL, createCss(component, States.NORMAL, INPLACE_CSS_CHANGE) ); - changedClasses.addOption(INPLACE_HOVERED, createCss(component,States.HOVERED, INPLACE_CSS_CHANGE)); - - viewClasses.addOption(INPLACE_NORMAL, createCss(component, States.NORMAL, INPLACE_CSS_VIEW) );; - viewClasses.addOption(INPLACE_HOVERED, createCss(component,States.HOVERED, INPLACE_CSS_VIEW)); - - componentClasses.addOption(INPLACE_CHANGED,changedClasses); - componentClasses.addOption(INPLACE_VIEW, viewClasses); - componentClasses.addOption(INPLACE_EDITABLE,createCss(component, States.EDIT, INPLACE_CSS_EDITABLE)); - - mainMap.addOption(INPLACE_COMPONENT, componentClasses); - cssMap.append(mainMap.toString()); - return cssMap.toString(); - } - - private String createCss(UIComponent component, States state, String suffix) { - return state.createCss(component, suffix); - } - public String getAsEventHandler(FacesContext context, UIComponent component, String attributeName) { JSFunctionDefinition script = getUtils().getAsEventHandler(context, component, attributeName, null); return ScriptUtils.toScript(script); Modified: trunk/ui/inplaceInput/src/main/resources/org/richfaces/renderkit/html/scripts/inplaceinput.js =================================================================== --- trunk/ui/inplaceInput/src/main/resources/org/richfaces/renderkit/html/scripts/inplaceinput.js 2008-09-26 15:02:46 UTC (rev 10580) +++ trunk/ui/inplaceInput/src/main/resources/org/richfaces/renderkit/html/scripts/inplaceinput.js 2008-09-26 15:03:07 UTC (rev 10581) @@ -4,7 +4,7 @@ Richfaces.InplaceInput.prototype = { //TODO: remove $$$$$ - initialize: function(clientId, temValueKeepId, valueKeepId, tabberId, attributes, events, classes, barParams) { + initialize: function(clientId, temValueKeepId, valueKeepId, tabberId, attributes, events, userStyles, commonStyles, barParams) { //TODO: delete tabberId from parameters this.inplaceInput = $(clientId); this.inplaceInput.component = this; @@ -13,8 +13,7 @@ this.valueKeeper = $(valueKeepId); this.attributes = attributes; this.events = events; - - this.classes = classes; + //TODO: static methods are preferred to be called within constructor this.currentText = this.getCurrentText(); this.value = this.valueKeeper.value; @@ -35,6 +34,7 @@ this.initHandlers(); this.initEvents(); + this.classes = Richfaces.mergeStyles(userStyles,commonStyles); this["rich:destructor"] = "destroy"; this.skipSwitching = false; @@ -81,12 +81,12 @@ //TODO: Nick recommends regexp var className = this.inplaceInput.className; if (this.currentState == Richfaces.InplaceInput.STATES[0]) { - if (className.indexOf(this.classes.COMPONENT.VIEW.HOVERED) == -1) { - className += " " + this.classes.COMPONENT.VIEW.HOVERED; + if (className.indexOf(this.classes.component.view.hovered) == -1) { + className += " " + this.classes.component.view.hovered; } } else if (this.currentState == Richfaces.InplaceInput.STATES[2]) { - if (className.indexOf(this.classes.COMPONENT.CHANGED.HOVERED) == -1) { - className += " " + this.classes.COMPONENT.CHANGED.HOVERED; + if (className.indexOf(this.classes.component.changed.hovered) == -1) { + className += " " + this.classes.component.changed.hovered; } } this.inplaceInput.className = className; @@ -94,9 +94,9 @@ inplaceMouseOutHandler : function(e) { if (this.currentState == Richfaces.InplaceInput.STATES[0]) { - this.inplaceInput.className = this.classes.COMPONENT.VIEW.NORMAL; + this.inplaceInput.className = this.classes.component.view.normal; } else if (this.currentState == Richfaces.InplaceInput.STATES[2]) { - this.inplaceInput.className = this.classes.COMPONENT.CHANGED.NORMAL; + this.inplaceInput.className = this.classes.component.changed.normal; } }, @@ -204,7 +204,7 @@ var inputSize = this.setInputWidth(textWidth); this.tempValueKeeper.style.clip = 'rect(auto auto auto auto)'; - this.inplaceInput.className = this.classes.COMPONENT.EDITABLE; + this.inplaceInput.className = this.classes.component.editable; if (this.bar) { this.bar.show(inputSize, this.tempValueKeeper.offsetHeight); @@ -221,7 +221,7 @@ this.changeState(Richfaces.InplaceInput.STATES[0]); this.createNewText(this.currentText); - this.inplaceInput.className = this.classes.COMPONENT.VIEW.NORMAL; + this.inplaceInput.className = this.classes.component.view.normal; //TODO: see above this.inplaceInput.observe("mouseover", function(e){this.inplaceMouseOverHandler(e);}.bindAsEventListener(this)); }, @@ -232,7 +232,7 @@ this.changeState(Richfaces.InplaceInput.STATES[2]); this.createNewText(this.currentText); - this.inplaceInput.className = this.classes.COMPONENT.CHANGED.NORMAL; + this.inplaceInput.className = this.classes.component.changed.normal; }, /** Modified: trunk/ui/inplaceInput/src/main/templates/inplaceinput.jspx =================================================================== --- trunk/ui/inplaceInput/src/main/templates/inplaceinput.jspx 2008-09-26 15:02:46 UTC (rev 10580) +++ trunk/ui/inplaceInput/src/main/templates/inplaceinput.jspx 2008-09-26 15:03:07 UTC (rev 10581) @@ -16,6 +16,7 @@ new org.ajax4jsf.javascript.PrototypeScript(), scripts/comboboxUtils.js, scripts/inplaceinput.js, + scripts/inplaceinputstyles.js, scripts/utils.js </h:scripts> <f:resource var="saveIcon" name="org.richfaces.renderkit.html.images.SaveControlIcon"/> @@ -164,10 +165,24 @@ #{this:encodeScriptAttributes(context, component)}; #{this:encodeScriptEvents(context, component)}; - #{this:encodeInplaceInputCss(context, component)}; + + var inplaceInputUserStyles = { + component:{ + view :{ + normal:'#{component.attributes["viewClass"]}', + hovered:'#{component.attributes["viewHoverClass"]}' + }, + changed:{ + normal:'#{component.attributes["changedClass"]}', + hovered:'#{component.attributes["changedHoverClass"]}', + }, + editable:'#{component.attributes["editClass"]}' + + } + }; var inplaceInput = new Richfaces.InplaceInput('#{clientId}', '#{clientId}tempValue', '#{clientId}value', '#{clientId}tabber', - attributes, events, classes, ['#{clientId}bar', + attributes, events, inplaceInputUserStyles, Richfaces.InplaceInput.classes, ['#{clientId}bar', '#{clientId}ok', '#{clientId}cancel', '#{clientId}buttons','#{clientId}btns_shadow']); </script> </div>