// initialize
$(function()
{	
	/*$('span#scroll_prev').click(scrollPrev);
	$('span#scroll_next').click(scrollNext);*/
	$('div.gallery').windowScroll();
	$('span#scroll_prev').prevButton();
	$('span#scroll_next').nextButton();
});

(function($){
	$.fn.extend({
		windowScroll: function() {
			jQuery(this).each(function(){
				var w = 0;
				el = $(this);
				els = jQuery("img", this);
				cnt = el.length;
				els.each(function()
				{
					var img = new Image();
					img.onload = $(img).imageLoadDone;
					img.src = $(this).attr('src');
				});
			})
		},
		prevButton: function() {
			$this = $(this);
			$(this).click(function(){
				var prev = $this.getCurrentFrontPicture()-1;
				$this.scrollToImageNum(prev>0?prev:0)
			});
		},
		nextButton: function() {
			$this = $(this);
			$(this).click(function(){
				var next = $this.getCurrentFrontPicture()+1;
				var l = $('#images a').length;
				$this.scrollToImageNum(next<l?next:l-1);	
			});
		},
		getCurrentFrontPicture: function  ()
		{
			var ret = 0
			var imgs = jQuery('#images a');
			var left = $.browser.safari?document.body.scrollLeft:jQuery('html, body').scrollLeft();
			imgs.each(function (i){
				var img = jQuery(imgs[i]);
				var l = img.offset().left-left;
				var r = l+img.width();
				if (l<=260 && r>260) ret = i
			});
			return ret;
		},
		scrollToImageNum: function (n)
		{
			var p = parseInt(jQuery('#images a:eq('+n+')').offset().left) - parseInt(jQuery('#images').css('padding-left'));
			jQuery('html, body').animate(
				{ scrollLeft: p }, 
				500
			);
			return false;
		},
		imageLoadDone: function ()
		{
			if(!cnt--)
			{
				var a = new Array();
				els.each(function() { a.push(this);});
				a = a.reverse();
				var space = $(window).width()-parseInt(el.parent().css('padding-left'));
				el.width(el.width()+(space-$(a[0]).width()))
			}
		}
		
	});
	var el, els;
	var cnt = 0;
})(jQuery);