[Mapbender-commits] r7183 - trunk/mapbender/http/javascripts

[svn_mapbender at osgeo.org]

Author: christoph
Date: 2010-12-02 08:04:32 -0800 (Thu, 02 Dec 2010)
New Revision: 7183

Modified:
   trunk/mapbender/http/javascripts/mod_tab.js
Log:
#730

Modified: trunk/mapbender/http/javascripts/mod_tab.js
===================================================================
--- trunk/mapbender/http/javascripts/mod_tab.js	2010-12-02 16:01:17 UTC (rev 7182)
+++ trunk/mapbender/http/javascripts/mod_tab.js	2010-12-02 16:04:32 UTC (rev 7183)
@@ -22,6 +22,7 @@
 eventInit.register(function () {
 	tab_init();
 	localizeTabs();
+
 });
 
 function localizeTabs() {
@@ -34,7 +35,8 @@
 }
  
 function tab_init(){
-	var obj = document.getElementById("tabs").style;
+	var tabNode = document.getElementById("tabs");
+	var obj = tabNode.style;
 
 	// generate a new tab array
 	tabs = new VerticalTabArray(tab_style);
@@ -47,6 +49,12 @@
 	if (open_tab !== "") {
 		tabs.openTab(tabs.get(open_tab).module);
 	}
+	$(tabNode).children("div").hover(function () {
+		$(this).addClass("ui-state-hover");
+	}, function () {
+		$(this).removeClass("ui-state-hover");
+	});
+
 }
 
 function tab_open(elementName) {
@@ -85,7 +93,7 @@
 		node.id = "tabs_" + that.module;
 		
 		//set css class
-		node.className = "verticalTabs ui-widget-header";
+		node.className = "verticalTabs ui-state-default";
 
 		//mandatory style entries
 		node.style.position = "absolute";
@@ -93,20 +101,10 @@
 		node.style.height = parseInt(tabHeight, 10) + "px";
 		node.style.top = parseInt(number * tabHeight, 10) + "px";
 		
-		// open or close on click
-		// see http://www.mapbender.org/index.php/Add_events_via_DOM_in_IE_and_FF
-		if ($.browser.msie) {
-		
-		   node.onclick = function() {
-		      tabs.toggleTab(that.module);
-		   };
-		}
-		else {
-			node.onclick = function(){
-				tabs.toggleTab(that.module);
-			};
-		}
-		
+		$(node).click(function() {
+			tabs.toggleTab(that.module);
+		});
+
 		// tab header
 		node.innerHTML = title;
 	};
@@ -205,6 +203,8 @@
 	 * @param {String} id the ID of the GUI element within the tab.
 	 */
 	this.toggleTab = function(id) {
+		$("#tabs_" + id).addClass("ui-state-active").siblings().removeClass("ui-state-active");
+
 		// if no tab is currently opening or closing
 		if (isAnimationFinished()) {
 			for (var i=0; i < this.count(); i++) {
@@ -366,7 +366,8 @@
   				hideFrame(this.get(i).module);
   			}
   		}
-      activeTabId = id;
+		activeTabId = id;
+		$("#tabs_" + id).addClass("ui-state-active").siblings().removeClass("ui-state-active");
     	startAnimation("open");
 		}
 	};