Author: nbelaevski Date: 2007-12-09 17:52:58 -0500 (Sun, 09 Dec 2007) New Revision: 4643 Modified: branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingComponentRendererBase.java branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/Control.js branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/ListBase.js branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/SelectItem.js branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx Log: http://jira.jboss.com/jira/browse/RF-1558 Modified: branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingComponentRendererBase.java =================================================================== --- branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingComponentRendererBase.java 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingComponentRendererBase.java 2007-12-09 22:52:58 UTC (rev 4643) @@ -296,7 +296,8 @@ } writer.startElement(HTML.DIV_ELEM, orderingList); - writer.writeAttribute(HTML.id_ATTRIBUTE, clientId + helper.getIdSuffix(), null); //FIXME: + String controlId = clientId + helper.getIdSuffix(); + writer.writeAttribute(HTML.id_ATTRIBUTE, controlId, null); //FIXME: writer.writeAttribute(HTML.class_ATTRIBUTE, currentStyle, null); String style = null; if (enabled) { @@ -317,12 +318,15 @@ } writer.startElement(HTML.a_ELEMENT, orderingList); + writer.writeAttribute(HTML.id_ATTRIBUTE, controlId + "link", null); //FIXME: writer.writeAttribute(HTML.HREF_ATTR, "#", null); if (!helper.enable) { writer.writeAttribute(HTML.DISABLED_ATTR, "disabled", null); writer.writeAttribute(HTML.class_ATTRIBUTE, baseStyle + "-a-disabled", null); } else { writer.writeAttribute(HTML.class_ATTRIBUTE, baseStyle + "-selection", null); + writer.writeAttribute(HTML.onblur_ATTRIBUTE, "Control.onblur(this);", null); + writer.writeAttribute(HTML.onfocus_ATTRIBUTE, "Control.onfocus(this);", null); } writer.writeAttribute(HTML.onclick_ATTRIBUTE, "return false;", null); Modified: branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java =================================================================== --- branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java 2007-12-09 22:52:58 UTC (rev 4643) @@ -122,10 +122,10 @@ ItemState state = getItemState(context, table, variables); boolean active = state.isActive(); - if (active) { - rowClassName.append(" rich-ordering-list-row-active"); - cellClassName.append(" rich-ordering-list-cell-active"); - } +// if (active) { +// rowClassName.append(" rich-ordering-list-row-active"); +// cellClassName.append(" rich-ordering-list-cell-active"); +// } boolean selected = state.isSelected(); if (selected) { @@ -170,8 +170,6 @@ writer.writeAttribute(HTML.NAME_ATTRIBUTE, table.getBaseClientId(context), null); StringBuffer value = new StringBuffer(); - value.append(table.getRowKey()); - if (selected) { value.append('s'); } @@ -180,6 +178,7 @@ value.append('a'); } + value.append(table.getRowKey()); value.append(':'); value.append(tableHolder.getConverter().getAsString(context, table, table.getRowData())); @@ -217,20 +216,20 @@ Object value = converter.getAsObject(context, orderingList, string.substring(idx + 1)); String substring = string.substring(0, idx); - idx = substring.length() - 1; + idx = 0; + if (substring.charAt(idx) == 's') { + selection.add(value); + idx++; + } + if (substring.charAt(idx) == 'a') { activeItem = value; - idx--; + idx++; } - if (substring.charAt(idx) == 's') { - selection.add(value); - idx--; - } + substring = substring.substring(idx); - substring = substring.substring(0, idx + 1); - Object key = new Integer(substring); map.put(key, value); } Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss 2007-12-09 22:52:58 UTC (rev 4643) @@ -172,10 +172,8 @@ } .rich-ordering-list-cell-selected { - padding : 1px 2px; + padding : 2px 2px; white-space: nowrap; - border-top: 1px solid; - border-bottom: 1px solid; } .rich-ordering-list-cell-active { @@ -293,10 +291,6 @@ <u:style name="font-family" skin="generalFamilyFont" /> <u:style name="font-size" skin="generalSizeFont" /> </u:selector> - <u:selector name=".rich-ordering-list-cell-selected"> - <u:style name="border-bottom-color" skin="tableBorderColor" /> - <u:style name="border-top-color" skin="tableBackgroundColor" /> - </u:selector> <u:selector name=".rich-ordering-list-cell-selected, .rich-ordering-list-cell-selected *"> <u:style name="color" skin="generalTextColor"/> Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/Control.js =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/Control.js 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/Control.js 2007-12-09 22:52:58 UTC (rev 4643) @@ -4,6 +4,14 @@ return false; } +Control.onfocus = function(element) { + element.hasFocus = true; +} + +Control.onblur = function(element) { + element.hasFocus = undefined; +} + Control.prototype.initialize = function(eNode, dNode, isShown, isEnabled, action) { this.disabledNode = dNode; this.disabledNode.onselectstart = Control.eventStub; @@ -50,8 +58,30 @@ Control.prototype.doDisable = function() { this.isEnabled = false; + + var nodes = this.enabledNode.select("a[id='" + this.enabledNode.id + "link']"); + + var newFocusNode = undefined; + + if (nodes && nodes[0]) { + var link = nodes[0]; + if (link.hasFocus) { + var disNodes = this.disabledNode.select("a[id='" + this.disabledNode.id + "link']"); + if (disNodes && disNodes[0]) { + newFocusNode = disNodes[0]; + } + } + } + this.doHideNode(this.enabledNode); this.doShowNode(this.disabledNode); + if (newFocusNode && newFocusNode.focus) { + //For IE + newFocusNode.disabled = false; + newFocusNode.focus(); + //For IE + newFocusNode.disabled = true; + } } Control.prototype.doHideNode = function(node) { Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/ListBase.js =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/ListBase.js 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/ListBase.js 2007-12-09 22:52:58 UTC (rev 4643) @@ -32,27 +32,8 @@ Richfaces.ListBase.CONTROL_SET = ["A", "INPUT", "TEXTAREA", "SELECT", "OPTION", "BUTTON"]; Richfaces.ListBase.prototype = { - CLASSES : { - ROW : { - ACTIVE : "rich-ordering-list-row-active", - SELECTED : "rich-ordering-list-row-selected", - ACTIVE_SELECTED : "rich-ordering-list-row-selected rich-ordering-list-row-active", - DISABLED : "rich-ordering-list-row-disabled", - NORMAL : "rich-ordering-list-row" - }, - CELL : { - ACTIVE : "rich-ordering-list-cell-active", - SELECTED : "rich-ordering-list-cell-selected", - ACTIVE_SELECTED : "rich-ordering-list-cell-selected rich-ordering-list-cell-active", - DISABLED : "rich-ordering-list-cell-disabled", - NORMAL : "rich-ordering-list-cell", - BEGIN: " rich-ordering-list-cell-begin", - END: " rich-ordering-list-cell-end" - } - }, - initialize : function(containerId, contentTableId, headerTableId, focusKeeperId, - onclickControlId) { + onclickControlId, controlClass) { this.selectedItems = new Array(); //this.layoutManager = layoutManager; @@ -64,13 +45,14 @@ //this.setFocus(); this.focusKeeper.observe("keydown", (function(e) {this.onkeydownHandler(window.event || e)}).bindAsEventListener(this)); this.focusKeeper.observe("blur", function (e) {this.focusListener(e);}.bindAsEventListener(this)); + this.focusKeeper.observe("focus", function (e) {this.onfocusHandler(e);}.bindAsEventListener(this)); this.shuttleTbody = this.shuttleTable.tBodies[0]; this.activeItem = null; this.items = null; - this.retrieveShuttleItems(containerId); + this.retrieveShuttleItems(containerId, controlClass); this.shuttle = null; this.sortOrder = Richfaces.ListBase.ASC; @@ -78,7 +60,7 @@ this.shuttleTable.observe("click", function(e) {this.onclickHandler(window.event || e)}.bindAsEventListener(this)); }, - retrieveShuttleItems : function(containerId) { + retrieveShuttleItems : function(containerId, controlClass) { var rows = this.shuttleTbody.rows; this.shuttleItems = new Array(); var id; @@ -86,15 +68,14 @@ for (var i = 0; i < rows.length; i++) { var row = rows[i]; id = row.id.split(containerId + ":")[1]; - this.shuttleItems[i] - = new Richfaces.SelectItem(null, (id || i), - ((Richfaces.SelectItems.isSelected(row, this.CLASSES)) ? true : false), row); - if (Richfaces.SelectItems.isSelected(row, this.CLASSES)) { + var item = new controlClass(null, (id || i), row); + if (item.isSelected()) { this.selectedItems.push(row); } - if (Richfaces.SelectItems.isActive(row, this.CLASSES)) { + if (item.isActive()) { this.activeItem = row; } + this.shuttleItems[i] = item; } }, @@ -144,6 +125,17 @@ return activeElem; }, + onfocusHandler: function (event) { + if (!this.activeItem && this.shuttleItems.length != 0) { + this.activeItem = this.shuttleItems[0]._node; + + } + + if (this.activeItem) { + this.activeItem.item.doActive(); + } + }, + onclickHandler : function(event) { if (event.srcElement && (event.srcElement.tagName.toLowerCase() == "tbody")) { return; @@ -162,7 +154,6 @@ } - Richfaces.SelectItems.doActive(this.activeItem, this.CLASSES); this.setFocus(); this.saveState(); @@ -188,7 +179,7 @@ this.selectAll(); Event.stop(event); } - Richfaces.SelectItems.doActive(this.activeItem, this.CLASSES); + this.activeItem.item.doActive(); this.saveState(); break; } @@ -212,8 +203,8 @@ changeActiveItems : function(newItem, item) { this.resetMarked(); - Richfaces.SelectItems.doSelect(newItem, this.CLASSES); - Richfaces.SelectItems.doActive(newItem, this.CLASSES); + newItem.item.doSelect(); + newItem.item.doActive(); this.activeItem = newItem; this.selectedItems.push(newItem); }, @@ -239,10 +230,10 @@ markedItem._selected = true; this.selectedItems[0] = markedShuttleItem; }*/ - if (Richfaces.SelectItems.isSelected(activeItem, this.CLASSES)) { - Richfaces.SelectItems.doNormal(activeItem); + if (activeItem.item.isSelected()) { + activeItem.item.doNormal(); } else { - Richfaces.SelectItems.doSelect(activeItem, this.CLASSES); + activeItem.item.doSelect(); this.selectedItems[0] = markedShuttleItem; //TODO: delete } //} @@ -263,20 +254,20 @@ this.selectedItems.push(markedShuttleItem); }*/ - if (Richfaces.SelectItems.isSelected(activeItem, this.CLASSES)) { + if (activeItem.item.isSelected()) { this.selectedItems.remove(markedShuttleItem); //TODO :delete - Richfaces.SelectItems.doNormal(activeItem, this.CLASSES); + activeItem.item.doNormal(); } else { - Richfaces.SelectItems.doSelect(activeItem, this.CLASSES); + activeItem.item.doSelect(); this.selectedItems.push(markedShuttleItem); //TODO :delete } if ((this.activeItem != null) && (this.activeItem.rowIndex != activeItem.rowIndex)) { //reset activity of an element - if (Richfaces.SelectItems.isSelected(this.activeItem, this.CLASSES)) { - Richfaces.SelectItems.doSelect(this.activeItem, this.CLASSES); + if (this.activeItem.item.isSelected()) { + this.activeItem.item.doSelect(); } else { - Richfaces.SelectItems.doNormal(this.activeItem, this.CLASSES); + this.activeItem.item.doNormal(); } } @@ -311,7 +302,7 @@ selectItemRange : function(startIndex, endIndex) { var rows = this.shuttleTbody.rows; for (var i = startIndex; i <= endIndex; i++) { - Richfaces.SelectItems.doSelect(rows[i], this.CLASSES); + rows[i].item.doSelect(); this.selectedItems.push(rows[i]); //this.getSelectItemByNode(rows[i])._selected = true; } @@ -323,7 +314,7 @@ var rows = this.shuttleTbody.rows; for (var i = 0; i < rows.length; i++) { var shuttleItem = rows[i]; - Richfaces.SelectItems.doNormal(shuttleItem, this.CLASSES); + shuttleItem.item.doNormal(); //this.getSelectItemByNode(shuttleItem)._selected = false; //FIXME } this.selectedItems.length = 0; @@ -379,10 +370,10 @@ //this.shuttleTable.className = Richfaces.ListBase.ORDERING_LIST_CLASSES.normal; if (this.activeItem) { - if (Richfaces.SelectItems.isSelected(this.activeItem, this.CLASSES)) { - Richfaces.SelectItems.doSelect(this.activeItem, this.CLASSES); + if (this.activeItem.item.isSelected()) { + this.activeItem.item.doSelect(); } else { - Richfaces.SelectItems.doNormal(this.activeItem, this.CLASSES); + this.activeItem.item.doNormal(); } } }, @@ -409,22 +400,9 @@ saveState : function() { for (var i = 0; i < this.shuttleItems.length; i++) { var item = this.shuttleItems[i]; - var value = item.input.value; - var idx = value.indexOf(":"); - var state = value.substring(0, idx); - state = state.replace(/[as]/g, ""); - - //TODO optimization - if (Richfaces.SelectItems.isSelected(item._node, this.CLASSES)) { - state = state + "s"; - } - if (this.activeItem && (this.activeItem.rowIndex == item._node.rowIndex)) { - state = state + "a"; - } - - item.input.value = state + value.substring(idx); - } + item.saveState(); + } } } Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/OrderingList.js 2007-12-09 22:52:58 UTC (rev 4643) @@ -1,8 +1,29 @@ if(!window.Richfaces) window.Richfaces = {}; +Richfaces.OrderingListSelectItem = Class.create(Richfaces.SelectItem); +Richfaces.OrderingListSelectItem.prototype.CLASSES = { + ROW : { + ACTIVE : "rich-ordering-list-row-active", + SELECTED : "rich-ordering-list-row-selected", + ACTIVE_SELECTED : "rich-ordering-list-row-selected rich-ordering-list-row-active", + DISABLED : "rich-ordering-list-row-disabled", + NORMAL : "rich-ordering-list-row" + }, + CELL : { + ACTIVE : "rich-ordering-list-cell-active", + SELECTED : "rich-ordering-list-cell-selected", + ACTIVE_SELECTED : "rich-ordering-list-cell-selected rich-ordering-list-cell-active", + DISABLED : "rich-ordering-list-cell-disabled", + NORMAL : "rich-ordering-list-cell", + BEGIN: " rich-ordering-list-cell-begin", + END: " rich-ordering-list-cell-end" + } +}, + + Richfaces.OrderingList = Class.create(Richfaces.ListBase, { - initialize: function($super, containerId, contentTableId, headerTableId, focusKeeperId, ids, onclickControlId, onorderchanged) { - $super(containerId, contentTableId, headerTableId, focusKeeperId, onclickControlId); + initialize: function($super, containerId, contentTableId, headerTableId, focusKeeperId, ids, onclickControlId, onorderchanged, controlClass) { + $super(containerId, contentTableId, headerTableId, focusKeeperId, onclickControlId, controlClass); if (onorderchanged) { this.container.observe("rich:onorderchanged", onorderchanged); Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/SelectItem.js =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/SelectItem.js 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/SelectItem.js 2007-12-09 22:52:58 UTC (rev 4643) @@ -1,43 +1,67 @@ if(!window.Richfaces) var Richfaces = function(){}; +Richfaces.SelectItem = Class.create(); -Richfaces.SelectItems = { +Richfaces.SelectItem.prototype = { + initialize : function(label, id, node) { + this._label = label; + this._node = node; + this._node.item = this; + this._id = id; + + //TODO 2 optimize + this.input = $(node.id + "StateInput"); + + this.selected = /^s/.test(this.input.value); + this.active = /^s?a/.test(this.input.value); + }, - doActive : function(row, classes) { + doActive : function() { + var classes = this.CLASSES; + var row = this._node; var newRowStyle = classes.ROW.ACTIVE; var newCellStyle = classes.CELL.ACTIVE; if (Element.hasClassName(row, classes.ROW.SELECTED)) { newRowStyle = classes.ROW.ACTIVE_SELECTED; newCellStyle = classes.CELL.ACTIVE_SELECTED; } - Richfaces.SelectItems.doChange(row, newRowStyle, newCellStyle, + this.doChange(row, newRowStyle, newCellStyle, classes.CELL.BEGIN, classes.CELL.END); + + this.active = true; }, - doSelect : function(row, classes) { - Richfaces.SelectItems - .doChange(row, + doSelect : function() { + var row = this._node; + var classes = this.CLASSES; + this.doChange(row, classes.ROW.SELECTED, classes.CELL.SELECTED); + + this.selected = true; }, - doNormal : function(row, classes) { - Richfaces.SelectItems - .doChange(row, + doNormal : function() { + var row = this._node; + var classes = this.CLASSES; + this.doChange(row, classes.ROW.NORMAL, classes.CELL.NORMAL); + + this.active = false; + this.selected = false; }, - isSelected : function(row, classes) { - return Richfaces.SelectItems.compareStates(row, classes.ROW.SELECTED); + isSelected : function() { + return this.selected; }, - isActive : function(row, classes) { - return Richfaces.SelectItems.compareStates(row, classes.ROW.ACTIVE); + isActive : function() { + return this.active; }, doChange : function(row, classNameRow, classNameCell, classNameCellBegin, classNameCellEnd) { - Richfaces.SelectItems.doChangeNode(row, classNameRow); + this.doChangeNode(row, classNameRow); var cells = row.cells; for (var i = 0; i < cells.length; i++) { var cell = cells[i]; @@ -48,7 +72,7 @@ if (classNameCellBegin && 0 == i){ clazz += " " + classNameCellBegin; } - Richfaces.SelectItems.doChangeNode(cell, clazz); + this.doChangeNode(cell, clazz); } }, @@ -56,24 +80,17 @@ node.className = className; }, - compareStates : function(row, className) { - if (row.className.indexOf(className) != -1) { - return true; + saveState: function() { + var regex = /^s?a?/; + + if (this.selected && this.active) { + this.input.value = this.input.value.replace(regex, 'sa'); + } else if (this.selected) { + this.input.value = this.input.value.replace(regex, 's'); + } else if (this.active) { + this.input.value = this.input.value.replace(regex, 'a'); + } else { + this.input.value = this.input.value.replace(regex, ''); } - return false; } } - -Richfaces.SelectItem = Class.create(); -Richfaces.SelectItem.prototype = { - initialize : function(label, id, selected, node) { - this._label = label; - this._node = node; - this._node.item = this; - this._id = id; - this._selected = selected; - - //TODO 2 optimize - this.input = $(node.id + "StateInput"); - } -} Modified: branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx =================================================================== --- branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-12-09 22:52:44 UTC (rev 4642) +++ branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-12-09 22:52:58 UTC (rev 4643) @@ -88,7 +88,7 @@ var clientId = '#{cId}'; Event.onReady(function() { var cotrolsIdPrefix = [['up', 'disup'], ['down', 'disdown'], ['last', 'dislast'], ['first','disfirst']]; - var shuttle = new Richfaces.OrderingList('#{cId}', '#{cId}internal_tab', '#{cId}internal_header_tab', '#{cId}focusKeeper', cotrolsIdPrefix, '#{cId}sortLabel', #{this:getAsEventHandler(context, component, "onorderchanged")}); + var shuttle = new Richfaces.OrderingList('#{cId}', '#{cId}internal_tab', '#{cId}internal_header_tab', '#{cId}focusKeeper', cotrolsIdPrefix, '#{cId}sortLabel', #{this:getAsEventHandler(context, component, "onorderchanged")}, Richfaces.OrderingListSelectItem); var layoutManager = new LayoutManager('#{clientId}internal_header_tab', '#{clientId}internal_tab'); layoutManager.widthSynchronization(); });