window.addEvent('domready', function() {
	if($('gallery')) {

		var imageSize = 200;			// in pixels
		var thumbSize = 50;				// in pixels
		var borderSize = 2;				// in pixels
		var alignGallery = 'center';	// left, right, center
		
		var galleryList = $('images');
		var galleryImages = $('images').getElements('img');
		var galleryMask = $('mask');
		var imageWrap = $$('.img');
		var imageMagnify = $$('.magnify');
		var thumbList = $('thumbs');
		var thumbWrap = $('thumbwrap');
		var captionList = $('captions');
		var captionWrap = $('captionwrap');
		var slide = new Fx.Morph(galleryList, {duration: '1000', transition: Fx.Transitions.Sine.easeOut});
		var caption = new Fx.Morph(captionList, {duration: '1000', transition: Fx.Transitions.Sine.easeOut});
		
		function createGallery() {
			$each(imageWrap, function(_wrap) {
				_wrap.setStyle('width', imageSize);	
			});
			$each(galleryImages, function(_image) {
				var imgSize = _image.getSize();
				var imgHeight = imgSize.y;
				var imgWidth = imgSize.x;
				if (imgWidth > imgHeight) {
					_image.setStyle('height', imageSize);
				} else {
					_image.setStyle('width', imageSize);
				}
				var imgTitle = _image.getProperty('alt');
				var imgSrc = _image.getProperty('src');
				var imgCaption = new Element('div', {'html': imgTitle}).inject(captionList);
				var imgLink = new Element('a', {'href': imgSrc, 'rel': 'lyteshow[seura]', 'title': imgTitle});
				var imageMagnify = new Element('div', {'class': 'magnify'}).inject(imgLink);
				imgLink.wraps(_image);
				imgCaption.setStyle('float', 'left');
				imgCaption.setStyle('width', imageSize);
			});
			galleryList.setStyle('width', (galleryImages.length * imageSize));
			galleryMask.setStyle('width', imageSize);
			galleryMask.setStyle('height', imageSize);
			galleryMask.setStyle('border-width', borderSize);
			galleryMask.setStyle('overflow', 'hidden');
			captionList.setStyle('width', (galleryImages.length * imageSize));
			captionWrap.setStyle('width', imageSize);
			captionWrap.setStyle('padding-top', (imageSize +10));
			if(alignGallery == 'center') {
				galleryMask.setStyle('margin-left', -(imageSize / 2));
				captionWrap.setStyle('margin-left', -(imageSize / 2));
			}
			else if (alignGallery == 'left') {
				galleryMask.setStyle('left', 0);
				captionWrap.setStyle('left', 0);
			}
		}
		
		function createThumbs() {
			$each(galleryImages, function(_image, index) {
				var thumbLi = new Element('li').inject(thumbList);
				var thumbImg = new Element('img', {'src': _image.getProperty('src'), 'width': thumbSize, 'height': thumbSize}).inject(thumbLi);
				thumbImg.setStyle('border-width', borderSize);
				thumbImg.addEvent('click', function() {
					caption.start({
						'left': -(index * imageSize)
					});
					slide.start({
						'left': -(index * imageSize)
					});
				});
			});
			thumbList.setStyle('width', (galleryImages.length * (thumbSize + (borderSize *2))));
			thumbWrap.setStyle('height', (thumbSize +25));
			thumbWrap.setStyle('padding-top', (imageSize +50));
		}
		
		createGallery();
		createThumbs();
	}
});