/****************************************************************************\ * Dynamic Tabs - Javascript Object * * * * Written by: * * - Raphael Derosso Pereira * * ------------------------------------------------------------------------ * * This program is free software; you can redistribute it and/or modify it * * under the terms of the GNU General Public License as published by the * * Free Software Foundation; either version 2 of the License, or (at your * * option) any later version. * \****************************************************************************/ /* * Dynamic Tabs - On-The-Fly Tabs in Javascript * * Usage: * var tabs = new dTabsManager({'id':
, 'width': '498px'}); * * tabs.addTab({'id': , * 'name': , * 'selectedClass': , * 'unselectedClass': }); */ dTabsManager.prototype.init = function(params) { /* Attributes definition */ this._Tabs = new Array(); this._Tabs['root'] = null; this._Tabs['tabIndexTR'] = null; this._Tabs['tabIndexTDs'] = new Array(); this._Tabs['contents'] = null; this._Tabs['contentsDIV'] = null; this._selectedIndex = null; this._nTabs = params['nTabs'] ? params['nTabs'] : 0; this._maxTabs = params['maxTabs'] ? params['maxTabs'] : 0; /* Create and insert the container */ var table, tbody, tr, td, style; var _this = this; style = document.createElement('link'); style.href = GLOBALS['serverRoot'] + "phpgwapi/js/dTabs/dTabs.css"; style.rel = "stylesheet"; style.type = "text/css"; this._Tabs['root'] = document.createElement('div'); this._Tabs['root'].id = params['id']; this._Tabs['root'].style.position = 'absolute'; //this._Tabs['root'].style.visibility = 'hidden'; this._Tabs['root'].style.top = '150px'; this._Tabs['root'].style.left = '0px'; this._Tabs['root'].style.width = params['width'] ? params['width'] : 0; table = document.createElement('table'); tbody = document.createElement('tbody'); table.style.border = '0px solid black'; table.style.width = '100%'; table.style.height = '100%'; table.cellpadding = '10px'; this._Tabs['tabIndexTR'] = document.createElement('tr'); this._Tabs['tabIndexTR'].style.height = '30px'; this._Tabs['tabIndexTR'].className = 'dTabs_tr_index'; //this._Tabs['tabIndexTR'].style.width = '100%'; this._Tabs['emptyTab'] = document.createElement('td'); this._Tabs['emptyTab'].className = 'dTabs_noTabs'; this._Tabs['emptyTab'].innerHTML = ' '; this._Tabs['tabIndexTR'].appendChild(this._Tabs['emptyTab']); tr = document.createElement('tr'); td = document.createElement('td'); tr.style.width = '100%'; tr.style.height = '100%'; //this._Tabs['contentsDIV'] = document.createElement('div'); //this._Tabs['contentsDIV'].style.position = 'relative'; this._Tabs['contentsDIV'] = td; this._Tabs['root'].appendChild(table); table.appendChild(tbody); tbody.appendChild(this._Tabs['tabIndexTR']); tbody.appendChild(tr); tr.appendChild(td); //td.appendChild(this._Tabs['contentsDIV']); tr.appendChild(this._Tabs['contentsDIV']); this._Tabs['contents'] = new Array(); var create = function () { document.body.appendChild(style); document.body.appendChild(_this._Tabs['root']); _this.created = true; } this.created = false; //JsLib.postponeFunction(create); create(); } /* @method addTab @abstract Inserts a tab */ dTabsManager.prototype.addTab = function (params) { var _this = this; if (this.created) { return this.addTabIE(params); } //JsLib.postponeFunction(function(){ _this.addTabIE(params);}); } dTabsManager.prototype.addTabIE = function (params) { if (typeof(params) != 'object') { return false; } if (!params['id'] || !Element(params['id']) || Element(params['id']).tagName.toLowerCase() != 'div' || Element(params['id']).style.position.toLowerCase() != 'absolute') { return false; } if (this._Tabs['contents'][params['id']]) { this.replaceTab(params); return; } //var contents, tdIndex; var element = Element(params['id']); // element.parentNode.removeChild(element); element.style.top = parseInt(this._Tabs['tabIndexTR'].style.height) + 5 + 'px'; element.style.left = this._Tabs['root'].style.left; element.style.zIndex = '-1'; this._Tabs['contents'][params['id']] = element; this._Tabs.tabIndexTDs[params['id']] = document.createElement('td'); var _this = this; this._Tabs.tabIndexTDs[params['id']].innerHTML = '  '+(params['name'] ? params['name'] : 'undefined')+'  '; this._Tabs.tabIndexTDs[params['id']].selectedClassName = 'dTabs_selected'; this._Tabs.tabIndexTDs[params['id']].unselectedClassName = 'dTabs_unselected'; this._Tabs.tabIndexTDs[params['id']].className = 'dTabs_unselected'; this._Tabs.tabIndexTDs[params['id']].onclick = function() {_this._showTab(params['id']);}; /* Old Version this._Tabs.tabIndexTDs[params['id']].innerHTML = params['name'] ? params['name'] : 'undefined'; this._Tabs.tabIndexTDs[params['id']].selectedClassName = params['selectedClass']; this._Tabs.tabIndexTDs[params['id']].unselectedClassName = params['unselectedClass']; this._Tabs.tabIndexTDs[params['id']].className = params['unselectedClass']; this._Tabs.tabIndexTDs[params['id']].onclick = function() {_this._showTab(params['id']);}; */ this._Tabs.tabIndexTR.removeChild(this._Tabs['emptyTab']); this._Tabs.tabIndexTR.appendChild(this._Tabs.tabIndexTDs[params['id']]); this._Tabs.tabIndexTR.appendChild(this._Tabs['emptyTab']); this._Tabs.contentsDIV.appendChild(this._Tabs['contents'][params['id']]); this._nTabs++; if (this._nTabs == 1) { this._showTab(params['id']); } return; } dTabsManager.prototype.enableTab = function(id) { var _this = this; var enable = function() { if (_this._Tabs.contents[id]) { _this._Tabs.tabIndexTDs[id].className = 'dTabs_unselected'; _this._Tabs.tabIndexTDs[id].onclick = function() {_this._showTab(id);}; } } if (!this.created) { JsLib.postponeFunction(enable); } else { enable(); } } dTabsManager.prototype.disableTab = function(id) { var _this = this; var disable = function () { if (_this._Tabs.contents[id]) { _this._Tabs.tabIndexTDs[id].className = 'dTabs_disabled'; _this._Tabs.tabIndexTDs[id].onclick = null; } } if (!this.created) { JsLib.postponeFunction(disable); } else { disable(); } } /****************************************************************************\ * Private Methods * \****************************************************************************/