Author: konstantin.mishin Date: 2010-06-18 14:16:11 -0400 (Fri, 18 Jun 2010) New Revision: 17639 Modified: root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.ecss root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js Log: RF-8101 Modified: root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.ecss =================================================================== --- root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.ecss 2010-06-18 16:56:52 UTC (rev 17638) +++ root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.ecss 2010-06-18 18:16:11 UTC (rev 17639) @@ -148,4 +148,8 @@ width: 9px; background-image: url("#{resource['reorderMarker.gif']}"); display: none; +} + +.rf-edt-r-s { + background-color: '#{richSkin.additionalBackgroundColor}'; /*TODO Probably use other skin property.*/ } \ No newline at end of file Modified: root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js =================================================================== --- root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-06-18 16:56:52 UTC (rev 17638) +++ root/ui/iteration/trunk/tables/ui/src/main/resources/META-INF/resources/extendedDataTable.js 2010-06-18 18:16:11 UTC (rev 17639) @@ -20,11 +20,13 @@ * 02110-1301 USA, or see the FSF site: http://www.fsf.org. */ (function(richfaces, jQuery) { - richfaces.getCSSRule = function (className) { + richfaces.utils = richfaces.utils || {}; + + richfaces.utils.getCSSRule = function (className) { var rule = null; var sheets = document.styleSheets; for (var j = 0; !rule && j < sheets.length; j++) { - var rules = sheets[j].cssRules ? sheets[j].cssRules: sheets[j].rules; + var rules = sheets[j].cssRules ? sheets[j].cssRules : sheets[j].rules; for (var i = 0; !rule && i < rules.length; i++) { if (rules[i].selectorText && rules[i].selectorText.toLowerCase() == className.toLowerCase()) { rule = rules[i]; @@ -34,19 +36,127 @@ return rule; }; + richfaces.utils.Ranges = function() { + this.ranges = []; + }; + + richfaces.utils.Ranges.prototype = { + + add: function(index) { + var i = 0; + while(i < this.ranges.length && index >= this.ranges[i++][1]); + i--; + if(this.ranges[i-1] && index==(this.ranges[i-1][1]+1) ) { + if(index==(this.ranges[i][0]-1)) { + this.ranges[i-1][1] = this.ranges[i][1]; + this.ranges.splice(i, 1); + } else { + this.ranges[i-1][1]++; + } + } else { + if(this.ranges[i]){ + if(this.ranges[i] && index==(this.ranges[i][0]-1)) { + this.ranges[i][0]--; + } else { + if(index==(this.ranges[i][1]+1)){ + this.ranges[i][1]++; + } else { + if(index<this.ranges[i][1]){ + this.ranges.splice(i, 0, [index, index]); + } else { + this.ranges.splice(i + 1, 0, [index, index]); + } + } + } + } else { + this.ranges.splice(i, 0, [index, index]); + } + } + }, + + remove: function(index) { + var i = 0; + while(i < this.ranges.length && index > this.ranges[i++][1]); + i--; + if(this.ranges[i]) { + if(index==(this.ranges[i][1]) ) { + if(index==(this.ranges[i][0])){ + this.ranges.splice(i, 1); + } else { + this.ranges[i][1]--; + } + } else { + if(index==(this.ranges[i][0])){ + this.ranges[i][0]++; + } else { + this.ranges.splice(i+1, 0, [index+1, this.ranges[i][1]]); + this.ranges[i][1] = index-1; + } + } + } + }, + + remove: function(index) { + var i = 0; + while(i < this.ranges.length && index > this.ranges[i++][1]); + i--; + if(this.ranges[i]) { + if(index==(this.ranges[i][1]) ) { + if(index==(this.ranges[i][0])){ + this.ranges.splice(i, 1); + } else { + this.ranges[i][1]--; + } + } else { + if(index==(this.ranges[i][0])){ + this.ranges[i][0]++; + } else { + this.ranges.splice(i+1, 0, [index+1, this.ranges[i][1]]); + this.ranges[i][1] = index-1; + } + } + } + }, + + clear: function() { + this.ranges = []; + }, + + isSelected: function(index) { + var i = 0; + while(i < this.ranges.length && index >= this.ranges[i][0]) { + if(index >= this.ranges[i][0] && index <= this.ranges[i][1]) { + return true; + } else { + i++; + } + } + return false; + }, + + toString: function() { + var ret = new Array(this.ranges.length); + for (var i = 0; i < this.ranges.length; i++) { + ret[i] = this.ranges[i].join(); + } + return ret.join(";"); + } + }; + richfaces.ExtendedDataTable = function(id, rowCount, ajaxFunction, ajaxParameters) { var WIDTH_CLASS_NAME_BASE = "rf-edt-cw-"; var MIN_WIDTH = 20; + var ranges = new richfaces.utils.Ranges(); var element = document.getElementById(id); - var bodyElement, contentElement, spacerElement, dataTableElement, rows, rowHeight, parts; + var bodyElement, contentElement, spacerElement, dataTableElement, rows, rowHeight, parts, tbodies, shiftIndex, activeIndex; 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(".rf-edt-pw").style; + var normalPartStyle = richfaces.utils.getCSSRule(".rf-edt-pw").style; var header = jQuery(element).children(".rf-edt-h"); - var resizerHolders = header.find(".rf-edt-rsh").get(); + var resizerHolders = header.find(".rf-edt-rsh"); var frozenHeaderPartElement = document.getElementById(id + ":frozenHeader"); var frozenColumnCount = frozenHeaderPartElement ? frozenHeaderPartElement.firstChild.rows[0].cells.length : 0;//TODO Richfaces.firstDescendant; @@ -103,7 +213,7 @@ }; var adjustResizers = function() { - var scrollLeft = scrollElement.scrollLeft; + var scrollLeft = scrollElement ? scrollElement.scrollLeft : 0; var clientWidth = element.clientWidth - 3; var i = 0; for (; i < frozenColumnCount; i++) { @@ -140,25 +250,29 @@ }; var updateScrollPosition = function() { - var scrollLeft = scrollElement.scrollLeft; - parts.each(function() { - this.scrollLeft = scrollLeft; - }); + if (scrollElement) { + var scrollLeft = scrollElement.scrollLeft; + parts.each(function() { + this.scrollLeft = scrollLeft; + }); + } adjustResizers(); }; var initializeLayout = function() { bodyElement = document.getElementById(id + ":b"); - contentElement = jQuery(bodyElement).children("div:first").get(0); + contentElement = jQuery(bodyElement).children("div:first")[0]; if (contentElement) { 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; + tbodies = jQuery(document.getElementById(id + ":tbf")).add(document.getElementById(id + ":tbn")); + rows = tbodies[0].rows.length; rowHeight = dataTableElement.offsetHeight / rows; if (rowCount != rows) { contentElement.style.height = (rowCount * rowHeight) + "px"; } - jQuery(bodyElement).bind("scroll", bodyScrollListener); + jQuery(bodyElement).bind("scroll", bodyScrollListener) + tbodies.bind("click", selectionClickListener); } else { spacerElement = null; dataTableElement = null; @@ -189,7 +303,7 @@ var setColumnWidth = function(id, width) { width = width + "px"; - richfaces.getCSSRule("." + WIDTH_CLASS_NAME_BASE + id).style.width = width; + richfaces.utils.getCSSRule("." + WIDTH_CLASS_NAME_BASE + id).style.width = width; newWidths[id] = width; var widthsArray = new Array(); for (var id in newWidths) { @@ -280,6 +394,83 @@ } }; + var selectRow = function (index) { + ranges.add(index); + for ( var i = 0; i < tbodies.length; i++) { + tbodies[i].rows[index].className = "rf-edt-r-s"; + } + } + + var deselectRow = function (index, skipUpdateModel) { + if (!skipUpdateModel) { + ranges.remove(index); + } + for ( var i = 0; i < tbodies.length; i++) { + tbodies[i].rows[index].className = ""; + } + } + + var selectionClickListener = function (event) { + var tr = event.target; + while (tbodies.index(tr.parentNode) == -1) { + tr = tr.parentNode; + } + var index = tr.rowIndex; + + if(!event.shiftKey) { + shiftIndex = null; + } else { + if (window.getSelection) { + window.getSelection().removeAllRanges(); //TODO + } else if (document.selection) { + document.selection.empty(); + } + } + if (event.shiftKey && !event.ctrlKey) { + if(!shiftIndex) {//TODO + shiftIndex = activeIndex; + } + var range; + if (index >= shiftIndex) { + range = [shiftIndex, index]; + } else { + range = [index, shiftIndex]; + } + var i = 0; + for (; i < range[0]; i++) { + if (ranges.isSelected(i)) { + deselectRow(i); + } + } + for (; i <= range[1]; i++) { + if (!ranges.isSelected(i)) { + selectRow(i); + } + } + for (; i < rows; i++) { + if (ranges.isSelected(i)) { + deselectRow(i); + } + } + } else if (!event.shiftKey && event.ctrlKey) { + if (ranges.isSelected(index)) { + deselectRow(index); + } else { + selectRow(index); + } + } else if (!event.shiftKey && !event.ctrlKey) { + ranges.clear(); + for (var i = 0; i < rows; i++) { + if (i == index) { + selectRow(i); + } else { + deselectRow(i, true); + } + } + } + activeIndex = index; + } + var ajaxComplete = function (event, data) { if (data.reinitializeHeader) { bindHeaderHandlers(); @@ -302,7 +493,6 @@ header.find(".rf-edt-hc").bind("mousedown", beginReorder); } bindHeaderHandlers(); - jQuery(bodyElement).bind("scroll", bodyScrollListener); jQuery(element).bind("rich:onajaxcomplete", ajaxComplete); //JS API @@ -313,7 +503,7 @@ var position; var headers = header.find(".rf-edt-hc"); for (var i = 0; i < headers.length; i++) { - if (id == headers.get(i).className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]) { + if (id == headers[i].className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]) { position = i; } } @@ -325,7 +515,7 @@ var before; var headers = header.find(".rf-edt-hc"); for (var i = 0; i < headers.length; i++) { - var current = headers.get(i).className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; + var current = headers[i].className.match(new RegExp(WIDTH_CLASS_NAME_BASE + "([^\\W]*)"))[1]; if (i == position) { if (before) { colunmsOrder += current + "," + id + ",";