Author: abelevich Date: 2007-11-21 08:35:25 -0500 (Wed, 21 Nov 2007) New Revision: 4134 Modified: trunk/ui/dataFilterSlider/src/main/config/component/dataFilterSlider.xml trunk/ui/dataFilterSlider/src/main/java/org/richfaces/component/UIDataFltrSlider.java trunk/ui/dataFilterSlider/src/main/java/org/richfaces/renderkit/DataFilterSliderRendererBase.java trunk/ui/dataFilterSlider/src/main/resources/org/richfaces/renderkit/html/scripts/scriptaculous-js-1.6.5/src/slider.js trunk/ui/dataFilterSlider/src/main/templates/dataFilterSlider.jspx Log: add onslide, onchange client events, add onSlideSubmit attribute (in the context of RF-256) Modified: trunk/ui/dataFilterSlider/src/main/config/component/dataFilterSlider.xml =================================================================== --- trunk/ui/dataFilterSlider/src/main/config/component/dataFilterSlider.xml 2007-11-21 12:26:40 UTC (rev 4133) +++ trunk/ui/dataFilterSlider/src/main/config/component/dataFilterSlider.xml 2007-11-21 13:35:25 UTC (rev 4134) @@ -157,23 +157,33 @@ MethodBinding representing an action listener method that will be notified after changing of slider control position </description> </property> + <property> - <name>onSlide</name> - <classname>boolean</classname> + <name>onslide</name> + <classname>java.lang.String</classname> <description> - If the slider value changes must submit a form, onSlide or OnChange can be true + Event occur on sliding </description> - <defaultvalue>true</defaultvalue> + <defaultvalue><![CDATA[""]]></defaultvalue> </property> + <property> - <name>onChange</name> - <classname>boolean</classname> + <name>onchange</name> + <classname>java.lang.String</classname> <description> - If the slider value changes must submit a form, onSlide or OnChange can be true + Event occur on chage </description> - <defaultvalue>true</defaultvalue> + <defaultvalue><![CDATA[""]]></defaultvalue> </property> + <property> + <name>onSlideSubmit</name> + <classname>boolean</classname> + <description>If the slider value changes must submit a form, onSlideSubmit can be true</description> + <defaultvalue>true</defaultvalue> + </property> + + <property> <name>storeResults</name> <classname>boolean</classname> <description> Modified: trunk/ui/dataFilterSlider/src/main/java/org/richfaces/component/UIDataFltrSlider.java =================================================================== --- trunk/ui/dataFilterSlider/src/main/java/org/richfaces/component/UIDataFltrSlider.java 2007-11-21 12:26:40 UTC (rev 4133) +++ trunk/ui/dataFilterSlider/src/main/java/org/richfaces/component/UIDataFltrSlider.java 2007-11-21 13:35:25 UTC (rev 4134) @@ -248,14 +248,10 @@ public abstract void setTrackStyleClass(String trackStyleClass); - public abstract boolean isOnSlide(); - - public abstract void setOnSlide(boolean onSlide); - - public abstract boolean isOnChange(); - - public abstract void setOnChange(boolean onChange); - + public abstract boolean isOnSlideSubmit(); + + public abstract void setOnSlideSubmit(boolean value); + public abstract boolean isStoreResults(); public abstract void setStoreResults(boolean storeResults); Modified: trunk/ui/dataFilterSlider/src/main/java/org/richfaces/renderkit/DataFilterSliderRendererBase.java =================================================================== --- trunk/ui/dataFilterSlider/src/main/java/org/richfaces/renderkit/DataFilterSliderRendererBase.java 2007-11-21 12:26:40 UTC (rev 4133) +++ trunk/ui/dataFilterSlider/src/main/java/org/richfaces/renderkit/DataFilterSliderRendererBase.java 2007-11-21 13:35:25 UTC (rev 4134) @@ -21,9 +21,8 @@ package org.richfaces.renderkit; -import org.ajax4jsf.util.SelectUtils; -import org.richfaces.component.UIDataFltrSlider; -import org.richfaces.event.DataFilterSliderEvent; +import java.io.IOException; +import java.util.Map; import javax.faces.component.UIComponent; import javax.faces.component.UIForm; @@ -31,9 +30,14 @@ import javax.faces.context.ExternalContext; import javax.faces.context.FacesContext; import javax.faces.convert.ConverterException; -import java.io.IOException; -import java.util.Map; +import org.ajax4jsf.javascript.JSFunction; +import org.ajax4jsf.javascript.JSFunctionDefinition; +import org.ajax4jsf.javascript.JSReference; +import org.ajax4jsf.util.SelectUtils; +import org.richfaces.component.UIDataFltrSlider; +import org.richfaces.event.DataFilterSliderEvent; + /** * @author Wesley Hales */ @@ -50,32 +54,64 @@ public Map getRequestMap() { return FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap(); } + + public String getEventHandlerFunction(UIDataFltrSlider slider,String eventName){ + + String returnScript = null; + Object script = (String) slider.getAttributes().get(eventName); + if(script != null && !script.equals("")){ + JSFunctionDefinition jsFunctionDefinition = new JSFunctionDefinition(); + jsFunctionDefinition.addParameter("event"); + jsFunctionDefinition.addToBody(script); + returnScript = jsFunctionDefinition.toScript(); + } + + return returnScript; + } public String renderSliderJs1(FacesContext context, UIDataFltrSlider slider) throws IOException { - - String clientId = slider.getClientId(context); - - String sliderScript = "var dataFilterSlider = new Control.Slider('"+ clientId +"slider-handle', '"+ clientId +"slider-track', {\n" + - "range: $R(" + slider.getStartRange() + "," + slider.getEndRange() + "),\n" + - "values: [" + slider.getSliderRange() + "],\n" + - "startSpan: '"+ clientId +"slider-trailer',\n" + - "sliderValue:$('"+ clientId +"slider_val').value"; - - if (slider.isOnSlide()) { - sliderScript = sliderScript + - ",\nonSlide: function(v) { updateSlider1(v);}"; + + StringBuffer script = new StringBuffer(); + String clientId = slider.getClientId(context); + script.append("var dataFilterSlider = "); + script.append("new "); + + StringBuffer options = new StringBuffer(); + options.append("{"); + options.append("range: $R(" + slider.getStartRange() + "," + slider.getEndRange() + ")"); + options.append(",values: [" + slider.getSliderRange() + "]"); + options.append(",startSpan: '"+ clientId +"slider-trailer'"); + options.append(",sliderInputId: '" + clientId + "slider_val'"); + options.append(",sliderValue:$('"+ clientId +"slider_val').value"); + + String onslide = getEventHandlerFunction(slider, "onslide"); + if(onslide != null){ + options.append(", onslide: " + onslide); + } + + String onchange = getEventHandlerFunction(slider, "onchange"); + if(onchange != null){ + options.append(", onchange: " + onchange); + } + + if(slider.isOnSlideSubmit()){ + options.append(",onSlideSubmit: function(v) { updateSlider1(v);}"); } + options.append("}"); + + JSReference reference = new JSReference(options.toString()); + + JSFunction function = new JSFunction("Control.Slider"); + function.addParameter(clientId + "slider-handle"); + function.addParameter(clientId + "slider-track"); + function.addParameter(reference); + function.appendScript(script); + script.append(";"); + + return script.toString(); + } + - if (slider.isOnChange()) { - sliderScript = sliderScript + - ",\nonChange: function(v) { updateSlider1(v);}\n"; - } - - sliderScript = sliderScript + " });\n"; - - return sliderScript; - } - public String renderSliderJs2(FacesContext context, UIDataFltrSlider slider) throws IOException { String clientId = slider.getClientId(context); Modified: trunk/ui/dataFilterSlider/src/main/resources/org/richfaces/renderkit/html/scripts/scriptaculous-js-1.6.5/src/slider.js =================================================================== --- trunk/ui/dataFilterSlider/src/main/resources/org/richfaces/renderkit/html/scripts/scriptaculous-js-1.6.5/src/slider.js 2007-11-21 12:26:40 UTC (rev 4133) +++ trunk/ui/dataFilterSlider/src/main/resources/org/richfaces/renderkit/html/scripts/scriptaculous-js-1.6.5/src/slider.js 2007-11-21 13:35:25 UTC (rev 4134) @@ -37,6 +37,7 @@ this.spans = this.options.spans ? this.options.spans.map(function(s){ return $(s) }) : false; this.options.startSpan = $(this.options.startSpan || null); this.options.endSpan = $(this.options.endSpan || null); + this.sliderInput = $(this.options.sliderInputId); this.restricted = this.options.restricted || false; @@ -74,6 +75,7 @@ this.handles[0].style.visibility="hidden"; setTimeout(this.initHandles.bind(this), 100); this.initialized = true; + }, initHandles: function() { this.handleLength = this.isVertical() ? @@ -256,7 +258,8 @@ update: function(event) { if(this.active) { if(!this.dragging) this.dragging = true; - this.draw(event); + this.draw(event); + // fix AppleWebKit rendering if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0); Event.stop(event); @@ -268,18 +271,19 @@ pointer[0] -= this.offsetX + offsets[0]; pointer[1] -= this.offsetY + offsets[1]; this.event = event; - this.setValue(this.translateToValue( this.isVertical() ? pointer[1] : pointer[0] )); + var value = this.translateToValue( this.isVertical() ? pointer[1] : pointer[0] ); + if(this.invokeEvent("slide",event,value,this.sliderInput)){ + this.setValue(value); + } if(this.initialized) { - if (this.options.onSlide) { - this.options.onSlide(this.values.length>1 ? this.values : this.values[0], this); - } else if (this.options.onChange) { - this.options.onChange(this.values.length>1 ? this.values : this.values[0], this); - } + if (this.options.onSlideSubmit) { + this.options.onSlideSubmit(this.values.length>1 ? this.values : this.values[0], this); + } } }, endDrag: function(event) { if(this.active && this.dragging) { - this.finishDrag(event, true); + this.finishDrag(event, true); Event.stop(event); } this.active = false; @@ -288,16 +292,63 @@ finishDrag: function(event, success) { this.active = false; this.dragging = false; - this.updateFinished(); + + this.updateFinished(event); }, updateFinished: function() { if(this.initialized) { - if (this.options.onSlide) { - this.options.onSlide(this.values.length>1 ? this.values : this.values[0], this); - } else if (this.options.onChange) { - this.options.onChange(this.values.length>1 ? this.values : this.values[0], this); + var value = this.values.length>1 ? this.values : this.values[0]; + if (this.options.onSlideSubmit) { + this.options.onSlideSubmit(value, this); + } + } + + this.event = null; + }, + + valueChanged: function(event,value){ + if(this.invokeEvent("change",event,value,this.sliderInput)){ + this.setValue(value); + } + }, + + invokeEvent: function(eventName, event, value, element) { + + var eventFunction = this.options['on'+eventName]; + var result; + + if (eventFunction) + { + var eventObj; + + if (event) + { + eventObj = event; + } + else if( document.createEventObject ) + { + eventObj = document.createEventObject(); + } + else if( document.createEvent ) + { + eventObj = document.createEvent('Events'); + eventObj.initEvent( eventName, true, false ); + } + + eventObj.rich = {component:this}; + eventObj.rich.value = value; + + try + { + result = eventFunction.call(element, eventObj); + } + catch (e) { LOG.warn("Exception: "+e.Message + "\n[on"+eventName + "]"); } + } + + if (result!=false) result = true; + + return result; } - this.event = null; - } + } \ No newline at end of file Modified: trunk/ui/dataFilterSlider/src/main/templates/dataFilterSlider.jspx =================================================================== --- trunk/ui/dataFilterSlider/src/main/templates/dataFilterSlider.jspx 2007-11-21 12:26:40 UTC (rev 4133) +++ trunk/ui/dataFilterSlider/src/main/templates/dataFilterSlider.jspx 2007-11-21 13:35:25 UTC (rev 4134) @@ -63,7 +63,7 @@ ]]> </jsp:scriptlet> - <input type="text" onchange="dataFilterSlider.setValue(this.value);" class="slider-input-field #{component.fieldStyleClass}" name="#{clientId}slider_val" id="#{clientId}slider_val" value="#{component.handleValue}"/> + <input type="text" onchange="dataFilterSlider.valueChanged(event,this.value);" class="slider-input-field #{component.fieldStyleClass}" name="#{clientId}slider_val" id="#{clientId}slider_val" value="#{component.handleValue}"/> <jsp:scriptlet> <![CDATA[