Author: vmolotkov Date: 2007-11-06 14:51:39 -0500 (Tue, 06 Nov 2007) New Revision: 3807 Modified: trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx Log: dataList scrolling Modified: trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js =================================================================== --- trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js 2007-11-06 19:27:54 UTC (rev 3806) +++ trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js 2007-11-06 19:51:39 UTC (rev 3807) @@ -44,4 +44,15 @@ LayoutManager.isIE = function() { return (/MSIE/.test(navigator.userAgent) && !window.opera); +} + +LayoutManager.getElemXY = function(elem) { + var x = elem.offsetLeft; + var y = elem.offsetTop; + + for (var parent = elem.offsetParent; parent; parent = parent.offsetParent) { + x += parent.offsetLeft; + y += parent.offsetTop; + } + return {left: x, top: y}; } \ No newline at end of file Modified: trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js =================================================================== --- trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js 2007-11-06 19:27:54 UTC (rev 3806) +++ trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js 2007-11-06 19:51:39 UTC (rev 3807) @@ -26,6 +26,7 @@ this.focusKeeper = document.getElementById(focusKeeperId); this.valueKeeper = document.getElementById(valueKeeperId); + this.shuttleTop = null; var obj = this; this.focusKeeper.onkeydown = function(e) { obj.onkeydownHandler(window.event || e); @@ -59,6 +60,7 @@ document.getElementById(firstControlId).onclick = function() {obj.moveSelectedItems('first');}; document.getElementById(lastControlId).onclick = function() {obj.moveSelectedItems('last');}; document.getElementById(contentTableId).onclick = function(e) {obj.onclickHandler(window.event || e);}; + this.shuttleTop = LayoutManager.getElemXY(this.shuttleTable).top; } Shuttle.prototype.retrieveShuttleItems = function() { @@ -135,6 +137,7 @@ } } + this.autoScrolling(action); this.shuttleItems = new Array(); for (var i = 0; i < rows.length; i++) { this.shuttleItems.push(rows[i].item); @@ -205,21 +208,24 @@ } Shuttle.prototype.onkeydownHandler = function(event) { + var action = null; switch (event.keyCode) { case 34 : this.moveSelectedItems('last'); break; //page down case 33 : this.moveSelectedItems('first'); break; //page up case 38 : //up arrow + action = 'up'; if (event.ctrlKey) { - this.moveSelectedItems('up'); + this.moveSelectedItems(action); } else { - this.moveActiveItem('up'); + this.moveActiveItem(action); } break; case 40 : //down arrow + action = 'down'; if (event.ctrlKey) { - this.moveSelectedItems('down'); + this.moveSelectedItems(action); } else { - this.moveActiveItem('down'); + this.moveActiveItem(action); } break; case 65 : // Ctrl + A @@ -237,6 +243,7 @@ break; case 32 : this.invertSelection(event); break; //blank } + if (action != null) this.autoScrolling(action); this.saveState(); } @@ -371,6 +378,21 @@ return null; } +Shuttle.prototype.autoScrolling = function(action) { + this.selectedItems.sort(this.compareByRowIndex); + var targetItemTop; + if (action == 'up' || action == 'first') { + targetItemTop = LayoutManager.getElemXY(this.selectedItems[0]).top; + var increment = targetItemTop - this.shuttleTop; + this.shuttleTable.parentNode.scrollTop = increment; + } else if (action == 'down' || action == 'last') { + var item = this.selectedItems[this.selectedItems.length - 1]; + targetItemTop = LayoutManager.getElemXY(this.selectedItems[this.selectedItems.length - 1]).top + item.offsetHeight; + var increment = targetItemTop - (this.shuttleTop + this.shuttleTable.parentNode.offsetHeight - LayoutManager.SCROLL_WIDTH); + this.shuttleTable.parentNode.scrollTop = increment; + } +} + /*Shuttle.prototype.init = function() { this.shuttle = this.shuttleTbody; this.addList(this.shuttleItems); Modified: trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx =================================================================== --- trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-11-06 19:27:54 UTC (rev 3806) +++ trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-11-06 19:51:39 UTC (rev 3807) @@ -52,18 +52,19 @@ <f:clientId var="cId"/> <script type="text/javascript"> var clientId = '#{cId}'; - if (window.attachEvent) { + /*if (window.attachEvent) { window.attachEvent("onload", init); } else { window.addEventListener("load", init, false); - } + }*/ document.body.onselectstart = function() {return false;}; document.body.className = "body"; - var shuttle = new Shuttle('#{cId}', '#{cId}internal_tab', '#{cId}internal_header_tab', '#{cId}focusKeeper', '#{cId}valueKeeper','#{cId}up', '#{cId}down', '#{cId}first', '#{cId}last', '#{cId}sortLabel'); function init() { + var shuttle = new Shuttle('#{cId}', '#{cId}internal_tab', '#{cId}internal_header_tab', '#{cId}focusKeeper', '#{cId}valueKeeper','#{cId}up', '#{cId}down', '#{cId}first', '#{cId}last', '#{cId}sortLabel'); var layoutManager = new LayoutManager('#{clientId}internal_header_tab', '#{clientId}internal_tab'); layoutManager.widthSynchronization(); - } + } + setTimeout(init, 0); </script> </f:root> \ No newline at end of file