// TNCC Javascript Functions
// Written by Chris Bell @ Weapon7 - http://weapon7.com
// September / October 2008
// This page uses Mootools - mootools.net 

window.addEvents({
		domready: function(){
			if(!isIE6()){
				preloader();
				initShareCLicks();
			}
			profileNavInit();
			twitterFeedInit();
		},
		load: function(){
				//Roll Over - Roll Out states for buttons
				$('home_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					if($('_headerNav_home_btn').hasClass('home_uk') || $('_headerNav_home_btn').hasClass('home_uk_sel')){
						// UK BUTTON
						if(!$('_headerNav_home_btn').hasClass('home_uk_sel'))
						{
							$('_headerNav_home_btn').setStyle('background-image','url(assets/images/home_btn_uk.png)');
						}
					} else {
						$('_headerNav_home_btn').setStyle('background-image','url(assets/images/home_btn.png)');
					}	
				});

				$('home_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();

					if($('_headerNav_home_btn').hasClass('home_uk') || $('_headerNav_home_btn').hasClass('home_uk_sel')){
						
						if(!$('_headerNav_home_btn').hasClass('home_uk_sel'))
						{
							$('_headerNav_home_btn').setStyle('background-image','url(assets/images/home_btn_uk_hover.png)');
						}
					} else {
						if($('_headerNav_home_btn').getProperty('class') != "nav_boxes home_sel" || $('_headerNav_home_btn').getProperty('class') != "nav_boxes home_uk_sel") {
							// ROI Button
							$('_headerNav_home_btn').setStyle('background-image','url(assets/images/home_btn_hover.png)');
						}
					}
				});


				// OUR STORY
				$('story_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					$('_headerNav_story_btn').setStyle('background-image','url(assets/images/ourstory_btn.png)');
				});
				$('story_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();
					if($('_headerNav_story_btn').getProperty('class') != "nav_boxes story_sel") {
						$('_headerNav_story_btn').setStyle('background-image','url(assets/images/ourstory_btn_hover.png)');
					}
				});

				//OUR SWEETS
				$('sweets_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					$('_headerNav_sweets_btn').setStyle('background-image','url(assets/images/oursweets_btn.png)');
				});
				$('sweets_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();
					if($('_headerNav_sweets_btn').getProperty('class') != "nav_boxes sweets_sel") {
						$('_headerNav_sweets_btn').setStyle('background-image','url(assets/images/oursweets_btn_hover.png)');
					}
				});

				//FUN STUFF
				$('fun_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					$('_headerNav_fun_btn').setStyle('background-image','url(assets/images/funstuff_btn.png)');
				});
				$('fun_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();
					if($('_headerNav_fun_btn').getProperty('class') != "nav_boxes fun_sel") {
						$('_headerNav_fun_btn').setStyle('background-image','url(assets/images/funstuff_btn_hover.png)');
					}
				});

				// KEEP ME POSTED
				$('posted_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					$('_headerNav_posted_btn').setStyle('background-image','url(assets/images/posted_btn.png)');
				});
				$('posted_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();
					if($('_headerNav_posted_btn').getProperty('class') != "nav_boxes posted_sel") {
						$('_headerNav_posted_btn').setStyle('background-image','url(assets/images/posted_btn_hover.png)');
					}
				});

				// CHAT
				$('chat_btn_link').addEvent('mouseover', function(e){
					e = new Event(e).stop();
					$('_headerNav_chat_btn').setStyle('background-image','url(assets/images/chat_btn.png)');
				});
				$('chat_btn_link').addEvent('mouseout', function(e){
					e = new Event(e).stop();
					if($('_headerNav_chat_btn').getProperty('class') != "nav_boxes chat_sel") {
						$('_headerNav_chat_btn').setStyle('background-image','url(assets/images/chat_btn_hover.png)');
					}
				});
		}
});

function isIE6(){
     return ((window.XMLHttpRequest == undefined) && (ActiveXObject != undefined));
}

function isIE7(){
	var ie7 = (document.all && !window.opera && window.XMLHttpRequest) ? true : false;
	return ie7;
}

function preloader(){
	
	// First of all hide the container
	// Load in the images etc
	// On complete fire the animation
	var graphCont = $('graph-cont');
	
	if(graphCont != null)
	{
		graphCont.setStyle('display','none');
		$('loader').setStyle('display','block');
		
		var base = "http://www.naturalconfectionery.co.uk/assets/images/";
		var images = new Array();
		images[0] = base + "graphs/character1_bar.png";
		images[1] = base + "graphs/character2_bar.png";
		images[2] = base + "graphs/character3_bar.png";
		images[3] = base + "graphs/character4_bar.png";
		images[4] = base + "graphs/character5_bar.png";
		images[5] = base + "graphs/character6_bar.png";
		images[6] = base + "graphs/character7_bar.png";
		images[7] = base + "graphs/character1_graphtop.png";
		images[8] = base + "graphs/character2_graphtop.png";
		images[9] = base + "graphs/character3_graphtop.png";
		images[10] = base + "graphs/character4_graphtop.png";
		images[11] = base + "graphs/character5_graphtop.png";
		images[12] = base + "graphs/character6_graphtop.png";
		images[13] = base + "graphs/character7_graphtop.png";
		images[14] = base + "graphs/character1-link.png";
		images[15] = base + "graphs/character2-link.png";
		images[16] = base + "graphs/character3-link.png";
		images[17] = base + "graphs/character4-link.png";
		images[18] = base + "graphs/character5-link.png";
		images[19] = base + "graphs/character6-link.png";
		images[20] = base + "graphs/character7-link.png";

		// Load it up scotty..
		var loader = new Asset.images(images, {
			onError:function(){
				//alert('Error with image loading...');
				(function(){
					$('loader').setStyle('display','none');
					graphCont.setStyle('display','block');	
					homeInit();
				}).delay(2000);
			},
			onComplete:function(){
				// Remove the loader
				(function(){
					$('loader').setStyle('display','none');
					graphCont.setStyle('display','block');	
					homeInit();
				}).delay(2000);
			}
		});
	}
}

function homeInit(){
	hide_scale();
	hide_title();
	hide_bar();
	hide_graphs();
	hide_speech();
	hide_links();
}

function initShareCLicks(){
	$$('div#share-cont ul li').each(function(el){
		el.addEvent('click',function(e){
			$('thanks-message').setStyle('visibility','');
			
			(function(){
				$('thanks-message').setStyle('visibility','hidden');
			}).delay(5000);
			
		});
		// After 5 seconds remove it again..
	});
}

function profileNavInit(){
	$$('div#profile-header ul li a').each(function(el){
		el.addEvent('mouseover',function(){
			// Show the charcter text
			var div = $('profileHead_' + el.rel);
			if(!div.hasClass('sel')){
				var character = div.get('rel'); 
				var text = $(character + 'text');
				div.setStyle('background-image','url(assets/images/profiles/NEW/'+character+'_tab.png)');
				text.setStyle('display','block');
				// NO FADE
			}
		});
		el.addEvent('mouseout',function(){
			// Show the charcter text
			var div = $('profileHead_' + el.rel);
			if(!div.hasClass('sel')){
				var character = div.get('rel'); 
				var text = $(character + 'text');
				div.setStyle('background-image','url(assets/images/profiles/NEW/'+character+'_tab_hover.png)');
				text.setStyle('display','none');
				
				// FADE
			}
		});
	});
}

function twitterFeedInit(){
	$$('div#profile-tweets ul li a').each(function(el){
		el.addEvent('click',function(e){
			// Open in a new window.
			e.stop();
			window.location = "exit-page.aspx?go=" + el.href + "&ret=" + window.location.pathname;
		});
	});
}

function hide_title(){
	var title = $('natural-favourite-title');
	if(title != null){
		title.setStyle('display','none');
		if(!isIE7()){
			title.fade('out');
		}
		(function(){
			animate_title(title);
		}).delay(5000);
	}
}

function hide_bar(){
	var bar = $('graph-bottom');
	if(bar != null){
		bar.setStyle('width','0px');
		(function(){
			animate_bar(bar);
		}).delay(550);
	}
}

function animate_bar(bar){
	var tween = new Fx.Morph(bar, { duration: 2000, transition: Fx.Transitions.Quint.easeOut });
	tween.start({
	    'width': 847 
	});
}

function animate_title(title){
	title.setStyle('display','block');
	if(!isIE7()){
		title.fade('in');
	}
}

function hide_graphs(){
	var orderArray = new Array();
	$$('div.graph-bar').each(function(el){
		
		orderArray[parseInt(el.get('rel')) - 1] = el.id;
		var children = el.getChildren('div.character');
		var children2 = el.getChildren('span');
		children.each(function(item){
			item.setStyle('display','none');
		});
		var amount;
		children2.each(function(item){
			amount = item.get('html');
		});
		amount = amount.replace('%','');
		var total = 100 - amount;
		total = "-" + total + "px";
		el.setStyle('height','0').setStyle('margin-bottom',total);
		
	});
	(function(){
		animate_graphs(orderArray);
	}).delay(2000);	
}

function animate_graphs(orderArray){
	// Loop through order array
	var delay = 400;
	var el, amount;
	var tween;
	
	for(var i = 0; i < orderArray.length; i++)
	{
		//var newDelay = Math.floor(Math.random() * (delay * i) + 1);
		var run = show_bar.bind($(orderArray[i]));
		run.delay(delay * i);
	}
}

function hide_scale(){
	var scale = $('graph-scale');
	if(scale != null)
	{
		scale.setStyle('top','280px');
		animate_scale(scale);
	}
}

function animate_scale(scale){
	(function(){
		scale.tween('top','0px');
	}).delay(1250);
}

function hide_links(){
	$$('ul#character-nav li').each(function(el){
		el.setStyle('display','none').setStyle('opacity',0);	
	});	
	(function(){
		animate_links();
	}).delay(5750);
}



function animate_links(){
	var delay = 250;
	var count = 1;
	$$('ul#character-nav li').each(function(el){
		// Ping each one in
		//(function(){
			el.setStyle('display','block').tween('opacity',1);
		//}).delay(delay);
	});
	
}

function hide_speech(){
	var orderArray = new Array();
	var instructional = new Array();
	var banter = new Array();
	var count = 0;
	
	$$('div.speech-bubble img.ins').each(function(el){
		el.setStyle('height', '0').setStyle('width', 0);
		instructional[count] = el.id;
		count++;
	});
	count = 0;
	$$('div.speech-bubble img.ban').each(function(el){
		el.setStyle('height', '0').setStyle('width', 0);
		banter[count] = el.id;
		count++;
	});
	
	(function(){
		animate_speech(instructional,banter, true);
	}).delay(5500);
}

function animate_speech(instructional, banter, banterOn){
		
	if(banterOn){
		// We need to show the instructional...
		for(var i = 0; i < instructional.length; i++)
		{
			var delay = 4400;
			if(i == 1) delay = 7000;
			$(instructional[i]).setStyle('bottom',0).setStyle('right','0');
			var run = show_bubble.bind($(instructional[i]));
				//var delay = randomXToY(700,1500);
			run.delay(delay);
			var hide = hide_bubble.bind($(instructional[i]));
			delay = 10000;
			if(i == 1) delay = 13000;
			//delay = randomXToY(3000,4500);
			hide.delay(delay);
		}
		banterOn = false;
	} else {
		// We need to show the banter..
		for(var i = 0; i < banter.length; i++)
		{
			$(banter[i]).setStyle('bottom',0).setStyle('right','0');
			var run = show_bubble.bind($(banter[i]));
				var delay = 4400;
				if(i == 1) delay = 7000;
			run.delay(delay);
			var hide = hide_bubble.bind($(banter[i]));
			delay = 10000;
			if(i == 1) delay = 13000;
			//delay = randomXToY(3000,4500);
			hide.delay(delay);
		}
		banterOn = true;
	}
	
	// LOOP
	(function(){
		animate_speech(instructional, banter, banterOn);
	}).delay(8500);
}

var show_bubble = function(){
	var el = this;
	var myEffect = new Fx.Morph(el, {duration: 'long', transition: Fx.Transitions.Elastic.easeOut});
	var div = $(this.id + '-div');
	var divEf = new Fx.Morph(div, {duration: 'short' });
	myEffect.start({
	    'height': this.naturalHeight, //Morphs the height from the current to 100px.
	    'width': this.naturalWidth,
		'bottom': 0,
		'right': 0
	});
}

var hide_bubble = function(){
	var el = this;
	el.setStyle('bottom',0).setStyle('right',0);
	var myEffect = new Fx.Morph(el, {duration: 'short', transition: Fx.Transitions.Bounce.easeOut });
	myEffect.start({
	    'height': 0, //Morphs the height from the current to 100px.
	    'width': 0,
		'bottom': 59.5,
		'right': 70.5
	});	
}

var show_bar = function(){
	var el = this;
	//var random = randomXToY(750,1250);
	var children = el.getChildren('span');
	var amount;
	children.each(function(item){
		amount = item.get('html');
	});
	var children = el.getChildren('div.character');
	children.each(function(item){
		(function(){
			item.setStyle('display','block');	
		}).delay(55);
	});
	var tween = new Fx.Morph(el, { duration: 450, unit: '%', transition: Fx.Transitions.Quint.easeOut });
	tween.start({
	    'height': amount, //Morphs the height from the current to 100px.
	    'margin-bottom': 0
	});
}


function randomXToY(minVal,maxVal,floatVal)
{
  var randVal = minVal+(Math.random()*(maxVal-minVal));
  return typeof floatVal=='undefined'?Math.round(randVal):randVal.toFixed(floatVal);
}