﻿var photoId = 1;
var photoDir = "Image/Gallery/Gallery";
var photoPrefix = "";
var photoNavCount = 3;
var photoEnlarge = [];

/*--------------------------------------------------------------------------*/

var Slideshow = Class.create();

Slideshow.prototype = {
	initialize: function()
	{
		this.photoWidth = 280;
		this.photoHeight = 167;
		this.photo = "Image";
		this.loader = "Loading";
	},
	setNewPhotoParams: function()
	{
		Element.setSrc(this.photo, photoDir + photoPrefix + photoId + ".jpg");
		Element.setWidth(this.photo, this.photoWidth, {queue: 'front'});
		Element.setHeight(this.photo, this.photoHeight);
	},
	showPhoto: function()
	{
		new Effect.Fade(this.loader, {delay: 0.5, duration: 0.3});
		new Effect.Appear(this.photo, {duration: 0.5, queue: 'end'});
	},
	initSwap: function()
	{
		Element.show(this.loader);
		Element.hide(this.photo);
		this.setNewPhotoParams();
	}
}

/*--------------------------------------------------------------------------*/

var myrules = {
	'#Image' : function(element)
	{
		element.onload = function()
		{
			var myPhoto = new Slideshow();
			myPhoto.showPhoto();
		}
	},
	'#gallerynav1' : function(element)
	{
		element.onclick = function()
		{
			photoId = 1;
            init();
            return false;
		}
	},
	'#gallerynav2' : function(element)
	{
		element.onclick = function()
		{
			photoId = 2;
            init();
            return false;
		}
	},
	'#gallerynav3' : function(element)
	{
		element.onclick = function()
		{
			photoId = 3;
            init();
            return false;
		}
	},
    '#enlarge' : function(element)
	{
		element.onclick = function()
		{
			openWindow('Popup/Gallery.asp?id=Gallery/Gallery' + photoPrefix + photoId + '_large.jpg', 'gallery' + photoId, 440, 280);
            return false;
		}
	},
	a : function(element)
	{
		element.onfocus = function()
		{
			this.blur();
		}
	}
};

function setGalleryNav()
{
    for (var i=1; i<=photoNavCount; i++) $("gallerynav" + i).className = "";
    $("gallerynav" + photoId).className = "active";

    $("enlarge").style.display = (photoEnlarge[photoId-1]) ? "block" : "none";
}

Behaviour.addLoadEvent(init);
Behaviour.apply();
function init()
{
	var myPhoto = new Slideshow();
	myPhoto.initSwap();
	setGalleryNav();
}