simpletabs_1.3.js
181 lines
| 1 | /** |
| 2 | * @version 1.3 |
| 3 | * @package SimpleTabs |
| 4 | * @author Fotis Evangelou - http://nuevvo.com/labs/simpletabs |
| 5 | * @copyright Copyright (c) 2009-2011 Fotis Evangelou / Nuevvo Webware Ltd. All rights reserved. |
| 6 | * @license GNU/GPL license: http://www.gnu.org/copyleft/gpl.html |
| 7 | */ |
| 8 | |
| 9 | // Main SimpleTabs function |
| 10 | var kmrSimpleTabs = { |
| 11 | |
| 12 | sbContainerClass: "simpleTabs", |
| 13 | sbNavClass: "simpleTabsNavigation", |
| 14 | sbContentClass: "simpleTabsContent", |
| 15 | sbCurrentNavClass: "current", |
| 16 | sbCurrentTabClass: "currentTab", |
| 17 | sbIdPrefix: "tabber", |
| 18 | |
| 19 | init: function(){ |
| 20 | if(!document.getElementsByTagName) return false; |
| 21 | if(!document.getElementById) return false; |
| 22 | |
| 23 | var containerDiv = document.getElementsByTagName("div"); |
| 24 | |
| 25 | for(var i=0; i<containerDiv.length; i++){ |
| 26 | if (containerDiv[i].className == kmrSimpleTabs.sbContainerClass) { |
| 27 | |
| 28 | // assign a unique ID for this tab block and then grab it |
| 29 | containerDiv[i].setAttribute("id",kmrSimpleTabs.sbIdPrefix+[i]); |
| 30 | var containerDivId = containerDiv[i].getAttribute("id"); |
| 31 | |
| 32 | // Navigation |
| 33 | var ul = containerDiv[i].getElementsByTagName("ul"); |
| 34 | |
| 35 | for(var j=0; j<ul.length; j++){ |
| 36 | if (ul[j].className == kmrSimpleTabs.sbNavClass) { |
| 37 | |
| 38 | var a = ul[j].getElementsByTagName("a"); |
| 39 | for(var k=0; k<a.length; k++){ |
| 40 | a[k].setAttribute("id",containerDivId+"_a_"+k); |
| 41 | // get current |
| 42 | if(kmrSimpleTabs.readCookie('simpleTabsCookie')){ |
| 43 | var cookieElements = kmrSimpleTabs.readCookie('simpleTabsCookie').split("_"); |
| 44 | var curTabCont = cookieElements[1]; |
| 45 | var curAnchor = cookieElements[2]; |
| 46 | if(a[k].parentNode.parentNode.parentNode.getAttribute("id")==kmrSimpleTabs.sbIdPrefix+curTabCont){ |
| 47 | if(a[k].getAttribute("id")==kmrSimpleTabs.sbIdPrefix+curTabCont+"_a_"+curAnchor){ |
| 48 | a[k].className = kmrSimpleTabs.sbCurrentNavClass; |
| 49 | } else { |
| 50 | a[k].className = ""; |
| 51 | } |
| 52 | } else { |
| 53 | a[0].className = kmrSimpleTabs.sbCurrentNavClass; |
| 54 | } |
| 55 | } else { |
| 56 | a[0].className = kmrSimpleTabs.sbCurrentNavClass; |
| 57 | } |
| 58 | |
| 59 | a[k].onclick = function(){ |
| 60 | kmrSimpleTabs.setCurrent(this,'simpleTabsCookie'); |
| 61 | return false; |
| 62 | } |
| 63 | } |
| 64 | } |
| 65 | } |
| 66 | |
| 67 | // Tab Content |
| 68 | var div = containerDiv[i].getElementsByTagName("div"); |
| 69 | var countDivs = 0; |
| 70 | for(var l=0; l<div.length; l++){ |
| 71 | if (div[l].className == kmrSimpleTabs.sbContentClass) { |
| 72 | div[l].setAttribute("id",containerDivId+"_div_"+[countDivs]); |
| 73 | if(kmrSimpleTabs.readCookie('simpleTabsCookie')){ |
| 74 | var cookieElements = kmrSimpleTabs.readCookie('simpleTabsCookie').split("_"); |
| 75 | var curTabCont = cookieElements[1]; |
| 76 | var curAnchor = cookieElements[2]; |
| 77 | if(div[l].parentNode.getAttribute("id")==kmrSimpleTabs.sbIdPrefix+curTabCont){ |
| 78 | if(div[l].getAttribute("id")==kmrSimpleTabs.sbIdPrefix+curTabCont+"_div_"+curAnchor){ |
| 79 | div[l].className = kmrSimpleTabs.sbContentClass+" "+kmrSimpleTabs.sbCurrentTabClass; |
| 80 | } else { |
| 81 | div[l].className = kmrSimpleTabs.sbContentClass; |
| 82 | } |
| 83 | } else { |
| 84 | div[0].className = kmrSimpleTabs.sbContentClass+" "+kmrSimpleTabs.sbCurrentTabClass; |
| 85 | } |
| 86 | } else { |
| 87 | div[0].className = kmrSimpleTabs.sbContentClass+" "+kmrSimpleTabs.sbCurrentTabClass; |
| 88 | } |
| 89 | countDivs++; |
| 90 | } |
| 91 | } |
| 92 | |
| 93 | // End navigation and content block handling |
| 94 | } |
| 95 | } |
| 96 | }, |
| 97 | |
| 98 | // Function to set the current tab |
| 99 | setCurrent: function(elm,cookie){ |
| 100 | |
| 101 | this.eraseCookie(cookie); |
| 102 | |
| 103 | //get container ID |
| 104 | var thisContainerID = elm.parentNode.parentNode.parentNode.getAttribute("id"); |
| 105 | |
| 106 | // get current anchor position |
| 107 | var regExpAnchor = thisContainerID+"_a_"; |
| 108 | var thisLinkPosition = elm.getAttribute("id").replace(regExpAnchor,""); |
| 109 | |
| 110 | // change to clicked anchor |
| 111 | var otherLinks = elm.parentNode.parentNode.getElementsByTagName("a"); |
| 112 | for(var n=0; n<otherLinks.length; n++){ |
| 113 | otherLinks[n].className = ""; |
| 114 | } |
| 115 | elm.className = kmrSimpleTabs.sbCurrentNavClass; |
| 116 | |
| 117 | // change to associated div |
| 118 | var otherDivs = document.getElementById(thisContainerID).getElementsByTagName("div"); |
| 119 | var RegExpForContentClass = new RegExp(kmrSimpleTabs.sbContentClass); |
| 120 | for(var i=0; i<otherDivs.length; i++){ |
| 121 | if ( RegExpForContentClass.test(otherDivs[i].className) ) { |
| 122 | otherDivs[i].className = kmrSimpleTabs.sbContentClass; |
| 123 | } |
| 124 | } |
| 125 | document.getElementById(thisContainerID+"_div_"+thisLinkPosition).className = kmrSimpleTabs.sbContentClass+" "+kmrSimpleTabs.sbCurrentTabClass; |
| 126 | |
| 127 | // get Tabs container ID |
| 128 | var RegExpForPrefix = new RegExp(kmrSimpleTabs.sbIdPrefix); |
| 129 | var thisContainerPosition = thisContainerID.replace(RegExpForPrefix,""); |
| 130 | |
| 131 | // set cookie |
| 132 | this.createCookie(cookie,'simpleTabsCookie_'+thisContainerPosition+'_'+thisLinkPosition,1); |
| 133 | }, |
| 134 | |
| 135 | // Cookies |
| 136 | createCookie: function(name,value,days) { |
| 137 | if (days) { |
| 138 | var date = new Date(); |
| 139 | date.setTime(date.getTime()+(days*24*60*60*1000)); |
| 140 | var expires = "; expires="+date.toGMTString(); |
| 141 | } |
| 142 | else var expires = ""; |
| 143 | document.cookie = name+"="+value+expires+"; path=/"; |
| 144 | }, |
| 145 | |
| 146 | readCookie: function(name) { |
| 147 | var nameEQ = name + "="; |
| 148 | var ca = document.cookie.split(';'); |
| 149 | for(var i=0;i < ca.length;i++) { |
| 150 | var c = ca[i]; |
| 151 | while (c.charAt(0)==' ') c = c.substring(1,c.length); |
| 152 | if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); |
| 153 | } |
| 154 | return null; |
| 155 | }, |
| 156 | |
| 157 | eraseCookie: function(name) { |
| 158 | this.createCookie(name,"",-1); |
| 159 | }, |
| 160 | |
| 161 | // Loader |
| 162 | addLoadEvent: function(func) { |
| 163 | var oldonload = window.onload; |
| 164 | if (typeof window.onload != 'function') { |
| 165 | window.onload = func; |
| 166 | } else { |
| 167 | window.onload = function() { |
| 168 | if (oldonload) { |
| 169 | oldonload(); |
| 170 | } |
| 171 | func(); |
| 172 | } |
| 173 | } |
| 174 | } |
| 175 | |
| 176 | // END |
| 177 | }; |
| 178 | |
| 179 | // Load SimpleTabs |
| 180 | kmrSimpleTabs.addLoadEvent(kmrSimpleTabs.init); |
| 181 |