jQuery.noConflict();

(function($) {

window.Imagebox = function(thumbs, image)
{
	this.init(thumbs, image);
}

window.Imagebox.prototype = {

	wrapperheight: 0,
	interval: false,
	thumbs: false,
	image: false,
	imagecontainer: false,
	wrapper: false,
	currentimage: false,
	imagedesc: false,
	imagedesctext: false,
	slidewrapper: false,
	slideinterval: false,
	scrollAmount: 0,
	secInterval: 2000,
	imageCount: 0,
	imageNoWrapper: false,
	descriptionhidden: false,

	init: function(thumbs, image)
	{
		this.thumbs = thumbs;
		this.image = image;
		this.imagecontainer = image.parent();
		this.wrapper = this.imagecontainer.parent();
		this.imagedesc = this.imagecontainer.find('#image-description');
		this.imagedesctext = this.imagedesc.find('#text-description');
		this.imageheadlinetext = this.imagedesc.find('#text-headline');
		this.slidewrapper = $('#imagebox-slide');
		this.imageNoWrapper = $('#imagebox-image-no');
		this.currentimage = $(this.thumbs[0]);

		this.wrapperheight = this.wrapper.get(0).offsetHeight;

		this.slidewrapper.animate({ scrollLeft: 0 });

		var context = this;
		var scrollAmount = 0;
		var imageNo = 1;
		this.thumbs.each(
			function()
			{
				$this = $(this);
				var tmbsrc = $this.attr('src');

				scrollAmount += this.parentNode.offsetWidth - 5;
				this.scrollAmount = scrollAmount;
				this.imageNo = imageNo;
				imageNo++;

				$this.bind('click', { context: context }, context.thumbClick);

				setTimeout(function() { context.preloadImages(context.resolveImgSrc(tmbsrc)); }, 1000 * imageNo);
			}
		);
		this.imageCount = imageNo - 1;

		$('#imagebox-inner-slide').css('width', scrollAmount + 60 +'px');

		this.imagedesc.find('#toggle-description').bind('click', { context: this }, this.toggleDescription);

		$('#toggle-slide').bind('click', { context: this }, function() { context.toggleSlide('toggle'); return false; });
		$('#start, #pstart').bind('click', { context: this }, function() { context.startSlideShow(); return false; });
		$('#stop').bind('click', { context: this }, function() { context.stopSlideShow(); return false; });

		$('#scroll-slide-forward').bind('mouseover', { context: this }, this.scrollForward);
		$('#scroll-slide-forward').bind('mouseout', { context: this }, this.stopScroll);
		$('#scroll-slide-back').bind('mouseover', { context: this }, this.scrollBack);
		$('#scroll-slide-back').bind('mouseout', { context: this }, this.stopScroll);

		//setTimeout(function() { context.nextImage(); }, 30);
		//setTimeout(function() { context.startSlideShow(); }, 5000);
	},

	setInterval: function(sec)
	{
		// Add 800 since the images fade for that long
		this.secInterval = (parseInt(sec, 10) * 1000) + 800;
	},

	updateImageNo: function(image)
	{
		this.imageNoWrapper.html(image.imageNo +'/'+ this.imageCount);
	},

	toggleDescription: function(e)
	{
		if($(this).html() == 'Info')
		{
			$(this).html('Dölj info');
			$(this.parentNode).animate({ width: 250 });
		}
		else
		{
			$(this).html('Info');
			$(this.parentNode).animate({ width: 22 });
		}

		$('#description-wrapper').toggle();
	},

	scrollForward: function(e)
	{
		var context = e.data.context;
		if(!context.slideRunning)
		{
			context.slideinterval = setInterval(function() { context.doScroll('forward'); }, 10);
		}
	},

	scrollBack: function(e)
	{
		var context = e.data.context;
		if(!context.slideRunning)
		{
			context.slideinterval = setInterval(function() { context.doScroll('back'); }, 10);
		}
	},

	doScroll: function(direction)
	{
		var domwrap = this.slidewrapper.get(0);

		if(direction == 'forward') domwrap.scrollLeft = domwrap.scrollLeft + 1;
		else domwrap.scrollLeft = domwrap.scrollLeft - 1;
	},

	stopScroll: function(e)
	{
		e.data.context.slideRunning = false;
		clearInterval(e.data.context.slideinterval);
	},

	thumbClick: function(e)
	{
		var context = e.data.context;
		context.scrollAmount = this.scrollAmount;
		context.removeGalleryDescription();

		if(context.currentimage) context.currentimage.removeClass('currentimage');
		context.showImage($(this));
		context.scrollToImage(this);

		context.stopSlideShow();
	},

	toggleSlide: function(mode)
	{
		var slide = $('#slide');

		if(mode == 'toggle')
		{
			if(parseInt(slide.css('opacity'), 10) != 0) mode = 'hide';
			else mode = 'show';
		}

		if(mode == 'hide')
		{
			$('#toggle-slide').html('Visa navigation');
			slide.fadeTo(1000, 0,
				function()
				{
					slide.hide();
				}
			);
		}
		else if(mode == 'show')
		{
			$('#toggle-slide').html('Dölj navigation');
			slide.show();
			slide.fadeTo(1000, 1, function() {  });
		}
		return false;
	},

	resolveImgSrc: function(tmbsrc)
	{
		return tmbsrc.replace(/imagebox_small/, 'imagebox_large');
		//return tmbsrc.replace(/small/, 'large');
	},

	removeGalleryDescription: function()
	{
		$('#gallerydescription').remove();
	},

	startSlideShow: function()
	{
		if(this.slideRunning) return;

		this.toggleSlide('hide');
		this.slideRunning = true;
		var context = this;
		context.removeGalleryDescription();
		context.nextImage();
		$('#div-image').show();
		this.interval = setInterval(function() { context.nextImage(); }, context.secInterval);
	},

	stopSlideShow: function()
	{
		//if(!this.slideRunning) return;

		this.toggleSlide('show');
		this.slideRunning = false;
		clearInterval(this.interval);
	},

	preloadImages: function()
	{
		var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
		var i,j=d.MM_p.length,a=arguments; for(i=0; i<a.length; i++)
		if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

	},

	nextImage: function()
	{
		if(this.currentimage)
		{
			var next = this.currentimage.parent().next('div').find('img');
			if(!next.length)
			{
				this.slidewrapper.animate({ scrollLeft: 0 });
				this.scrollAmount = 0;
				next = this.thumbs.parent().find('img:first-child');
			}
			this.currentimage.removeClass('currentimage');
		}
		else
		{
			var next = this.thumbs.parent().find('img:first-child');
		}

		var preload = next.next('img');
		if(preload.attr('src'))
		{
			var d = document;
			//if(d.images)
			var src = this.resolveImgSrc(preload.attr('src'));
			this.preloadImages(src);
		}

		this.scrollToImage(next.get(0));
		this.showImage(next);
	},

	scrollToImage: function(image)
	{
		this.slidewrapper.animate({ scrollLeft: image.scrollAmount - 400 });
	},

	showImage2: function(tmb)
	{
		var thumb = tmb;
		var context = this;

		context.imagecontainer.fadeOut(1500,
			function()
			{
				var src = context.resolveImgSrc(thumb.attr('src'));
				var img = new Image();
				img.src = src;
				var height = img.height;
				var width = img.width;

				thumb.addClass('currentimage');
				context.currentimage = thumb;

				var title = thumb.attr('title');
				if(typeof title == 'undefined') title = '';

				var desc = thumb.attr('longdesc');
				if(typeof desc == 'undefined') desc = '';

				if(title == '' && desc == '') context.imagedesc.hide();
				else context.imagedesc.show();

				context.imageheadlinetext.html(title);
				context.imagedesctext.html(desc);

				context.image.attr('src', src);

				context.imagecontainer.fadeIn(1500);
				context.updateImageNo(thumb.get(0));
			}
		);
	},

	showImage: function(tmb)
	{
		var thumb = tmb;
		var context = this;

		context.image.fadeTo(1500, 0);
		$('.currentimage').removeClass('currentimage');
		thumb.addClass('currentimage');
		context.currentimage = thumb;

		var src = context.resolveImgSrc(thumb.attr('src'));
		var img = new Image();
		img.src = src;
		img = $(img);
		img.css('opacity', 0);
        context.imagecontainer.append(img);
        img.fadeTo(1500, 1,
            function()
            {
                context.image.remove();
                context.image = img;
                context.updateImageNo(thumb[0]);
            }
        );
	}

};

})(jQuery);