$(document).ready(function()
	{
		//$("#tabs").tabs();
		$("#tabs").tabs({ fx: { opacity: 'toggle' } });
		/*
		$.fn.canvasSwap.defaults.suffix = '_hover';
		$.fn.canvasSwap.defaults.ie6_support = false;
		$('img').canvasSwap();
		*/
		getData();

		$('.prev').click(function()
		{
			var parent = $(this).parent();
			var div = parent.next();
			var currentPage = Number(div.attr('page'));
			var pages = Number(div.attr('pages'));
			
			if(currentPage != 1)
			{
				currentPage -= 1;
				div.attr('page',currentPage);
				
				var page = (currentPage - 1);
				var pageLeft = -1 * (438 * page);
				
				div.animate({'left': pageLeft+'px'}, 'slow');
				div.prev().prev().html('Set ' + currentPage + ' of ' + pages);
			}
			checkArrows(parent, currentPage, pages);
		})
		
		$('.next').click(function()
		{
			var parent = $(this).parent();
			var div = parent.next();
			var currentPage = Number(div.attr('page'));
			var pages = Number(div.attr('pages'));
			
			if(currentPage != pages)
			{
				currentPage += 1;
				div.attr('page',currentPage);
				
				var page = (currentPage - 1);
				var pageLeft = -1 * (438 * page);
				
				div.animate({'left': pageLeft+'px'}, 'slow');
				div.prev().prev().html('Set ' + currentPage + ' of ' + pages);
			}
			checkArrows(parent, currentPage, pages);
		});

		$('.prev').css('opacity',  .3);
		$('.next').css('opacity',  .3);
	});
	
	function checkArrows(parent, currentPage, pages)
	{
		if(pages > 1)
		{
			if(currentPage == 1)
			{
				parent.children().eq(0).css('opacity',  .3);
				parent.children().eq(0).css('cursor', 'default');
				
				parent.children().eq(1).css('opacity',  1);
				parent.children().eq(1).css('cursor', 'pointer');
			}
			else if(currentPage == pages)
			{
				parent.children().eq(0).css('opacity',  1);
				parent.children().eq(0).css('cursor', 'pointer');
				
				parent.children().eq(1).css('opacity',  .3);
				parent.children().eq(1).css('cursor', 'default');
			}
			else if(currentPage != pages)
			{
				parent.children().eq(0).css('opacity',  1);
				parent.children().eq(0).css('cursor', 'pointer');
				
				parent.children().eq(1).css('opacity',  1);
				parent.children().eq(1).css('cursor', 'pointer');
				
			}
		}
	}
	
// ***********************************************************************************************
	
	var isIE = false;
	var obj = null;
	
	function loadXMLDoc(url, callBack)
	{
		// branch for native XMLHttpRequest object
		if (window.XMLHttpRequest) {
			obj = new XMLHttpRequest();
			obj.onreadystatechange = callBack;
			obj.open("GET", url, true);
			obj.send(null);
		// branch for IE/Windows ActiveX version
		} else if (window.ActiveXObject) {
			isIE = true;
			obj = new ActiveXObject("Microsoft.XMLHTTP");
			if (obj) {
				obj.onreadystatechange = callBack;
				obj.open("GET", url, true);
				obj.send();
			}
		}else{
			return;
		}
	}
	
	function getData()
	{
		loadXMLDoc('/salming_academy.xml', getCountriesCallBack);
	}
	
	var rootXML;
	var introXML;
	/*
	var zone_a_array = new Array();
	var zone_b_array = new Array();
	var zone_c_array = new Array();
	var zone_d_array = new Array();
	var trick_shooting_array = new Array();
	var shooting_from_distance_array = new Array();
	var back_towards_the_net_array = new Array();
	var behind_the_net_array = new Array();
	var volley_shooting_array = new Array();
	var backhand_shooting_array = new Array();
	*/
	// new *******************************************
	
	var goalie_array = new Array();
	var feint_array = new Array();
	var penalty_array = new Array();
	var shot_array = new Array();
	
	// ***********************************************
	
	var categories_array;
	var categories_order;
	var categories_order_array;
	
	function getCountriesCallBack()
	{
		if(obj.readyState == 4)
		{
			if (obj.status == 200)
			{
			    
				rootXML = obj.responseXML.getElementsByTagName('clips')[0];
				clipXML = rootXML.getElementsByTagName('clip');
				
				var clipsLength = clipXML.length;
				
				for(var i=0;i<clipsLength;i++)
				{
					addTagObj(clipXML[i]);
				}
				
				categories_array = Array()
				
                // new *******************************************
				
				categories_order_array = categories_order.split("|");
				
				for(var i=0;i<categories_order_array.length;i++)
				{
					categories_array.push(categories_order_array[i]);
				}
				
				// ***********************************************
				/*
				categories_array.push('trick_shooting');
				categories_array.push('shooting_from_distance');
				categories_array.push('back_towards_the_net');
				categories_array.push('behind_the_net');
				categories_array.push('volley_shooting');
				categories_array.push('backhand_shooting');
			    */
				addCategory();
				
				// ********************************************************************************
				/*
				addZone('zone_a');
				addZone('zone_b');
				addZone('zone_c');
				addZone('zone_d');
				*/
				/*
				alert("zone_a: " + zone_a_array.length);
				alert("zone_b: " + zone_b_array.length);
				alert("zone_c: " + zone_c_array.length);
				alert("zone_d: " + zone_d_array.length);
				
				alert("trick_shooting: " + trick_shooting_array.length);
				alert("shooting_from_distance: " + shooting_from_distance_array.length);
				alert("back_towards_the_net: " + back_towards_the_net_array.length);
				alert("behind_the_net: " + behind_the_net_array.length);
				alert("volley_shooting: " + volley_shooting_array.length);
				alert("backhand_shooting: " + backhand_shooting_array.length);
				*/
			}
		}
	}
	var categoryId = 0;
	
	function addCategory()
	{
		if(categoryId < categories_array.length)
		{
			var categoryName = categories_array[categoryId];
			var xPos = 5;
			var responseText = '';
			var array = eval(categoryName+'_array');
			
			array.reverse();
			
			for(var j=0; j < array.length; j++)
			{
				responseText += '<div class="clipHolder" style="left:'+ xPos +'px;">';
				responseText += '<div class="clipThumb" style="background-image:url('+array[j].getElementsByTagName('thumbnail_medium')[0].firstChild.data+');">';
				responseText += '<a href="javascript:getClipData(\''+categoryName+'_array\', '+j+');">';
				responseText += '<img src="/images/crackbox.png" width="140" height="98" />';
				responseText += '<\/a>'
				responseText += '<\/div>';
				responseText += '<div class="clipTitle">' + array[j].getElementsByTagName('title')[0].firstChild.data + '<\/div>';
				responseText += '<\/div>';
				
				xPos += 146;
			}
			setPageData(categoryName, responseText);
		}
	}
	
	function addZone(zoneName)
	{
		var responseText = '';
		var array = eval(zoneName+'_array');
		
		for(var j=0; j < array.length; j++)
		{
			responseText += '<div class="clipHolder2" style="float:left;" >';
			responseText += '<div class="clipThumb" style="background-image:url('+array[j].getElementsByTagName('thumbnail_medium')[0].firstChild.data+');">';
			responseText += '<a href="javascript:getClipData(\''+zoneName+'_array\', '+j+');">';
			responseText += '<img src="images/crackbox.png" width="130" />';
			responseText += '<\/a>'
			responseText += '<\/div>';
			responseText += '<div class="clipTitle">' + array[j].getElementsByTagName('title')[0].firstChild.data + '<\/div>';
			responseText += '<\/div>';
		}
		
		setPageData2(zoneName, responseText, j);
	}
	
	function setIntro()
	{
	    var responseText = '';
		responseText += '<div class="clipDataPuff">'
		responseText += '<div class="clipDataPuffHeader">' + introXML.getElementsByTagName('title')[0].firstChild.data + "</div>";
		responseText += '<div class="clipDataPuffContent">';
		responseText += '<div class="clipDataPuffFlash" >';
		responseText += '<object type="application/x-shockwave-flash" width="480" height="270" data="http://vimeo.com/moogaloop.swf?clip_id=' + introXML.getElementsByTagName('clip_id')[0].firstChild.data + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;autoplay=1">';
		responseText += '<param name="quality" value="best" />';
		responseText += '<param name="allowfullscreen" value="true" />';
		responseText += '<param name="scale" value="showAll" />';
		responseText += '<param name="bgcolor" value="#000000" />';
		responseText += '<param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=' + introXML.getElementsByTagName('clip_id')[0].firstChild.data + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;autoplay=1" />';
		responseText += '<\/object><\/div>';

		responseText += '<\/div>'
		responseText += '<div class="clipDataPuffFooter"><\/div>';
		responseText += '<\/div>'
		
	    $("#IntroClip").html(responseText);
    }
	
	function addTagObj(clipItemXml)
	{
		var tags = new Array();
		/*
		if(clipItemXml.getElementsByTagName('tags')[0].firstChild != null){
		    tags = clipItemXml.getElementsByTagName('tags')[0].firstChild.data.toLowerCase()
		}
		*/
		tags = clipItemXml.getElementsByTagName('tags')[0].firstChild.data.toLowerCase().split(", ");
		
		for (var i = 0; i<tags.length; i++)
		{
            if (tags[i] == "goalie") {
				goalie_array.push(clipItemXml);
			}else if (tags[i] == "feint") {
				feint_array.push(clipItemXml);
			}else if (tags[i] == "penalty") {
				penalty_array.push(clipItemXml);
			}else if (tags[i] == "intro") {
			    introXML = clipItemXml;
				setIntro();
				//alert(clipItemXml);
			}else if (tags[i] == "shot") {
				shot_array.push(clipItemXml);
			}else{
			    //alert(tags[i]);
				//alert(clipItemXml.getElementsByTagName('title')[0].firstChild.data);
			}
		    /*
			if (tags[i] == "zone_a"){
				zone_a_array.push(clipItemXml);
			}else if (tags[i] == "zone_b") {
				zone_b_array.push(clipItemXml);
			}else if (tags[i] == "zone_c") {
				zone_c_array.push(clipItemXml);
			}else if (tags[i] == "zone_d") {
				zone_d_array.push(clipItemXml);
			}else if (tags[i] == "trick_shooting") {
				trick_shooting_array.push(clipItemXml);
			}else if (tags[i] == "shooting_from_distance") {
				shooting_from_distance_array.push(clipItemXml);
			}else if (tags[i] == "back_towards_the_net") {
				back_towards_the_net_array.push(clipItemXml);
			}else if (tags[i] == "behind_the_net") {
				behind_the_net_array.push(clipItemXml);
			}else if (tags[i] == "volley_shooting") {
				volley_shooting_array.push(clipItemXml);
			}else if (tags[i] == "backhand_shooting") {
				backhand_shooting_array.push(clipItemXml);
			}else if (tags[i] == "goalie") {
				goalie_array.push(clipItemXml);
			}else if (tags[i] == "feint") {
				feint_array.push(clipItemXml);
			}else{
			    //alert(tags[i]);
				//alert(clipItemXml.getElementsByTagName('title')[0].firstChild.data);
			}
			*/
		}
		
	}
	
	function getClipData(arrayName, id)
	{
		var clipData = eval(arrayName)[id];
		var responseText = '';
		responseText += '<div class="clipDataPuff">'
		responseText += '<div class="clipDataPuffHeader">' + clipData.getElementsByTagName('title')[0].firstChild.data + "</div>";
		responseText += '<div class="clipDataPuffContent">';
		responseText += '<div class="clipDataPuffFlash" >';
		responseText += '<object type="application/x-shockwave-flash" width="480" height="270" data="http://vimeo.com/moogaloop.swf?clip_id=' + clipData.getElementsByTagName('clip_id')[0].firstChild.data + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;autoplay=1">';
		responseText += '<param name="quality" value="best" />';
		responseText += '<param name="allowfullscreen" value="true" />';
		responseText += '<param name="scale" value="showAll" />';
		responseText += '<param name="bgcolor" value="#000000" />';
		responseText += '<param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=' + clipData.getElementsByTagName('clip_id')[0].firstChild.data + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;autoplay=1" />';
		responseText += '<\/object></div>';
		//responseText += '<div class="clipDataPuffPlayground"><a href="javascript:startpage();"><img src="images/playground.png" title="Back to startpage" alt="Back to startpage"/></a></div>';
		responseText += '<div class="clipDataPuffTable">';
		//responseText += ReplaceData('<table><tr><td class="tableHeader">' + clipData.getElementsByTagName('caption')[0].firstChild.data + '</td></tr></table>');
		//responseText += ReplaceData( clipData.getElementsByTagName('caption')[0].firstChild.data );
		responseText +=  clipData.getElementsByTagName('caption')[0].firstChild.data ;
		responseText += '</div>';
		responseText += '</div>'
		responseText += '<div class="clipDataPuffFooter"></div>';
		responseText += '</div>'

		//$('#col1A').css('display','none');
		//$('#col1B').css('display','none');
		$('#IntroClip').html(responseText);
		//$('#col1B').fadeIn();
		scroll(0,0);
	}
	
	function ReplaceData(str)
	{
		str = replaceString(str, '<br />', '</td></tr><tr><td class="tableHeader">');
		str = replaceString(str, ': ', ':</td><td>');
		return str;
	}
	
	function replaceString(inString,str1,str2)
	{
		var outString = '';
		if(inString.indexOf(str1) != -1){
			var inString = inString.split(str1);
			var inStringLength = inString.length;
			for(var i=0;i<inStringLength;i++){
				if(i == inStringLength-1){
					inString[i];
				}else{
					inString[i] += str2;
				}
				outString += inString[i];
			}
			return outString;
		}else{
			return inString;
		}
	}
	
	function setPageData(divName, html)
	{
//		$('#'+divName).css('opacity',  .1);
		$('#'+divName).html(html);
		$('#'+divName).attr('page','1');
		pages = $('#'+divName).find('.clipHolder').length;
		pages = Math.ceil(pages/3);
		$('#'+divName).attr('pages', pages);
		$('#'+divName+ ' .clipHolder').css('position','absolute');
		$('#'+divName).css('left','0px');
		$('#'+divName+'_div .clipsNavInfo').html('Set 1 of ' + pages);
		
		$('#'+divName).fadeIn('slow', function()
		{
			categoryId++;
			addCategory();
		});
		
		// activate next button if more then 3 clips
		
		if($('#'+divName).children().length > 3)
		{
		    $('#'+divName).prev().children().eq(1).css('opacity',  1);
		    $('#'+divName).prev().children().eq(1).css('cursor', 'pointer');
    	}
	}
	
	function setPageData2(divName, html, j)
	{
		$('#'+divName).html(html);
		
		var rows = Math.ceil(j/3);
		var tabHeight = (rows*146);
		
		$('#'+divName).parent().css('height', tabHeight);
	}
	
	function back(divName)
	{
		var currentPage = Number($('#'+divName).attr('page'));
		var pages = Number($('#'+divName).attr('pages'));
		
		if(currentPage != 1)
		{
			currentPage -= 1;
			$('#'+divName).attr('page',currentPage);
			var page = (currentPage - 1);
			var pageLeft = -1 * (438 * page);
			$('#'+divName).animate({'left': pageLeft+'px'}, 'fast');
			$('#'+divName+'_div .clipsNavInfo').html('Set ' + currentPage + ' of ' + pages);
		}
	}
	
	function next(obj,divName)
	{
		var currentPage = Number($('#'+divName).attr('page'));
		var pages = Number($('#'+divName).attr('pages'));
		
		if(currentPage != pages)
		{
			currentPage += 1;
			$('#'+divName).attr('page',currentPage);
			var page = (currentPage - 1);
			var pageLeft = -1 * (438 * page);
			$('#'+divName).animate({'left': pageLeft+'px'}, 'fast');
			$('#'+divName+'_div .clipsNavInfo').html('Set ' + currentPage + ' of ' + pages);
		}
	}

function startpage(){
	$('#col1B').css('display','none');
	$('#col1B').html('');
	$('#col1A').fadeIn();
}

function showZone(zone)
{
	if(zone == 'zone_a')
	{
		$('#tabs').tabs('select', 1);
	}else if(zone == 'zone_b'){
		$('#tabs').tabs('select', 2);
	}else if(zone == 'zone_c'){
		$('#tabs').tabs('select', 3);
	}else if(zone == 'zone_d'){
		$('#tabs').tabs('select', 4);
	}
}