// flash detectiom
function getFlashVersion(){
  // ie
  try {
    try {
      // avoid fp6 minor version lookup issues
      // see: http://blog.deconcept.com/2006/01/11/getvariable-setvariable-crash-internet-explorer-flash-6/
      var axo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash.6');
      try { axo.AllowScriptAccess = 'always'; }
      catch(e) { return '6,0,0'; }
    } catch(e) {}
    return new ActiveXObject('ShockwaveFlash.ShockwaveFlash').GetVariable('$version').replace(/\D+/g, ',').match(/^,?(.+),?$/)[1];
  // other browsers
  } catch(e) {
    try {
      if(navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin){
        return (navigator.plugins["Shockwave Flash 2.0"] || navigator.plugins["Shockwave Flash"]).description.replace(/\D+/g, ",").match(/^,?(.+),?$/)[1];
      }
    } catch(e) {}
  }
  return '0,0,0';
}


/*******************************************************************************

		Viewport

*******************************************************************************/

$('document').ready( function()
{

	$('#viewport').tileSlide({
		slides : 'slides',
		width : 600,
		height : 365,
		animationSpeed : 800,
		animationType : 'easeOutQuint',
		
		onNextSlideStart : function(){
//			
			//console.log('onNextSlideStart');
			if ( $('#show_info').hasClass('selected') )
				$('#show_info').trigger( 'click' );
			
			moveUp();
			setProjectData('first');
		},
		onNextSlideEnd : function(){
			//mayScroll(); 
			false;
		},
		onPrevSlideStart : function(){
//			console.log('onPrevSlideStart');
			if ( $('#show_info').hasClass('selected') )
				$('#show_info').trigger( 'click' );
			
			moveDown();
			setProjectData('last');
		},
		onPrevSlideEnd : function(){
			//mayScroll();
			false;
		}
	});
	
	// Update the preview panel (ofcourse)
	updatePreviewPanel();

	// visual enhancements
	$('#slide-up,#slide-down').hover(
	function(){
		$(this).stop()
			.animate({opacity: 1});
	},
	function(){
		$(this).stop()
			.animate({opacity: 0.5});
	});
	

	$('#slide-left,#slide-right').css( 'opacity', 0 );
	$('#slide-left,#slide-right').hover(
	function(){
		if ( $('#viewport > #slides > li').length == 1 && $('#viewport > #slides > li:first > ul > li').length == 1 )
			return;
			
		$(this).stop()
			.animate({opacity: 1});
	},
	function(){
		$(this).stop()
			.animate({opacity: 0});
	});	
	
	//$('#viewmore').show();
	
	$('#show_info').click(function()
	{
		// Show and hide correct buttons
		var hidden = $('.btn-showhide:hidden');
		$('.btn-showhide:visible').hide();
		hidden.show();
		
		if( $(this).hasClass('selected') )
		{
			$(this).removeClass('selected').blur();
			$('#viewmore').stop().animate({
					top: "330px"
					},500);
			$('#viewmore div').addClass('down');

		}
		else
		{
			$(this).addClass('selected').blur();
			$('#viewmore').stop().show().animate({
					top: "0px"
					},500);
			$('#viewmore div').removeClass('down');

		}
		
		return false;
	});
	
	// Preset info
	$('#viewmore').empty()
		.html( $('#slides li.current-slide .project_data').html() );

});


/*******************************************************************************

	Preview panel

*******************************************************************************/

// Set fxc and fxi in global scope
var fxc, fxi, oc;
		
function updatePreviewPanel()
{
	var height = 61;
	$('#preview-panel').empty();
	
	$('#preview-panel').css({
		listStyleType : 'none',
		margin : '0px',
		padding : '0px'				
	});
	
	var last = false;
	
	// make copy of first image of all slides
	$('#slides > li').each(function(i)
	{
		// Get name
		var name	= $(this).attr('title');
		var id		= $(this).attr('id');
		
		if( i % 2 )
		{
			var nw = $('<li><div class="project-panel"/><div class="project-name-even"/></li>');
			nw.find(".project-name-even").append('<p>'+name+'</p>');
			nw.find(".project-name-even").attr('rel', id );
		}
		else
		{
			var nw = $('<li><div class="project-panel"/><div class="project-name-odd"/></li>');
			nw.find(".project-name-odd").append('<p>'+name+'</p>');
			nw.find(".project-name-odd").attr('rel', id );
		}
		//var imsrc = 'url(' + $(this).find('li:first img').attr('src') + ')';
		var imsrc = 'url(' + $(this).attr('rel') + ')';
		if ( imsrc == 'url()' ) imsrc = 'url('+tplpath+'/img/geen_afbeelding.gif)';
		nw.height( height ).find('.project-panel').css({
			backgroundImage:  imsrc,
			backgroundPosition: "30% 35%"
		});
		
		
		if( $(this).hasClass( 'current-slide' ) )
		{
			last = nw ;
		}
		else
		{	
			$('#preview-panel').append( nw );
		}
	});
	
	if( last != 'undefined' )
		$('#preview-panel').append( last );
}


// 
function moveUp( callback )
{	
	if ( ! callback ) {
		callback = function(){};
		var sp = 300;
	} else {
		var sp = 150;
	}
	
	// Delete the first item if it's hidden
	$('.leftpane > #preview-panel > li:first:hidden').appendTo( '.leftpane > #preview-panel' );
	
	// Slide open the last project and slide down the first
	$('.leftpane > #preview-panel > li:last').slideDown( sp );
	$('.leftpane > #preview-panel > li:first').slideUp( sp, function() {
		$('.leftpane > #preview-panel').append( $(this) );
		callback();
		setTimeout("loadImages()", 1000);
	});
}

function moveUpMultiple( subject )
{
	// Get index of the target
	var index = $('#preview-panel > li').index( subject );
	
	// Get the number of items
	var itemcount = index + 1;
	
	// Delete the first item if it's hidden
	$('.leftpane > #preview-panel > li:first:hidden').appendTo( '.leftpane > #preview-panel' );
	
	// Slide up the correct number of items
	$('.leftpane > #preview-panel > li:lt('+itemcount+')').each( function()
	{
		// Slide open the last project and close the first
		$(this).slideUp( 0, function()
		{
			$('.leftpane > #preview-panel > li:last').show();
			$('.leftpane > #preview-panel').append( $(this) );
			loadImages();
		});
	});
}

/**
 * @desc   When a certain project should be shown load the images.
 *         We are only loading images on demand.
 * @param  Load the images..
 * @return ...
 */
function loadImages()
{
	// Each image has a special attribute to indicatie that is has been loaded (or not...).
	$(".current-slide").find("img").each(function()
	{
		$(this).attr("src", $(this).attr("rel"));
		$(this).attr("loaded", "1");
	});
}

function moveDown( callback )
{
	// Check if the callback function isset properly
	if ( ! callback ) callback = function(){};
	
	// Set the last item as first
	$('.leftpane > #preview-panel > li:last').prependTo( $('.leftpane > #preview-panel') );
	
	// Slide the first item down and execute the callback
	// when completed while the last item is being slideUp
	$('.leftpane > #preview-panel > li:last').slideUp( 300 , function(){loadImages();});
	$('.leftpane > #preview-panel > li:first').slideDown( 300, function() {
		callback();
	});
	
	setTimeout("loadImages()", 1000);
}

function setProjectData( dir )
{
	setTimeout(function()
	{
		// Preset info
		$('#viewmore').empty()
			.html( $('#slides li.current-slide .project_data').html() );
	}, 1000);
}

// todo: fix te snel naar left of right button laat em niet zien
function mayScroll()
{
	return;
	if( $('.current-slide ul li').length > 1 )
	{
		$('#slide-left,#slide-right').show();
	}
	else
	{
		$('#slide-left,#slide-right').hide();
	}
}

// Functie om het juiste project bij de juiste
// slide te tonen.
$( function()
{
	// Update the project and the preview when a certain
	// project is clicked in the preview panel
	$( '#preview-panel > li' ).live('click', function()
	{
		// Check the lock
		if ( lock ) return;
		
		if ( $('#show_info').hasClass('selected') )
			$('#show_info').trigger( 'click' );
		
		// Set lock to true
		lock = true;
		
		// Set effect counter
		fxc = 0;
		
		// Get index of the clicked preview
		fxi = $('#preview-panel > li').index( $(this) );
		
		// Get the related project
		var p = $('div[rel]', this).attr( 'rel' );
		
		// Get the active project
		var ap = $('.current-slide').attr( 'id' );
		
		// Stop further functioning if the project clicked
		// is the same as the active project
		if ( p == ap ) { lock=false; return; }
		
		// Get the corresponding project index of
		// the clicked preview
		var pi = $('#slides > li').index( $('#'+p) );
		
		// Height of a slide
		var sh = -365;
		
		// Fix IE bug
		if ( /MSIE/.test(navigator.userAgent) ) sh -= 5;
		
		// Math the offset top
		var t = (pi * sh);
		
		// deselect current-(sub)slides
		$('.current-slide').removeClass( 'current-slide' );
		$('.current-subslide').removeClass( 'current-subslide' );
		
		// Set the correct project to current
		$('#'+p).addClass( 'current-slide' );
		$('#'+p+' > ul > li:first').addClass( 'current-subslide' );
		
		// Scroll to the correct project
		$('#slides').animate( {top: t+'px'}, 800, 'easeOutQuint', function() {
			// Set lock to false
			lock = false;
		});
		
		// Get project data
		var html = $('#'+p+' .project_data').html();
		
		// Empty old project data and set new data
		$('#viewmore')
			.empty()
			.html( html );
		
		// Update the preview panel
		moveUpMultiple( $(this) );
	});
	
	
	// Hover effect
	$('#preview-panel > li').live( 'mouseover', function()
	{
		// Get old color first
		oc = $('div[rel]', this).css( 'color' );
		
		// Set new background color
		$('div[rel]', this).css( 'color', '#5D5C5D' );
	});
	$('#preview-panel > li').live( 'mouseout', function()
	{
		// Set back the old background color
		$('div[rel]', this).css( 'color', oc );
	});
	$('#preview-panel > li').live( 'mouseup', function()
	{
		if ( lock ) return;
		$(this).trigger( 'mouseout' );
	});
	
	
	// Set function to repeat the move
	var repeater = function()
	{
		// Check if the counter hasn't reached the same
		// value as the effect max
		if ( fxc < fxi ) moveUp( repeater );
		/*else {
			sIFR.replace( _ms, {
				selector: 'p.getsifred span',
				transparent: true,
				css: [ '.sIFR-root {color: #00EC00; font-size: 18px; text-transform: uppercase; }' ],
				ratios: [6, 1.49, 8, 1.5, 9, 1.44, 12, 1.45, 17, 1.42, 18, 1.39, 23, 1.4, 24, 1.37, 30, 1.38, 39, 1.37, 41, 1.36, 42, 1.37, 44, 1.36, 47, 1.37, 54, 1.36, 56, 1.35, 57, 1.36, 59, 1.35, 60, 1.36, 62, 1.35, 63, 1.36, 65, 1.35, 66, 1.36, 103, 1.35, 104, 1.34, 106, 1.35, 107, 1.34, 108, 1.35, 110, 1.34, 111, 1.35, 113, 1.34, 114, 1.35, 116, 1.34, 117, 1.35, 119, 1.34, 120, 1.35, 122, 1.34, 123, 1.35, 1.34]
			});
			sIFR.replace( _ms, {
				selector: 'p.getsifred font',
				transparent: true,
				css: [ '.sIFR-root {color: #FFFFFF; font-size: 18px; text-transform: uppercase; }' ],
				ratios: [6, 1.49, 8, 1.5, 9, 1.44, 12, 1.45, 17, 1.42, 18, 1.39, 23, 1.4, 24, 1.37, 30, 1.38, 39, 1.37, 41, 1.36, 42, 1.37, 44, 1.36, 47, 1.37, 54, 1.36, 56, 1.35, 57, 1.36, 59, 1.35, 60, 1.36, 62, 1.35, 63, 1.36, 65, 1.35, 66, 1.36, 103, 1.35, 104, 1.34, 106, 1.35, 107, 1.34, 108, 1.35, 110, 1.34, 111, 1.35, 113, 1.34, 114, 1.35, 116, 1.34, 117, 1.35, 119, 1.34, 120, 1.35, 122, 1.34, 123, 1.35, 1.34]
			});
		}*/
		
		// Increment fxc
		fxc++;
	}
});

/*******************************************************************************

	Tabs

*******************************************************************************/
$('document').ready( function()
{
	$('.tab_header').click( function()
	{
		// Store this
		var t = this;
		
		// Stop any on the tabs pane animations
		//$(this).parent().stop();		
		
		// Set new height
		var nh = $(window).height()-40;
		
		// Set height of tab_content
		$('.tab_content').css( 'height', nh+'px' );
		
		// Close pane or not?
		if ( $(this).hasClass('selected') )
		{
			// Hide the selected class
			$(this).removeClass('selected');
			
			// Hide the tabs pane
			$(this).css('left', '0');
			$('.menu-tab').animate({left: '-273px'});
			$('#tabs').animate({width: '0'}, false, function()
			{
				$('#tabs').css('background','transparent');
				$('.tab_header').css('position', 'relative');
			});
		}
		else
		{
			// Remove all other selected tabs
			$('.tab_header').removeClass('selected');
			
			// Add the selected class
			$(this).addClass('selected');
			
			// Do the correct animations
			$('.menu-tab').animate({left: '0px'});
			$('#tabs').css('background','#070707');
			$('#tabs').animate({width: '273px'}, function()
			{
				//$('.tab_header').css('position', 'relative');
			});
		}
	});
	
	$('.close').live( 'click', function() {
		$('.tab_header').trigger( 'click' );
		return false;
	});
});
			
			
/**********************************
	
	GET ELEMENTS BY CLASSNAME
	
***********************************/
document.getElementsByClassName=function(a,b){if(typeof b=='undefined')b=this.getElementsByTagName("body")[0];var c=new Array();var d=new RegExp('\\b'+a+'\\b');var e=b.getElementsByTagName("*");for(var i=0;i<e.length;i++)if(d.test(e[i].className))c.push(e[i]);return c};

/**********************************

	PNG Fix

**********************************/

$( function() {
	$('#viewmore').pngfix();
});
