/* CONFIGURATION AREA */
/*
	browsers:
		IE - Microsoft Internet Explorer
		FF - FireFox
		Safari - Safari browser
		Opera - Opera browser
		all - includes IE, FF, Opera and Safari
		
	parentId:
		any existing Id attribute 
	tagName:
		any valid tag name
	tagPosition:
		all - all inner elements 
		children - first level children only
	className:
		any valid class name
*/

var browsers = 'IE';
var config = {
	hovers: new Array(
		{
			parentId:'main-menu',
			tagName:'li',
			tagPosition:'children',
			className:'hover'
		},
		{
			parentId:'content',
			tagName:'li',
			tagPosition:'all',
			className:'hover'
		}
	)
};

/* CODE AREA */

/* hovers */

var initHovers = function()
{
	for (var index in config.hovers){
		var conf = config.hovers[index];
		var topLevelElement = document.getElementById(conf.parentId);
		if (topLevelElement){
			var subElements = topLevelElement.getElementsByTagName(conf.tagName);
			for (var i = 0; i < subElements.length; i++){
				if (conf.tagPosition == 'all' || (conf.tagPosition == 'children' && subElements[i].parentNode.id == conf.parentId))
				{
					subElements[i].configIndex = index;
					subElements[i].onmouseover = function(){
						this.className += ' ' + config.hovers[this.configIndex].className;
					};
					subElements[i].onmouseout = function(){
						this.className = this.className.replace(config.hovers[this.configIndex].className,'');
					};
				}
			}
		}
	}
}

/* common */

var currentState = {};

var opera = window.opera;
var safari = navigator.appVersion.indexOf("Safari") != -1;
var ie = document.all && !window.opera;
var ff = navigator.userAgent.indexOf("Firefox") != -1;

var addEasyEvent = function(browsers,event,initMethod)
{
	if (opera && (browsers.match(/Opera/) || browsers.match(/all/))) {
		window.addEventListener(event, initMethod, false);
	} else if (safari && (browsers.match(/Safari/) || browsers.match(/all/))) {
		window.addEventListener(event, initMethod, false);
	} else if (ie && (browsers.match(/IE/) || browsers.match(/all/))) {
		window.attachEvent("on" + event, initMethod);
	} else if (ff && (browsers.match(/FF/) || browsers.match(/all/))) {
		window.addEventListener(event, initMethod, false);
	} else if (!ie && !ff && !safari && !opera) {
		if (window.addEventListener){
			window.addEventListener(event, initMethod, false);
		}
		else if (window.attachEvent){
			window.attachEvent("on" + event, initMethod);
		}
	} 
}

addEasyEvent(browsers,'load',initHovers);

var initTabs = function(){
	var tab_titles = $$('.choose .titles li a');
	var tab_content = $$('.choose .content div');
	
	var n = tab_titles.length;
	var activeTab = 0;
	var display = 'none';
	
	for (var i=0; i<n; i++){
		tab_titles[i].tabContent = tab_content[i];
		tab_titles[i].index = i;
		display = 'none';
		opacity = 0;
		if (i == activeTab) 
		{
			display = 'block';
			opacity = 1;
		}
		tab_titles[i].tabContent.setStyle('display', display);
		tab_titles[i].tabContent.setStyle('opacity', opacity);		
		tab_titles[i].addEvent('click', function(e){		
		  (e = new Event(e)).stop();
		  if (this.index == activeTab) return;
			for (var j=0; j<n; j++){
				tab_titles[j].getParent().removeClass('active');
			}
			this.getParent().addClass('active');
			this.fx = new Fx.Styles(tab_content[activeTab], {duration:500, wait:false});
			this.fx.start({
				'opacity': 0				
			});
			tab_content[activeTab].setStyle('display','none');
			this.tabContent.setStyle('display', 'block');
			this.fx2 = new Fx.Styles(this.tabContent, {duration:500, wait:false});
			this.fx2.start({
				'opacity': 1				
			});			
			activeTab = this.index;
		});
	} 
}; 

var initPreview = function(){
	
	var preview = $$('.preview').pop();
	
	var video_links = $$('#content #tab1 li a');	
	
	video_links.each(function(item, index){
		item.index = index;
		
		item.addEvent('click', function(e){
			new Event(e).stop();			
					
			preview.setHTML(videos[this.index].html);			
		
		});
	});


	var photo_links = $$('#content #tab2 li a');	
	
	photo_links.each(function(item, index){
		item.index = index;
		
		item.addEvent('click', function(e){
			new Event(e).stop();								
			preview.setHTML(photos[this.index].html);		
		
		});
	});
	
}


var initPage = function(){
	initTabs();
	initPreview();
}

window.addEvent('domready',initPage);