var myPlay;
myPlay = "play";
var myTimer;
function makeGallery(){
	var size = $('picture').getSize();
	//alert(size.y);
	var pictureHeight =$ ('pictureinner').getStyle('height');
	//alert(pictureHeight);
	$('myImage').setStyles({height: size.y + 'px' });
	
		window.addEvent('keydown', function(event){

			if (event.key == 'right') nextProduct(); 
			if (event.key == 'left') prevProduct(); 
			
		});
		
		$('playbutton').addEvent('click', function(){
			if(strpbrk($('myplaybutton').getProperty('src'), "pause")){
				$('myplaybutton').src = "/images/play.png";
				myPlay = "stop";
				$clear(myTimer); 
			} else {
				$('myplaybutton').src = "/images/pause.png";
				myPlay = "play";
				myTimer = nextProduct.delay(3500); 
			}
		});
		
		var currentImage = $('myImage').getProperty('src');
		if((!currentImage || strpbrk($('myImage').getProperty('src'), "blank")) && Images){
			changeBGPic(Images[0]);
		}

		$('loading').setStyle('visibility', 'visible');
	    ['slider', 'arrow-left', 'arrow-right', 'list-container', 'toggleup', 'playbutton', 'mainnavigation', 'logo'].each(function(el) {
	    	$(el).fade('hide');

	    });
	
	$('toggledown').addEvent('click', function(){
		$('gallery').fade.delay(400, $('gallery'), 'out', {'duration': '400'});
		$('mainnavigation').fade.delay(400, $('mainnavigation'), 'in', {'duration': '400'});
		$('list-container').fade.delay(400, $('list-container'), 'out', {'duration': '400'});
		$('playbutton').fade.delay(400, $('playbutton'), 'in', {'duration': '400'});
		$('logo').fade.delay(400, $('logo'), 'in', {'duration': '400'});
		$('toggleup').fade.delay(400, $('toggleup'), 'in', {'duration': '400'});

	});
		
	$('toggleup').addEvent('click', function(){
		$('gallery').fade.delay(400, $('gallery'), 'in', {'duration': '400'});
		$('mainnavigation').fade.delay(400, $('mainnavigation'), 'out', {'duration': '400'});
		$('playbutton').fade.delay(400, $('playbutton'), 'out', {'duration': '400'});
		$('list-container').fade.delay(400, $('list-container'), 'in', {'duration': '400'});
		$('logo').fade.delay(400, $('logo'), 'out', {'duration': '400'});
		$('toggleup').fade.delay(400, $('toggleup'), 'out', {'duration': '400'});
	});
	
	$('slideupimage').addEvent('click', function(){
		$('gallery').fade.delay(400, $('gallery'), 'in', {'duration': '400'});
		$('mainnavigation').fade.delay(400, $('mainnavigation'), 'out', {'duration': '400'});
		$('list-container').fade.delay(400, $('list-container'), 'in', {'duration': '400'});
		$('playbutton').fade.delay(400, $('playbutton'), 'out', {'duration': '400'});
		$('logo').fade.delay(400, $('logo'), 'out', {'duration': '400'});
		$('toggleup').fade.delay(400, $('toggleup'), 'out', {'duration': '400'});
	});
	
	$('imagedescription').addEvent('click', function(){
		$('gallery').fade.delay(400, $('gallery'), 'in', {'duration': '400'});
		$('mainnavigation').fade.delay(400, $('mainnavigation'), 'out', {'duration': '400'});
		$('playbutton').fade.delay(400, $('playbutton'), 'out', {'duration': '400'});
		$('list-container').fade.delay(400, $('list-container'), 'in', {'duration': '400'});
		$('logo').fade.delay(400, $('logo'), 'out', {'duration': '400'});
		$('toggleup').fade.delay(400, $('toggleup'), 'out', {'duration': '400'});
	});
	

		$('gallery').addEvent('mouseleave', function(){
			$('gallery').fade.delay(400, $('gallery'), 'out', {'duration': '400'});
			$('mainnavigation').fade.delay(400, $('mainnavigation'), 'in', {'duration': '400'});
			$('playbutton').fade.delay(400, $('playbutton'), 'in', {'duration': '400'});
			$('logo').fade.delay(400, $('logo'), 'in', {'duration': '400'});
			$('list-container').fade.delay(400, $('list-container'), 'out', {'duration': '400'});
			$('toggleup').fade.delay(400, $('toggleup'), 'in', {'duration': '400'});
		});



	if($('toggledown').getStyle('visibility') != 'visible'){
		$('toggleup').fade('show');
	}

	var carousel = new vCarousel($('list'), {
    	'slider': {
        	'element': $('slider'),
        	'knob': $('slider-knob'),
        	'options': {
            	'offset': 5
             }
        },
       	'title': $('title'),
        onProgress: function(counter, length) { 
            $('loading').set('html', counter + ' <span style="color: #404040">of<\/span> ' + length);

        },
        onPreload: function() { 
            $('loading').fade('out', {'duration': '300'}); 

        },
        onComplete: function() {
        	$$('.arrow').each(function(arrow) { arrow.fade.delay(500, arrow, 'in', {'duration': 'long'}); });
            $('slider').fade.delay(600, $('slider'), 'in', {'duration': 'long'});
			$('list-container').fade.delay(400, $('list-container'), 'in', {'duration': 'long'});
        }
	});
	

}


window.addEvent('domready', function() {
	makeGallery();

});
window.addEvent('resize', function() {

	makeGallery();
	$('mainnavigation').fade.delay(400, $('mainnavigation'), 'in', {'duration': '400'});
	$('playbutton').fade.delay(400, $('playbutton'), 'in', {'duration': '400'});
	$('list-container').fade.delay(400, $('list-container'), 'out', {'duration': '400'});

});