Author: konstantin.mishin Date: 2010-04-01 10:21:26 -0400 (Thu, 01 Apr 2010) New Revision: 16703 Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js Log: RF-8104 Modified: root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js =================================================================== --- root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-04-01 13:42:17 UTC (rev 16702) +++ root/ui-sandbox/trunk/components/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-04-01 14:21:26 UTC (rev 16703) @@ -149,9 +149,9 @@ }; var beginResize = function(event) { - var className = this.parentNode.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "[^\w]*"))[0]; + var id = this.parentNode.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; resizeData = { - className : className, + id : id, left : jQuery(this).parent().offset().left }; dragElement.style.height = element.offsetHeight + "px"; @@ -162,12 +162,10 @@ return false; }; - var endResize = function(event) { - jQuery(document).unbind("mousemove", drag); - dragElement.style.display = "none"; - var width = Math.max(MIN_WIDTH, event.pageX - resizeData.left) + "px"; - richfaces.getCSSRule("." + resizeData.className).style.width = width; - newWidths[resizeData.className.substr(WIDTH_CLASS_NAME_BASE.length)] = width; + var setColumnWidth = function(id, width) { + width = width + "px"; + richfaces.getCSSRule("." + WIDTH_CLASS_NAME_BASE + id).style.width = width; + newWidths[id] = width; var widthsArray = new Array(); for (var id in newWidths) { widthsArray.push(id + ":" + newWidths[id]); @@ -175,9 +173,16 @@ widthInput.value = widthsArray.toString(); updateLayout(); adjustResizers(); - ajaxFunction(event, ""); // Maybe, event model should be used here. + ajaxFunction(null, ""); // TODO Maybe, event model should be used here. }; + var endResize = function(event) { + jQuery(document).unbind("mousemove", drag); + dragElement.style.display = "none"; + var width = Math.max(MIN_WIDTH, event.pageX - resizeData.left); + setColumnWidth(resizeData.id, width); + }; + var reorder = function(event) { jQuery(reorderElement).setPosition(event, {offset:[5,5]}); reorderElement.style.display = "block"; @@ -185,7 +190,7 @@ }; var beginReorder = function(event) { - idOfReorderingColumn = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "[^\w]*"))[0].substr(WIDTH_CLASS_NAME_BASE.length); //To try to do this without substr. + 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); jQuery(document).one("mouseup", cancelReorder); @@ -209,17 +214,17 @@ var endReorder = function(event) { reorderMarkerElement.style.display = ""; jQuery(this).unbind("mouseout", outReorder); - var id = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "[^\w]*"))[0].substr(WIDTH_CLASS_NAME_BASE.length); //To try to do this without substr. + 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() { - var i = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "[^\w]*"))[0].substr(WIDTH_CLASS_NAME_BASE.length); //To try to do this without substr. + var i = this.className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; if (i == id) { colunmsOrder += idOfReorderingColumn + "," + id + ","; } else if (i != idOfReorderingColumn) { colunmsOrder += i + ","; } }); - ajaxFunction(event, colunmsOrder); + ajaxFunction(event, colunmsOrder); // TODO Maybe, event model should be used here. }; var cancelReorder = function(event) { @@ -263,6 +268,47 @@ jQuery(element).children(".rich-extable-header").find(".rich-extable-header-cell").bind("mousedown", beginReorder); jQuery(bodyElement).bind("scroll", bodyScrollListener); jQuery(element).bind("rich:onscrollcomplete", scrollComplete); + + //JS API + element.component = this; + + this.getColumnPosition = function(id) { + var position; + var headers = jQuery(element).children(".rich-extable-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; + } + } + return position; + } + + this.setColumnPosition = function(id, position) { + var colunmsOrder = ""; + var before; + var headers = jQuery(element).children(".rich-extable-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) { + if (before) { + colunmsOrder += current + "," + id + ","; + } else { + colunmsOrder += id + "," + current + ","; + } + } else { + if (id != current) { + colunmsOrder += current + ","; + } else { + before = true; + } + } + } + ajaxFunction(null, colunmsOrder); // TODO Maybe, event model should be used here. + } + + this.setColumnWidth = function(id, width) { + setColumnWidth(id, width); + } }; }(window.RichFaces, jQuery));