/**
 * Dynamic image gallery
 * 
 * 
 * 
 * @author Joe Bushi <joeb@kollektiviti.com>
 */


(function($){
	
	// private
	var gallery = {
		defaults: {
			containers: {
				caption:   '#caption',   // caption text ID
				close:   '#close',       // close link ID
				current:   '#current',       // current image text ID
				gallery: '#gallery',     // large image container ID
				nav:     '#nav-gallery', // next/prev link navigation link container 
				next:    '.next',        // next/prev links, must be class
				prev:    '.prev',
				placeholder:    '.placeholder', // placeholder for hidden navigation
				target:  '#property',    // where to insert the gallery
				thumbs:  '#thumbs',      // thumbnail container
				total:  '#total'      // total number of images container
			},
			text: {
				next: 'next',
				of: 'of',
				prev: 'previous',
				close: 'close',
				view: 'view gallery'
			}
		},
		settings: {},
		images: {
			current: 0,
			total: 0,
			files: []
		},
		setup: function(){

			// gallery.containers();
			
			if (!$(gallery.settings.containers.gallery).exists()) {
				$(gallery.settings.containers.target).before('<div id="'+gallery.settings.containers.gallery.substr(1)+'" class="box clear hide"><div id="'+gallery.settings.containers.close.substr(1)+'"><a href="/close">Skjul bilde</a></div><div id="img"><img /><a class="'+gallery.settings.containers.prev.substr(1)+'" title="'+gallery.settings.text.prev+'" href="/prev">'+gallery.settings.text.prev+'</a><a class="'+gallery.settings.containers.next.substr(1)+'" title="'+gallery.settings.text.next+'" href="/next">'+gallery.settings.text.next+'</a></div><div id="'+gallery.settings.containers.caption.substr(1)+'"></div></div>');
			}
			
			if (!$(gallery.settings.containers.nav).exists()) {
				$(gallery.settings.containers.thumbs).before('<div id="'+gallery.settings.containers.nav.substr(1)+'" class="hide"><a class="'+gallery.settings.containers.prev.substr(1)+'" href="/prev">'+gallery.settings.text.prev+'</a> <span id="'+gallery.settings.containers.current.substr(1)+'"></span> '+gallery.settings.text.of+' <span id="'+gallery.settings.containers.total.substr(1)+'"></span> <a class="'+gallery.settings.containers.next.substr(1)+'" href="/next">'+gallery.settings.text.next+'</a></div>');
			}
			
			// gallery.changeLinks();
			gallery.getImages();

			// attach events
			$(gallery.settings.containers.close).bind('click', function(e){
				e.preventDefault();
				gallery.quit();
			});
			
			$(gallery.settings.containers.next).bind('click', function(e){
				e.preventDefault();
				gallery.next();
			});
			
			$(gallery.settings.containers.prev).bind('click', function(e){
				e.preventDefault();
				gallery.prev();
			});
		},
		quit: function(){
			// $(gallery.settings.containers.gallery).animate({"opacity": "hide"}, { "duration": "slow", "easing": "easeout" });
			$(gallery.settings.containers.gallery+', '+gallery.settings.containers.nav).hide();
			gallery.placeholders();
			return;
		},
		placeholders: function(){
			var $this = $(gallery.settings.containers.placeholder);
			if ($this.exists()) {
				$this.remove();
			} else {
				$(gallery.settings.containers.target).before('<div class="' + gallery.settings.containers.placeholder.substr(1) + '">');
				$(gallery.settings.containers.thumbs).before('<div class="' + gallery.settings.containers.placeholder.substr(1) + '">');
			}
			return;
		},
		// changeLinks: function(){
		// 	var links = $(gallery.settings.containers.thumbs).find('a');
		// 	
		// },
		getImages: function(){
			// find our image URLs
			var links = $(gallery.settings.containers.thumbs).find('a');

			// set image total
			gallery.images.total = links.length;
			gallery.images.current = 0;
			
			$(gallery.settings.containers.current).text(gallery.images.current);
			$(gallery.settings.containers.total).text(gallery.images.total);

			links.each(function(i){
				var link = $(this);
				
				var preloader = new Image();
				preloader.onload = function() {
					preloader.onload = null;
					preloader = null;
				};
				preloader.src = link.attr("href");
				
				// center portrait images
				// if (link.children().width() == 83) link.css('margin-left', '20px');
				if (link.children().width() == 83) {
					link.css('margin-left', '20px');
				}
				
				// alert($(this+' img').html());
				
				// add our image paths and titles to array
				gallery.images.files.push([link.attr("href"), link.attr("title")]);
				
				link.bind('click', function(e){
					e.preventDefault();
					gallery.images.current = i;
					gallery.display();
					// gallery.show(i);
					$('html,body').animate({scrollTop: 0}, 1000);
				});
				
			});
		},
		next: function(){
			// $(gallery.settings.containers.gallery).fadeOut('fast');
			
			if (gallery.images.current == gallery.images.total-1) {
				gallery.images.current = 0;
			} else {
				// $current = gallery.images.current+1;
				gallery.images.current += 1;
			}
			// alert('current: '+gallery.images.current+' $current: '+$current);
			gallery.display();
			
		},
		prev: function(){
			if (gallery.images.current === 0) {
				gallery.images.current = gallery.images.total-1;
			} else {
				// $current = gallery.images.current+1;
				gallery.images.current -= 1;
			}
			gallery.display();
		},
		display: function(){

			var galleryId = gallery.settings.containers.gallery;

			$(galleryId+' #img').addClass('loading');
			$(galleryId+' img,'+galleryId+' a,'+galleryId+' #caption').hide();
			
			var img = new Image();
					img.src = gallery.images.files[gallery.images.current][0];

			var title = gallery.images.files[gallery.images.current][1];

			$(galleryId+' img').attr('src', img.src);
			$(gallery.settings.containers.caption).text(gallery.images.files[gallery.images.current][1]);
			
			// adjust image container and next/prev link height/width
			$(galleryId+' #img').css({
				margin: '10px auto',
				width: (img.width+10)+'px',
				height: (img.height+10)+'px'
			});
			$(galleryId+' a').css({
				width: img.width/2+'px',
				height: img.height+'px'
			});
			$(galleryId + ' #caption').css({
				margin: '10px auto',
				width: img.width+'px'
			});

			// update current count
			$("#current").text(gallery.images.current+1);
			
			$(galleryId+' img,'+galleryId+' a,'+galleryId+' #caption').show();
			
			$(galleryId+' #img').removeClass('loading');
			
			
			// if gallery and navigation hiddden, display them
			if ($(galleryId).isHidden() && $(gallery.settings.containers.nav).isHidden()) {
				// $(gallery.settings.containers.target + ', ' + gallery.settings.containers.thumbs).css('margin-top', '0');
				gallery.placeholders();
				$(galleryId + ', ' + gallery.settings.containers.nav).toggle();
			}
			
			// if ($(galleryId).isHidden()) $(galleryId).toggle();
			// if ($(gallery.settings.containers.nav).isHidden()) $(gallery.settings.containers.nav).toggle();
			
			// $(gallery.settings.containers.gallery).fadeIn('slow');
			// $(gallery.settings.containers.gallery).animate({fadeIn: 0}, 1000);
		},
		
		show: function(index){

			$(gallery.settings.containers.current).text(index+1);

			// change image
			$(gallery.settings.containers.gallery+' img').attr('src', gallery.images.files[index][0]);
			$(gallery.settings.containers.caption).text(gallery.images.files[index][1]);

			if ($(gallery.settings.containers.gallery).isHidden()) {
				$(gallery.settings.containers.gallery).toggle();
			}
			
			if ($(gallery.settings.containers.nav).isHidden()) {
				$(gallery.settings.containers.nav).toggle();
			}
			
		}
	};
	
	
	// public
	$.gallery = {
		// options: {},
		init: function(options){
			// update our settings
			gallery.settings = $.extend({}, gallery.defaults, options);
			// init the gallery
			gallery.setup();
		}
	};
	
	// initialize
	$(function(){

		var options = {
			// containers: {
			// 	thumbs: '#wm-galleri',
			// },
			text: {
				next: 'Neste',
				prev: 'Forrige',
				of: 'av',
				close: 'Skjul bilde',
				view: 'Vis galleri'
			}
		};
		if ($('#thumbs').exists()) {
			$.gallery.init(options);
		}

	});
	
})(jQuery);