var paginator = { 

	currentPage : 1,

	pages: document.getElementById('pages').childNodes,
	
	slides: [],

	goTo: function ( pageNumber ) {

		if ( pageNumber > paginator.pages.length ) pageNumber = 1;

		else if ( pageNumber < 1 ) pageNumber = paginator.pages.length;

		paginator.pageLoad ( pageNumber );
		
		paginator.focusTo ( pageNumber );

		paginator.currentPage = pageNumber;

	},

	focusTo: function ( value ) { 

		for ( var i=1; i <= paginator.pages.length; i++ ) {

			paginator.pages[i-1].className = '';

			if ( i == value ) paginator.pages[i-1].className = "this";

		}

	},

	pageLoad: function ( page ) { 

		for ( var i=1; i <= paginator.slides.length; i++ ) {

			if ( i == page ) paginator.slides[i-1].style.display = 'block';

			else paginator.slides[i-1].style.display = 'none';

		}

	},
	
	init: function () {

		var elements = document.getElementById('frame').childNodes;
		
		for (var i=0; i < elements.length; i++) {

			if ( elements[i].className != 'slide' ) continue;
			
			paginator.slides.push ( elements[i] );

		}

		for (var i=1; i <= paginator.pages.length; i++) {

			paginator.pages[i-1].onclick = function() {

				paginator.goTo ( this.innerHTML );

				this.blur();

			};

		}

		document.getElementById('previous').onclick = function () { paginator.goTo ( paginator.currentPage-1 ); this.blur(); };
		document.getElementById('next').onclick = function () { paginator.goTo ( paginator.currentPage+1 ); this.blur(); };

	}
};

var DOM	= {};

DOM.fireWalk = function ( element, spark, callback ) {

	var k = 0;

	while ( element.childNodes[k] ) {

		if ( element.childNodes[k].className == spark )

		callback ( element.childNodes[k] );

		DOM.fireWalk ( element.childNodes[k++], spark, callback );

	}
};

var nTab = { groups: new Array() };

nTab.focus = function () {

	var siblingDivs = this.parentNode.childNodes;

	for ( var i = 0; i < siblingDivs.length; i++ ) {

		if ( siblingDivs[i].nodeType != 1 ) continue;

		if ( siblingDivs[i].getAttribute('rel') == this.getAttribute('rel') ) {

			if ( siblingDivs[i].className.substr ( 0, 3 ) != "tab" ) { 

				siblingDivs[i].style.display = "block";

			}

		} else {

			if ( siblingDivs[i].className.substr ( 0, 3 ) == "tab" ) { // other tabs

				siblingDivs[i].className = "tab";

			} else {

				siblingDivs[i].style.display = "none";

			}
		}

		this.className = "tab on";

	}
};

nTab.make = function ( element ) {

	element.onclick = nTab.focus;

};

DOM.fireWalk ( document.getElementById ('tabs'), 'tab', function ( element ) { nTab.make ( element ) });

document.getElementById('tabOne').onclick();

paginator.init();