/**
 * @description		prototype.js based viewswitcher (main purpose is to change font-sizes)
 * 					Most flexible viewswitcher, easy to use and install. Doesn't require any extra stylesheets.
 * @param			parent: container to which the switchButtons should be inserted
 * 					amount: amount of switchButtons
 * 					ui: ui in which the viewswitcher is used
 * @requires		uibase/script/setcookie.js
 * @author        	Peter Slagter; peter [at] procurios [dot] nl;
*/

var viewSwitcher = Class.create({
	'initialize': function(parent, amount, position, active) {
		// Store arguments;
		this.parent = $(parent) || $(document.body);
		this.amount = amount || 3;
		this.position = position || 'bottom';

		// Initialize variables / statusses
		this.amountMedian = 0;
		this.switchButtons = [];
		this.active = active || '';

		// Build the Switcher
		this.buildSwitcher();

	},

	'buildSwitcher': function() {
		// Build CSS Switch list
		var ol = new Element('ol', {'id': 'css-switcher'});

		for (i=0; i<this.amount; i++) {
			// Build list items
			var li = new Element('li', {'class': 'view-'+i});
			var liText = document.createTextNode('a');
			li.appendChild(liText);
			ol.appendChild(li);

			// Observe the list-items
			li.observe('click', function(event) {
				this.switchView(event.element());
			}.bind(this));

			this.switchButtons.push(li);

			// Get the sum of the indexes, needed for the median
			this.amountMedian += i;
		}

		if (this.position == 'top') {
			this.parent.insert({'top':ol});
		} else {
			this.parent.insert({'bottom':ol});
		}

		// Get median, find out if theres a cookie stored and set active element
		this.amountMedian = (this.amountMedian/this.amount).round();
		this.active = GetCookie('view-switcher') ? GetCookie('view-switcher') : (this.active !== '' ? this.active : this.amountMedian);
		this.switchButtons[this.active].addClassName('active');
		$(document.body).addClassName('view-'+this.active);
	},

	'switchView': function(element) {
		var elementIndex = this.switchButtons.indexOf(element);

		if (elementIndex != this.active) {
			// Swap li.active classnames
			this.switchButtons[this.active].removeClassName('active');
			element.addClassName('active');

			// Swap body.view-n classnames
			$(document.body).removeClassName('view-'+this.active);
			$(document.body).addClassName('view-'+elementIndex);

			// Store new active element and set a Cookie
			this.active = this.switchButtons.indexOf(element);
			SetCookie('view-switcher', this.active, 365);
		}
	}
});