improved tab support

chromesoul.html

@@ -29,6 +29,7 @@
     <script type="text/javascript" src="third-party/ab-str.js"></script>
     <script type="text/javascript" src="lib/ns_client.js"></script>
     <script type="text/javascript" src="lib/options.js"></script>
+    <script type="text/javascript" src="lib/tab.nsui.js"></script>
     <script type="text/javascript" src="lib/nsui.js"></script>
     <script type="text/javascript" src="start.js"></script>
   </body>

lib/nsui.js

@@ -22,7 +22,36 @@ Nsui.prototype.setReconnect = function(func) {
     document.getElementById('reconnect').addEventListener('click', func, false);
 };
 
-Nsui.prototype.getWidgetByName = function(name) {
+Nsui.prototype.createTab = function(name) {
+    var tab = new Tab(name);
+
+    tab.hide();
+    this.tab_lst.push(tab);
+    return tab;
+};
+
+Nsui.prototype.deleteTab = function(tab) {
+    var new_tab = this.getNextTab(tab.name);
+
+    this.tab_lst = this.tab_lst.filter(function(element, index, array) {
+	return tab.name !== element.name;
+    });
+
+    if (new_tab !== null) {
+	new_tab.show();
+    } else {
+	document.getElementById('configuration').style.display = 'block';
+    }
+};
+
+Nsui.prototype.hideAllTabs = function() {
+    document.getElementById('configuration').style.display = 'none';
+    for (i = this.tab_lst.length - 1; i >= 0; --i) {
+	this.tab_lst[i].hide();
+    }
+};
+
+Nsui.prototype.getTabByName = function(name) {
     var i, ret = null;
 
     for (i = this.tab_lst.length - 1; i >= 0; --i) {
@@ -35,14 +64,29 @@ Nsui.prototype.getWidgetByName = function(name) {
     return ret;
 }
 
-Nsui.prototype.registerTab = function(tab) {
+Nsui.prototype.getNextTab = function(current_name) {
-    this.tab_lst.push(tab);
+    var i, prev = null;
-};
 
-Nsui.prototype.unRegisterTab = function(tab) {
+    for (i = this.tab_lst.length - 1; i >= 0; --i) {
-    this.tab_lst = this.tab_lst.filter(function(element, index, array) {
+	if (this.tab_lst[i].name === current_name) {
-	return tab.name !== element.name;
+	    if (prev === null && typeof this.tab_lst[i - 1] !== 'undefined') {
-    });
+		prev = this.tab_lst[i - 1];
+	    }
+	    break ;
+	}
+	prev = this.tab_lst[i];
+    }
+
+    return prev;
+}
+
+Nsui.prototype.addContentToTab = function(tab_name, content) {
+    var tab = this.getTabByName(tab_name);
+    if (tab === null) {
+	tab = this.createTab(tab_name);
+    }
+    tab.setActive();
+    tab.appendText(content);
 };
 
 Nsui.prototype.init = function() {
@@ -54,35 +98,19 @@ Nsui.prototype.init = function() {
 	    this.classList.add('tab-current');
 	    document.getElementById('configuration').style.display = 'block';
 	};
+    },
+    tch = function(elem) {
+	return function() {
+	    elem.deleteTab(this);
+	};
+    },
+    tsh = function(elem) {
+	return function() {
+	    elem.hideAllTabs();
+	};
     };
 
     document.getElementById('tab-config').addEventListener('click', sh(this), false);
-
+    Tab.prototype.closeHandler = tch(this);
-    /*
+    Tab.prototype.showHandler = tsh(this);
-    var i, t, tabs = ['guitto_f', 'cadore_s', 'baud_c', 'bastie_j'], onTabDelete = function(elem) {
-	return function(tab) {
-	    var n = tab.getNextTabName(), t = elem.getWidgetByName(tab.name);
-
-	    if (t !== null) {
-		elem.unRegisterTab(t);
-	    }
-	    if (n !== null) {
-		n = elem.getWidgetByName(n);
-		if (n !== null) {
-		    n.show();
-		}
-	    } else {
-		    document.getElementById('configuration').style.display = 'block';
-	    }
-	};
-    };
-
-    for (i = 0; i < tabs.length; i++) {
-	t = new Tab(tabs[i]);
-	this.registerTab(t);
-	t.registerCloseHandler(onTabDelete(this));
-	t.appendText(tabs[i] + ': Salut Rodolphe !');
-	t.appendText(tabs[i] + ': Ça va ?');
-    }
-    */
 };

lib/tab.nsui.js

@@ -15,7 +15,6 @@
 //
 
 var Tab = function(name) {
-    this.closeHandler = null;
     this.name = this.filterName(name);
     this.wr_lst = document.getElementById('tab-lst');
     this.wr_body = document.getElementById('tab-body-wrapper');
@@ -70,29 +69,9 @@ Tab.prototype.initBodyElement = function() {
     this.wr_body.appendChild(this.el_body);
 };
 
-Tab.prototype.registerCloseHandler = function(func) {
-    this.closeHandler = func;
-};
-
-Tab.prototype.getNextTabName = function() {
-    var i, prev = null;
-
-    for (i = this.wr_body.children.length - 1; i > 1; --i) {
-	if (this.wr_body.children[i].id === this.name) {
-	    if (prev === null) {
-		prev = this.wr_body.children[i - 1].id;
-	    }
-	    break ;
-	}
-	prev = this.wr_body.children[i].id;
-    }
-
-    return prev;
-}
-
 Tab.prototype.close = function() {
-    if (this.closeHandler !== null) {
+    if (typeof this.closeHandler !== 'undefined') {
-	this.closeHandler(this);
+	this.closeHandler();
     }
     this.wr_body.removeChild(this.el_body);
     this.wr_lst.removeChild(this.el_lst);
@@ -104,22 +83,17 @@ Tab.prototype.hide = function() {
 };
 
 Tab.prototype.show = function() {
-    for (var i = this.wr_body.children.length - 1; i >= 0; --i) {
+    if (typeof this.showHandler !== 'undefined') {
-	this.wr_body.children[i].style.display = 'none';
+	this.showHandler();
-    }
-    this.el_body.style.display = 'block';
-    this.chat_log.scrollTop = 42000;
-    this.setCurrent();
-};
-
-Tab.prototype.setCurrent = function() {
-    var i, elems = document.getElementsByClassName('tab-current');
-
-    for (i = elems.length - 1; i >= 0; --i) {
-	elems[i].classList.remove('tab-current');
     }
     this.el_lst.classList.remove('tab-active');
     this.el_lst.classList.add('tab-current');
+    this.el_body.style.display = 'block';
+    this.chat_log.scrollTop = 42000;
+};
+
+Tab.prototype.setActive = function() {
+    this.el_lst.classList.add('tab-active');
 }
 
 Tab.prototype.appendText = function(text) {