[Mapbender-commits] r3704 - trunk/mapbender/http/javascripts
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Fri Mar 13 09:11:10 EDT 2009
Author: christoph
Date: 2009-03-13 09:11:10 -0400 (Fri, 13 Mar 2009)
New Revision: 3704
Modified:
trunk/mapbender/http/javascripts/mod_tab.js
Log:
unix style line breaks
Modified: trunk/mapbender/http/javascripts/mod_tab.js
===================================================================
--- trunk/mapbender/http/javascripts/mod_tab.js 2009-03-13 12:37:08 UTC (rev 3703)
+++ trunk/mapbender/http/javascripts/mod_tab.js 2009-03-13 13:11:10 UTC (rev 3704)
@@ -1,498 +1,498 @@
-// check element vars
-try{
- if (open_tab){
- open_tab = Number(open_tab);
-
- if (isNaN(open_tab)) {
- var e = new Mb_warning("mod_tab.js: tab_init: open_tab must be a number or an empty string.");
- }
- }
-}
-catch(e){
- var z = new Mb_warning("mod_tab.js: tab_init: open_tab is not set.");
- open_tab = "";
-}
-
-var tabs;
-
-eventLocalize.register(function () {
- localizeTabs();
-});
-
-eventInit.register(function () {
- tab_init();
- localizeTabs();
-});
-
-function localizeTabs() {
- mb_ajax_json("../php/mod_tab_messages.php", function(obj, status){
- tabs.setTitles(obj);
- });
-}
-
-function tab_init(){
- var obj = document.getElementById("tabs").style;
-
- // generate a new tab array
- tabs = new VerticalTabArray(tab_style);
-
- // add the tabs from element vars
- for (var i = 0; i < tab_ids.length; i++){
- tabs.addTab(tab_ids[i], tab_prefix + tab_titles[i], tab_frameHeight[i]);
- }
-
- if (open_tab !== "") {
- tabs.openTab(tabs.get(open_tab).module);
- }
-}
-
-function tab_open(elementName) {
- // show the desired tab
- tabs.openTab(elementName);
-}
-
-/**
- * @class A single vertical tab
- *
- * @constructor
- * @param {String} id the ID of the GUI element that will be displayed within the tab
- * @param {String} title the header of the tab
- * @param {Integer} frameHeight the height of the frame containing the GUI element
- * @param {Integer} tabWidth the width of a tab (NOT the frame)
- * @param {Integer} tabHeight the height of a tab (NOT the frame)
- * @param {String} tabStyle A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
- * @param {Integer} number the index of the current tab in a {@link VerticalTabArray}.
- */
-var VerticalTab = function (id, title, frameHeight, tabWidth, tabHeight, tabStyle, number) {
-
- /**
- * Sets the attributes of the tabs DOM node.
- *
- * @private
- * @param {String} title the header of the tab
- * @param {Integer} frameHeight the height of the frame containing the GUI element
- * @param {Integer} tabWidth the width of a tab (NOT the frame)
- * @param {Integer} tabHeight the height of a tab (NOT the frame)
- * @param {String} tabStyle A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
- * @param {Integer} number the index of the current tab in a {@link VerticalTabArray}.
- *
- */
- var setNodeAttributes = function(title, frameHeight, tabWidth, tabHeight, tabStyle, number) {
-
- node.id = "tabs_" + that.module;
-
- //set css class
- node.className = "verticalTabs";
-
- //mandatory style entries
- node.style.position = "absolute";
- node.style.width = tabWidth;
- node.style.height = tabHeight;
- node.style.top = number * tabHeight;
-
- // 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);
- };
- }
-
- // tab header
- node.innerHTML = title;
- };
-
- /**
- * Returns the DOM node of this tab.
- *
- * @return the DOM node of this tab.
- * @type DOMNode
- */
- this.getNode = function() {
- return node;
- };
-
- /**
- * The ID of the GUI element that will be displayed within the tab.
- */
- this.module = id;
-
- /**
- * The height of the frame containing the GUI element.
- */
- this.height = frameHeight;
-
- /**
- * While a tab is opened or closed, the value is false.
- */
- this.animationFinished = true;
-
- /**
- * The DOM node of this tab.
- *
- * @private
- */
- var node = document.createElement("div");
- var that = this;
-
- setNodeAttributes(title, frameHeight, tabWidth, tabHeight, tabStyle, number);
-};
-
-/**
- * An array of vertical tabs, behaving like an accordion
- *
- * @extends List
- * @param {String} cssString A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
- */
-var VerticalTabArray = function (cssString) {
-
- /**
- * Adds a new tab to the Array.
- *
- * @param {String} id the ID of the GUI element that will be displayed within the tab
- * @param {String} title the header of the tab
- * @param {Integer} height the height of the frame containing the GUI element
- */
- this.addTab = function(id, title, height) {
- var tab = new VerticalTab(id, title, height, tabWidth, tabHeight, tabStyle, this.count());
- this.add(tab);
-
- document.getElementById(id).style.visibility = 'hidden';
- document.getElementById(id).style.display = 'none';
-
- // append the new tab
- rootNode.appendChild(this.get(-1).getNode());
- };
-
- /**
- * Removes a tab from the Array.
- *
- * @param {String} id the ID of the GUI element within the tab.
- */
- this.delTab = function(id) {
- var index = getIndexById(id);
-
- if (index !== null) {
- // delete the DOM node
- rootNode.removeChild(this.get(index).getNode());
-
- // delete the tab
- this.del(index);
-
- // move the other tabs (below the removed tab) up
- for (var i = index; i < this.count(); i++) {
- var currentNode = this.get(i).getNode();
-
- // parseInt removes "px"
- var currentTop = parseInt(currentNode.style.top, 10);
- currentNode.style.top = currentTop - tabHeight;
- }
- }
- };
-
- /**
- * Opens a tab specified by the module Id.
- *
- * @param {String} id the ID of the GUI element within the tab.
- */
- this.toggleTab = function(id) {
- // if no tab is currently opening or closing
- if (isAnimationFinished()) {
- for (var i=0; i < this.count(); i++) {
- hideFrame(this.get(i).module);
- }
- // if the opened tab is the active tab, close it
- if (id === activeTabId) {
- closeTab(activeTabId);
- }
- //otherwise
- else {
- // show the desired tab
- activeTabId = id;
- startAnimation("open");
- }
- }
- else {
- var e = new Mb_warning("mod_tab.js: could not activate tab, opening or closing in progress!");
- }
- };
-
- /**
- * Sets the titles of each single tab after l10n
- *
- * @param {Object} obj an array containing objects with id and title
- */
- this.setTitles = function (obj) {
- for (var i = 0; i < this.count(); i++) {
- for(var j=0; j<obj.length; j++){
- if (this.get(i).module == obj[j].id) {
- this.get(i).getNode().innerHTML = tabPrefix + obj[j].title;
- }
- }
- }
- }
- /**
- * Returns the absolute coordinates of tab by the module ID
- *
- * @param {String} id the ID of the GUI element within the tab.
- * @return {String} String with "left,top,right,bottom"
- */
-
- this.getCoords = function(id) {
- var coords=[];
- //get indixes
- if (activeTabId) {
- var indexOfOpeningTab = getIndexById(activeTabId);
- }
- var index = getIndexById(id);
-
- //left
- coords[0] = tabLeftOffset;
- //top
- coords[1] = tabTopOffset + index*tabHeight + (activeTabId&&indexOfOpeningTab<index?this.get(indexOfOpeningTab).height:0);
- //right
- coords[2] = coords[0] + tabWidth;
- //bottom
- coords[3] = coords[1] + (id==activeTabId?this.get(indexOfOpeningTab).height+tabHeight:tabHeight);
-
- return coords.join(",");
- };
-
- /**
- * Animated opening and closing of the tab with the given id.
- * Needs to be public because it is called via "setInterval".
- *
- * @param {String} openOrClose a string with the values "open" or "close".
- */
- this.animate = function(openOrClose) {
-
- for (var i=0; i < this.count(); i++) {
-
- if (this.get(i).animationFinished === false) {
-
- //The 'top' position of the i-th tab after the animation
- var currentTabNewTop = i * tabHeight;
-
- if (openOrClose == 'open') {
- var indexOfOpeningTab = getIndexById(activeTabId);
-
- // move the lower tabs down by the height of the opening tab
- if (indexOfOpeningTab !== null && i > indexOfOpeningTab) {
- currentTabNewTop += this.get(indexOfOpeningTab).height;
- }
- }
- //The current 'top' position of the i-th tab
- //(parseInt removes 'px')
- var currentTabCurrentTop = parseInt(this.get(i).getNode().style.top, 10);
-
- // animation is finished
- if (currentTabCurrentTop == currentTabNewTop) {
- this.get(i).animationFinished = true;
- }
- // animation not yet finished, move the tab down
- else if (currentTabCurrentTop < currentTabNewTop) {
- var pixel = Math.min(pixelPerIteration, currentTabNewTop - currentTabCurrentTop);
- this.get(i).getNode().style.top = currentTabCurrentTop + pixel;
- }
- // animation not yet finished, move the tab up
- else if (currentTabCurrentTop > currentTabNewTop) {
- var pixel = Math.min(pixelPerIteration, currentTabCurrentTop - currentTabNewTop);
- this.get(i).getNode().style.top = currentTabCurrentTop - pixel;
- }
- else {
- var e = new Mb_exception("mod_tab.js: animate: unknown state for tab "+ i + " (currentTop: "+currentTabCurrentTop+", newTop:"+currentTabNewTop+")");
- }
- }
- }
- // check if the animation is finished
- if (isAnimationFinished()) {
- stopAnimation();
- if (openOrClose == "open") {
- showFrame(activeTabId);
- }
- }
- };
-
- /**
- * Returns the index of the vertical tab with a given id
- *
- * @private
- * @param {String} id the ID of the GUI element within the tab.
- */
- var getIndexById = function(id) {
- for (var i = 0; i < that.count(); i++) {
- if (that.get(i).module == id) {
- return i;
- }
- }
- var e = new Mb_exception("mod_tab.js: getIndexById: ID '"+id+"' not found.");
- return null;
- };
-
- /**
- * Closes a tab.
- *
- * @private
- * @param {String} id the ID of the GUI element within the tab.
- */
- var closeTab = function(id) {
- if (id !== null) {
- hideFrame(id);
- activeTabId = null;
- startAnimation("close");
- }
- };
-
- /**
- * Opens a tab.
- *
- * @public
- * @param {String} id the ID of the GUI element within the tab.
- */
- this.openTab = function(id) {
- if (id !== null && activeTabId != id) {
- // if no tab is currently opening or closing
- if (isAnimationFinished()) {
- for (var i=0; i < this.count(); i++) {
- hideFrame(this.get(i).module);
- }
- }
- activeTabId = id;
- startAnimation("open");
- }
- };
-
- /**
- * Hides a frame within a tab (before closing the tab).
- *
- * @private
- * @param {String} id the ID of the GUI element within the tab.
- */
- var hideFrame = function(id) {
- var index = getIndexById(id);
- if (index !== null) {
- var obj = document.getElementById(id);
- obj.style.visibility = 'hidden';
- //try to apply for childs of horizontal tabs
- try{
- if(obj.tabs)
- document.getElementById(obj.tabs[obj.activeTab].id).style.visibility = 'hidden';
- }
- catch(e){}
- }
- };
-
- /**
- * Shows a frame within a tab (after opening the tab).
- *
- * @private
- * @param {String} id the ID of the GUI element within the tab.
- */
- var showFrame = function(id) {
- var index = getIndexById(id);
- if (index !== null) {
- var obj = document.getElementById(id);
- var newpos = ((index+1) * tabHeight) + parseInt(tabTopOffset);
- //try to apply for childs of horizontal tabs
- try{
- if(obj.tabs){
- activeTab = document.getElementById(obj.tabs[obj.activeTab].id).style;
- activeTab.visibility = 'visible';
- activeTab.top = ((newpos + 1) + obj.tab_height) + "px";
- activeTab.left = (tabLeftOffset) + "px";
- activeTab.width = tabWidth;
- activeTab.height = (parseInt(that.get(index).height) - 2) - obj.tab_height;
- }
- }
- catch(e){}
- obj=obj.style;
- obj.top = (newpos + 1) + "px";
- obj.left = (tabLeftOffset) + "px";
- obj.width = tabWidth;
- obj.height = (parseInt(that.get(index).height, 10) - 2);
- obj.visibility = 'visible';
- obj.display = 'block';
- }
- };
-
- /**
- * Starts the animation of the opening and closing tabs
- *
- * @private
- * @param {String} openOrClose a string with the values "open" or "close".
- */
- var startAnimation = function(openOrClose) {
- for (var i = 0; i < that.count(); i++) {
- that.get(i).animationFinished = false;
- }
- tabInterval = setInterval(function(){
- tabs.animate(openOrClose);
- },1);
- };
-
- /**
- * Checks if the animation of the opening and closing tabs is finished.
- *
- * @private
- */
- var isAnimationFinished = function() {
- for (var i = 0; i < that.count(); i ++) {
- if (that.get(i).animationFinished === false) {
- return false;
- }
- }
- return true;
- };
-
- /**
- * Stops the animation of the opening and closing tabs
- *
- * @private
- */
- var stopAnimation = function() {
- clearInterval(tabInterval);
- };
-
- this.list = [];
- var that = this;
-
- /**
- * The DOM node of the tab array.
- */
- var rootNode = document.getElementById("tabs");
-
- /**
- * The ID of the currently open tab. If no tab is open, the value is NULL
- */
- var activeTabId = null;
-
- /**
- * Number of pixel that a tab moves while opening or closing.
- * @private
- */
- var pixelPerIteration = 20;
-
- /**
- * Used for the 'setInterval' call of 'this.animate'
- */
- var tabInterval;
-
-
- var tabTopOffset = parseInt(rootNode.style.top, 10);
- var tabLeftOffset = parseInt(rootNode.style.left, 10);
- var tabWidth = parseInt(rootNode.style.width, 10);
- var tabHeight = parseInt(rootNode.style.height, 10);
- var tabStyle = cssString;
-
- var tabPrefix = tab_prefix || '';
- var styleObj = new StyleTag();
- styleObj.addClass("verticalTabs", tabStyle);
-};
-
-VerticalTabArray.prototype = new List();
+// check element vars
+try{
+ if (open_tab){
+ open_tab = Number(open_tab);
+
+ if (isNaN(open_tab)) {
+ var e = new Mb_warning("mod_tab.js: tab_init: open_tab must be a number or an empty string.");
+ }
+ }
+}
+catch(e){
+ var z = new Mb_warning("mod_tab.js: tab_init: open_tab is not set.");
+ open_tab = "";
+}
+
+var tabs;
+
+eventLocalize.register(function () {
+ localizeTabs();
+});
+
+eventInit.register(function () {
+ tab_init();
+ localizeTabs();
+});
+
+function localizeTabs() {
+ mb_ajax_json("../php/mod_tab_messages.php", function(obj, status){
+ tabs.setTitles(obj);
+ });
+}
+
+function tab_init(){
+ var obj = document.getElementById("tabs").style;
+
+ // generate a new tab array
+ tabs = new VerticalTabArray(tab_style);
+
+ // add the tabs from element vars
+ for (var i = 0; i < tab_ids.length; i++){
+ tabs.addTab(tab_ids[i], tab_prefix + tab_titles[i], tab_frameHeight[i]);
+ }
+
+ if (open_tab !== "") {
+ tabs.openTab(tabs.get(open_tab).module);
+ }
+}
+
+function tab_open(elementName) {
+ // show the desired tab
+ tabs.openTab(elementName);
+}
+
+/**
+ * @class A single vertical tab
+ *
+ * @constructor
+ * @param {String} id the ID of the GUI element that will be displayed within the tab
+ * @param {String} title the header of the tab
+ * @param {Integer} frameHeight the height of the frame containing the GUI element
+ * @param {Integer} tabWidth the width of a tab (NOT the frame)
+ * @param {Integer} tabHeight the height of a tab (NOT the frame)
+ * @param {String} tabStyle A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
+ * @param {Integer} number the index of the current tab in a {@link VerticalTabArray}.
+ */
+var VerticalTab = function (id, title, frameHeight, tabWidth, tabHeight, tabStyle, number) {
+
+ /**
+ * Sets the attributes of the tabs DOM node.
+ *
+ * @private
+ * @param {String} title the header of the tab
+ * @param {Integer} frameHeight the height of the frame containing the GUI element
+ * @param {Integer} tabWidth the width of a tab (NOT the frame)
+ * @param {Integer} tabHeight the height of a tab (NOT the frame)
+ * @param {String} tabStyle A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
+ * @param {Integer} number the index of the current tab in a {@link VerticalTabArray}.
+ *
+ */
+ var setNodeAttributes = function(title, frameHeight, tabWidth, tabHeight, tabStyle, number) {
+
+ node.id = "tabs_" + that.module;
+
+ //set css class
+ node.className = "verticalTabs";
+
+ //mandatory style entries
+ node.style.position = "absolute";
+ node.style.width = tabWidth;
+ node.style.height = tabHeight;
+ node.style.top = number * tabHeight;
+
+ // 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);
+ };
+ }
+
+ // tab header
+ node.innerHTML = title;
+ };
+
+ /**
+ * Returns the DOM node of this tab.
+ *
+ * @return the DOM node of this tab.
+ * @type DOMNode
+ */
+ this.getNode = function() {
+ return node;
+ };
+
+ /**
+ * The ID of the GUI element that will be displayed within the tab.
+ */
+ this.module = id;
+
+ /**
+ * The height of the frame containing the GUI element.
+ */
+ this.height = frameHeight;
+
+ /**
+ * While a tab is opened or closed, the value is false.
+ */
+ this.animationFinished = true;
+
+ /**
+ * The DOM node of this tab.
+ *
+ * @private
+ */
+ var node = document.createElement("div");
+ var that = this;
+
+ setNodeAttributes(title, frameHeight, tabWidth, tabHeight, tabStyle, number);
+};
+
+/**
+ * An array of vertical tabs, behaving like an accordion
+ *
+ * @extends List
+ * @param {String} cssString A string with a CSS (example: position:absolute;visibility:visible;border: 1px solid white;font-size:12;color:#343434;background-color:#CFD2D4;cursor:pointer;)
+ */
+var VerticalTabArray = function (cssString) {
+
+ /**
+ * Adds a new tab to the Array.
+ *
+ * @param {String} id the ID of the GUI element that will be displayed within the tab
+ * @param {String} title the header of the tab
+ * @param {Integer} height the height of the frame containing the GUI element
+ */
+ this.addTab = function(id, title, height) {
+ var tab = new VerticalTab(id, title, height, tabWidth, tabHeight, tabStyle, this.count());
+ this.add(tab);
+
+ document.getElementById(id).style.visibility = 'hidden';
+ document.getElementById(id).style.display = 'none';
+
+ // append the new tab
+ rootNode.appendChild(this.get(-1).getNode());
+ };
+
+ /**
+ * Removes a tab from the Array.
+ *
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ this.delTab = function(id) {
+ var index = getIndexById(id);
+
+ if (index !== null) {
+ // delete the DOM node
+ rootNode.removeChild(this.get(index).getNode());
+
+ // delete the tab
+ this.del(index);
+
+ // move the other tabs (below the removed tab) up
+ for (var i = index; i < this.count(); i++) {
+ var currentNode = this.get(i).getNode();
+
+ // parseInt removes "px"
+ var currentTop = parseInt(currentNode.style.top, 10);
+ currentNode.style.top = currentTop - tabHeight;
+ }
+ }
+ };
+
+ /**
+ * Opens a tab specified by the module Id.
+ *
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ this.toggleTab = function(id) {
+ // if no tab is currently opening or closing
+ if (isAnimationFinished()) {
+ for (var i=0; i < this.count(); i++) {
+ hideFrame(this.get(i).module);
+ }
+ // if the opened tab is the active tab, close it
+ if (id === activeTabId) {
+ closeTab(activeTabId);
+ }
+ //otherwise
+ else {
+ // show the desired tab
+ activeTabId = id;
+ startAnimation("open");
+ }
+ }
+ else {
+ var e = new Mb_warning("mod_tab.js: could not activate tab, opening or closing in progress!");
+ }
+ };
+
+ /**
+ * Sets the titles of each single tab after l10n
+ *
+ * @param {Object} obj an array containing objects with id and title
+ */
+ this.setTitles = function (obj) {
+ for (var i = 0; i < this.count(); i++) {
+ for(var j=0; j<obj.length; j++){
+ if (this.get(i).module == obj[j].id) {
+ this.get(i).getNode().innerHTML = tabPrefix + obj[j].title;
+ }
+ }
+ }
+ }
+ /**
+ * Returns the absolute coordinates of tab by the module ID
+ *
+ * @param {String} id the ID of the GUI element within the tab.
+ * @return {String} String with "left,top,right,bottom"
+ */
+
+ this.getCoords = function(id) {
+ var coords=[];
+ //get indixes
+ if (activeTabId) {
+ var indexOfOpeningTab = getIndexById(activeTabId);
+ }
+ var index = getIndexById(id);
+
+ //left
+ coords[0] = tabLeftOffset;
+ //top
+ coords[1] = tabTopOffset + index*tabHeight + (activeTabId&&indexOfOpeningTab<index?this.get(indexOfOpeningTab).height:0);
+ //right
+ coords[2] = coords[0] + tabWidth;
+ //bottom
+ coords[3] = coords[1] + (id==activeTabId?this.get(indexOfOpeningTab).height+tabHeight:tabHeight);
+
+ return coords.join(",");
+ };
+
+ /**
+ * Animated opening and closing of the tab with the given id.
+ * Needs to be public because it is called via "setInterval".
+ *
+ * @param {String} openOrClose a string with the values "open" or "close".
+ */
+ this.animate = function(openOrClose) {
+
+ for (var i=0; i < this.count(); i++) {
+
+ if (this.get(i).animationFinished === false) {
+
+ //The 'top' position of the i-th tab after the animation
+ var currentTabNewTop = i * tabHeight;
+
+ if (openOrClose == 'open') {
+ var indexOfOpeningTab = getIndexById(activeTabId);
+
+ // move the lower tabs down by the height of the opening tab
+ if (indexOfOpeningTab !== null && i > indexOfOpeningTab) {
+ currentTabNewTop += this.get(indexOfOpeningTab).height;
+ }
+ }
+ //The current 'top' position of the i-th tab
+ //(parseInt removes 'px')
+ var currentTabCurrentTop = parseInt(this.get(i).getNode().style.top, 10);
+
+ // animation is finished
+ if (currentTabCurrentTop == currentTabNewTop) {
+ this.get(i).animationFinished = true;
+ }
+ // animation not yet finished, move the tab down
+ else if (currentTabCurrentTop < currentTabNewTop) {
+ var pixel = Math.min(pixelPerIteration, currentTabNewTop - currentTabCurrentTop);
+ this.get(i).getNode().style.top = currentTabCurrentTop + pixel;
+ }
+ // animation not yet finished, move the tab up
+ else if (currentTabCurrentTop > currentTabNewTop) {
+ var pixel = Math.min(pixelPerIteration, currentTabCurrentTop - currentTabNewTop);
+ this.get(i).getNode().style.top = currentTabCurrentTop - pixel;
+ }
+ else {
+ var e = new Mb_exception("mod_tab.js: animate: unknown state for tab "+ i + " (currentTop: "+currentTabCurrentTop+", newTop:"+currentTabNewTop+")");
+ }
+ }
+ }
+ // check if the animation is finished
+ if (isAnimationFinished()) {
+ stopAnimation();
+ if (openOrClose == "open") {
+ showFrame(activeTabId);
+ }
+ }
+ };
+
+ /**
+ * Returns the index of the vertical tab with a given id
+ *
+ * @private
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ var getIndexById = function(id) {
+ for (var i = 0; i < that.count(); i++) {
+ if (that.get(i).module == id) {
+ return i;
+ }
+ }
+ var e = new Mb_exception("mod_tab.js: getIndexById: ID '"+id+"' not found.");
+ return null;
+ };
+
+ /**
+ * Closes a tab.
+ *
+ * @private
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ var closeTab = function(id) {
+ if (id !== null) {
+ hideFrame(id);
+ activeTabId = null;
+ startAnimation("close");
+ }
+ };
+
+ /**
+ * Opens a tab.
+ *
+ * @public
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ this.openTab = function(id) {
+ if (id !== null && activeTabId != id) {
+ // if no tab is currently opening or closing
+ if (isAnimationFinished()) {
+ for (var i=0; i < this.count(); i++) {
+ hideFrame(this.get(i).module);
+ }
+ }
+ activeTabId = id;
+ startAnimation("open");
+ }
+ };
+
+ /**
+ * Hides a frame within a tab (before closing the tab).
+ *
+ * @private
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ var hideFrame = function(id) {
+ var index = getIndexById(id);
+ if (index !== null) {
+ var obj = document.getElementById(id);
+ obj.style.visibility = 'hidden';
+ //try to apply for childs of horizontal tabs
+ try{
+ if(obj.tabs)
+ document.getElementById(obj.tabs[obj.activeTab].id).style.visibility = 'hidden';
+ }
+ catch(e){}
+ }
+ };
+
+ /**
+ * Shows a frame within a tab (after opening the tab).
+ *
+ * @private
+ * @param {String} id the ID of the GUI element within the tab.
+ */
+ var showFrame = function(id) {
+ var index = getIndexById(id);
+ if (index !== null) {
+ var obj = document.getElementById(id);
+ var newpos = ((index+1) * tabHeight) + parseInt(tabTopOffset);
+ //try to apply for childs of horizontal tabs
+ try{
+ if(obj.tabs){
+ activeTab = document.getElementById(obj.tabs[obj.activeTab].id).style;
+ activeTab.visibility = 'visible';
+ activeTab.top = ((newpos + 1) + obj.tab_height) + "px";
+ activeTab.left = (tabLeftOffset) + "px";
+ activeTab.width = tabWidth;
+ activeTab.height = (parseInt(that.get(index).height) - 2) - obj.tab_height;
+ }
+ }
+ catch(e){}
+ obj=obj.style;
+ obj.top = (newpos + 1) + "px";
+ obj.left = (tabLeftOffset) + "px";
+ obj.width = tabWidth;
+ obj.height = (parseInt(that.get(index).height, 10) - 2);
+ obj.visibility = 'visible';
+ obj.display = 'block';
+ }
+ };
+
+ /**
+ * Starts the animation of the opening and closing tabs
+ *
+ * @private
+ * @param {String} openOrClose a string with the values "open" or "close".
+ */
+ var startAnimation = function(openOrClose) {
+ for (var i = 0; i < that.count(); i++) {
+ that.get(i).animationFinished = false;
+ }
+ tabInterval = setInterval(function(){
+ tabs.animate(openOrClose);
+ },1);
+ };
+
+ /**
+ * Checks if the animation of the opening and closing tabs is finished.
+ *
+ * @private
+ */
+ var isAnimationFinished = function() {
+ for (var i = 0; i < that.count(); i ++) {
+ if (that.get(i).animationFinished === false) {
+ return false;
+ }
+ }
+ return true;
+ };
+
+ /**
+ * Stops the animation of the opening and closing tabs
+ *
+ * @private
+ */
+ var stopAnimation = function() {
+ clearInterval(tabInterval);
+ };
+
+ this.list = [];
+ var that = this;
+
+ /**
+ * The DOM node of the tab array.
+ */
+ var rootNode = document.getElementById("tabs");
+
+ /**
+ * The ID of the currently open tab. If no tab is open, the value is NULL
+ */
+ var activeTabId = null;
+
+ /**
+ * Number of pixel that a tab moves while opening or closing.
+ * @private
+ */
+ var pixelPerIteration = 20;
+
+ /**
+ * Used for the 'setInterval' call of 'this.animate'
+ */
+ var tabInterval;
+
+
+ var tabTopOffset = parseInt(rootNode.style.top, 10);
+ var tabLeftOffset = parseInt(rootNode.style.left, 10);
+ var tabWidth = parseInt(rootNode.style.width, 10);
+ var tabHeight = parseInt(rootNode.style.height, 10);
+ var tabStyle = cssString;
+
+ var tabPrefix = tab_prefix || '';
+ var styleObj = new StyleTag();
+ styleObj.addClass("verticalTabs", tabStyle);
+};
+
+VerticalTabArray.prototype = new List();
More information about the Mapbender_commits
mailing list