var $j = jQuery.noConflict();

/* 
 * MEEGEGEVEN VANUIT PHP
 * *********************
 * var img_ids = {$img_ids};
 * var thumbs = {$thumbs};
 * var images = {$images};
 * var previous = {$this->previous};
 * var current = {$this->current};
 * var next = {$this->next};
 * var nextnext = {$this->nextnext};

 * var gallery_spacer_thumbs = "{$this->spacer_thumbs}";
 * var gallery_spacer_imgs = "{$this->spacer_imgs}";
 */
var gallery_thumbs_max_height = 40;
var gallery_thumbs_max_width = 52;
var gallery_imgs_max_height = 225;
var gallery_imgs_max_width = 300;
// hoe lang wacht de gallerij om de volgende foto te laten zien als de slideshow nog actief is? (in seconden)
var gallery_slideshow_timer = 5;
// moet de slideshow gestopt worden? (standaard bij het laden van de pagina staat de slideshow aan, enkel bij het klikken op de
// thumb van een andere image of de 'next'/'previous' buttons.
var gallery_stop_slideshow = false;

$j(document).ready(function(){
	$j('#gallery').onImagesLoad({
		selectorCallback: gallery_init
	});
	gallery_events();

    // als er op een thumb wordt geklikt of op een van de next/previous buttons wordt de slideshow stilgelegd.
    $j('#gallery_thumb img').click(function(){
        gallery_stop_slideshow = true;
    });

    // gallery slideshow activeren
    setTimeout('gallery_slideshow();', (gallery_slideshow_timer * 1000));
});

function gallery_init()
{
	$j.preload(thumbs);
	$j.preload(images);
	gallery_update();
}

function gallery_events()
{
	$j('#gallery .act_prev a').live('click',function(){ gallery_previous(); gallery_update(); });
	$j('#gallery .act_next a').live('click',function(){ gallery_next(); gallery_update(); });
	$j('#gallery .act_nextnext a').live('click',function(){ gallery_nextnext(); gallery_update(); });
}

function gallery_previous()
{
	// nieuwe nextnext is oude next
	nextnext = next;
	// nieuwe next is oude current
	next = current;
	// nieuwe current is oude prev
	current = previous;
	// nieuwe previous is ?
	var previous_idx = $j.inArray(previous.toString(),img_ids);
	if (previous_idx > -1)
	{
		if(previous_idx > 0)
		{
			previous = img_ids[(previous_idx - 1)];
		}
		else
		{
			previous = img_ids[img_ids.length-1];
		}
	}
}

function gallery_next()
{
	// nieuwe prev is oude current
	previous = current;
	// nieuwe current is oude next
	current = next;
	// nieuwe next is oude nextnext
	next = nextnext;
	// niewe nextnext is ?
	var nextnext_idx = $j.inArray(nextnext.toString(),img_ids);
	if (nextnext_idx > -1)
	{
		if(nextnext_idx < img_ids.length-1)
		{
			nextnext = img_ids[(nextnext_idx + 1)];
		}
		else
		{
			nextnext = img_ids[0];
		}
	}
}

function gallery_nextnext()
{
	gallery_next();
	gallery_next();
}

/**
 * Bij het switchen moet het volgende geregeld worden:
 	* thumbs img src aanpassen
	* detail img src aanpassen
 */
function gallery_update()
{
	/* detail img */
	gallery_load_img('#gallery_img',images[current]);
	
	/* thumbs img */
	gallery_load_thumb('#gallery_thumb .gallery_item.act_prev',thumbs[previous]);
	gallery_load_thumb('#gallery_thumb #gallery_current',thumbs[current]);
	gallery_load_thumb('#gallery_thumb .gallery_item.act_next',thumbs[next]);
	gallery_load_thumb('#gallery_thumb .gallery_item.act_nextnext',thumbs[nextnext]);
}

function gallery_load_thumb(selector,url)
{
	$j('#gallery '+selector+' img')
		.fadeOut('slow',function(){
			$j(this).removeAttr('height').attr('width',gallery_thumbs_max_width);
			$j(this).attr('src',url);
		
			$j('#gallery '+selector).onImagesLoad({
				itemCallback: jScaleWrapper_thumbs
			});
		});
}

function gallery_load_img(selector,url)
{
	$j('#gallery '+selector+' img')
		.fadeOut('slow',function(){
			$j(this).removeAttr('height').attr('width',gallery_imgs_max_width);
			$j(this).attr('src',url);
				
			$j('#gallery '+selector).onImagesLoad({
				itemCallback: jScaleWrapper_imgs
			});
		});
}

function jScaleWrapper_thumbs(obj)
{
	$j(obj).find('img').jScale({h:gallery_thumbs_max_height},function(){ gallery_img_reveal(obj,gallery_thumbs_max_height); });
}

function jScaleWrapper_imgs(obj)
{
	$j(obj).find('img').jScale({h:gallery_imgs_max_height},function(){ gallery_img_reveal(obj,gallery_imgs_max_height); });
}

function gallery_img_reveal(obj,max_height)
{
	// verticaal centreren
	var img_height = $j(obj).find('img').height();
	var margin_top = (max_height-img_height)/2; 
	
	// HACK voor ie6 en ie7
	if ($j.browser.msie != false && ($j.browser.version < 8)) margin_top = margin_top -2;
	
	// img ontplooien
	$j(obj).find('img').css('margin-top',margin_top).fadeIn('slow');
}

function gallery_slideshow()
{
    if(!gallery_stop_slideshow)
    {
        gallery_next();
        gallery_update();
        setTimeout('gallery_slideshow();', (gallery_slideshow_timer * 1000));
    }
}