/** 
 * N2 library - Gui  
 * (dependant on YUI 2.x)
 * 
 * Copyright (c) north2. All rights reserved.
 * Code licensed under the BSD Licence
 *
 * @author: Alan Kralj (alan@north2.net)
 * @version: 1.0.1 (05.06.11)
 */


if (typeof(N2) === 'undefined')
	var N2 = {};

if (!console) {
    var console = {log: function(){}};
}

N2.gui = {
	initGallery: function(id, context) {
		var thumbs;
		var gallery = {
			images: [],
			index: 0,
			id: id
		};
		var next;
		var previous;
		var indicator;
		
		context = (context) ? context : this; 
		
		if ((!id && id!==0) || !document.getElementById(id)) {
			return false;
		}
		
		indicator = N2.util.createElement('div', {className: 'gallery-indicator'});
		YAHOO.util.Dom.setStyle(indicator, 'display', 'none');
		document.getElementById(id).appendChild(indicator);
		gallery.indicator = indicator;
		
		thumbs = YAHOO.util.Dom.getElementsByClassName('gallery-thumb', 'a', id);
		for (var t=0; t<thumbs.length; t++) {
			gallery.images[t] = thumbs[t].getAttribute('img');

			if (YAHOO.util.Dom.hasClass(thumbs[t], 'active')) {
				gallery.index = t;
			}
		}
		
		context.gallery = gallery;
		next = YAHOO.util.Dom.getElementsByClassName('gallery-next', 'a', id)[0];
		previous = YAHOO.util.Dom.getElementsByClassName('gallery-previous', 'a', id)[0];
		
		if (next) {
			YAHOO.util.Event.addListener(next, 'click', this.nextGalleryImage, context);	
		}
		if (previous) {
			YAHOO.util.Event.addListener(previous, 'click', this.previousGalleryImage, context);	
		}

		YAHOO.util.Event.addListener(thumbs, 'click', this.showGalleryImage, context);
	},
	
	showGalleryImage: function(e, context) {
		var index;
		var gallery = context.gallery;
		var url; 
		var container;
		var img;
		var self = this;
		var newImg;

		var show = function() {
			var anim = [];
			var thumbs = YAHOO.util.Dom.getElementsByClassName('gallery-thumb', 'a', gallery.id);
			
			if (!newImg.complete || newImg.complete==null) {
				YAHOO.lang.later(250, this, show);
				
				return;
			}
			
			YAHOO.util.Dom.setStyle(gallery.indicator, 'display', 'none');
			
			YAHOO.util.Dom.removeClass(thumbs, 'active');
			YAHOO.util.Dom.addClass(thumbs[gallery.index], 'active');
			YAHOO.util.Dom.addClass(img, 'gallery-oldimg');
			YAHOO.util.Dom.setStyle(img, 'position', 'absolute');
			YAHOO.util.Dom.setStyle(newImg, 'position', 'static');
			
			anim[0] = new YAHOO.util.Anim(img, {opacity: {to: 0}}, .35);
			anim[1] = new YAHOO.util.Anim(newImg, {opacity: {to: 1}}, .7);
			
			anim[0].onComplete.subscribe(function(){
				img.parentNode.removeChild(img);		
			});
			
			anim[1].onComplete.subscribe(function(){
				var previous = YAHOO.util.Dom.getElementsByClassName('gallery-previous', 'a', gallery.id)[0];
				var next = YAHOO.util.Dom.getElementsByClassName('gallery-next', 'a', gallery.id)[0];
				
				if (gallery.index==0) {
					YAHOO.util.Dom.addClass(previous, 'hidden');
				}
				else if (gallery.index==gallery.images.length-1) {
					YAHOO.util.Dom.addClass(next, 'hidden');
				}
				else {
					YAHOO.util.Dom.removeClass(next, 'hidden');
					YAHOO.util.Dom.removeClass(previous, 'hidden');
				}
			});
			
			anim[0].animate();
			anim[1].animate();
		}
		
		YAHOO.util.Event.preventDefault(e);
		
		if (this.getAttribute && this.getAttribute('img')) {
			url = this.getAttribute('img');

			for (index = 0; index < gallery.images.length; index++) {
				if (gallery.images[index] == url) {
					break;
				}
			}
			
			if (index >= gallery.images.length) {
				return false;
			}
			
			gallery.index = index;
		}
		else {
			url = gallery.images[gallery.index];
		}
		
		container = YAHOO.util.Dom.getElementsByClassName('gallery-image', '*', gallery.id)[0];
		img = container.getElementsByTagName('img')[0];
		
		YAHOO.util.Dom.setStyle(gallery.indicator, 'display', 'block');
		
		newImg = N2.util.createElement('img', {src: url, className: 'gallery-newimg'});
		YAHOO.util.Dom.setStyle(newImg, 'opacity', '0');
		YAHOO.util.Dom.setStyle(newImg, 'position', 'absolute');
		YAHOO.util.Dom.insertBefore(newImg, img);
		
		show();
	},
	
	nextGalleryImage: function(e, context) {
		var gallery = context.gallery;
		
		gallery.index++;
		gallery.index = (gallery.index>=gallery.images.length) ? 0 : gallery.index;
		
		N2.gui.showGalleryImage(e, context);
	},
	
	previousGalleryImage: function(e, context) {
		var gallery = context.gallery;
		
		gallery.index--;
		gallery.index = (gallery.index<0) ? gallery.images.length-1 : gallery.index;
		
		N2.gui.showGalleryImage(e, context);
	}
}