Author: abelevich Date: 2010-05-13 12:22:05 -0400 (Thu, 13 May 2010) New Revision: 17021 Modified: root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/datatable.js root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/subtable.js root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/toggler.js Log: dataTable client api Modified: root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/datatable.js =================================================================== --- root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/datatable.js 2010-05-13 14:49:49 UTC (rev 17020) +++ root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/datatable.js 2010-05-13 16:22:05 UTC (rev 17021) @@ -7,6 +7,7 @@ this.options = options; $super.constructor.call(this,id); $p.attachToDom.call(this, id); + }; var $super = richfaces.BaseComponent.extend(richfaces.BaseComponent, richfaces.ui.DataTable); @@ -15,7 +16,8 @@ $.extend(richfaces.ui.DataTable, { SORTING: "rich:sorting", - FILTERING: "rich:filtering" + FILTERING: "rich:filtering", + SUBTABLE_SELECTOR:".rich-subtable" }); $.extend(richfaces.ui.DataTable.prototype, ( function () { @@ -38,6 +40,7 @@ return parameters; }; + return { name : "RichFaces.ui.DataTable", @@ -48,20 +51,55 @@ filter: function(columnId, filterValue, isClear) { invoke.call(this,createParameters.call(this,richfaces.ui.DataTable.FILTERING, columnId, filterValue, isClear)); + }, + + expandAllSubTables: function() { + this.invokeOnSubTables.call(this, 'expand'); }, + collapseAllSubTables: function() { + this.invokeOnSubTables.call(this, 'collapse'); + }, + switchSubTable: function(id) { - + this.getSubTable(id).toggle(); }, - expandAllSubTables: function() { - + getSubTable: function(id) { + return richfaces.$(id); }, - collapseAllSubTables: function() { - + invokeOnSubTables: function(funcName) { + var elements = $(document.getElementById(this.id)).children(richfaces.ui.DataTable.SUBTABLE_SELECTOR); + if(elements && elements.length > 0) { + for (var key in elements) { + var element = elements[key]; + if(element && element.richfaces && element.richfaces.component) { + var component = element.richfaces.component; + if(component instanceof RichFaces.ui.SubTable) { + this.invokeOnComponent(component, funcName) + } + } + } + } + }, + + invokeOnSubTable: function(id, funcName) { + var subtable = this.getSubTable(id); + this.invokeOnComponent(subtable, funcName); + }, + + invokeOnComponent: function(component, funcName) { + if(component) { + var func = component[funcName]; + if(typeof func == 'function') { + func.call(component); + } + } } + } + })()); })(jQuery, window.RichFaces); Modified: root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/subtable.js =================================================================== --- root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/subtable.js 2010-05-13 14:49:49 UTC (rev 17020) +++ root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/subtable.js 2010-05-13 16:22:05 UTC (rev 17021) @@ -11,89 +11,90 @@ $super.constructor.call(this, id); $p.attachToDom.call(this, id); - }; + }; $.extend(richfaces.ui.SubTable, { MODE_AJAX: "ajax", MODE_SRV: "server", - MODE_CLNT: "client" + MODE_CLNT: "client", + collapse: 0, + expand: 1 }) var $super = richfaces.BaseComponent.extend(richfaces.BaseComponent, richfaces.ui.SubTable); var $p = richfaces.BaseComponent.extend(richfaces.BaseComponent,richfaces.ui.SubTable, {}); - var $super = richfaces.ui.SubTable.$super; + var $super = richfaces.ui.SubTable.$super; $.extend(richfaces.ui.SubTable.prototype, (function () { - getElementById = function(id) { - return $(document.getElementById(id)); - } + var element = function() { + return $(document.getElementById(this.id)); + }; - getState = function() { - return getElementById(this.stateInput).val(); - } + var stateInputElem = function() { + return $(document.getElementById(this.stateInput)); + }; + + var ajax = function(e, options) { + this.switchState(); + richfaces.ajax(this.id, e, options); + }; - setState = function(state) { - getElementById(this.stateInput).val(state); - } + var server = function() { + this.switchState(); + $(document.getElementById(this.formId)).submit(); + }; - ajax = function(e) { - if(this.element && this.element[0]) { - jsf.ajax.request(this.element[0], e, this.eventOptions); - } - } - - server = function(e) { - var f = document.getElementById(this.formId); - if(f) { - f.submit(); - } - } - - client = function(e) { + var client = function() { if(this.isExpand()) { - this.element.show(); + this.collapse(); } else { - this.element.hide(); + this.expand(); } - } - + }; + + return { + + name: "RichFaces.ui.SubTable", toggle: function(e) { - if(this.isExpand()) { - this.collapse(e); - } else { - this.expand(e); - } + if(this.expandMode == richfaces.ui.SubTable.MODE_AJAX) { + ajax.call(this, e, this.eventOptions); + }else if(this.expandMode == richfaces.ui.SubTable.MODE_SRV) { + server.call(this); + }else if(this.expandMode == richfaces.ui.SubTable.MODE_CLNT) { + client.call(this); + } }, - collapse: function(e) { - this.toggleToState(0, e); + collapse: function() { + this.setState(richfaces.ui.SubTable.collapse); + element.call(this).hide(); }, - expand: function(e) { - this.toggleToState(1, e); + expand: function() { + this.setState(richfaces.ui.SubTable.expand); + element.call(this).show(); }, isExpand: function() { - var currentState = getState.call(this); - return (currentState > 0); - }, - - toggleToState: function(toState, e) { - - setState.call(this, toState); - - if(this.expandMode == richfaces.ui.SubTable.MODE_AJAX) { - ajax.call(this, e); - }else if(this.expandMode == richfaces.ui.SubTable.MODE_SRV) { - server.call(this, e); - }else if(this.expandMode == richfaces.ui.SubTable.MODE_CLNT) { - client.call(this ,e); - } - } - }; + return (this.getState() > richfaces.ui.SubTable.collapse); + }, + + switchState: function() { + var state = this.isExpand() ? richfaces.ui.SubTable.collapse : richfaces.ui.SubTable.expand; + this.setState(state); + }, + + getState: function() { + return stateInputElem.call(this).val(); + }, + + setState: function(state) { + stateInputElem.call(this).val(state) + } + }; })()); Modified: root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/toggler.js =================================================================== --- root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/toggler.js 2010-05-13 14:49:49 UTC (rev 17020) +++ root/ui-sandbox/tables/trunk/ui/src/main/resources/META-INF/resources/toggler.js 2010-05-13 16:22:05 UTC (rev 17021) @@ -14,18 +14,17 @@ $.extend(richfaces.ui.DataTableToggler.prototype, (function () { - getElementById= function(id) { - $(document.getElementById(id)) + var getElementById= function(id) { + return $(document.getElementById(id)) } return { - - toggle: function(event) { - var element = getElementById(this.forId); - var subtable = element.attr('richfaces'); - if(subtable && subtable.component) { - this.toggleControl(subtable.component.isExpand()); - subtable.component.toggle(event); + + toggle: function(e) { + var subtable = richfaces.$(this.forId); + if(subtable) { + this.toggleControl(subtable.isExpand()); + subtable.toggle(e); } },