// JavaScript Document

var H = {
	
	current : 0,
	duration : 1000,
	imgs : [],
	thumbs : [],
	dir : '',
	interval : '',
	
	loadData: function(){
		$.get( '/index.php?/home/slides/', null, H.dataLoaded );
	},
	
	getElements:function(node, name){
		var c = node.childNodes;
		var r = [];
		for(var i=0; i<c.length; i++){
			if(c[i].nodeName == name){
				r.push(c[i]);
			}
		}
		return r;
	},
	
	begin: function(){
		H.imgs = $('#home-banner-images img');
		H.imgs.each( function(i){
			if( i != 0 ){
				//$(this).clip( [ 0, $(this).width(), $(this).height(), $(this).width() ] );
				$(this).hide();		
			}
		});
		$('#home-banner-thumbs img:first').addClass('active');
		$('#home-banner-thumbs img').click( H.thumbClicked );
		$('#home-banner-right').click( H.nextClicked );
		$('#home-banner-left').click( H.prevClicked );
		$('#home-banner-text').html( H.imgs[0].title );
		$('#home-banner-images').fadeIn(800);
		H.interval = window.setInterval( H.slideshow, 5000 );
	},
	
	slideshow: function(){
		H.dir = 'left';
		var n = H.current + 1;
		if( n > (H.imgs.length - 1) ) n = 0;
		H.hideImage(H.imgs[H.current]);
		H.showImage(H.imgs[n]);
		H.current = n;
	},
	
	cancelSlideshow: function(){
		window.clearInterval( H.interval );
	},
	
	show: function(i){
		if( (i > H.current) || ( H.current == (H.imgs.length - 1)  ) ){
			H.hideImageLeft( H.imgs[H.current] );
			H.showImage( H.imgs[i] );
			H.current = i;
		}else if( i < H.current ){
			H.hideImageRight( H.imgs[H.current] );
			H.showImage( H.imgs[i] );
			H.current = i;
		}
	},
	
	thumbClicked: function(){
		H.cancelSlideshow();
		var o = $(this).attr('order');
		var c = H.current;
		if( o == c ) return;
		if( o > c){
			H.dir = 'left';
		}else if( o < c ){
			H.dir = 'right';
		}
		H.hideImage(H.imgs[c]);
		H.showImage(H.imgs[o]);
		H.current = o;
	},
	
	sortThumbs: function(){
		$('#home-banner-thumbs img').removeClass('active');
		$( $('#home-banner-thumbs img')[H.current] ).addClass('active');
		var txt = H.imgs[H.current].title;
		$('#home-banner-text').html( txt );
		$('#home-banner-text').fadeIn();
	},
	
	nextClicked: function(){
		H.cancelSlideshow();
		H.dir = 'left';
		var n = H.current + 1;
		if( n > (H.imgs.length - 1) ) n = 0;
		H.hideImage(H.imgs[H.current]);
		H.showImage(H.imgs[n]);
		H.current = n;
	},
	
	prevClicked: function(){
		H.cancelSlideshow();
		H.dir = 'right';
		var n = H.current - 1;
		if( n < 0) n = H.imgs.length - 1;
		H.hideImage(H.imgs[H.current]);
		H.showImage(H.imgs[n]);
		H.current = n;
	},
	
	showImage: function(img){
		if( H.dir == 'right' ){
			H.showImageLeft(img);
		}else if( H.dir == 'left' ){
			H.showImageRight(img);
		}
		
	},
	
	hideImage: function(img){
		$('#home-banner-text').fadeOut();
		if( H.dir == 'right' ){
			H.hideImageRight(img);
		}else if( H.dir == 'left' ){
			H.hideImageLeft(img);
		}
		
	},
	
	showImageLeft: function(img){
		//$(img).clip( [0, 0, $(img).height(), 0]);
		//$(img).clip( [0, $(img).width(), $(img).height(), 0], H.duration, H.sortThumbs );
		$(img).fadeIn(H.duration, H.sortThumbs);
	},
	
	showImageRight: function(img){
		$(img).fadeIn(H.duration, H.sortThumbs);
		//$(img).clip( [0, $(img).width(), $(img).height(), $(img).width()]);
		//$(img).clip( [0, $(img).width(), $(img).height(), 0], H.duration, H.sortThumbs );
	},
	
	hideImageLeft: function(img){
		//$(img).clip( [0, 0, $(img).height(), 0], H.duration );
		$(img).fadeOut(H.duration);
	},
	
	hideImageRight: function(img){
		//$(img).clip( [0, $(img).width(), $(img).height(), $(img).width()], H.duration );
		$(img).fadeOut(H.duration);
	},
	
	dataLoaded: function(data, txt, request){
		var els = H.getElements(data.documentElement, 'image');
		var imgs = [];
		var thumbs = [];
		$.each( els, function(i, el){
			imgs.push( $('<img src="'+el.getAttribute('src')+'" alt="Homepage Banner" title="'+el.getAttribute('title')+'" />') );				  
			thumbs.push( $('<a href="javascript:void(0)"><img src="'+el.getAttribute('thumb')+'" alt="Homepage Thumb" order="'+i+'" /><a/>') );	
		});
		for( var i=0; i < imgs.length; i++ ){
			imgs[i].appendTo( '#home-banner-images');
			thumbs[i].appendTo( '#home-banner-thumbs' );
		}
		$('#home-banner-thumbs').append( '<div class="clear"></div>' );
		H.begin();
	},

	init: function(){
		H.loadData();
	}
	
}

$(document).ready( H.init );