Author: konstantin.mishin Date: 2010-05-26 15:08:28 -0400 (Wed, 26 May 2010) New Revision: 17295 Modified: root/ui-sandbox/tables/trunk/ui/src/main/java/org/richfaces/renderkit/ExtendedDataTableRenderer.java root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/extendedDataTable.js Log: RF-8630 Modified: root/ui-sandbox/tables/trunk/ui/src/main/java/org/richfaces/renderkit/ExtendedDataTableRenderer.java =================================================================== --- root/ui-sandbox/tables/trunk/ui/src/main/java/org/richfaces/renderkit/ExtendedDataTableRenderer.java 2010-05-26 18:32:43 UTC (rev 17294) +++ root/ui-sandbox/tables/trunk/ui/src/main/java/org/richfaces/renderkit/ExtendedDataTableRenderer.java 2010-05-26 19:08:28 UTC (rev 17295) @@ -336,31 +336,19 @@ encodeHeaderOrFooter(state, "header"); } - private void encodeBodyProlog(FacesContext context, UIComponent table, String tableBodyId) throws IOException { - ResponseWriter writer = context.getResponseWriter(); - writer.startElement(HTML.DIV_ELEM, table); - writer.writeAttribute(HTML.ID_ATTRIBUTE, tableBodyId, null); - writer.writeAttribute(HTML.CLASS_ATTRIBUTE, "rich-extable-body", null); - } - - private void encodeBodyEpilog(FacesContext context) throws IOException { - ResponseWriter writer = context.getResponseWriter(); - writer.endElement(HTML.DIV_ELEM); - } - public void encodeBody(RendererState state) throws IOException { FacesContext context = state.getContext(); ResponseWriter writer = context.getResponseWriter(); UIDataTableBase table = state.getRow(); String tableBodyId = table.getClientId(context) + ":b"; - + EncoderVariance encoderVariance = state.getEncoderVariance(); + encoderVariance.encodeStartUpdate(context, tableBodyId); + writer.startElement(HTML.DIV_ELEM, table); + writer.writeAttribute(HTML.ID_ATTRIBUTE, tableBodyId, null); + writer.writeAttribute(HTML.CLASS_ATTRIBUTE, "rich-extable-body", null); if (table.getRowCount() == 0) { - EncoderVariance encoderVariance = state.getEncoderVariance(); - encoderVariance.encodeStartUpdate(context, tableBodyId); - encodeBodyProlog(context, table, tableBodyId); - UIComponent facet = table.getFacet("noData"); if (facet != null && facet.isRendered()) { facet.encodeAll(context); @@ -371,13 +359,8 @@ } } - encodeBodyEpilog(context); - encoderVariance.encodeEndUpdate(context); - } else { - encodeBodyProlog(context, table, tableBodyId); - table.getAttributes().put("clientFirst", 0); writer.startElement(HTML.DIV_ELEM, table); writer.startElement(HTML.DIV_ELEM, table); @@ -398,9 +381,6 @@ String targetId = table.getClientId(context) + ":tbt" + partName.name().charAt(0); - EncoderVariance encoderVariance = state.getEncoderVariance(); - encoderVariance.encodeStartUpdate(context, targetId); - writer.startElement(HTML.TABLE_ELEMENT, table); writer.writeAttribute(HTML.ID_ATTRIBUTE, targetId, null); writer.writeAttribute(HTML.CELLPADDING_ATTRIBUTE, "0", null); @@ -412,8 +392,6 @@ writer.endElement(HTML.TBODY_ELEMENT); writer.endElement(HTML.TABLE_ELEMENT); - encoderVariance.encodeEndUpdate(context); - writer.endElement(HTML.DIV_ELEM); writer.endElement(HTML.TD_ELEM); } @@ -421,9 +399,9 @@ writer.endElement(HTML.TBODY_ELEMENT); writer.endElement(HTML.TABLE_ELEMENT); writer.endElement(HTML.DIV_ELEM); - - encodeBodyEpilog(context); } + writer.endElement(HTML.DIV_ELEM); + encoderVariance.encodeEndUpdate(context); } public void encodeFooter(RendererState state) throws IOException { @@ -456,10 +434,9 @@ public void encodeMetaComponent(FacesContext context, UIComponent component, String metaComponentId) throws IOException { - + UIExtendedDataTable table = (UIExtendedDataTable) component; if (UIExtendedDataTable.SCROLL.equals(metaComponentId)) { final PartialResponseWriter writer = context.getPartialViewContext().getPartialResponseWriter(); - UIExtendedDataTable table = (UIExtendedDataTable) component; int clientFirst = table.getClientFirst(); Integer oldClientFirst = (Integer) table.getAttributes().remove(UIExtendedDataTable.OLD_CLIENT_FIRST); if (oldClientFirst == null) { @@ -534,9 +511,8 @@ writer.endEval(); } writer.startEval(); - //TODO nick - make this utility function in RendererUtils writer.write("jQuery('#" + component.getClientId(context).replace(":", "\\\\:") - + "').triggerHandler('rich:onscrollcomplete', " + table.getClientFirst() + ");"); + + "').triggerHandler('rich:onajaxcomplete', {first: " + table.getClientFirst() + "});"); writer.endEval(); table.setRowKey(context, key); table.restoreOrigValue(context); @@ -552,12 +528,22 @@ RendererState state = createRowHolder(context, component); state.setEncoderVariance(EncoderVariance.partial); + PartialResponseWriter writer = context.getPartialViewContext().getPartialResponseWriter(); + if (UIDataTableBase.HEADER.equals(metaComponentId)) { encodeHeader(state); + writer.startEval(); + writer.write("jQuery('#" + component.getClientId(context).replace(":", "\\\\:") + + "').triggerHandler('rich:onajaxcomplete', {reinitializeHeader: true});"); + writer.endEval(); } else if (UIDataTableBase.FOOTER.equals(metaComponentId)) { encodeFooter(state); } else if (UIDataTableBase.BODY.equals(metaComponentId)) { encodeBody(state); + writer.startEval(); + writer.write("jQuery('#" + component.getClientId(context).replace(":", "\\\\:") + + "').triggerHandler('rich:onajaxcomplete', {first: " + table.getClientFirst() + ", rowCount: " + getRowCount(component)+ ", reinitializeBody: true});"); + writer.endEval(); } else { throw new IllegalArgumentException("Unsupported metaComponentIdentifier: " + metaComponentId); } Modified: root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/extendedDataTable.js =================================================================== --- root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-05-26 18:32:43 UTC (rev 17294) +++ root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-05-26 19:08:28 UTC (rev 17295) @@ -39,27 +39,18 @@ var MIN_WIDTH = 20; var element = document.getElementById(id); - var bodyElement = document.getElementById(id + ":b"); - var contentElement = jQuery(bodyElement).children("div:first").get(0); + var bodyElement, contentElement, spacerElement, dataTableElement, rows, rowHeight, parts; var dragElement = document.getElementById(id + ":d"); var reorderElement = document.getElementById(id + ":r"); var reorderMarkerElement = document.getElementById(id + ":rm"); var widthInput = document.getElementById(id + ":wi"); - var normalPartStyle = richfaces.getCSSRule(".rich-extable-part-width").style; - var resizerHolders = jQuery(element).children(".rich-extable-header").find(".rich-extable-resizer-holder").get(); + var header = jQuery(element).children(".rich-extable-header"); + var resizerHolders = header.find(".rich-extable-resizer-holder").get(); var frozenHeaderPartElement = document.getElementById(id + ":frozenHeader"); var frozenColumnCount = frozenHeaderPartElement ? frozenHeaderPartElement.firstChild.rows[0].cells.length : 0;//TODO Richfaces.firstDescendant; - if (contentElement) { - var spacerElement = contentElement.firstChild;//TODO this.marginElement = Richfaces.firstDescendant(this.contentElement); - var dataTableElement = contentElement.lastChild;//TODO this.dataTableElement = Richfaces.lastDescendant(this.contentElement); - var rows = document.getElementById(id + ":body").firstChild.rows.length;//TODO Richfaces.firstDescendant; - } - - var parts = jQuery(element).find(".rich-extable-part"); - var scrollElement = document.getElementById(id + ":footer"); var resizeData = {}; @@ -153,10 +144,20 @@ }; var initializeLayout = function() { - //TODO Use "var rowHeight" instead of "dataTableElement.offsetHeight / rows" + bodyElement = document.getElementById(id + ":b"); + contentElement = jQuery(bodyElement).children("div:first").get(0); if (contentElement) { - contentElement.style.height = (rowCount * dataTableElement.offsetHeight / rows) + "px"; + spacerElement = contentElement.firstChild;//TODO this.marginElement = Richfaces.firstDescendant(this.contentElement); + dataTableElement = contentElement.lastChild;//TODO this.dataTableElement = Richfaces.lastDescendant(this.contentElement); + rows = document.getElementById(id + ":body").firstChild.rows.length;//TODO Richfaces.firstDescendant; + rowHeight = dataTableElement.offsetHeight / rows; + contentElement.style.height = (rowCount * rowHeight) + "px"; + jQuery(bodyElement).bind("scroll", bodyScrollListener); + } else { + spacerElement = null; + dataTableElement = null; } + parts = jQuery(element).find(".rich-extable-part"); updateLayout(); updateScrollPosition(); //TODO Restore horizontal scroll position }; @@ -210,7 +211,7 @@ var beginReorder = function(event) { idOfReorderingColumn = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; jQuery(document).bind("mousemove", reorder); - jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell").bind("mouseover", overReorder); + header.find(".rich-extable-header-cell").bind("mouseover", overReorder); jQuery(document).one("mouseup", cancelReorder); return false; }; @@ -234,7 +235,7 @@ jQuery(this).unbind("mouseout", outReorder); var id = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; var colunmsOrder = ""; - jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell").each(function() { + header.find(".rich-extable-header-cell").each(function() { var i = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; if (i == id) { colunmsOrder += idOfReorderingColumn + "," + id + ","; @@ -247,12 +248,12 @@ var cancelReorder = function(event) { jQuery(document).unbind("mousemove", reorder); - jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell").unbind("mouseover", overReorder); + header.find(".rich-extable-header-cell").unbind("mouseover", overReorder); reorderElement.style.display = "none"; }; var loadData = function(event) { - var clientFirst = Math.round((bodyElement.scrollTop + bodyElement.clientHeight / 2) / (dataTableElement.offsetHeight / rows) - rows / 2); + var clientFirst = Math.round((bodyElement.scrollTop + bodyElement.clientHeight / 2) / (rowHeight) - rows / 2); if (clientFirst <= 0) { clientFirst = 0; } else { @@ -271,29 +272,37 @@ } }; - var scrollComplete = function (event, first) { - spacerElement.style.height = (first * dataTableElement.offsetHeight / rows) + "px"; -// TODO var height = first * dataTableElement.offsetHeight / rows; -// var style = spacerElement.style; -// style.height = height + "px"; -// style.display = height ? "block" : ""; + var ajaxComplete = function (event, data) { + if (data.reinitializeHeader) { + bindHeaderHandlers(); + } else { + if (data.reinitializeBody) { + rowCount = data.rowCount; + initializeLayout(); + } + if (spacerElement) { + spacerElement.style.height = (data.first * rowHeight) + "px"; + } + } }; jQuery(document).ready(initializeLayout); jQuery(window).bind("resize", updateLayout); jQuery(scrollElement).bind("scroll", updateScrollPosition); - //TODO nick - use end() or alike functions - jQuery(element).children(".rich-extable-header").find(".rich-extable-resizer").bind("mousedown", beginResize); - jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell").bind("mousedown", beginReorder); + var bindHeaderHandlers = function () { + header.find(".rich-extable-resizer").bind("mousedown", beginResize); + header.find(".rich-extable-header-cell").bind("mousedown", beginReorder); + } + bindHeaderHandlers(); jQuery(bodyElement).bind("scroll", bodyScrollListener); - jQuery(element).bind("rich:onscrollcomplete", scrollComplete); + jQuery(element).bind("rich:onajaxcomplete", ajaxComplete); //JS API element.component = this; this.getColumnPosition = function(id) { var position; - var headers = jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell"); + var headers = header.find(".rich-extable-header-cell"); for (var i = 0; i < headers.length; i++) { if (id == headers.get(i).className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]) { position = i; @@ -305,7 +314,7 @@ this.setColumnPosition = function(id, position) { var colunmsOrder = ""; var before; - var headers = jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell"); + var headers = header.find(".rich-extable-header-cell"); for (var i = 0; i < headers.length; i++) { var current = headers.get(i).className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; if (i == position) {