/**
 * Bootstrap.js - Bootstrap for all Javascript functionality
 * 
 * @author  Webstores <info at webstores dot nl>
 *           Copyright (c) Webstores internet totaalbureau <http://www.webstores.nl/>
 */

WS.DOM.ready(function() {
	
	$(document.body).addClassName('js');
	
	// External links
	var a=document.getElementsByTagName('a');for(var i=0;i<a.length;i++){if(/external/.test(a[i].rel)){a[i].target='_blank';}}
	
	// Toggle input values
	var inputs=WS.DOM.getElementsByClass('toggle-value');inputs.forEach(function(el){var v=el.value;WS.Event.addEvent(el,'focus',function(){if(this.value==v){this.value='';}WS.addClass(this,'focus');});WS.Event.addEvent(el,'blur',function(){if(this.value==''){this.value=v;WS.removeClass(this,'focus');}});});
	
	// IE6 hover
	if(WS.browser.IE6 && $('navigation')){var hoverEls=$('navigation').getElementsByTagName('li');for(var i=0;i<hoverEls.length;i++){WS.Event.addEvent(hoverEls[i],'mouseover',function(){WS.addClass(this,'iehover');});WS.Event.addEvent(hoverEls[i],'mouseout',function(){WS.removeClass(this,'iehover');});}}
	
	// Homepage news tabs
	var homeTabs=new Tabs('article-visual-items',{listener:'mouseover',onAfterTabChange:function(tab){var visualURL=tab.getElementsByTagName('img')[0].src.replace('/small/','/medium/');$('article-visual-image').src=visualURL;}});
	var partnerTabs = new Tabs('partners-tabs');
	var partnerSearchTabs = new Tabs('partner-search-tabs');
	
	// Togglers
	if($('comment-form')) {
		var commentVal=new WS.Validation('comment-form');
		commentVal.initialize();
		
		var commentToggler = new Toggler('comment-fields-toggler', 'comment-fields', {
			onAfterToggle: function(t) {
				if(this.isVisible()) {
					$('comment-form').removeClassName('collapsed');
					$('comment-form').addClassName('expanded');
				}
				else {
					$('comment-form').removeClassName('expanded');
					$('comment-form').addClassName('collapsed');
				}
			}
		});
	}
	
	if($('registration-form')) {
		var registrationVal=new WS.Validation('registration-form');
		registrationVal.initialize();
	}
	
	// Textarea maxlength
	if(Prototype.Browser.IE) {
	      $$('textarea[maxlength]').each(function(t) {
	            $(t).observe('keyup', function() {
	                  var maxLength = parseInt(t.getAttribute('maxlength'), 10);
	                  var text = t.value;
	                  var textLength = text.length;

	                  if(textLength > maxLength) {
	                        var fragment = text.substr(0, maxLength);
	                        t.value = fragment;
	                  }
	            });
	      });
	}
	
	// Timelines
	if($('timeline')) {
		var panel = new HScrollPanel('timeline-milestones', 'timeline-milestones-content');
		var slider = new Control.Slider('timeline-handle', 'timeline-track');
		
		var t = new Timeline(panel, slider);
		
		$('timeline-prev').observe('click', function(e) { Event.stop(e); t.prev(); });
		$('timeline-next').observe('click', function(e) { Event.stop(e); t.next(); });
	}
	
	// Validation
	if($('contact-form')){var contactVal=new WS.Validation('contact-form');contactVal.initialize();}
	if($('subscribe-form')){var subscribeVal=new WS.Validation('subscribe-form');subscribeVal.initialize();}
	
	// Registration Form
	
	if($('registration-form')){
		$$('input[name="member"], input[name="student"]').each(function(el) {

			$$('#member-price, #student-price, #student-member-price').invoke('hide');

			el.observe('click', function() {
				var mc = $$('input[name="member"]')[0];
				var sc = $$('input[name="student"]')[0];

				$$('.ticket-price').invoke('hide');

				if(mc.checked && sc.checked) {
				      $('student-member-price').show();
				}
				else if(mc.checked) {
				      $('member-price').show();
				}
				else if (sc.checked) {
				      $('student-price').show();
				}
				else {
				      $('regular-price').show();
				}
			});
		});
	}
});


/**
 * Timeline
 * 
 * @param {Object} panel The scroll panel
 * @param {Object} slider The slider
 * @param {Object} options Optional or override parameters
 */
var Timeline = function(scrollPanel, slider, options) {
	this.scrollPanel = scrollPanel;
	this.slider = slider;
	this.items = null;
	this.anchors = null;
	this.current = 0;
	this.overlay = null;
	this.selectedCls = 'selected';
	
	if(typeof options != 'undefined') {
		for(prop in options) {
			this[prop] = options[prop];
		}
	}
	
	this.initialize();
};

Timeline.prototype = {
	initialize: function() {
		var self = this;
		
		this.items = this.scrollPanel.getPanel().childElements();
		this.anchors = this.scrollPanel.getPanel().getElementsByTagName('a');
		
		// Slider listeners
		this.slider.options.onSlide = function(value) {
			self.scrollPanel.setPosition(value);
		}
		
		this.slider.options.onChange = function(value) {
			self.select(Math.round(value * (self.items.length - 1)));
		}
		
		// Milestone listeners
		$A(this.anchors).forEach(function(el, i) {
			WS.Event.addEvent(el, 'click', function(e) {
				WS.Event.stopEvent(e);
				self.select(i);
			});
		});
		
		// Create loading overlay
		this.overlay = document.createElement('div');
		this.overlay.id = 'content-wrapper-overlay';
		this.overlay.className = 'loading-overlay';
		this.overlay.style.display = 'none';
		$('content-wrapper').appendChild(this.overlay);
		
		// Set initial timeline position
		for(var i = 0; i < this.items.length; i++) {
			if(this.items[i].hasClassName('selected')) {
				this.setPosition(i);
				break;
			}
		}
	},
	select: function(index) {
		if(index !== this.current) {
			WS.show($('content-wrapper-overlay'));
			
			WS.removeClass(this.items[this.current], this.selectedCls);
			WS.addClass(this.items[index], this.selectedCls);
			
			var itemId = this.getItemId(index);
			
			WS.Ajax.request('/calendars/ajax/' + itemId, function(response) {
				var data = WS.Util.parseJSON(response);
				$('timeline-image').src = data.imgURL;
				$('timeline-caption').innerHTML = data.caption;
				$('content').innerHTML = data.content;
				WS.hide($('content-wrapper-overlay'));
			});
		}
		
		this.setPosition(index);
	},
	setPosition: function(index) {
		var percentage = index / (this.items.length - 1);
		
		this.scrollPanel.setPosition(percentage);
		this.slider.setValue(percentage);
		
		this.current = index;
	},
	prev: function() {
		if(this.current > 0) {
			this.select(this.current - 1);
		}
	},
	next: function() {
		if(this.current < (this.items.length - 1)) {
			this.select(this.current + 1);
		}
	},
	getItemId: function(index) {
		var path = this.anchors[index].pathname;
		if(path.charAt(0) != '/') {
			path = '/' + path;
		}
		return path.split('/')[3];
	}
};


/**
 * HScrollPanel, horizontal scrollable panel
 * 
 * @param {Object} container The element containing the panel
 * @param {Object} panel The panel being moved
 */
var HScrollPanel = function(container, panel) {
	this.container = $(container);
	this.panel = $(panel);
	
	this.initialize();
};

HScrollPanel.prototype = {
	initialize: function() {
		this.panel.style.width = (this.panel.childElements()[0].offsetWidth * this.panel.childElements().length) + 'px';
	},
	setPosition: function(perc) {
		var cWidth = this.container.offsetWidth;
		var pWidth = parseInt(this.panel.style.width);
		var posPx = ((cWidth * perc) - (pWidth * perc));
		this.panel.style.left = posPx + 'px';
	},
	getPanel: function() {
		return this.panel;
	}
};

