Author: pkawiak Date: 2008-07-21 07:17:43 -0400 (Mon, 21 Jul 2008) New Revision: 9703 Added: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-dt-drag-indicator.js trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-draggable.js trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-dropzone.js Removed: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/dt-drag-indicator.js trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-draggable.js trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-dropzone.js Modified: trunk/sandbox/ui/extendedDataTable/src/main/java/org/richfaces/renderkit/AbstractExtendedTableRenderer.java trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTable.js trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTableHeader.js trunk/sandbox/ui/extendedDataTable/src/main/templates/org/richfaces/htmlExtendedDataTable.jspx Log: Colgroup surrounding cols added, changed getters and setters of columns, changed names of several files Modified: trunk/sandbox/ui/extendedDataTable/src/main/java/org/richfaces/renderkit/AbstractExtendedTableRenderer.java =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/java/org/richfaces/renderkit/AbstractExtendedTableRenderer.java 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/java/org/richfaces/renderkit/AbstractExtendedTableRenderer.java 2008-07-21 11:17:43 UTC (rev 9703) @@ -99,7 +99,7 @@ private static final String GROUP_TOGGLE_ACTION_NAME = "groupToggleAction"; - private static final String MIN_COLUMN_WIDTH = "100"; + private static final String MIN_COLUMN_WIDTH = "20"; /** * Encode all table structure - colgroups definitions, caption, header, @@ -110,16 +110,10 @@ * @throws IOException */ - public void encodeTableStructure(FacesContext context, + public void encodeColumns(FacesContext context, UIExtendedDataTable table) throws IOException { ResponseWriter writer = context.getResponseWriter(); - // int columns = getColumnsCount(table); Iterator<UIColumn> cols = table.getSortedColumns(); - // columns = extendedDataTable.getVisibleColumnsCount(); - // Encode colgroup definition. - // writer.startElement("colgroup", table); - // writer.writeAttribute("span", String.valueOf(columns), null); - while (cols.hasNext()) { UIColumn col = cols.next(); if (col.isRendered()) { @@ -134,9 +128,7 @@ } } writer.startElement("col", table); - writer.writeAttribute("width", "1*", null); writer.endElement("col"); - // writer.endElement("colgroup"); } public void encodeHeader(FacesContext context, UIExtendedDataTable table) @@ -433,6 +425,8 @@ int columns = table.getVisibleColumnsCount() + 1; if (footer != null || columnFacetPresent) { writer.startElement("tfoot", table); + writer.writeAttribute(HTML.id_ATTRIBUTE, table.getBaseClientId(context) + + ":footer", null); String footerClass = (String) table.getAttributes().get( "footerClass"); Modified: trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTable.js =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTable.js 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTable.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -32,6 +32,17 @@ Utils.Condition.ElementPresent(id+':header'), 5); }, + setColumnWidth: function(columnIndex, newWidth) { + ClientUILib.log(ClientUILogger.INFO, "columnIndex: " + columnIndex); + if (columnIndex >= this.getColumnsNumber) { + return false; + }else{ + ClientUILib.log(ClientUILogger.INFO, "newWidth inside method: " + newWidth); + this.getColumns()[columnIndex].width = newWidth; + ClientUILib.log(ClientUILogger.INFO, "newWidth after: " + this.getColumnWidth(columnIndex)); + } + }, + _findParentElement: function(event, element) { var el = null; if(ClientUILib.isSafari) { @@ -127,19 +138,18 @@ imageDiv.setAttribute('alternatesrc', src); }, - getColumnWidth: function(columnNumber) { + getColumnWidth: function(columnNumber) { if ((columnNumber < this.getColumnsNumber()) && (columnNumber >=0)) { - var col = this.getColumns()[columnNumber+this.getColumnsNumber()]; + var col = this.getColumns()[columnNumber]; if (col.offsetWidth) { return col.offsetWidth; }else{ - //cols don't have offsetWidth in Opera return parseInt(col.width); } }else{ return null; } - }, + }, setGroupExpanded: function(iGroupIndex, bValue) { var group = this.groups[iGroupIndex]; @@ -172,6 +182,7 @@ createControls: function() { var id = this.id; this.table = new ClientUI.common.box.Box(this.id +":tu",null,true); + var table = this.table; this.mainDiv = new ClientUI.common.box.Box(this.id,null,true); this.outerDiv = new ClientUI.common.box.Box(this.id +":od",null,true); this.tableB = new ClientUI.common.box.Box(this.id +":n",null,true); @@ -179,11 +190,13 @@ this.fakeIeBodyRow = $(this.id +":body:fakeIeRow"); this.header = new ExtendedDataTable.DataTable.header(this.id +":header",this); this.header.minColumnWidth = this.minColumnWidth; - this.cols = this.table.getElement().getElementsByTagName("col"); - this.columnsNumber = this.cols.length/2; + var colgroup = $(this.id +":colgroup:body"); + this.cols = colgroup.getElementsByTagName("col"); + this.columnsNumber = this.cols.length; this.scrollingDiv = new ClientUI.common.box.Box(this.id +":sd",null,true); this.groupRows = []; - + var tfoot = table.getElement().getElementsByTagName('tfoot'); + this.footer = $(this.id +":footer"); if (ClientUILib.isOpera) { //no overflow-x nor overflow-y in Opera this.scrollingDiv.setStyle({overflow: 'scroll', @@ -206,9 +219,10 @@ var sd = this.scrollingDiv.getElement(); return sd.offsetWidth - sd.clientWidth; }, - validateColumnsWidth: function(columns,excessWidth) { + validateColumnsWidth: function(columns,excessWidth) { + ClientUILib.log(ClientUILogger.INFO, "validatingColumnsWidth: "+excessWidth); var i=1; - var endIndex = columns.length/2-1; + var endIndex = columns.length-1; while ((i < endIndex) && (excessWidth > 0)) { var col = columns[columns.length-i-1]; var spareWidth = col.offsetWidth - this.minColumnWidth; @@ -223,7 +237,16 @@ } i++; } - }, + }, + + getFooterHeight: function() { + if (this.footer) { + return this.footer.getHeight(); + }else{ + return 0; + } + }, + updateLayout: function() { var table = this.table.getElement(); this.grid = table; @@ -236,41 +259,36 @@ var headerChildren = header.getColumnCells(); var footers = table.getElementsByTagName('tfoot'); - var footerHeight = 0; - if (footers.length > 0) { - footerHeight = footers[0].offsetHeight; - } + var footerHeight = this.getFooterHeight(); + var columnsNumber = this.getColumnsNumber(); var visibleHeaderWidth = this.header.getVisibleWidth(); - var excessWidth = this.header.getVisibleWidth() - this.mainDiv.getWidth(); + ClientUILib.log(ClientUILogger.INFO, "visibleHeaderWidth: "+visibleHeaderWidth); + ClientUILib.log(ClientUILogger.INFO, "mainDivWidth: " + this.mainDiv.getWidth()); + var scrollbarWidth = scrollingDiv.getElement().offsetWidth - scrollingDiv.getElement().clientWidth; + var maxAllowedWidth = this.mainDiv.getWidth() - scrollbarWidth; + var excessWidth = this.header.getVisibleWidth() - maxAllowedWidth; + ClientUILib.log(ClientUILogger.ALERT, "1"); if (excessWidth > 0) { - var scrollbarExcess = scrollingDiv.getElement().offsetWidth - scrollingDiv.getElement().clientWidth; - excessWidth += scrollbarExcess; + ClientUILib.log(ClientUILogger.INFO, "excessWidth: " + excessWidth); this.validateColumnsWidth(cols,excessWidth); - }else{ - var excessWidth = visibleHeaderWidth - scrollingDiv.getElement().clientWidth; - if (excessWidth>0) { - this.validateColumnsWidth(cols,excessWidth); - } - } + }; + ClientUILib.log(ClientUILogger.ALERT, "2"); if (ClientUILib.isOpera) { var _stl = headerChildren[0].getStyles().borderRightWidth; _stl = parseInt(_stl.replace(/"px"/,""))*2; var newWidth = mainDivWidth - visibleHeaderWidth - (this.header.getColumnsNumber()-1)*_stl; - cols[columnsNumber-1].width = newWidth; - ClientUILib.log(ClientUILogger.INFO, "_stl: " + _stl); - ClientUILib.log(ClientUILogger.INFO, "newWidth: " + newWidth); + cols[columnsNumber-1].width = null; newWidth -= this.getScrollbarWidth()-1; if (newWidth <= 0) { newWidth = 1; } - cols[cols.length-1].width = newWidth; - ClientUILib.log(ClientUILogger.EVENT, "newWidth: " + newWidth); + cols[cols.length-1].width = null; var cols = this.header.getColumns(); var columnsNumber = this.header.getColumnsNumber(); for (var i=0; i<columnsNumber-1; i++) { - cols[i].width = parseInt(cols[i+columnsNumber].width) - _stl; + cols[i].width = this.getColumnWidth(i) - _stl; } }else{ cols[columnsNumber-1].width = null; Modified: trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTableHeader.js =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTableHeader.js 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/javascript/ClientUI/controls/datatable/ExtendedDataTableHeader.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -24,9 +24,8 @@ }, getVisibleWidth: function() { var sum = 0; - var cols = this.getColumns(); for(var i=0; i<this.getColumnsNumber()-1; i++){ - sum += parseInt(cols[i].width); + sum += this.getColumnWidth(i); } return sum; }, @@ -49,9 +48,10 @@ } this.headerRow = new ClientUI.common.box.Box(this.extDtId +":headerRow",this.getElement(),true); this.filterRow = new ClientUI.common.box.Box(this.extDtId +":filterRow",this.getElement(),true); - this.cols = this.extDt.table.getElement().getElementsByTagName("col"); + var colgroup = $(this.extDtId +":colgroup:header"); + this.cols = colgroup.getElementsByTagName("col"); + this.columnsNumber = this.cols.length; this.columnCells = this.headerRow.getElement().childElements(); - this.columnsNumber = this.columnCells.length; return true; }, getColumns: function() { @@ -64,22 +64,35 @@ return this.columnsNumber; }, + setColumnWidth: function(columnIndex, newWidth) { + if (columnIndex >= this.getColumnsNumber) { + return false; + }else{ + if (!newWidth) { + newWidth = null; + } + ClientUILib.log(ClientUILogger.INFO, "newWidth inside method: " + newWidth); + this.getColumns()[columnIndex].width = newWidth; + } + }, + getColumnWidth: function(columnNumber) { if ((columnNumber < this.getColumnsNumber()) && (columnNumber >=0)) { var col = this.columnCells[columnNumber]; - if (col.offsetWidth) { - return col.offsetWidth; - }else{ - //cols don't have offsetWidth in Opera - return parseInt(col.width); - } + if (col.offsetWidth) { + return col.offsetWidth; + }else{ + return parseInt(col.width); + } }else{ return null; } }, + getHeightWithoutFacets: function() { return this.headerRow.getHeight() + this.filterRow.getHeight(); }, + OnMenuImageMouseDown: function(event) { var el = this.extDt._findParentElement(event, "th"); var columnId = (el) ? el.id : null; @@ -156,13 +169,16 @@ }; var srcElement = this.dragColumnInfo.srcElement; if (ClientUILib.isOpera) { - this.maxDelta = this.extDt.getColumnWidth(this.getColumnsNumber()-1); + this.maxDelta = this.getColumnWidth(this.getColumnsNumber()-1); + if (ClientUILib.isOpera) { + this.maxDelt -= 1; + }; ClientUILib.log(ClientUILogger.INFO, "this.maxDelta: " + this.maxDelta); }else{ - this.maxDelta = this.getColumnWidth(this.getColumnsNumber()-1); - ClientUILib.log(ClientUILogger.INFO, "this.maxDelta: " + this.maxDelta); - this.maxDelta -= this.extDt.getScrollbarWidth(); - ClientUILib.log(ClientUILogger.INFO, "this.extDt.getScrollbarWidth() " + this.extDt.getScrollbarWidth()); + this.maxDelta = this.getColumnWidth(this.getColumnsNumber()-1); + ClientUILib.log(ClientUILogger.INFO, "this.maxDelta: " + this.maxDelta); + this.maxDelta -= this.extDt.getScrollbarWidth(); + ClientUILib.log(ClientUILogger.INFO, "this.extDt.getScrollbarWidth() " + this.extDt.getScrollbarWidth()); } this.minDelta = this.minColumnWidth - this.getColumnWidth(srcElement.columnIndex); Event.observe(document, 'mousemove', this.eventSepMouseMove, true); @@ -195,11 +211,9 @@ }, OnSepMouseUp: function(event) { - var colsNumber = this.getColumnsNumber(); Event.stop(event); Event.stopObserving(document, 'mousemove', this.eventSepMouseMove); Event.stopObserving(document, 'mouseup', this.eventSepMouseUp); - var cols = this.getColumns(); if(this.dragColumnInfo && this.dragColumnInfo.dragStarted) { this.dragColumnInfo.dragStarted = false; @@ -218,18 +232,20 @@ // sep span width delta -= 6; } + ClientUILib.log(ClientUILogger.INFO, "delta: " + delta); var columnIndex = this.dragColumnInfo.srcElement.columnIndex; var newWidth = this.getColumnWidth(columnIndex) + delta; - cols[columnIndex].width = newWidth; - cols[columnIndex+this.getColumnsNumber()].width = newWidth; - + this.extDt.setColumnWidth(columnIndex, newWidth); + this.setColumnWidth(columnIndex,newWidth); + ClientUILib.log(ClientUILogger.ALERT, "newWidth: " + newWidth); + ClientUILib.log(ClientUILogger.INFO, "newWidth 1: " + this.extDt.getColumnWidth(1)); this.extDt.updateLayout(); if (this.extDt.onColumnResize){ //set properly value to this.columnWidths this.extDt.columnWidths = ""; for (i=0; i<this.columnsNumber; i++){ - this.extDt.columnWidths += "" + this.cols[i].width + ";"; + this.extDt.columnWidths += "" + this.getColumnWidth(i) + ";"; }//for this.extDt.onColumnResize(event, this.extDt.columnWidths); } @@ -254,7 +270,7 @@ } ClientUILib.log(ClientUILogger.INFO, "maxDelta: " + this.maxDelta); var x = this.dragColumnInfo.originalX + delta; - var finalX = x - this.minColumnWidth - 6; + var finalX = x - this.minColumnWidth - 6 //6 stands for sep span width; this.columnSplitter.moveToX(finalX); Event.stop(event); } @@ -263,7 +279,7 @@ var tr = table.insertRow(0); var td = tr.insertCell(0); td.setAttribute("colspan", 5); - td.innerHTML = "FU SAFARI!!!"; + td.innerHTML = "safari-must-have-something-inserted-to-redraw-table"; table.deleteRow(tr); } }); \ No newline at end of file Deleted: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/dt-drag-indicator.js =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/dt-drag-indicator.js 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/dt-drag-indicator.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -1,209 +0,0 @@ -DragIndicator = { - - init: function(event) { - var ieVersion = RichFaces.getIEVersion(); - DragIndicator.isIE6 = (ieVersion && ieVersion < 7); - }, - - setContent: function(name, single, params) { - Element.clearChildren(this); - - var p = DnD.getDnDDefaultParams(this); - - if (!p) { - p = {}; - } - - if (params) { - Object.extend(p, params); - } - - if (!p['marker']) { - if (p[name]) { - p['marker'] = p[name]; - } else { - p['marker'] = this.markers[name]; - } - } - - var parts; - - if (single) { - parts = this.indicatorTemplates['single']; - } else { - parts = this.indicatorTemplates['multi']; - } - - new Insertion.Top(this, parts.invoke('getContent', p).join('')); - - if (DragIndicator.isIE6) { - this.initIFrame(); - } - }, - - show: function() { - if (!this.floatedToBody) { - if (!this.realParent) { - this.realParent = this.parentNode; - this._nextSibling = this.nextSibling; - } - this.realParent.removeChild(this); - document.body.appendChild(this); - this.floatedToBody = true; - } - Element.show(this); - this.style.position = 'absolute'; - }, - - hide: function() { - Element.hide(this); - this.style.position = ''; - this.offsets = undefined; - this.leave(); - if (this.floatedToBody && this.realParent) { - document.body.removeChild(this); - if (this._nextSibling) { - this.realParent.insertBefore(this, this._nextSibling); - } else { - this.realParent.appendChild(this); - } - this.floatedToBody = false; - } - }, - - position: function(x, y) { - if (!this.offsets) { - Element.show(this); - this.style.position = 'absolute'; - } - Element.setStyle(this, {"left": x + "px", "top": y + "px"}); - }, - - accept: function() { - Element.removeClassName(this, 'drgind_default'); - Element.removeClassName(this, 'drgind_reject'); - Element.addClassName(this, 'drgind_accept'); - - var acceptClass = this.getAcceptClass(); - if (acceptClass) { - Element.addClassName(this, acceptClass); - } - }, - - reject: function() { - Element.removeClassName(this, 'drgind_default'); - Element.removeClassName(this, 'drgind_accept'); - Element.addClassName(this, 'drgind_reject'); - - var rejectClass = this.getRejectClass(); - if (rejectClass) { - Element.addClassName(this, rejectClass); - } - }, - - leave: function() { - Element.removeClassName(this, 'drgind_accept'); - //Element.removeClassName(this, 'drgind_reject'); - //Element.addClassName(this, 'drgind_default'); - Element.removeClassName(this, 'drgind_default'); - Element.addClassName(this, 'drgind_reject'); - - var acceptClass = this.getAcceptClass(); - var rejectClass = this.getRejectClass(); - if (acceptClass) { - Element.removeClassName(this, acceptClass); - } - if (rejectClass) { - Element.removeClassName(this, rejectClass); - } - }, - - getAcceptClass: function() { - return this.ils_acceptClass; - }, - - getRejectClass: function() { - return this.ils_rejectClass; - }, - - initIFrame: function() { - var iframe = document.createElement("iframe"); - Element.addClassName(iframe, 'rich-dragindicator-iframe'); - this.insertBefore(iframe, this.firstChild); - var table = iframe.nextSibling; - iframe.style.width = table.offsetWidth + "px"; - iframe.style.height = table.offsetHeight + "px"; - } -}; - -function createDragIndicator(elt, acceptClass, rejectClass) { - Object.extend(elt, DragIndicator); - elt.init(); - - elt.ils_acceptClass = acceptClass; - elt.ils_rejectClass = rejectClass; -} - -// <table border="0" cellpadding="3" cellspacing="0" class="drgind_internal" style="height : 100%"> -// <tr> -// <td class="drgind_marker"> -// {marker} -// </td> -// <td class="drgind_text"> -// <div class="drgind_wordcut drgind_text_content"> -// {label} -// </div> -// </td> -// </tr> -// </table> -// <div class="drgind_shadow" /> -DefaultDragIndicatorView = -[ - new E('table', - { - 'style':'height : 100%; z-index: 2;', - 'className':'drgind_internal', - 'cellspacing':'0', - 'cellpadding':'3', - 'border':'0' - }, - [ - new E('tbody',{}, - [ - new E('tr',{}, - [ - new E('td', - { - 'className':'drgind_marker' - }, - [ - new ET(function (context) { return Richfaces.eval("marker", context)}) - ] - ), - new E('td', - { - 'className':'drgind_text' - }, - [ - new E('div', - { - 'className':'drgind_wordcut drgind_text_content' - }, - [ - new ET(function (context) { return Richfaces.eval("label", context)}) - ] - ) - ] - ) - ] - ) - ] - ) - ] - ), - new E('div', - { - 'className':'drgind_shadow' - } - ) -]; Copied: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-dt-drag-indicator.js (from rev 9269, trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/dt-drag-indicator.js) =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-dt-drag-indicator.js (rev 0) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-dt-drag-indicator.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -0,0 +1,209 @@ +DragIndicator = { + + init: function(event) { + var ieVersion = RichFaces.getIEVersion(); + DragIndicator.isIE6 = (ieVersion && ieVersion < 7); + }, + + setContent: function(name, single, params) { + Element.clearChildren(this); + + var p = DnD.getDnDDefaultParams(this); + + if (!p) { + p = {}; + } + + if (params) { + Object.extend(p, params); + } + + if (!p['marker']) { + if (p[name]) { + p['marker'] = p[name]; + } else { + p['marker'] = this.markers[name]; + } + } + + var parts; + + if (single) { + parts = this.indicatorTemplates['single']; + } else { + parts = this.indicatorTemplates['multi']; + } + + new Insertion.Top(this, parts.invoke('getContent', p).join('')); + + if (DragIndicator.isIE6) { + this.initIFrame(); + } + }, + + show: function() { + if (!this.floatedToBody) { + if (!this.realParent) { + this.realParent = this.parentNode; + this._nextSibling = this.nextSibling; + } + this.realParent.removeChild(this); + document.body.appendChild(this); + this.floatedToBody = true; + } + Element.show(this); + this.style.position = 'absolute'; + }, + + hide: function() { + Element.hide(this); + this.style.position = ''; + this.offsets = undefined; + this.leave(); + if (this.floatedToBody && this.realParent) { + document.body.removeChild(this); + if (this._nextSibling) { + this.realParent.insertBefore(this, this._nextSibling); + } else { + this.realParent.appendChild(this); + } + this.floatedToBody = false; + } + }, + + position: function(x, y) { + if (!this.offsets) { + Element.show(this); + this.style.position = 'absolute'; + } + Element.setStyle(this, {"left": x + "px", "top": y + "px"}); + }, + + accept: function() { + Element.removeClassName(this, 'drgind_default'); + Element.removeClassName(this, 'drgind_reject'); + Element.addClassName(this, 'drgind_accept'); + + var acceptClass = this.getAcceptClass(); + if (acceptClass) { + Element.addClassName(this, acceptClass); + } + }, + + reject: function() { + Element.removeClassName(this, 'drgind_default'); + Element.removeClassName(this, 'drgind_accept'); + Element.addClassName(this, 'drgind_reject'); + + var rejectClass = this.getRejectClass(); + if (rejectClass) { + Element.addClassName(this, rejectClass); + } + }, + + leave: function() { + Element.removeClassName(this, 'drgind_accept'); + //Element.removeClassName(this, 'drgind_reject'); + //Element.addClassName(this, 'drgind_default'); + Element.removeClassName(this, 'drgind_default'); + Element.addClassName(this, 'drgind_reject'); + + var acceptClass = this.getAcceptClass(); + var rejectClass = this.getRejectClass(); + if (acceptClass) { + Element.removeClassName(this, acceptClass); + } + if (rejectClass) { + Element.removeClassName(this, rejectClass); + } + }, + + getAcceptClass: function() { + return this.ils_acceptClass; + }, + + getRejectClass: function() { + return this.ils_rejectClass; + }, + + initIFrame: function() { + var iframe = document.createElement("iframe"); + Element.addClassName(iframe, 'rich-dragindicator-iframe'); + this.insertBefore(iframe, this.firstChild); + var table = iframe.nextSibling; + iframe.style.width = table.offsetWidth + "px"; + iframe.style.height = table.offsetHeight + "px"; + } +}; + +function createDragIndicator(elt, acceptClass, rejectClass) { + Object.extend(elt, DragIndicator); + elt.init(); + + elt.ils_acceptClass = acceptClass; + elt.ils_rejectClass = rejectClass; +} + +// <table border="0" cellpadding="3" cellspacing="0" class="drgind_internal" style="height : 100%"> +// <tr> +// <td class="drgind_marker"> +// {marker} +// </td> +// <td class="drgind_text"> +// <div class="drgind_wordcut drgind_text_content"> +// {label} +// </div> +// </td> +// </tr> +// </table> +// <div class="drgind_shadow" /> +DefaultDragIndicatorView = +[ + new E('table', + { + 'style':'height : 100%; z-index: 2;', + 'className':'drgind_internal', + 'cellspacing':'0', + 'cellpadding':'3', + 'border':'0' + }, + [ + new E('tbody',{}, + [ + new E('tr',{}, + [ + new E('td', + { + 'className':'drgind_marker' + }, + [ + new ET(function (context) { return Richfaces.eval("marker", context)}) + ] + ), + new E('td', + { + 'className':'drgind_text' + }, + [ + new E('div', + { + 'className':'drgind_wordcut drgind_text_content' + }, + [ + new ET(function (context) { return Richfaces.eval("label", context)}) + ] + ) + ] + ) + ] + ) + ] + ) + ] + ), + new E('div', + { + 'className':'drgind_shadow' + } + ) +]; Copied: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-draggable.js (from rev 9269, trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-draggable.js) =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-draggable.js (rev 0) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-draggable.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -0,0 +1,121 @@ +DnD.ExtSimpleDraggable = Class.create(); + +Object.extend(DnD.ExtSimpleDraggable.prototype, DnD.Draggable.prototype); +Object.extend(DnD.ExtSimpleDraggable.prototype, { + initialize: function(id, options) { + this.id = $(id); + + if (!this.id) { + alert("drag: Element with [" + id + "] ID was not found in the DOM tree. Probably element has no client ID or client ID hasn't been written. DnD's disabled. Check please!"); + return ; + } + + this.options = options; + + this.dragIndicatorId = this.options.dragIndicator; + + this.eventMouseDown = this.initDrag.bindAsEventListener(this); + + Event.observe(this.id, "mousedown", this.eventMouseDown); + + this.form = this.id; + while (this.form && !/^form$/i.test(this.form.tagName)) { + this.form = this.form.parentNode; + } + + this.enableDraggableCursors(this.options.grab, this.options.grabbing); + }, + + getDnDDragParams: function() { + if (this.options.dndParams) { + return this.options.dndParams.parseJSON(EventHandlersWalk); + } + + return null; + }, + + getIndicator: function() { + var dragIndicator = $(this.dragIndicatorId); + if (!dragIndicator) { + dragIndicator = this.getOrCreateDefaultIndicator(); + } + + return dragIndicator; + }, + + ondragstart : function(event, drag) { + this.showDropTargets(); + drag.params = this.options.parameters; + drag.params[this.id] = this.id; + + this.setIndicator(event); + + this.getIndicator().leave(); + + //this.dragEnter(event); + + if (this.form) { + drag.params[this.form.id] = this.form.id; + } + }, + + ondragend: function (event, drag) { + this.hideDropTargets(); + }, + + getContentType: function() { + return this.options.dragType; + }, + + getDraggableOptions: function() { + return this.options; + }, + + initDrag: function(event) { + if (Event.isLeftClick(event)) { + var src = Event.element(event); + if(src.tagName && /^INPUT|SELECT|OPTION|BUTTON|TEXTAREA$/i.test(src.tagName)) + return; + + Event.stop(event); + + this.startDrag(event); + //Event.observe(document, "mousemove", this.listenDragBound); + //Event.observe(document, "mouseup", this.stopListenDragBound); + } + }, + + showDropTargets: function(){ + var idStr = this.id.id; + var ind = idStr.lastIndexOf('_'); + var prefix = idStr.substring(0,ind).replace("hdrag", "hdrop"); + var spans = document.getElementsByTagName("span"); + for(i=0;i<spans.length;i++){ + var s = spans[i]; + if (s.id.indexOf(prefix) == 0){ + //s.style.zIndex = '70'; + s.style.visibility = "visible"; + //change dropzone style + s.childNodes[0].style.visibility="hidden";//top element + s.childNodes[1].style.visibility="hidden";//bottom element + } + }//for + }, + + hideDropTargets: function(){ + var idStr = this.id.id; + var ind = idStr.lastIndexOf('_'); + var prefix = idStr.substring(0,ind).replace("hdrag", "hdrop"); + var spans = document.getElementsByTagName("span"); + for (i=0;i<spans.length;i++){ + var s = spans[i]; + if (s.id.indexOf(prefix) == 0){ + //s.style.zIndex = '59'; + s.style.visibility = "hidden"; + //change dropzone style + s.childNodes[0].style.visibility="hidden";//top element + s.childNodes[1].style.visibility="hidden";//bottom element + } + }//for + } +}); \ No newline at end of file Copied: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-dropzone.js (from rev 9269, trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-dropzone.js) =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-dropzone.js (rev 0) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/ext-simple-dropzone.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -0,0 +1,99 @@ +DnD.ExtSimpleDropZone = Class.create(); +Object.extend(DnD.ExtSimpleDropZone.prototype, DnD.Dropzone.prototype); +Object.extend(DnD.ExtSimpleDropZone.prototype, { + initialize: function(id, options) { + this.id = id; + var element = $(id); + + if (!element) { + alert("drop: Element with [" + id + "] ID was not found in the DOM tree. Probably element has no client ID or client ID hasn't been written. DnD's disabled. Check please!"); + return ; + } + + this.element = element; + if (options.acceptedTypes) { + this.acceptedTypes = options.acceptedTypes; + } else { + this.acceptedTypes = []; + } + + if (options.typeMapping) { + this.typeMapping = options.typeMapping; + } else { + this.typeMapping = {}; + } + + if (options.cursorTypeMapping) { + this.cursorTypeMapping = options.cursorTypeMapping; + } else { + this.cursorTypeMapping = {}; + } + + this.mouseoverBound = this.mouseover.bindAsEventListener(this); + this.mouseoutBound = this.mouseout.bindAsEventListener(this); + this.mouseupBound = this.mouseup.bindAsEventListener(this); + + Event.observe(element, "mouseover", this.mouseoverBound); + Event.observe(element, "mouseout", this.mouseoutBound); + Event.observe(element, "mouseup", this.mouseupBound); + + + + this.options = options || {}; + this.enableDropzoneCursors(options.acceptCursor,options.rejectCursor); + + }, + + getDropzoneOptions: function() { + return this.options; + }, + + getDnDDropParams: function() { + if (this.options.dndParams) { + return this.options.dndParams.parseJSON(EventHandlersWalk); + } + + return null; + }, + + mouseover: function(event) { + if (window.drag){ + this.dragEnter(event); + //change dropzone style + this.element.childNodes[0].style.visibility="visible";//top element + this.element.childNodes[1].style.visibility="visible";//bottom element + } + }, + + mouseup: function(event) { + this.dragUp(event); + }, + + mouseout: function(event) { + if (window.drag){ + this.dragLeave(event); + //change dropzone style + this.element.childNodes[0].style.visibility="hidden";//top element + this.element.childNodes[1].style.visibility="hidden";//bottom element + } + }, + getAcceptedTypes: function() { + return this.acceptedTypes; + }, + getTypeMapping: function() { + return this.typeMapping; + }, + + getCursorTypeMapping: function() { + return this.cursorTypeMapping; + }, + + drop: function(event, drag){ + alert('I drop'); + }, + onafterdrag: function(drag) { + if (this.options.onafterdrag) { + this.options.onafterdrag.call(this, drag); + } + } +}); \ No newline at end of file Deleted: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-draggable.js =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-draggable.js 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-draggable.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -1,121 +0,0 @@ -DnD.G3SimpleDraggable = Class.create(); - -Object.extend(DnD.G3SimpleDraggable.prototype, DnD.Draggable.prototype); -Object.extend(DnD.G3SimpleDraggable.prototype, { - initialize: function(id, options) { - this.id = $(id); - - if (!this.id) { - alert("drag: Element with [" + id + "] ID was not found in the DOM tree. Probably element has no client ID or client ID hasn't been written. DnD's disabled. Check please!"); - return ; - } - - this.options = options; - - this.dragIndicatorId = this.options.dragIndicator; - - this.eventMouseDown = this.initDrag.bindAsEventListener(this); - - Event.observe(this.id, "mousedown", this.eventMouseDown); - - this.form = this.id; - while (this.form && !/^form$/i.test(this.form.tagName)) { - this.form = this.form.parentNode; - } - - this.enableDraggableCursors(this.options.grab, this.options.grabbing); - }, - - getDnDDragParams: function() { - if (this.options.dndParams) { - return this.options.dndParams.parseJSON(EventHandlersWalk); - } - - return null; - }, - - getIndicator: function() { - var dragIndicator = $(this.dragIndicatorId); - if (!dragIndicator) { - dragIndicator = this.getOrCreateDefaultIndicator(); - } - - return dragIndicator; - }, - - ondragstart : function(event, drag) { - this.showDropTargets(); - drag.params = this.options.parameters; - drag.params[this.id] = this.id; - - this.setIndicator(event); - - this.getIndicator().leave(); - - //this.dragEnter(event); - - if (this.form) { - drag.params[this.form.id] = this.form.id; - } - }, - - ondragend: function (event, drag) { - this.hideDropTargets(); - }, - - getContentType: function() { - return this.options.dragType; - }, - - getDraggableOptions: function() { - return this.options; - }, - - initDrag: function(event) { - if (Event.isLeftClick(event)) { - var src = Event.element(event); - if(src.tagName && /^INPUT|SELECT|OPTION|BUTTON|TEXTAREA$/i.test(src.tagName)) - return; - - Event.stop(event); - - this.startDrag(event); - //Event.observe(document, "mousemove", this.listenDragBound); - //Event.observe(document, "mouseup", this.stopListenDragBound); - } - }, - - showDropTargets: function(){ - var idStr = this.id.id; - var ind = idStr.lastIndexOf('_'); - var prefix = idStr.substring(0,ind).replace("hdrag", "hdrop"); - var spans = document.getElementsByTagName("span"); - for(i=0;i<spans.length;i++){ - var s = spans[i]; - if (s.id.indexOf(prefix) == 0){ - //s.style.zIndex = '70'; - s.style.visibility = "visible"; - //change dropzone style - s.childNodes[0].style.visibility="hidden";//top element - s.childNodes[1].style.visibility="hidden";//bottom element - } - }//for - }, - - hideDropTargets: function(){ - var idStr = this.id.id; - var ind = idStr.lastIndexOf('_'); - var prefix = idStr.substring(0,ind).replace("hdrag", "hdrop"); - var spans = document.getElementsByTagName("span"); - for (i=0;i<spans.length;i++){ - var s = spans[i]; - if (s.id.indexOf(prefix) == 0){ - //s.style.zIndex = '59'; - s.style.visibility = "hidden"; - //change dropzone style - s.childNodes[0].style.visibility="hidden";//top element - s.childNodes[1].style.visibility="hidden";//bottom element - } - }//for - } -}); \ No newline at end of file Deleted: trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-dropzone.js =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-dropzone.js 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/resources/org/richfaces/renderkit/html/scripts/simple-dropzone.js 2008-07-21 11:17:43 UTC (rev 9703) @@ -1,99 +0,0 @@ -DnD.G3SimpleDropZone = Class.create(); -Object.extend(DnD.G3SimpleDropZone.prototype, DnD.Dropzone.prototype); -Object.extend(DnD.G3SimpleDropZone.prototype, { - initialize: function(id, options) { - this.id = id; - var element = $(id); - - if (!element) { - alert("drop: Element with [" + id + "] ID was not found in the DOM tree. Probably element has no client ID or client ID hasn't been written. DnD's disabled. Check please!"); - return ; - } - - this.element = element; - if (options.acceptedTypes) { - this.acceptedTypes = options.acceptedTypes; - } else { - this.acceptedTypes = []; - } - - if (options.typeMapping) { - this.typeMapping = options.typeMapping; - } else { - this.typeMapping = {}; - } - - if (options.cursorTypeMapping) { - this.cursorTypeMapping = options.cursorTypeMapping; - } else { - this.cursorTypeMapping = {}; - } - - this.mouseoverBound = this.mouseover.bindAsEventListener(this); - this.mouseoutBound = this.mouseout.bindAsEventListener(this); - this.mouseupBound = this.mouseup.bindAsEventListener(this); - - Event.observe(element, "mouseover", this.mouseoverBound); - Event.observe(element, "mouseout", this.mouseoutBound); - Event.observe(element, "mouseup", this.mouseupBound); - - - - this.options = options || {}; - this.enableDropzoneCursors(options.acceptCursor,options.rejectCursor); - - }, - - getDropzoneOptions: function() { - return this.options; - }, - - getDnDDropParams: function() { - if (this.options.dndParams) { - return this.options.dndParams.parseJSON(EventHandlersWalk); - } - - return null; - }, - - mouseover: function(event) { - if (window.drag){ - this.dragEnter(event); - //change dropzone style - this.element.childNodes[0].style.visibility="visible";//top element - this.element.childNodes[1].style.visibility="visible";//bottom element - } - }, - - mouseup: function(event) { - this.dragUp(event); - }, - - mouseout: function(event) { - if (window.drag){ - this.dragLeave(event); - //change dropzone style - this.element.childNodes[0].style.visibility="hidden";//top element - this.element.childNodes[1].style.visibility="hidden";//bottom element - } - }, - getAcceptedTypes: function() { - return this.acceptedTypes; - }, - getTypeMapping: function() { - return this.typeMapping; - }, - - getCursorTypeMapping: function() { - return this.cursorTypeMapping; - }, - - drop: function(event, drag){ - alert('I drop'); - }, - onafterdrag: function(drag) { - if (this.options.onafterdrag) { - this.options.onafterdrag.call(this, drag); - } - } -}); \ No newline at end of file Modified: trunk/sandbox/ui/extendedDataTable/src/main/templates/org/richfaces/htmlExtendedDataTable.jspx =================================================================== --- trunk/sandbox/ui/extendedDataTable/src/main/templates/org/richfaces/htmlExtendedDataTable.jspx 2008-07-21 10:30:06 UTC (rev 9702) +++ trunk/sandbox/ui/extendedDataTable/src/main/templates/org/richfaces/htmlExtendedDataTable.jspx 2008-07-21 11:17:43 UTC (rev 9703) @@ -39,10 +39,10 @@ /org/richfaces/renderkit/html/script/controlUtils.js, /org/richfaces/renderkit/html/scripts/extended-data-table.js, - /org/richfaces/renderkit/html/scripts/dt-drag-indicator.js, + /org/richfaces/renderkit/html/scripts/ext-dt-drag-indicator.js, - /org/richfaces/renderkit/html/scripts/simple-draggable.js, - /org/richfaces/renderkit/html/scripts/simple-dropzone.js + /org/richfaces/renderkit/html/scripts/ext-simple-draggable.js, + /org/richfaces/renderkit/html/scripts/ext-simple-dropzone.js </h:scripts> <f:clientid var="clientId"/> @@ -81,7 +81,9 @@ style="visibility:hidden;" width="100%" - <f:call name="encodeTableStructure"/> + <colgroup id="#{clientId}:colgroup:header"> + <f:call name="encodeColumns"/> + </colgroup> <f:call name="encodeHeader"/> <f:call name="encodeCaption"/> <tbody> @@ -94,7 +96,9 @@ <f:call name="utils.encodePassThruWithExclusions"> <f:parameter value="height,value,name,type,id,class,rows,style,width" /> </f:call> - <f:call name="encodeTableStructure"/> + <colgroup id="#{clientId}:colgroup:body"> + <f:call name="encodeColumns"/> + </colgroup> <tbody id="#{clientId}:tb"> <vcp:body> <f:call name="encodeRows"/>