// JavaScript Document

var itemArr = new Array('images/voice.gif', 'images/voice.gif', 'images/voice.gif', 'images/voice.gif', 'images/voice.gif', 'images/voice.gif');
var i = 0;

document.observe('dom:loaded', function(e)
{
	/*
	if($('partner_container'))
		new PeriodicalExecuter(insertItem, 3);
	*/
	if($('question_mark'))
	{
		$('question_mark').observe('click', helpText);
		$('question_mark').observe('mouseenter', doMouseOver);
		$('question_mark').observe('mouseleave', doMouseOut);
	}
	if($('up_arrow'))
	{
		$('up_arrow').observe('mouseenter', doMouseOver);
		$('up_arrow').observe('mouseleave', doMouseOut);
		$('up_arrow').observe('click', emailForm);
	}
	if($('main_flash_content'))
		var MyRotator = new Rotator('main_flash_content');
	$$('#navi li').invoke('observe', 'mouseenter', openSubMenu);
	$$('#navi li').invoke('observe', 'mouseleave', closeSubMenu);
	$$('.performer').invoke('observe', 'click', navigateTo);
	if($('rss_lang_container'))
	{
		$$('#rss_lang_container img').invoke('observe', 'mouseenter', doMouseOver);
		$$('#rss_lang_container img').invoke('observe', 'mouseleave', doMouseOut);
	}
	$$('.highlight').each(function(e) { new Effect.Highlight(e, { duration: 3 }); });
	
	$$('.tabs').each(function(tab_group)
	{
	    new Control.Tabs(tab_group);  
	});
});

navigateTo = function(e)
{
	Event.stop(e);
	if(this.down('a').href != "")
		window.location.href = this.down('a').href;
}

doMouseOver = function(e)
{
	this.src = this.src.replace('.png', '_mouseover.png');
}

doMouseOut = function(e)
{
	this.src = this.src.replace('_mouseover.png', '.png');
}

navigateToTitle = function(e)
{
	window.location.href = this.title;
}

var Rotator = Class.create(
{
	initialize: function(id)
	{
		this.el = $(id);
		this.images = $$('#' + id + ' img');
		this.list = $$('#' + id + ' li');
		var switchImage = this.switchImage.bind(this);
		this.list.invoke('observe', 'click', switchImage);
		this.index = 0;
		this.images.invoke('observe', 'click', navigateToTitle);
		this.effect = false;
		this.next = 1;
		if(this.images.size() > 1)
			this.startRotate();
	},
	
	switchImage: function(e)
	{
		var el = Event.element(e);
		if(el.hasClassName('selected'))
			return;
		this.pe.stop();
		
		if(this.effect)
		{
			this.cancelEffect();
		}
		
		var value = 0;
		var fade = false;
		this.images.each(function(e)
		{
			if(e.getOpacity() > value && e.visible())
			{
				value = e.getOpacity();
				fade = e;
			}
			else
			{
				e.setStyle({ opacity: 0, display: 'none' });
			}
		});
		
		
		this.next = parseInt(el.innerHTML) - 1;
		
		var next = this.next;
		
		this.setSelected(this.list[next]);
		
		var _this = this;
		
		this.effect = new Effect.Parallel(
		[
			new Effect.Fade(fade, { sync: true }),
			new Effect.Appear(this.images[next], { sync: true })
		], { afterFinish: function(e) { _this.effect = false; _this.startRotate(); _this.index = next; }, duration: 3 });
	},
	
	setSelected: function(el)
	{
		this.list.invoke('removeClassName','selected');
		el.addClassName('selected');
	},
	
	cancelEffect: function()
	{
		this.effect.cancel();
		this.effect = false;		
	},
	
	startRotate: function()
	{
		var crossFade = this.crossFade.bind(this);
		this.pe = new PeriodicalExecuter(crossFade, 8);
	},
	
	crossFade: function()
	{
		
		this.next = this.getNext();
		
		next = this.next;
		
		var selectTarget = this.getNext();
		
		this.setSelected(this.list[selectTarget]);
		
		var _this = this;
		
		this.effect = new Effect.Parallel(
		[
			new Effect.Fade(this.images[this.index], { sync: true }),
			new Effect.Appear(this.images[next], { sync: true })
		], { afterFinish: function(e) { _this.effect = false; _this.index = next; }, duration: 3 });	
	},
	
	getNext: function()
	{
		if(this.index < this.images.size() - 1)
		{
			return this.index + 1;
		}
		else
		{
			return 0;
		}
	}
});

openSubMenu = function() {
	if(this.down('ul')) {
		this.down('ul').addClassName('open');
		this.down('ul').show();
	}
}

closeSubMenu = function() {
	if(this.down('ul')) {
		this.down('ul').removeClassName('open');
		this.down('ul').hide();
	}
}

helpText = function(e)
{
	var el = this.up('div').up('div');
	new Effect.Move(el, { x: 0, y: this.up('div').getHeight(), mode: 'relative', duration: 0.3 });
}

emailForm = function(e)
{
	var el = this.up('div').up('div');
	new Effect.Move(el, { x: 0, y: -this.up('div').getHeight(), mode: 'relative', duration: 0.3 });
}

insertItem = function()
{
	if(i < itemArr.size() - 1)
		i++
	else
		i = 0;
	$('partner_container').addScrollableItem(itemArr[i]);

}

var UtilityFunctions =
{
	addScrollableItem: function(element, imageSource)
	{
		var imageItem = new ScrollableItem(element, imageSource);
	}
}

var ScrollableItem = Class.create(
{	
	initialize: function(element, imageSource)
	{
		this.imageSource = imageSource;
		this.element = $(element);
		this.insertImage();
	},
	
	insertImage: function()
	{
		var me = document.createElement('img');
		me.src = this.imageSource;
		me.setStyle({ position: 'absolute', left: '200px' });
		this.me = $(me);
		this.element.insert(me);
		
		this.startScrolling();
	},
	
	startScrolling: function()
	{
		var destroySelf = this.destroySelf.bind(this);
		new Effect.Move(this.me, { x: -400, mode: 'relative', afterFinish: destroySelf, duration: 8, transition: Effect.Transitions.linear });
	},
	
	destroySelf: function()
	{
		
		this.me.remove();
	}
});

Element.addMethods(UtilityFunctions);
/*

	insertImage: function()
	{
		
		element = this.element;
		var MyImage = document.createElement('img');
		MyImage.src = this.imageSource;
		element.insert(MyImage);
		this.startScrolling();
	}
*/