/*  
JAVASCRIPT IMAGE GALLERY W/ mootools
Description: A easy, non destructive javascript image gala.
Version: 1.1
Author: Devin Ross
Author URI: http://tutorialdog.com
*/

/*
Release notes:
	1.1 - Adds loading animation, and properly fades in images when fully loaded
	1.1.1 - Fixes displaying description, Fades out current image, Works with Mootools 1.2
*/


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

		onload="initLightbox();";
		
		// CHANGE BELOW THIS !!
		
		var slides01 = 6;		// NUMBER OF SLIDES IN PORTFOIO SLIDESHOW, CHANGE ACCORDINGLY
		var slides02 = 3;		// NUMBER OF SLIDES IN ILLUSTRATION SLIDESHOW, CHANGE ACCORDINGLY
		var slides03 = 4;		// NUMBER OF SLIDES IN HTML SLIDESHOW, CHANGE ACCORDINGLY
		
		// CHANGE ABOVE THIS !!
		
		
		
		var pos01 = 0;
		var pos02 = 0;
		var pos03 = 0;

		var offset01 = 669;	// HOW MUCH TO SLIDE WITH EACH CLICK
		var offset02 = 608;	// HOW MUCH TO SLIDE WITH EACH CLICK
		var offset03 = 608;	// HOW MUCH TO SLIDE WITH EACH CLICK
		var currentslide01 = 1;	// CURRENT SLIDE IS THE FIRST SLIDE
		var currentslide02 = 1;	// CURRENT SLIDE IS THE FIRST SLIDE
		var currentslide03 = 1;	// CURRENT SLIDE IS THE FIRST SLIDE
		var inspector = $('fullimg');	// WHERE THE LARGE IMAGES WILL BE PLACE	
		var fx = new Fx.Morph(inspector, {duration: 300, transition: Fx.Transitions.Sine.easeOut});
 		var fx2 = new Fx.Morph(inspector, {duration: 200, transition: Fx.Transitions.Sine.easeOut});

		
		/* THUMBNAIL IMAGE SCROLL */
		var imgscroll01 = new Fx.Scroll('wrapper01', {
   			offset: {'x': 0, 'y': 0},
   			transition: Fx.Transitions.Cubic.easeOut	// HOW THE SCROLLER SCROLLS
		}).toLeft();

	
		/* EVENTS - WHEN AN ARROW IS CLICKED THE THUMBNAILS SCROLL */
		$('moveleft01').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide01 == 1) return;
			currentslide01--;					// CURRENT SLIDE IS ONE LESS
			pos01 += -(offset01);				// CHANGE SCROLL POSITION
			imgscroll01.start(pos01);			// SCROLL TO NEW POSITION
		});
		$('moveright01').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide01 >= slides01) return;
			currentslide01++;
			pos01 += offset01;
			imgscroll01.start(pos01);
		});



		/* THUMBNAIL IMAGE SCROLL */
		var imgscroll02 = new Fx.Scroll('wrapper02', {
   			offset: {'x': 0, 'y': 0},
   			transition: Fx.Transitions.Cubic.easeOut	// HOW THE SCROLLER SCROLLS
		}).toLeft();

	
		/* EVENTS - WHEN AN ARROW IS CLICKED THE THUMBNAILS SCROLL */
		$('moveleft02').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide02 == 1) return;
			currentslide02--;					// CURRENT SLIDE IS ONE LESS
			pos02 += -(offset02);				// CHANGE SCROLL POSITION
			imgscroll02.start(pos02);			// SCROLL TO NEW POSITION
		});
		$('moveright02').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide02 >= slides02) return;
			currentslide02++;
			pos02 += offset02;
			imgscroll02.start(pos02);
		});
		
		
		/* THUMBNAIL IMAGE SCROLL */
		var imgscroll03 = new Fx.Scroll('wrapper03', {
   			offset: {'x': 0, 'y': 0},
   			transition: Fx.Transitions.Cubic.easeOut	// HOW THE SCROLLER SCROLLS
		}).toLeft();

	
		/* EVENTS - WHEN AN ARROW IS CLICKED THE THUMBNAILS SCROLL */
		$('moveleft03').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide03 == 1) return;
			currentslide03--;					// CURRENT SLIDE IS ONE LESS
			pos03 += -(offset03);				// CHANGE SCROLL POSITION
			imgscroll03.start(pos03);			// SCROLL TO NEW POSITION
		});
		$('moveright03').addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide03 >= slides03) return;
			currentslide03++;
			pos03 += offset03;
			imgscroll03.start(pos03);
		});
		
		
});


function ShowDialogBox(file)
{
	var Message = '';
	
	/* YUI Starts */

	document.getElementById("imgdisplay").src = 'images/spacer.gif';
	document.getElementById("imagedialog").style.display = '';
	document.getElementById("imgdisplay").src = file;
	
	//alert(document.getElementById("imgdisplay").src);
	
	//var myDialog = new YAHOO.widget.Dialog("myDialog");
	
// Instantiate the Dialog
	mySimpleDialog = new YAHOO.widget.SimpleDialog("imagedialog", { 
		width: "525px", 
		effect:{effect:YAHOO.widget.ContainerEffect.FADE,
				duration:0.25}, 
		fixedcenter:true,
		visible:false,
		draggable:false,
		underlay: "shadow",
		modal:true });

	mySimpleDialog.render(document.body);

	mySimpleDialog.show();
}