﻿	window.onload = function(){setScreenClass();setBehavior();}; 
	window.onresize = setScreenClass;

	//  Following transition classes will be declared:
	//
	//	classname		  screenwidth
	//	------------------------------------------
	//	screen_lo		    < 990px
	//	screen_hi           > 990px		


	function setScreenClass(){
		var fmt = document.documentElement.clientWidth;
		var cls = (fmt<990)?'screen_lo':(fmt>=990)?'screen_hi':'screen_hi';
		document.body.className=cls;
		//animateContainer(cls)
	};


	function setBehavior(){
		tabs = document.getElementsByTagName('dt');
		for (t=0;t < tabs.length; t++ ){
			if(tabs[t].parentNode.parentNode.className == 'tabbed'){
				tabs[t].onclick = activateTab;
				//alert(tabs[t].onclick);
			}
		}
	};

	function activateTab(){
		tabs = document.getElementsByTagName('dt');
		for (t=0;t < tabs.length; t++ ){
			if(tabs[t].className == 'current'){tabs[t].className="";}
		}
		page = document.getElementsByTagName('dd');
		for (t=0;t < page.length; t++ ){
			if(page[t].className == 'current'){page[t].className="";}
		}
		this.className="current";
		dd = this.nextSibling;
		if(dd.nodeType!=1){dd = dd.nextSibling;}
		dd.className="current";		
	};
	
	function animateContainer(cls){
	    var element = Element.extend($('pageContainer'));
	    var str = element.getStyle('top');
	    var i = str.slice(0,str.indexOf("px"));
	    var moving = false;
	    if (cls == 'screen_lo' && i > -1 && moving != true) {
	        new Effect.Move(element, {x: 0, y: -34, sync: false, beforeStart: function(){moving = true} });
	    } else if (cls == 'screen_hi' && i < -33 && moving != true) {
	        new Effect.Move(element, {x: 0, y: 34, sync: false, beforeStart: function(){moving = true} });
	    }
	}
