5:54 a.m.
Author: vmolotkov
Date: 2007-10-30 06:54:19 -0400 (Tue, 30 Oct 2007)
New Revision: 3611
Removed:
trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/StringBuilder.js
Modified:
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:
Management of the keyboard is added
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-10-30
01:07:16 UTC (rev 3610)
+++
trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js 2007-10-30
10:54:19 UTC (rev 3611)
@@ -10,37 +10,19 @@
Shuttle = function(containerId, shuttleItems) {
this.container = document.getElementById(containerId);
- this.shuttleTable = document.getElementById(this.container.id + "table");
- this.shuttleTbody = document.getElementById(this.container.id + "tbody");
- this.shuttle = this.shuttleTbody;
-
this.items = null;
this.selectedItems = new Array();
+ this.shuttleItems = shuttleItems;
-
- this.shuttleItems = new Array();
-
- var rows = this.shuttleTable.rows;
- var shuttle = this;
-
- for (var i = 0; i < rows.length; i++) {
- var row = rows[i];
- this.shuttleItems.push(new SelectItem("", i, "", row.id, false,
row));
- row.onclick = function(e) {
- e = (window.event || e);
- shuttle.onclickHandler(e);
- }
- }
-
- //this.shuttleItems = shuttleItems;
-
- //this.shuttle = null;
+ this.shuttle = null;
this.sortOrder = Shuttle.ASC;
- //this.shuttleTable = null;
- //this.shuttleTbody = null;
+ this.shuttleTable = null;
+ this.shuttleTbody = null;
this.activeItem = null;
+
+ this.focusKeeper = document.getElementById("focusKeeper");
}
Shuttle.ASC = "acs";
@@ -69,7 +51,7 @@
Shuttle.prototype.sort = function() {
if (this.sortOrder == Shuttle.ASC) {
- this.shuttleItems.sort(this.compare);
+ this.shuttleItems.sort(this.compareByLabel);
this.sortOrder = Shuttle.DESC;
} else {
this.shuttleItems.reverse();
@@ -81,35 +63,38 @@
Shuttle.prototype.moveSelectedItems = function(action) {
var rows = this.shuttleTbody.rows;
var item;
- this.selectedItems.sort(this.compareByRowIndex);
- if ((action == 'up') &&
this.getExtremeItem("first").previousSibling) {
- for (var i = 0; i < this.selectedItems.length; i++) {
- item = this.selectedItems[i];
- item.parentNode.insertBefore(item, item.previousSibling);
- }
- } else if ((action == 'down') &&
this.getExtremeItem("last").nextSibling) {
- for (var i = this.selectedItems.length - 1; i > -1; i--) {
- item = this.selectedItems[i];
- item.parentNode.insertBefore(item.nextSibling, item);
- }
- } else if (action == 'first') {
- var incr = this.selectedItems[0].rowIndex;
- for (var i = 0; i < this.selectedItems.length; i++) {
- item = this.selectedItems[i];
- item.parentNode.insertBefore(item, rows[item.rowIndex - incr]);
- }
- } else if (action == 'last') {
- var length = this.shuttleItems.length;
- var incr = length - this.selectedItems[this.selectedItems.length - 1].rowIndex;
- for (var i = this.selectedItems.length - 1; i > -1; i--) {
- item = this.selectedItems[i];
- if (item.rowIndex + incr > length - 1) {
- item.parentNode.insertBefore(item, null);
- } else {
- item.parentNode.insertBefore(item, rows[item.rowIndex + incr]);
+ if (this.selectedItems.length > 0) {
+ this.selectedItems.sort(this.compareByRowIndex);
+
+ if ((action == 'up') &&
this.getExtremeItem("first").previousSibling) {
+ for (var i = 0; i < this.selectedItems.length; i++) {
+ item = this.selectedItems[i];
+ item.parentNode.insertBefore(item, item.previousSibling);
}
- }
- }
+ } else if ((action == 'down') &&
this.getExtremeItem("last").nextSibling) {
+ for (var i = this.selectedItems.length - 1; i > -1; i--) {
+ item = this.selectedItems[i];
+ item.parentNode.insertBefore(item.nextSibling, item);
+ }
+ } else if (action == 'first') {
+ var incr = this.selectedItems[0].rowIndex;
+ for (var i = 0; i < this.selectedItems.length; i++) {
+ item = this.selectedItems[i];
+ item.parentNode.insertBefore(item, rows[item.rowIndex - incr]);
+ }
+ } else if (action == 'last') {
+ var length = this.shuttleItems.length;
+ var incr = length - this.selectedItems[this.selectedItems.length - 1].rowIndex;
+ for (var i = this.selectedItems.length - 1; i > -1; i--) {
+ item = this.selectedItems[i];
+ if (item.rowIndex + incr > length - 1) {
+ item.parentNode.insertBefore(item, null);
+ } else {
+ item.parentNode.insertBefore(item, rows[item.rowIndex + incr]);
+ }
+ }
+ }
+ }
}
Shuttle.prototype.getExtremeItem = function(position) {
@@ -131,12 +116,7 @@
return extremeItem;
}
-Shuttle.prototype.getLastSelectedItem = function() {
-
-}
-
Shuttle.prototype.onclickHandler = function(event) {
- //this.selectItem(event.srcElement);
var activeElem = event.target || event.srcElement;
if (activeElem == null) {
return;
@@ -158,6 +138,14 @@
this.activeItem = activeElem;
}
+Shuttle.prototype.onkeydownHandler = function(event) {
+ switch (event.keyCode) {
+ case 34 : this.moveSelectedItems('last'); break; //page down
+ case 33: this.moveSelectedItems('first'); break; //page up
+ case 38 : this.moveSelectedItems('up'); break; //up arrow
+ case 40 : this.moveSelectedItems('down'); break; //down arrow
+ }
+}
/**
* Click handler
*/
@@ -173,7 +161,6 @@
this.resetMarked();
markedItem._selected = true;
- //markedShuttleItem.className = Shuttle.ACTIVE_ITEM_CLASS;
this.selectedItems[0] = markedShuttleItem;
}
}
@@ -187,12 +174,10 @@
var markedShuttleItem = activeItem;
if (markedItem._selected) {
- //this.activeItem.className = Shuttle.NORMAL_ITEM_CLASS;
this.selectedItems.remove(markedShuttleItem);
markedItem._selected = false;
} else {
markedItem._selected = true;
- //markedShuttleItem.className = Shuttle.SELECTED_ITEM_CLASS;
this.selectedItems.push(markedShuttleItem);
}
this.activeItem.className = Shuttle.SELECTED_ITEM_CLASS;
@@ -246,10 +231,17 @@
}
Shuttle.prototype.init = function() {
+ this.shuttleTable = document.createElement("table");
+ this.shuttleTbody = document.createElement("tbody");
+ this.shuttle = this.shuttleTbody;
this.addList(this.shuttleItems);
- //this.shuttleTable.appendChild(this.shuttle)
- //this.container.appendChild(this.shuttleTable);
+ this.shuttleTable.appendChild(this.shuttle)
+ this.container.appendChild(this.shuttleTable);
+ var obj = this;
+ this.focusKeeper.onkeydown = function(e) {
+ obj.onkeydownHandler(window.event || e);
+ }
}
Shuttle.prototype.rebuild = function() {
@@ -262,12 +254,11 @@
this.shuttleTable.appendChild(this.shuttle);
this.shuttleTbody = this.shuttleTable.tBodies[0];
}
-//--------------------------------
+
Shuttle.prototype.createShuttleItem = function(selectItem, elemContainer) {
var tr = document.createElement("tr");
elemContainer.appendChild(tr);
tr.id = selectItem._id
- //elemContainer.append('<tr
id="').append(selectItem._id).append('" ');
var className = null;
if (selectItem._selected) {
className = Shuttle.SELECTED_ITEM_CLASS;
@@ -276,15 +267,13 @@
} else {
className = Shuttle.NORMAL_ITEM_CLASS;
}
- //elemContainer.append('class="').append(className);
tr.className = className;
+
var obj = this;
tr.onclick = function(e) {
- e = (window.event || e);
- obj.onclickHandler(e);
+ obj.onclickHandler(window.event || e);
}
- //elemContainer.append('"
onclick="shuttle.onclickHandler(window.event||event);"');
- //elemContainer.append('>').append('<td>');
+
var td = document.createElement("td");
tr.appendChild(td);
if (td.textContent == undefined) {
@@ -293,25 +282,24 @@
td.textContent = selectItem._label;
}
selectItem._node = tr;
- //elemContainer.append(selectItem._label);
- //elemContainer.append('</td><td width="0">');
- //this.createValueKeeper(selectItem, elemContainer);
- //elemContainer.append('</td></tr>');
}
-Shuttle.prototype.compare = function(obj1, obj2) {
+Shuttle.prototype.compareByLabel = function(obj1, obj2) {
obj1 = obj1._label;
obj2 = obj2._label;
- return ((obj1 == obj2) ? 0 : ((obj1 < obj2) ? -1 : 1));
+ return Shuttle.compare(obj1, obj2);
}
Shuttle.prototype.compareByRowIndex = function(obj1, obj2) {
obj1 = obj1.rowIndex;
obj2 = obj2.rowIndex;
- return ((obj1 == obj2) ? 0 : ((obj1 < obj2) ? -1 : 1));
+ return Shuttle.compare(obj1, obj2);
}
-Shuttle.prototype.createValueKeeper = function(selectItem, elemContainer) {
- elemContainer.append('<input type="hidden" value="')
- .append(selectItem._value).append('"/>');
+Shuttle.compare = function(obj1, obj2) {
+ return ((obj1 == obj2) ? 0 : ((obj1 < obj2) ? -1 : 1));
}
+
+Shuttle.setFocus = function(targetObjectId) {
+ document.getElementById(targetObjectId).focus();
+}
Deleted:
trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/StringBuilder.js
===================================================================
---
trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/StringBuilder.js 2007-10-30
01:07:16 UTC (rev 3610)
+++
trunk/sandbox/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/StringBuilder.js 2007-10-30
10:54:19 UTC (rev 3611)
@@ -1,55 +0,0 @@
-/*
-/* sbuilder.js - Helper class to improve strings concatenation perfomance
- * by Denis Morozov <dmorozov(a)exadel.com> distributed under the BSD license.
- *
- * Usage:
- * var sb = new StringBuilder();
- * sb.append("String 1").append("String 2");
- * sb.append("String 3");
- * var str = sb.toString();
- */
-StringBuilder = function() {
-
- this.length = 0;
-
- this._current = 0;
- this._parts = [];
- this._string = null;
-
- this.initialize();
-}
-
-StringBuilder.prototype.initialize = function(str) {
- this._string = null;
- this._current = 0;
- this._parts = [];
- this.length = 0;
-
- if(str != null)
- this.append(str);
-}
-StringBuilder.prototype.append = function(str) {
- // append argument
- //this.length += (this._parts[this._current++] = String(str)).length;
- this._parts.push(String(str));
-
- // reset cache
- this._string = null;
- return this;
-}
-
-StringBuilder.prototype.toString = function () {
- if (this._string != null)
- return this._string;
-
- var s = this._parts.join("");
- this._parts = [];
- this._current = 1;
- this.length = s.length;
-
- return this._string = s;
-}
-
-StringBuilder.prototype.clean = function(str) {
- this.initialize();
-}
Modified:
trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx
===================================================================
---
trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-10-30
01:07:16 UTC (rev 3610)
+++
trunk/sandbox/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-10-30
10:54:19 UTC (rev 3611)
@@ -7,34 +7,31 @@
xmlns:x=" http://ajax4jsf.org/cdk/x"
baseclass="org.richfaces.renderkit.OrderingListRendererBase"
class="org.richfaces.renderkit.html.OrderingListRenderer"
- component="org.richfaces.component.UIOrderingList"
+ component="org.richfaces.component.UIOrderingList"
<h:styles>css/orderingList.xcss</h:styles>
<h:scripts>
- scripts/StringBuilder.js,scripts/SelectItem.js,scripts/OrderingList.js
+ scripts/SelectItem.js,scripts/OrderingList.js
</h:scripts>
<f:clientid var="clientId"/>
- <div id="#{clientId}">
- <table id="#{clientId}table">
- <tbody id="#{clientId}tbody">
- <vcp:body>
- <input type="text" value="dsfdsf"
name="asdasdas"/>
- <f:call name="renderChildren" />
- </vcp:body>
- </tbody>
- </table>
+ <div id="#{clientId}"
onclick="Shuttle.setFocus('focusKeeper')">
+ <input id="focusKeeper" type="button" value=""
style="position: absolute; top: -100; left: -100;"
name="focusKeeper"/>
+ <vcp:body>
+ <f:call name="renderChildren" />
+ </vcp:body>
+
+ <a href="#"
onclick="shuttle.sort();">Header</a><br/>
+ <a href="#"
onclick="shuttle.moveSelectedItems('up');">up</a><br/>
+ <a href="#"
onclick="shuttle.moveSelectedItems('down');">down</a><br/>
+ <a href="#"
onclick="shuttle.moveSelectedItems('first');">first</a><br/>
+ <a href="#"
onclick="shuttle.moveSelectedItems('last');">last</a>
</div>
- <a href="#"
onclick="shuttle.sort();">Header</a><br/>
- <a href="#"
onclick="shuttle.moveSelectedItems('up');">up</a><br/>
- <a href="#"
onclick="shuttle.moveSelectedItems('down');">down</a><br/>
- <a href="#"
onclick="shuttle.moveSelectedItems('first');">first</a><br/>
- <a href="#"
onclick="shuttle.moveSelectedItems('last');">last</a>
<script type="text/javascript">
#{this:initJSShuttleObject(context, component)}
document.body.onselectstart = function() {return false;};
document.body.className = "body";
-
+ document.body.onload = Shuttle.setFocus('focusKeeper');
</script>
</f:root>
\ No newline at end of file