From 553f2fa375c9b10bc95d59f1b291b6b0af1e4319 Mon Sep 17 00:00:00 2001 From: Eric Kever Date: Wed, 10 Aug 2011 13:20:52 -0400 Subject: [PATCH] Moved functions for compatibility into Skeleton namespace. --- javascripts/app.js | 236 ++++++++++++++++++++++++++------------------- 1 file changed, 135 insertions(+), 101 deletions(-) diff --git a/javascripts/app.js b/javascripts/app.js index ea5259c..91442ec 100644 --- a/javascripts/app.js +++ b/javascripts/app.js @@ -7,109 +7,143 @@ * 7/17/2011 * un-jQuerified by Eric Kever */ + +(function(){ + var Skeleton = { + getElementsByClassName : function(context, cls){ + if(context.getElementsByClassName){ + return context.getElementsByClassName(cls); + } + + var ele = context.getElementsByTagName("*"), + ret = [], + current, + classes; + + for(var i = 0, j = ele.length; i < j; i++){ + current = ele[i]; + classes = (current.getAttribute("className") || current.className).split(" "); + for(var k = 0, l = classes.length; k < l; k++){ + if(classes[k] === cls){ + ret.push(current); + break; + } + } + } + + return ret; + }, + + filterTags : function(list, tags){ + var exists = false; + + for(var i = 0, j = list.length; i < j; i++){ + for(var k = 0, l = tags.length; k < l; k++){ + if(list[i].tagName === tags[k]){ + exists = true; + break; + } + } + if(exists === true){ + list.splice(i, 1); + } + } + + return list; + }, + + addClass : function(element, name){ + var classes = (element.getAttribute("className") || element.className).split(" "), + exists = false; + + for(i = 0, j = classes.length; i < j; i++){ + if(classes[i] === name){ + exists = true; + break; + } + } + if(!exists){ + classes.push(name); + element.className = classes.join(" "); + } + }, + + removeClass : function(element, name){ + var classes = (element.getAttribute("className") || element.className).split(" "), + exists = false; + + for(var i = 0, j = classes.length; i < j; i++){ + if(classes[i] === name){ + exists = true; + break; + } + } + if(exists){ + classes.splice(i, 1); + element.className = classes.join(" "); + } + }, + + addListener : function(element, on, fn, last){ + last = (last || false); + var BH; + + if(window.addEventListener){ //AddEventListener takes precedence here + BH = "addEventListener"; + }else if(window.attachEvent){ + BH = "attachEvent"; + on = "on" + on; + } + + element[BH](on, function(e){ + var event = e || window.event; + return fn.call(element, event); //Force it to call the handler in the proper context (IE 7 & 8 do not) + }, last); + } + }; - -if(window.addEventListener){ - var BIND_HANDLER = "addEventListener"; - var BIND_HANDLER_PREFIX = ""; -}else if(window.attachEvent){ - var BIND_HANDLER = "attachEvent"; - var BIND_HANDLER_PREFIX = "on"; -} - -function getElementsByClassName(context, tag, cls){ - var ele = context.getElementsByTagName(tag), - ret = [], - current, - classes; - - for(var i = 0, j = ele.length; i < j; i++){ - current = ele[i]; - classes = (current.getAttribute("className") || current.className).split(" "); - for(var k = 0, l = classes.length; k < l; k++){ - if(classes[k] === cls){ - ret.push(current); - break; - } - } - } - - return ret; -} - -function addClass(element, name){ - var classes = (element.getAttribute("className") || element.className).split(" "), - exists = false; - - for(i = 0, j = classes.length; i < j; i++){ - if(classes[i] === name){ - exists = true; - break; - } - } - if(!exists){ - classes.push(name); - element.className = classes.join(" "); - } -} - -function removeClass(element, name){ - var classes = (element.getAttribute("className") || element.className).split(" "), - exists = false; - - for(var i = 0, j = classes.length; i < j; i++){ - if(classes[i] === name){ - exists = true; - break; - } - } - if(exists){ - classes.splice(i, 1); - element.className = classes.join(" "); - } -} + window.Skeleton = Skeleton; +})(); function doFancyExpensiveTabThings(){ - var tabs = (document.getElementsByClassName ? document.getElementsByClassName("tabs") : getElementsByClassName(document, "ul", "tabs")); - - for(var i = 0, j = tabs.length; i < j; i++){ - var tabList = tabs[i].getElementsByTagName('li'); - for(var k = 0, l = tabList.length; k < l; k++){ - tabList[k].getElementsByTagName('a')[0][BIND_HANDLER](BIND_HANDLER_PREFIX + "click", function(e){ - var event = e || window.event; - return (function(e){ - var contentLocation = this.href.substr(this.href.indexOf("#")) + "Tab", - contentElement, - siblings; - - if(contentLocation.charAt(0) === "#"){ - if(e.preventDefault){ - e.preventDefault(); - }else{ - e.returnValue = false; - e.cancelBubble = true; - } - - for(var m = 0; m < k; m++){ - removeClass(tabList[m].getElementsByTagName('a')[0], "active"); - } - addClass(this, "active"); - - contentElement = document.getElementById(contentLocation.substr(1)); - addClass(contentElement, "active"); - - siblings = contentElement.parentNode.getElementsByTagName('li'); - for(m = 0, n = siblings.length; m < n; m++){ - if(siblings[m] !== contentElement){ - removeClass(siblings[m], "active"); - } - } - } - return false; - }).call(event.target || event.srcElement, event); - }, false); - } - } + var tabs = Skeleton.filterTags(Skeleton.getElementsByClassName(document, "tabs"), ["ul"]); + + for(var i = 0, j = tabs.length; i < j; i++){ + var tabList = tabs[i].getElementsByTagName("li"); + for(var k = 0, l = tabList.length; k < l; k++){ + Skeleton.addListener(tabList[k].getElementsByTagName('a')[0], "click", function(e){ + var contentLocation = this.href.substr(this.href.indexOf("#")) + "Tab", + contentElement, + siblings; + + if(contentLocation.charAt(0) === "#"){ + if(e.preventDefault){ + e.preventDefault(); + }else{ + e.returnValue = false; + e.cancelBubble = true; + } + + for(var m = 0; m < k; m++){ + Skeleton.removeClass(tabList[m].getElementsByTagName('a')[0], "active"); + } + + Skeleton.addClass(this, "active"); + + contentElement = document.getElementById(contentLocation.substr(1)); + Skeleton.addClass(contentElement, "active"); + + siblings = contentElement.parentNode.getElementsByTagName('li'); + for(m = 0, n = siblings.length; m < n; m++){ + if(siblings[m] !== contentElement){ + Skeleton.removeClass(siblings[m], "active"); + } + } + } + return false; + }); + } + } } -window[BIND_HANDLER](BIND_HANDLER_PREFIX + "load", doFancyExpensiveTabThings, false); \ No newline at end of file +Skeleton.addListener(window, "load", doFancyExpensiveTabThings); \ No newline at end of file