Author: abelevich Date: 2007-06-07 08:56:29 -0400 (Thu, 07 Jun 2007) New Revision: 1073 Added: trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/ScrollableGrid.js Modified: trunk/sandbox-samples/scrollable-grid-demo/src/main/webapp/pages/scrollable-grid.xhtml trunk/sandbox/scrollable-grid/generatescript.xml trunk/sandbox/scrollable-grid/src/main/java/org/richfaces/renderkit/html/ScrollableGridBaseRenderer.java trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/Selection.js trunk/sandbox/scrollable-grid/src/main/templates/org/richfaces/scrollable-grid.jspx Log: fix sorting and scrolling. Move javascript from renderer template to the ScrollableGrid.js Modified: trunk/sandbox/scrollable-grid/generatescript.xml =================================================================== --- trunk/sandbox/scrollable-grid/generatescript.xml 2007-06-07 12:49:22 UTC (rev 1072) +++ trunk/sandbox/scrollable-grid/generatescript.xml 2007-06-07 12:56:29 UTC (rev 1073) @@ -44,6 +44,7 @@ <file name="/ClientUI/controls/grid/GridFooter.js"/> <file name="/ClientUI/controls/grid/Grid.js"/> <file name="/ClientUI/controls/grid/Selection.js"/> + <file name="/ClientUI/controls/grid/ScrollableGrid.js"/> </filelist> </concat> </target> Modified: trunk/sandbox/scrollable-grid/src/main/java/org/richfaces/renderkit/html/ScrollableGridBaseRenderer.java =================================================================== --- trunk/sandbox/scrollable-grid/src/main/java/org/richfaces/renderkit/html/ScrollableGridBaseRenderer.java 2007-06-07 12:49:22 UTC (rev 1072) +++ trunk/sandbox/scrollable-grid/src/main/java/org/richfaces/renderkit/html/ScrollableGridBaseRenderer.java 2007-06-07 12:56:29 UTC (rev 1073) @@ -1,14 +1,17 @@ package org.richfaces.renderkit.html; import java.io.IOException; +import java.io.Serializable; import java.util.Collection; import java.util.Iterator; import java.util.Map; +import javax.faces.application.Application; import javax.faces.component.UIComponent; import javax.faces.context.ExternalContext; import javax.faces.context.FacesContext; import javax.faces.context.ResponseWriter; +import javax.faces.convert.Converter; import org.ajax4jsf.ajax.repeat.DataVisitor; import org.ajax4jsf.framework.ajax.AjaxContext; @@ -19,14 +22,19 @@ import org.ajax4jsf.framework.renderer.RendererBase; import org.ajax4jsf.framework.renderer.RendererUtils.HTML; import org.ajax4jsf.framework.util.javascript.JSFunction; +import org.ajax4jsf.framework.util.javascript.JSFunctionDefinition; import org.ajax4jsf.framework.util.javascript.JSReference; import org.apache.commons.logging.Log; import org.apache.commons.logging.LogFactory; import org.richfaces.component.UIScrollableGrid; import org.richfaces.component.UIScrollableGridColumn; import org.richfaces.event.sort.SortEvent; +import org.richfaces.model.selection.ClientSelection; +import org.richfaces.model.selection.Selection; +import org.richfaces.model.selection.SimpleSelection; import org.richfaces.renderkit.CompositeRenderer; import org.richfaces.renderkit.RendererContributor; +import org.richfaces.renderkit.ScriptOptions; import org.richfaces.renderkit.html.response.GridScrollSettings; import org.richfaces.utils.TemplateLoader; @@ -55,6 +63,8 @@ private RendererBase headerCellTemplate = null; private RendererBase footerCellTemplate = null; + + private static final String CLIENT_SELECTION = "clientSelection"; private final Log log = LogFactory.getLog(ScrollableGridBaseRenderer.class); @@ -304,6 +314,38 @@ return "Richfaces_ScrollableGrid_" + id.replaceAll("[^A-Za-z0-9_]", "_"); } + public String createClientScrollableGrid(FacesContext context, UIScrollableGrid grid) { + + String id = grid.getBaseClientId(context); + + ScriptOptions options = new ScriptOptions(grid); + options.addOption("client_id", id); + + if(grid.getFacets().containsKey("splash")){ + UIComponent splash = grid.getFacet("splash"); + String splash_id = splash.getClientId(context); + options.addOption("splash_id", splash_id); + } + + int columnCount = grid.getChildCount(); + + options.addOption("columnsCount", new Integer(columnCount)); + options.addOption("rowsCount", new Integer(grid.getDefaultRows())); + + JSFunction function = new JSFunction("new ClientUI.controls.grid.ScrollableGrid"); + function.addParameter(options); + + JSFunctionDefinition functionDefinition = new JSFunctionDefinition(); + + JSReference sortEvent = new JSReference("event"); + functionDefinition.addParameter(sortEvent); + functionDefinition.addToBody(onSortAjaxUpdate(context, grid)); + + options.addOption("onSortAjaxUpdate", functionDefinition); + + return function.toScript(); + } + protected String getScriptContributions(FacesContext context, UIScrollableGrid grid) { return super.getScriptContributions(getJavaScriptVarName(context, grid), context, grid); } @@ -416,10 +458,10 @@ public String onSortAjaxUpdate(FacesContext context, UIScrollableGrid grid){ - JSReference sortColumn = new JSReference("sortEvent.column"); - JSReference sortOrder = new JSReference("sortEvent.order"); - JSReference sortStartRow = new JSReference("sortEvent.startRow"); - JSReference sortIndex = new JSReference("sortEvent.index"); + JSReference sortColumn = new JSReference("event.column"); + JSReference sortOrder = new JSReference("event.order"); + JSReference sortStartRow = new JSReference("event.startRow"); + JSReference sortIndex = new JSReference("event.index"); Map options = AjaxRendererUtils.buildEventOptions(context, grid); @@ -494,6 +536,126 @@ } + private void decodeSelection(FacesContext context, UIScrollableGrid grid) + throws IOException{ + + String clientId = grid.getClientId(context); + String id = clientId + "_selection"; + ExternalContext externalContext = context.getExternalContext(); + Map requestParamMap = externalContext.getRequestParameterMap(); + Application application = context.getApplication(); + + String value = (String) requestParamMap.get(id); + + Converter converter = application.createConverter(ClientSelection.class); + + ClientSelection _oldClientSelection = + (ClientSelection) grid.getAttributes().get(CLIENT_SELECTION); + + final ClientSelection oldClientSelection = + _oldClientSelection == null ? + new ClientSelection() : + _oldClientSelection; + + final ClientSelection clientSelection = + (ClientSelection) converter.getAsObject(context, grid, value); + + + + //FIXME: Obscure code. Hope Anton will make it more clear + final GridRendererState state = GridRendererState.createState(context, grid); + + final SimpleSelection simpleSelection = new SimpleSelection(); + + grid.walk(context, + new DataVisitor() { + public void process(FacesContext context, Object rowKey, + Object argument) throws IOException { + + int i = state.getRowIndex(); + + if (shouldAddToSelection(i, oldClientSelection, clientSelection)) { + + simpleSelection.addKey((Serializable)rowKey); + + } else if (shouldRemoveFromSelection(i, oldClientSelection, clientSelection)){ + + simpleSelection.removeKey((Serializable) rowKey); + + } + + } + }, + state); + + + GridRendererState.restoreState(context); + + //FIXME: + + + } + + //Decide whether to add new row to selection based on comparison with old one + private boolean shouldAddToSelection(int i, ClientSelection oldSelection, ClientSelection newSelection) { + return false; + } + + //Decide whether to remove new row to selection based on comparison with old one + private boolean shouldRemoveFromSelection(int i, ClientSelection oldSelection, ClientSelection newSelection) { + return false; + } + + + private void encodeSelection(FacesContext context, UIScrollableGrid grid) throws IOException { + final GridRendererState state = GridRendererState.createState(context, grid); + + final Selection gridSelection = new SimpleSelection(); + final ClientSelection clientSelection = new ClientSelection(); + + grid.walk(context, + new DataVisitor() { + public void process(FacesContext context, Object rowKey, + Object argument) throws IOException { + + if (gridSelection.isSelected((Serializable) rowKey)) { + + int i = state.getRowIndex(); + + clientSelection.addIndex(i); + } + + + + + } + }, + state); + + + GridRendererState.restoreState(context); + + grid.getAttributes().put(CLIENT_SELECTION, clientSelection); + } + + public void writeSelection(FacesContext context, UIScrollableGrid grid) + throws IOException { + + Application application = context.getApplication(); + + Converter converter = + application.createConverter(ClientSelection.class); + + String string = + converter.getAsString(context, grid, grid.getAttributes().get(CLIENT_SELECTION)); + + if (string == null) { + string = ""; + } + + } + + private void decodeScrolling(String submitedState, UIScrollableGrid grid){ boolean isEmpty = true; Added: trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/ScrollableGrid.js =================================================================== --- trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/ScrollableGrid.js (rev 0) +++ trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/ScrollableGrid.js 2007-06-07 12:56:29 UTC (rev 1073) @@ -0,0 +1,67 @@ +ClientUILib.declarePackage("ClientUI.controls.grid.ScrollableGrid"); + +ClientUI.controls.grid.ScrollableGrid = Class.create({ + CLASSDEF: { + name: 'ClientUI.controls.grid.ScrollableGrid' + } +}); + +Object.extend(ClientUI.controls.grid.ScrollableGrid.prototype, { + + initialize: function(options) { + + this.options = options; + this.client_id = this.options.client_id; + + this.columns_count = this.options.columnsCount; + this.splash_id = this.options.splash_id; + this.rows_count = $(this.client_id + "_rows_input").value; + this.init2 = this.init.bindAsEventListener(this); + }, + + init: function(){ + + this.dataModel = new ClientUI.controls.grid.FakeArrayDataModel(this.rows_count, this.columns_count, this.client_id); + + var templates = [ + {pane: GridLayout_Enum.HEADER, ref: this.client_id +"_" + "GridHeaderTemplate"}, + {pane: GridLayout_Enum.BODY, ref: this.client_id +"_" + "GridBodyTemplate"}, + {pane: GridLayout_Enum.FOOTER, ref: this.client_id +"_" + "GridFooterTemplate"} + ]; + + // create the Grid + this.grid = new ClientUI.controls.grid.Grid(this.client_id, this.dataModel, templates, + { + showIndexColumn: false, + indexColumnWidth: 40 + } + ); + + var progress = new ClientUI.common.box.SplashBox(this.splash_id, null, 300, true); + + this.grid.setProgressCtrl(progress); + Event.observe(this.grid.eventOnSort, "on sort", this.onSorted.bindAsEventListener(this)); + }, + + onSortComplete : function(request, event, data){ + var options = request.getJSON("options"); + AjaxUpdater.updateRows(options,request, this.grid, this.client_id); + }, + + onScrollComplete : function(request, event, data){ + var options = this.dataModel.getCurrentOptions(); + AjaxUpdater.updateRows(options,request,this.grid,this.client_id); + }, + + onSorted: function(sortEvent) { + this.options.onSortAjaxUpdate(sortEvent); + } +}); + + + + + + + + Modified: trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/Selection.js =================================================================== --- trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/Selection.js 2007-06-07 12:49:22 UTC (rev 1072) +++ trunk/sandbox/scrollable-grid/src/main/javascript/ClientUI/controls/grid/Selection.js 2007-06-07 12:56:29 UTC (rev 1073) @@ -425,4 +425,4 @@ nElement.style.color = "#0000AA"; this.activeRow = rowIndex; } -}); \ No newline at end of file +}); Modified: trunk/sandbox/scrollable-grid/src/main/templates/org/richfaces/scrollable-grid.jspx =================================================================== --- trunk/sandbox/scrollable-grid/src/main/templates/org/richfaces/scrollable-grid.jspx 2007-06-07 12:49:22 UTC (rev 1072) +++ trunk/sandbox/scrollable-grid/src/main/templates/org/richfaces/scrollable-grid.jspx 2007-06-07 12:56:29 UTC (rev 1073) @@ -187,70 +187,11 @@ <script id="#{clientId}_grid_create_scripts" type="text/javascript"> //<![CDATA[ - - var #{this:getJavaScriptVarName(context, component)} = function() { + var #{this:getJavaScriptVarName(context, component)} = #{this:createClientScrollableGrid(context, component)}; + #{this:getScriptContributions(context, component)}; - return { - init : function() { - var currTime = (new Date()).getTime(); - // ClientUILib.log(ClientUILogger.WARNING, "Document loaded over " + (currTime - ClientUILib.startTime) + " miliseconds."); - var clientId = '#{clientId}'; - var rows_count = $(clientId + "_rows_input").value; - var columns_count = '#{columns_count}'; - - function onSorted(sortEvent) { - // alert("onSorted column: " + sortEvent.column + " by order: " + sortEvent.order + ", row:" + sortEvent.startRow + ", index:" + sortEvent.index); - var event = null; - #{this:onSortAjaxUpdate(context,component)} - } - - dataModel = new ClientUI.controls.grid.FakeArrayDataModel(rows_count, columns_count, clientId); - - var templates = [ - {pane: GridLayout_Enum.HEADER, ref: clientId +"_" + "GridHeaderTemplate"}, - {pane: GridLayout_Enum.BODY, ref: clientId +"_" + "GridBodyTemplate"}, - {pane: GridLayout_Enum.FOOTER, ref: clientId +"_" + "GridFooterTemplate"} - ]; + Event.observe(window, 'load', #{this:getJavaScriptVarName(context, component)}.init2); - // ClientUILib.log(ClientUILogger.WARNING, "DataModel created over " + ((new Date()).getTime() - currTime) + " miliseconds."); - // currTime = (new Date()).getTime(); - - // create the Grid - grid = new ClientUI.controls.grid.Grid(clientId, dataModel, templates, - { - showIndexColumn: false, - indexColumnWidth: 40 - } - ); - - var splash_id = '#{splash_id}'; - - var progress = new ClientUI.common.box.SplashBox(splash_id, null, 300, true); - grid.setProgressCtrl(progress); - - Event.observe(grid.eventOnSort, "on sort", onSorted); - }, - - onSortComplete : function(request, event, data){ - var options = request.getJSON("options"); - var clientid = '#{clientId}'; - AjaxUpdater.updateRows(options,request,grid, clientid); - - }, - - onScrollComplete : function(request, event, data,clientid){ - var options = dataModel.getCurrentOptions(); - var clientid = '#{clientId}'; - AjaxUpdater.updateRows(options,request,grid,clientid); - } - } - - }(); - - - #{this:getScriptContributions(context, component)}; - Event.observe(window, 'load', #{this:getJavaScriptVarName(context, component)}.init); - // ]]> </script> </f:root> Modified: trunk/sandbox-samples/scrollable-grid-demo/src/main/webapp/pages/scrollable-grid.xhtml =================================================================== --- trunk/sandbox-samples/scrollable-grid-demo/src/main/webapp/pages/scrollable-grid.xhtml 2007-06-07 12:49:22 UTC (rev 1072) +++ trunk/sandbox-samples/scrollable-grid-demo/src/main/webapp/pages/scrollable-grid.xhtml 2007-06-07 12:56:29 UTC (rev 1073) @@ -36,8 +36,7 @@ <f:view> <h:form> - <sg:scrollable-grid id="grid" - value="#{dataModel}" + <sg:scrollable-grid value="#{dataModel}" var="issues" frozenColCount="3" first="0"