$(document).ready(begin);

function begin(){
	subs_length = $('.sub').length;
	z = 0;
	$('.sub').each( function(){
		z++;
		p = (25-(z*.5));
		$(this).css({'paddingTop' : p+'px' });
		$(this).attr({'p': p });
		$(this).attr({'z': z });
		$('#stage').attr({'anim': 'c' });
	});
	$('#stage').attr('allow', '1');
	
	//$($('.sub')[0]).animate({'width': '600px'}, {duration:300, queue: false });
	
	$('.sub').mousemove( sub_click );
	
	$('.scroll-img').each( function(){
		$(this).find('a').lightBox({imageBtnClose: 'close.gif', imageBtnPrev: 'prev.gif', imageBtnNext: 'next.gif', txtImage: ''});
	});
	
	$('#email').click( function(){ e = new Array('@','ik', 'aes', 'cody', '.', 'c','om'); location.href='mailto:'+e[3]+e[0]+e[2]+e[1]+e[4]+e[5]+e[6]; });
	
	$('.sub').mousemove( function(){
		if($(this).width() < 50 && $('#stage').attr('anim') == 'c' ){
			$('#stage').attr('anim', 'o');

			$(this).animate(
				{
					'width': '600px', 
					'paddingTop': $(this).attr('p')+'px'
				},
				{
					duration: 400,
					queue: false,
					complete: function(){ 
						$('#stage').attr('anim', 'c');
						$(this).attr('anim', 'o');
					},
					easing: 'easeOutExpo'
				}
			);
	
			new_sub = $(this).attr('z');
			z = 0;
			$('.sub').each( function(){
				z++;
				if(z > new_sub)
					p_top = ((parseFloat($(this).attr('p'))-5)-(z*.9))+'px';
				else if( z < new_sub )
					p_top = $(this).attr('p')+'px';

				if(z != new_sub){
					$(this).stop();
					$(this).animate(
					{
						'width': '30px',
						'height': '240px',
						'paddingTop': p_top
					},
					{
						duration:400,
						queue: false,
						easing: 'easeOutExpo'
					});				
				}
			
			});
		}
	});
	
	$('.sub').mouseout( function(){
		if($(this).attr('anim') != 'o') return
		
		$('#stage').attr('anim', 'c');
		$(this).attr('anim', 'c');
	});
		
	$('.scroll-left, .scroll-right').each( function(){
		$(this).css('marginLeft', '0px')
	});
	
	$('.scroll-left').click( function(){
		target = $($(this).next().children()[0]);
		wid = $(target.children()[0]).width();
		if(
			parseFloat(target.css('marginLeft')) < 0 && 
			( target.attr('anim') == 'c' || !target.attr('anim') )
		){
			target.attr('anim', 'o');
			target.animate({'marginLeft' : '+='+wid+'px' }, { complete: function(){ $(this).attr('anim', 'c'); }});
		} else if( 
					  parseFloat(target.css('marginLeft')) == 0 && 
					( target.attr('anim') == 'c' || !target.attr('anim'))
		){
			target.attr('anim', 'o');
			len = (target.children().length-1) * wid;
			target.animate({'marginLeft' : '-='+len+'px' }, { complete: function(){ $(this).attr('anim', 'c'); }});
		}
	});
	
	$('.scroll-right').click( function(){
		target = $($(this).prev().children()[0]);
		wid = $(target.children()[0]).width();
		if(
		   	parseFloat(target.css('marginLeft')) != ((target.children().length-1) * wid * -1) && 
			( target.attr('anim') == 'c' || !target.attr('anim') )
		){
			target.attr('anim', 'o');
			target.animate({'marginLeft' : '-='+wid+'px' }, { complete: function(){ $(this).attr('anim', 'c'); }});
		} else if( 
				  	target.attr('anim') == 'c' &&
					parseFloat(target.css('marginLeft')) <= ((target.children().length-1) * wid * -1)
		){
			target.attr('anim', 'o');
			target.animate({'marginLeft' : '0px' }, { complete: function(){ $(this).attr('anim', 'c'); }});
		}
	});
}

function sub_click(){
	
	if( $('#stage').attr('anim') == 'o') return;
	
	$('.sub .tab-open').each( function(){
		$(this).attr('active', 0);
	});
	
	target = $( $( $(this).children()[0] ).children()[0]);
	target.attr('active', 1);
	
	$('.sub .tab-open').each( function(){
		if( $(this).attr('active') == '0'){
			$(this).hide();
			$(this).stop();
			$(this).css('opacity', '1')
		}
	});
	
	target.fadeIn('slow');
	
	$(this).animate({'height': '700px'}, {duration:1000, queue: false, easing: 'easeOutExpo'});
}

// below 2 no longer used :[
function ani_check(new_sub){
	z = 0;
	$('.sub').each( function(){
		z++;
		if(z > new_sub)
			p_top = ((parseFloat($(this).attr('p'))-5)-(z*.25))+'px';
		else if( z < new_sub )
			p_top = $(this).attr('p')+'px';
		else
			p_top = '';
			
		if(z != new_sub)
			$(this).animate({'width': '30px', 'paddingTop': p_top }, {duration:300, queue: false});

	});
	
	$('#stagez').mousemove( function(e){
		subs_length = $('.sub').length;
		x = e.pageX - this.offsetLeft;
		y = e.pageY - this.offsetTop;
		if( y > 200 ) return; // only if over colors
		
		per = x / 600;
		new_sub = Math.round(per*subs_length);
		if(new_sub == 0)
			new_sub = 1;
		sub_el = $($('.sub')[new_sub-1]);
	
		if($(sub_el).width() < 50){
			$(sub_el).animate(
				{
					'width': '600px', 
					'paddingTop': sub_el.attr('p')+'px'
				},
				{
					duration: 300,
					queue: false,
					complete: ani_check(new_sub) 
				}
			);
			
			$(sub_el).attr('anim', 'o');
		}

		z = 0;
		$('.sub').each( function(){
			z++;
			if($(this).width() == 600 && new_sub != z){
				//$(this).animate({'width': '10px'}, {duration:300, queue: false});
				$(this).attr('anim', 'c');
			}
			
			/*
			this_w = this.clientWidth;
			this_x = this.offsetLeft;

			if(x > this_x && (x < ( this_w+this_x))){
				if(this.clientWidth <= 50  && $(this).attr('anim') != 'o'){
					$(this).attr('anim', 'o')
					$(this).animate({'width': '600px'}, {duration:300, queue: false, complete: ani_check(this) });
				}
			} else {
				if(this.clientWidth >= 600 && $(this).attr('anim') != 'c'){
					$(this).attr('anim', 'c')
					$(this).animate({'width': '10px'}, {duration:300, queue: false, complete: ani_check(this) });
				}
			}
			*/
			
			//$(this).css({'width':Math.floor( stage_w / (Math.abs(x) ) +35)+'px'});
		});
	});
}
