/* Metzemaekers Javascript
	(c) 2006-2008 Omines - www.omines.com
	
	All rights explicitly reserved - unauthorized reproduction strictly prohibited
*/

// Site class - main active content wrapper
var Site = {
	start: function()
	{
		this.initTabs();
		this.initSlides();
		this.initPaging();
		this.initCollapse();
		DateControl.initialize();
	},
	initCollapse: function()
	{
		$$('.collapsible').each(function (el) {
			var toggler = $(el.id + '-toggler');
			toggler.addClass('collapse-toggler');

			if(Cookie.read(el.id + '-toggler') == 1)
			{
				el.addClass('hidden');
			}	
			toggler.addEvent('click', function(e) {
				if(el.hasClass('hidden'))
					{
						el.removeClass('hidden');
						toggler.addClass('collapsed');
						Cookie.dispose(el.id + '-toggler'); 

					}
				else
					{
						el.addClass('hidden');
						toggler.removeClass('collapsed');
						Cookie.write(el.id + '-toggler', 1, {duration:1});
					}
			});
		}, this);
	},
	initTabs: function()
	{
		$$('.tabs .tab').each(function (el) {
			el.addEvent('click', function(e) {
				el.getParent().getChildren('.tab').each(function(child) {
					child.removeClass('active');
					$(child.id+'cont').removeClass('active');
				});
				el.addClass('active');
				$(el.id+'cont').addClass('active');
				Cookie.write('tab', el.id, {duration:1});
			});
		}, this);
		var el = Cookie.read('tab');
		if(el && $(el)) {
			$(el).fireEvent('click');
			Cookie.dispose('tab');
		}
	},

	initSlides: function()
	{
		$$('.slides .slide').each(function (el) {
			el.addEvent('click', function(e) {
				el.getParent().getChildren('.slide').each(function(child) {
					child.removeClass('active');
					$(child.id+'cont').removeClass('active');
				});
				el.addClass('active');
				$(el.id+'cont').addClass('active');
				Cookie.write('slide', el.id, {duration:1});
			});
		}, this);
		var el = Cookie.read('slide');
		if(el && $(el)) {
			$(el).fireEvent('click');
			Cookie.dispose('slide');
		}
	},


	initPaging: function()
	{
		this.pagers = [];
		$$('.paging').each(function (el, idx) {
			this.pagers[idx] = new Pager(el);
		}, this);		
	}
};



// Calendar control
var DateControl = {
	initialize: function()
	{
		this.openers	= $$('.datecontrol-datepicker-opener');
		if (this.openers.length > 0)
		{
			this.openers.each(function (item) {
				var elId	= item.getProperty('id');
				var e		= $(elId);
				e.setStyle('cursor','pointer');
				console.log('Found a datepicker control with ID: ' + elId);
			});
		}
	}
}

// Pager class - controls Javascript paged elements
var Pager = new Class({
	initialize: function(element)
	{
		this.root = element;
		this.pages = element.getChildren('.page');
		this.active = 0;
		if(this.pages.length > 1)
			this.createPager();
	},	
	perform: function()
	{
		this.pages.each(function (el, idx) {
			if(idx != this.active)
				el.addClass('hidden');
			else
				el.removeClass('hidden');
		}, this);
		this.pagelinks.getChildren('a').each(function (el, idx) {
			if(idx != this.active)
				el.removeClass('active');
			else
				el.addClass('active');
		}, this);
		if(this.active == 0)
			this.previous.addClass('hidden');
		else
			this.previous.removeClass('hidden');
		if(this.active == this.pages.length-1)
			this.next.addClass('hidden');
		else
			this.next.removeClass('hidden');		
	},
	createPager: function(element)
	{
		this.pager = new Element('div', {'class':'page-selection'}).injectBefore(this.root);
		this.previous = new Element('a', {'class':'hidden','href':'#'}).injectInside(new Element('div', {'class':'previous'}).injectInside(this.pager)).set('text','vorige').addEvent('click',this.prevClick.bindWithEvent(this));
		this.next = new Element('a',{'href':'#'}).injectInside(new Element('div', {'class':'next'}).injectInside(this.pager)).set('text','volgende').addEvent('click',this.nextClick.bindWithEvent(this));
		this.pagelinks = new Element('div', {'class':'pages'}).injectInside(this.pager);
		for(var i = 0; i != this.pages.length; i++)
		{
			if(i != 0)
				this.pagelinks.appendText(' | ');
			new Element('a',{'href':'#'}).set('text',i+1).injectInside(this.pagelinks).addEvent('click',this.pageClick.bindWithEvent(this));
		}
		
		this.perform();
	},
	pageClick: function(e)
	{
		this.active = e.target.get('text')-1;
		this.perform();
		e.stop();
	},
	nextClick: function(e)
	{
		this.active++;
		this.perform();
		e.stop();
	},
	prevClick: function(e)
	{
		this.active--;
		this.perform();
		e.stop();
	}
});

// Set event to start running active content when DOM is loaded
window.addEvent('domready', function() { Site.start(); });