Author: abelevich Date: 2010-04-07 13:48:00 -0400 (Wed, 07 Apr 2010) New Revision: 16744 Added: root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/subtable.js Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/component/UISubTable.java root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/SubTableRenderer.java root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/ToggleControlRendererBase.java root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/toggler.js root/ui-sandbox/trunk/components/tables/ui/src/main/templates/org/richfaces/renderkit/html/toggle-control.template.xml Log: start implement subTable expand collapse Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/component/UISubTable.java =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/component/UISubTable.java 2010-04-07 17:27:33 UTC (rev 16743) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/component/UISubTable.java 2010-04-07 17:48:00 UTC (rev 16744) @@ -22,6 +22,7 @@ package org.richfaces.component; import javax.el.MethodExpression; +import javax.faces.application.ResourceDependency; import org.richfaces.event.ToggleListener; @@ -30,6 +31,7 @@ * */ +@ResourceDependency(name = "subtable.js") public class UISubTable extends UIDataTableBase implements Column, Expandable { enum PropertyKeys { Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/SubTableRenderer.java =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/SubTableRenderer.java 2010-04-07 17:27:33 UTC (rev 16743) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/SubTableRenderer.java 2010-04-07 17:48:00 UTC (rev 16744) @@ -1,7 +1,10 @@ package org.richfaces.renderkit; import java.io.IOException; +import java.text.MessageFormat; +import java.util.HashMap; import java.util.Iterator; +import java.util.Map; import javax.faces.component.UIColumn; import javax.faces.component.UIComponent; @@ -14,6 +17,8 @@ import org.richfaces.component.UISubTable; public class SubTableRenderer extends AbstractTableRenderer { + + private static final String SUBTABLE_SCRIPT = "new RichFaces.ui.SubTable(''{0}'', {1});"; @Override public void encodeTableFacets(ResponseWriter writer, FacesContext context, UIDataTableBase dataTable) @@ -61,10 +66,12 @@ } @Override - protected void doEncodeEnd(ResponseWriter writer, FacesContext context, UIComponent component) throws IOException { + protected void doEncodeEnd(ResponseWriter writer, FacesContext facesContext, UIComponent component) throws IOException { UISubTable subTable = (UISubTable)component; - encodeFooterFacet(writer, context, subTable); - encodeTableBodyEnd(writer, context, subTable); + encodeFooterFacet(writer, facesContext, subTable); + encodeClientScript(writer, facesContext, subTable); + encodeTableBodyEnd(writer, facesContext, subTable); + } @Override @@ -79,12 +86,18 @@ } @Override - public void encodeClientScript(ResponseWriter writer, FacesContext context, UIDataTableBase component) { - // TODO Auto-generated method stub + public void encodeClientScript(ResponseWriter writer, FacesContext facesContext, UIDataTableBase component) throws IOException { + UISubTable subTable = (UISubTable)component; + String id = subTable.getClientId(facesContext); + Map<String, Object> options = new HashMap<String, Object>(); + String script = MessageFormat.format(SUBTABLE_SCRIPT, id, options); + + writer.startElement(HTML.SCRIPT_ELEM, subTable); + writer.writeText(script, null); + writer.endElement(HTML.SCRIPT_ELEM); } - - + @Override public String getRowSkinClass() { return "rich-subtable-row"; Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/ToggleControlRendererBase.java =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/ToggleControlRendererBase.java 2010-04-07 17:27:33 UTC (rev 16743) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/java/org/richfaces/renderkit/ToggleControlRendererBase.java 2010-04-07 17:48:00 UTC (rev 16744) @@ -8,7 +8,6 @@ import javax.faces.application.ResourceDependencies; import javax.faces.application.ResourceDependency; import javax.faces.component.UIComponent; -import javax.faces.component.UIForm; import javax.faces.context.FacesContext; import javax.faces.context.ResponseWriter; @@ -29,14 +28,10 @@ public abstract class ToggleControlRendererBase extends RendererBase { - private static final String MANAGER_SCRIPT = "RichFaces.ui.ToggleManager.addToggler(new RichFaces.ui.Toggle(''{0}'', {1}));"; - private static final String CLIENT_TOGGLE_SCRIPT = "RichFaces.ui.ToggleManager.clientToggle(''{0}'', {1});"; + private static final String DATATABLE_TOGGLER_SCRIPT = "new RichFaces.ui.DataTableToggler(''{0}'', {1});"; - private static final String SERVER_TOGGLE_SCRIPT = "RichFaces.ui.ToggleManager.serverToggle(''{0}'', {1});"; - private static final String AJAX_TOGGLE_SCRIPT = "RichFaces.ui.ToggleManager.ajaxToggle(''{0}'', {1});"; - private static final String DISPLAY_NONE = "display: none;"; private static final String EXPAND_STATE = "expand"; @@ -87,9 +82,9 @@ encodeControl(context, writer, toggleControl, switchType, expanded, false); encodeControl(context, writer, toggleControl, switchType, !expanded, true); - encodeHiddenInput(context, writer, toggleControl); +// encodeHiddenInput(context, writer, toggleControl); - String registerScript = MessageFormat.format(MANAGER_SCRIPT, toggleId, options); + String registerScript = MessageFormat.format(DATATABLE_TOGGLER_SCRIPT, toggleId, options); writer.startElement(HTML.SCRIPT_ELEM, subTable); writer.writeText(registerScript, null); writer.endElement(HTML.SCRIPT_ELEM); @@ -100,63 +95,56 @@ protected void encodeControl(FacesContext context, ResponseWriter writer, UIToggleControl control, String switchType, boolean expanded, boolean visible) throws IOException { String state = getState(expanded); - String script = getScript(control, switchType, expanded); - String styleClass = getStyleClass(context, control); String style = getStyle(context, control); writer.startElement(HTML.SPAN_ELEM, control); + + if (!visible) { + writer.writeAttribute(HTML.STYLE_ATTRIBUTE, DISPLAY_NONE, null); + } + + writer.writeAttribute(HTML.ID_ATTRIBUTE, control.getClientId() + ":" + state, null); writer.writeAttribute(HTML.CLASS_ATTRIBUTE, styleClass, null); writer.writeAttribute(HTML.STYLE_ATTRIBUTE, style, null); UIComponent controlFacet = control.getFacet(state); if(controlFacet != null && controlFacet.isRendered()) { + if(!visible) { String facetStyle = (String)controlFacet.getAttributes().get("style"); facetStyle = facetStyle != null ? facetStyle + "; display: none" : "; display: none"; controlFacet.getAttributes().put("style", facetStyle); - } + } + controlFacet.encodeAll(context); + } else { String image = expanded ? control.getExpandControl() : control.getCollapseControl(); if (image != null && image.trim().length() > 0) { - writer.startElement(HTML.IMG_ELEMENT, control); - writer.writeAttribute(HTML.ID_ATTRIBUTE, control.getClientId() + ":" + state, null); writer.writeAttribute(HTML.SRC_ATTRIBUTE, image, null); writer.writeAttribute(HTML.ALT_ATTRIBUTE, "", null); - - if (!visible) { - writer.writeAttribute(HTML.STYLE_ATTRIBUTE, DISPLAY_NONE, null); - } - - //TODO: anton - remove inline script ! - if (script != null && script.length() > 0) { - String eventName = control.getEvent(); - writer.writeAttribute(eventName, script, null); - } writer.endElement(HTML.IMG_ELEMENT); } + } writer.endElement(HTML.SPAN_ELEM); } public String encodeOptions(FacesContext context, UIToggleControl toggleControl, UISubTable subTable) { - UIForm nestingForm = getUtils().getNestingForm(context, toggleControl); - - String formId = nestingForm.getClientId(context); String forId = subTable.getClientId(context); - + String toggleControlId = toggleControl.getClientId(context); + HashMap<String, Object> options = new HashMap<String, Object>(); - options.put("formId", formId); options.put("forId", forId); -// options.put("initialState", (Boolean) subTable.isExpanded()); - options.put("eventName", toggleControl.getEvent()); -// if(subTable.getSwichType().equals(UISubTable.SWITCH_TYPE_AJAX)) { -// options.put("ajax", AjaxRendererUtils.buildEventOptions(context, subTable)); -// } - + options.put("expandControl", toggleControlId + ":expand"); + options.put("collapseControl", toggleControlId + ":collapse"); + + String eventName = toggleControl.getEvent(); + eventName = eventName.trim().startsWith("on") ? eventName.substring(2) : eventName; + options.put("eventName", eventName); return ScriptUtils.toScript(options); } @@ -193,21 +181,6 @@ return null; } - public String getScript(UIToggleControl toggleControl, String switchType, boolean isExpanded) { - String pattern = null; - /* - if (switchType.equals(UISubTable.SWITCH_TYPE_CLIENT)) { - pattern = CLIENT_TOGGLE_SCRIPT; - } else if (switchType.equals(UISubTable.SWITCH_TYPE_AJAX)) { - pattern = AJAX_TOGGLE_SCRIPT; - } else { - pattern = SERVER_TOGGLE_SCRIPT; - }*/ - String toggleId = toggleControl.getClientId(); - - return ""; //MessageFormat.format(pattern, toggleId, isExpanded); - } - protected String getState(boolean expand) { return expand ? EXPAND_STATE : COLLAPSE_STATE; } Added: root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/subtable.js =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/subtable.js (rev 0) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/subtable.js 2010-04-07 17:48:00 UTC (rev 16744) @@ -0,0 +1,31 @@ +(function (jQuery, richfaces) { + + richfaces.ui = richfaces.ui || {}; + + richfaces.ui.SubTable = function(id, options) { + this.id = id; + var subTable = document.getElementById(this.id); + subTable.component = this; + }; + + + jQuery.extend(richfaces.ui.SubTable, { + EXPAND :'expand', + COLLAPSE : 'collapse' + }); + + jQuery.extend(richfaces.ui.SubTable.prototype, (function () { + + return { + toggle: function() { + + }, + + getState: function() { + + } + }; + + })()); + +})(jQuery, window.RichFaces); \ No newline at end of file Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/toggler.js =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/toggler.js 2010-04-07 17:27:33 UTC (rev 16743) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/toggler.js 2010-04-07 17:48:00 UTC (rev 16744) @@ -1,142 +1,56 @@ - -// TODO: remove second closure -// TODO: -(function(jQuery, richfaces) { - - richfaces.ui = richfaces.ui || {}; - - // TODO: Make "T" small. ToggleManager is not a class - richfaces.ui.ToggleManager = {}; - - (function(manager){ - var togglers = {}; - - manager['addToggler'] = function(toggler) { - if(toggler) { - togglers[toggler.id] = toggler; - } - }; - - // TODO: Rename function names "clientToggle", "serverToggle" ... May be one function "toggle" with additional argument for type will be enough - manager['clientToggle'] = function(id, toState) { - if(id) { - togglers[id].clientToggle(toState); - } - }; - - manager['serverToggle'] = function(id, toState) { - if(id) { - togglers[id].serverToggle(toState); - } - }; - - manager['ajaxToggle'] = function(id, toState) { - if(id) { - togglers[id].ajaxToggle(toState); - } - }; - - manager['clearTogglers'] = function() { - togglers = {}; - }; - - manager['getTogglers'] = function () { - return togglers; - }; - - })(richfaces.ui.ToggleManager); - -})(jQuery, window.RichFaces); - - (function (jQuery, richfaces) { - - // TODO: not needed, was defined above - richfaces.ui = richfaces.ui || {}; - // TODO: unnecessary space in tab - richfaces.ui.Toggle = function(id, options) { - this.getElement(id).rich= {component: this}; - this.id = id; - this.hiddenInput = this.getElement(id + ":hidden"); - this.expandControl = this.getElement(id + ":expand"); - this.collapseControl = this.getElement(id + ":collapse"); - this.form = this.getElement(options.formId); - this.options = options; + + richfaces.ui = richfaces.ui || {}; + + richfaces.ui.DataTableToggler = function(id, options) { + + this.id = id; + + this.eventName = options.eventName; + this.expandControl = options.expandControl; + this.collapseControl = options.collapseControl; this.forId = options.forId; - this.state = options.initialState; + richfaces.Event.bindById(this.id, this.eventName, this.toggle, this); }; + + + jQuery.extend(richfaces.ui.DataTableToggler, { + EXPAND :'expand', + COLLAPSE : 'collapse' + }); - jQuery.extend(richfaces.ui.Toggle.prototype, ( function () { - - // REM: this=window. If you want to get this as instance to you object, you should call this function from public function using call or apply and set as context your object - var convertId = function (id){ - return id.replace(/:/g, "\\:"); - }; - - return { - getElement : function (id) { - return jQuery("#" + convertId(id)); - }, + + jQuery.extend(richfaces.ui.DataTableToggler.prototype, (function () { + + return { + + toggle: function(elem) { + var element = jQuery(document.getElementById(this.forId)); + var subtable = element.attr('component'); + + var state = subtable.getState(); + this.toggleControl(this.state); + subtable.toggle(); + }, - saveState : function(state) { - if(this.hiddenInput) { - this.hiddenInput.attr('value', state); - } - }, + toggleControl: function(state) { + var expandControl = jQuery(document.getElementById(this.expandControl)); + var collapseControl = jQuery(document.getElementById(this.collapseControl)); + + if(state == richfaces.ui.DataTableToggler.EXPAND) { + expandControl.hide(); + collapseControl.show(); + this.state = "collapse"; + } else if(state == richfaces.ui.DataTableToggler.COLLAPSE) { + collapseControl.hide(); + expandControl.show(); + this.state = "expand"; + } + } - toggle: function (toState) { - var element = this.getElement(this.forId); - if(this.state != toState) { - this.toggleControls(toState); - - if(toState) { - this.command("show", element); - } else { - this.command("hide", element); - } - - this.state = toState; - this.saveState(this.state); - } - }, - - toggleControls: function (toState){ - var hideControl = toState ? this.expandControl : this.collapseControl; - var showControl = this.state ? this.expandControl : this.collapseControl; - this.command("show", showControl); - this.command("hide", hideControl); - }, - - clientToggle: function(expand){ - this.toggle(expand); - }, - - serverToggle: function(expand){ - this.saveState(expand); - if(this.form) { - this.form.submit(); - } - }, - - ajaxToggle: function(expand){ - - this.toggle(expand); - var source = this.id; - var event = this.options.eventName; - var params = this.options.ajax; - - jsf.ajax.request(source, event, params); - }, - - command: function(name, element){ - if(name) { - if(element && typeof element[name] == 'function') { - element[name](); - } - } - } - }; - - })()); -})(jQuery, window.RichFaces); // TODO: RichFaces may be undefined \ No newline at end of file + }; + + })()); + +})(jQuery, window.RichFaces); \ No newline at end of file Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/templates/org/richfaces/renderkit/html/toggle-control.template.xml =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/templates/org/richfaces/renderkit/html/toggle-control.template.xml 2010-04-07 17:27:33 UTC (rev 16743) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/templates/org/richfaces/renderkit/html/toggle-control.template.xml 2010-04-07 17:48:00 UTC (rev 16744) @@ -13,11 +13,9 @@ </cc:interface> <cc:implementation> - <cdk:call expression="getUtils().encodeBeginFormIfNessesary(facesContext, component);"/> <span id="#{clientId}" class="#{component.attributes['styleClass']}"> <cdk:call expression="encodeControl(facesContext, component);" /> </span> - <cdk:call expression="getUtils().encodeEndFormIfNessesary(facesContext, component);"/> </cc:implementation> </cdk:root> \ No newline at end of file