/*
** Javascript snippets for brunow & maunula site
**
** Require prototype, scriptaculous, accordion.
**
** Try to get all inline-js here..
**
** copyright T:mi Artisokka - Mika Porspakka 2009
*/


var pathPrefix = '';

/* uncomment the following for development */
/*var development = false;
if (development)
{
	pathPrefix = '/brumau';
}*/

/*
** togglePhase 
** phases the selected element either in or out
*/
function togglePhase(el) {
	new Effect.Phase(el, {duration: 0.3} );
}

/*
** Frontpage common variables 
** 'frontpageProjects' and 'frontpageStart' set in the page html
*/
var frontpageDelay = 4; //seconds
var frontpageFadeSpeed = 0.5; // seconds
var frontpageCurrent = 0;
var frontpageLast = 0;
var frontpageTimeout;

/*
** frontpageInitalizeCarousel
** Initializes the carousel if #frontpage element is found on the page
*/
function frontpageInitalizeCarousel() 
{
	// only initialize if page contains #frontpage
	if ($('frontpage') && frontpageProjects > 1) 
	{
		// make first sure that the images are loaded!
		// PRELOAD IMAGES: 
		// var blahblah = new Image();
		// blahblah.onLoad=imagesLoaded();
		
		// start the carousel at the wanted point
		frontpageLast = 0;
		frontpageCurrent = 1;
		if (frontpageStart != 0)
		{
			frontpageLast = frontpageStart;
			frontpageCurrent = frontpageLast+1;
			if (frontpageCurrent >= frontpageProjects) {
				frontpageCurrent = 0;
			} 
		}

		// initialize carousel slide selection
		for (var i=0; i<frontpageProjects; i++)
		{
			Event.observe( 'frontpage_jumpto_'+i, 'click', 
					function(ev) { frontpageJumpToCarouselEv(Event.element(ev)); },
					false);
		}

		// start the carousel
		frontpageTimeout = frontpageChangeCarousel.delay(frontpageDelay);
	}
}
Event.observe(window, 'load', frontpageInitalizeCarousel, false);

/*
** frontpageChangeCarousel
** Cycles through the frontpage projects automatically with nice transition.
** Sets timeout for itself in the end to continue the cycling.
*/
function frontpageChangeCarousel( ) 
{
	var elemLast = $('frontpage_slide_'+frontpageLast);
	var elemCurrent = $('frontpage_slide_'+frontpageCurrent);

	//console.log('elemLast: '+elemLast.id+'; elemCurrent:'+elemCurrent.id);

	// set and get heights
	$('frontpage').style.height = elemLast.style.height;
	var newheight = elemCurrent.getHeight();

	// change the selector
	$('frontpage_jumpto_'+frontpageCurrent).addClassName('selected');
	$('frontpage_jumpto_'+frontpageLast).removeClassName('selected');

	// transition: fade out the current slide, resize the div to accommodate the new slide, fade in the new slide
	new Effect.Fade(elemLast,{duration: frontpageFadeSpeed});
	new Effect.ReSize($('frontpage'), {direction:'vert', toSize: newheight, duration:0.2, delay: frontpageFadeSpeed});
	new Effect.Appear(elemCurrent,{duration: frontpageFadeSpeed,delay: frontpageFadeSpeed+0.2});
		
	// set the new and last positions of the carousel
	frontpageLast = frontpageCurrent;
	frontpageCurrent++;
	if (frontpageCurrent >= frontpageProjects) {
		frontpageCurrent = 0;
	} 

	// set timeout to this functio to make the next change
	frontpageTimeout = frontpageChangeCarousel.delay(frontpageDelay);
}

/*
** frontpageJumpToCarouselEv
** Jumps to user selected slide based on an element passed to it.
** Clears any current timeout, and sets a new one in the end.
*/
function frontpageJumpToCarouselEv( elem ) 
{
	// get slide number from elements id
	slide = elem.id.split('_');
	slide.reverse();
	slide = slide[0];

	// see that the wanted slide isn't the current one
	if ( slide != frontpageLast )
	{
		// if there's any timeout currently, clear it.
		window.clearTimeout(frontpageTimeout);

		//set new current slide and then show it
		frontpageCurrent = slide;
		frontpageChangeCarousel();
	}
}

/*
** isLoaded
** checks if the element is loaded
*/
function isLoaded(elm) {
	var elm = $(elm);
	if(elm.complete) {
  		elm.fire('element:loaded');
	} else {
		setTimeout(function(elm) { loaded(elm); }, 100);
	}
}

document.observe('element:loaded', function(ev) 
	{
	var elm = ev.element();
	console.log('Height: '+elm.getHeight()+'px, Width: '+elm.getWidth()+'px');
	}
);