﻿


function $() {
	if (arguments.length == 1) return get$(arguments[0]);
	var elements = [];
	$c(arguments).each(function(el){
		elements.push(get$(el));
	});
	return elements;

	function get$(el){
		if (typeof el == 'string') el = document.getElementById(el);
		return el;
	}
}


var Thumbnails = {
	init : function(obj) {
		var container = $(obj[0]);
		var img = $(obj[1]);
		
		var thumbs = container.getElementsByTagName('img');
		var cs = img.src;
		cs = cs.substr(0,cs.length - 4);
		for(var i = thumbs.length; i-- > 0;)
		{
			var s = thumbs[i].src.replace('-thumb','');
			s = s.substr(0,s.length - 4);
			if( s == cs )
			{
				YAHOO.util.Dom.addClass(thumbs[i], 'current');
				Thumbnails.current = thumbs[i];
			}
			else
			{
				YAHOO.util.Dom.removeClass(thumbs[i], 'current');
			}
				
			YAHOO.util.Event.addListener(thumbs[i], 'click', function() { Thumbnails.replaceMain(this); }, thumbs[i], true);
			YAHOO.util.Event.addListener(thumbs[i], 'click', function() { if($('moreinfo').state == 'open') BracketAnim.hide.animate(); }, thumbs[i], true);
		}
		
		YAHOO.util.Event.addListener(container, 'mouseover', function() { YAHOO.util.Dom.addClass(container, 'over'); }, 'tnail', true);
		YAHOO.util.Event.addListener(container, 'mouseout', function() { YAHOO.util.Dom.removeClass(container, 'over'); }, 'tnail2', true);
	},
	
	replaceMain : function(thumb) {
	
		thumb = $(thumb);
		var s = thumb.src.replace('-thumb','');
		s = s.substr(0,s.length - 4);
		var mn = $('mainimage');
		var fadeDuration = 0.3;
		var fadeoutAttr = { opacity: { to: 0 } };
		var fadeinAttr = { opacity: { to: 1 } };
		var fadeout = new YAHOO.util.Anim(mn, fadeoutAttr, fadeDuration, YAHOO.util.Easing.easeOut);
		var fadein = new YAHOO.util.Anim(mn, fadeinAttr, fadeDuration, YAHOO.util.Easing.easeOut);
		
		fadeout.onComplete.subscribe(
			function(){
				mn.src = s + ".jpg";
				YAHOO.util.Event.addListener(mn,'load',fadein.animate,fadein, true);
			}
		);
						
		fadeout.animate();
		
		if(Thumbnails.current != undefined)
		{
			YAHOO.util.Dom.removeClass(Thumbnails.current, 'current');
		}
		
		YAHOO.util.Dom.addClass(thumb,'current');
		Thumbnails.current = thumb;
		
	}
}

var BracketAnim = {

	init : function(obj) {
	
		var imageWidth = 500;
		var imageHeight = 350;

		var showAttrs = { width: { to: 260 } };
		var shrinkAttrs = { width: { to: imageWidth * .5 }, height: { to: imageHeight * .5 } };
		var hideAttrs = { width: { to: 20 } };
		var growAttrs = { width: { to: imageWidth }, height: { to: imageHeight } };
		
		$('moreinfo').state = 'closed'; //closed, opening, open, closing
		
		// create the animation objects
		BracketAnim.show = new YAHOO.util.Anim(obj[0], showAttrs, 0.5, YAHOO.util.Easing.easeBoth);
		BracketAnim.hide = new YAHOO.util.Anim(obj[0], hideAttrs, 0.5, YAHOO.util.Easing.easeBoth);
		var grow = new YAHOO.util.Anim(obj[1], growAttrs, 0.5, YAHOO.util.Easing.easeBoth);
		var shrink = new YAHOO.util.Anim(obj[1], shrinkAttrs, 0.5, YAHOO.util.Easing.easeBoth);
		
		// set up show
		BracketAnim.show.onStart.subscribe(
			function() { 
				$('moreinfo_teaser').style.display = 'none'; // hide the dots
				var state = $('moreinfo').state; // get the current state
				if(state == 'closing' || state == 'open') { return; } // return
				$('moreinfo').state = 'opening'; // set the state
				$('moreinfo').style.backgroundImage = 'url(skin/bracket.gif)';
				shrink.animate(); // shrink the image
			}
		);
		
		BracketAnim.show.onComplete.subscribe(
			function() { 
				$('moreinfo').state = 'open'; // set the state
				$('moreinfo_content').style.display = 'block'; // show the content
			}
		);
		
		// set up hide
		BracketAnim.hide.onStart.subscribe(
			function() {
				var state = $('moreinfo').state; // get the state
				if(state == 'opening' || state == 'closed') { return; } // stop
				$('moreinfo').state = 'closing'; // change the state
				$('moreinfo_content').style.display = 'none'; // set display to none
				$('moreinfo_content').style.visibility = 'hidden'; // hide it
				grow.animate(); // start the image grow
			}	
		);
		
		BracketAnim.hide.onComplete.subscribe(
			function() {
				var hide_tmr = setTimeout( function() { $('moreinfo').state = 'closed'; clearTimeout(hide_tmr); }, 700);
				$('moreinfo_teaser').style.display = 'block';
				$('moreinfo_content').style.display = 'none';
				$('moreinfo_content').style.visibility = 'visible';
				$('moreinfo').style.backgroundImage = 'url(skin/bracket-left.gif)';
			}
		);
		
		// add the listeners
		YAHOO.util.Event.addListener('moreinfo', 'mouseover', function() { if($('moreinfo').state == 'closed') BracketAnim.show.animate(); }, BracketAnim.show, true);
		YAHOO.util.Event.addListener('moreinfo_x1', 'click', function() { BracketAnim.hide.animate(); }, BracketAnim.hide, true);
		YAHOO.util.Event.addListener('moreinfo_x2', 'click', function() { BracketAnim.hide.animate(); }, BracketAnim.hide, true);
		YAHOO.util.Event.addListener('mainimage', 'click', function() { BracketAnim.hide.animate(); }, BracketAnim.hide, true);
	}
	
};