// JavaScript Document

///////////////////////////// vars

// vars
Gallery.prototype.imageURLs;
Gallery.prototype.captions;
Gallery.prototype.links;
Gallery.prototype.holders = [];
Gallery.prototype.current;
Gallery.prototype.t;
Gallery.prototype.scrollPosition = 0;
Gallery.prototype.animating = false;

// selectors
Gallery.prototype.win = $(window);
Gallery.prototype.doc = $(document);
Gallery.prototype.banner = $(Gallery.prototype.holder);
Gallery.prototype.scrollSection;
Gallery.prototype.overlay;
Gallery.prototype.paging;
Gallery.prototype.lis;
Gallery.prototype.uls;

///////////////////////////// construct

function Gallery(holder, images, captions, links) {
	Gallery.prototype.holder = holder;
	Gallery.prototype.imageURLs = images;
	Gallery.prototype.captions = captions;
	Gallery.prototype.links = links;
	Gallery.prototype.current = Math.floor(Math.random()*images.length);
	Gallery.prototype.setupUI();
	Gallery.prototype.changeTo(Gallery.prototype.current);
};

///////////////////////////// public methods

Gallery.prototype.changeTo = function(number) {
	clearTimeout(Gallery.prototype.t);
	$(Gallery.prototype.scrollSection).clearQueue();
	Gallery.prototype.current = number;
	$(Gallery.prototype.scrollSection).append("<div class=\"itemHolder\"><div class=\"imageHolder\"></div><div class=\"caption\"></div></div>");
	Gallery.prototype.holders.push($("#bScrollSection > div:last"));
	$(Gallery.prototype.holders[Gallery.prototype.holders.length-1]).find(".caption").css({ width:"270px", height:"24px", paddingTop:"6px", paddingLeft:"10px", overflow:"hidden", position:"absolute", top:($(Gallery.prototype.holder).height()-30-3)+'px', left:($(Gallery.prototype.holder).width()-280)+'px', background:'#0e3643', opacity:"0.8", color:"#ffffff" }).append(Gallery.prototype.captions[Gallery.prototype.current]);
	var left = (-Gallery.prototype.scrollPosition+$(Gallery.prototype.holder).width())+"px";
	$(Gallery.prototype.holders[Gallery.prototype.holders.length-1]).css({ width:$(Gallery.prototype.holder).width()+"px", height:$(Gallery.prototype.holder).height()+"px", position:'absolute', left:left, background:'red' });
	Gallery.prototype.loadImage(Gallery.prototype.imageURLs[number]);
};

///////////////////////////// private methods

Gallery.prototype.setupUI = function() {
		$(Gallery.prototype.holder).css({ overflow:'hidden', position:'absolute' })
		$(Gallery.prototype.holder).append("<div id=\"bScrollSection\"></div><div id=\"bPaging\"></div><div id=\"bOverlay\"></div>");
		Gallery.prototype.scrollSection = $(Gallery.prototype.holder+" #bScrollSection");
		Gallery.prototype.overlay = $(Gallery.prototype.holder+" #bOverlay");
		Gallery.prototype.paging = $(Gallery.prototype.holder+" #bPaging");
		$(Gallery.prototype.overlay).css({ position:'absolute', zIndex:100, width:$(Gallery.prototype.holder).width()+"px", height:$(Gallery.prototype.holder).height()+"px", background:"#333333" }).hide();
		$(Gallery.prototype.scrollSection).css({ position:'absolute', left:0, zIndex:50 });
		Gallery.prototype.setupPages();
};

Gallery.prototype.setupPages = function() {
	$(Gallery.prototype.paging).css({ position:'absolute', zIndex:75, width:"240px", top:($(Gallery.prototype.holder).height()-24-3)+'px', height:"24px" });
	$(Gallery.prototype.paging).append("<ul></ul>");
	Gallery.prototype.uls = $(Gallery.prototype.paging).find("ul");
	$(Gallery.prototype.uls).css({ listStyle:'none', margin:0, padding:0 });
	for(var i=1; i<=Gallery.prototype.imageURLs.length; i++) {
		$(Gallery.prototype.uls).append("<li><span class=\"bgHover\"></span><span class=\"bText\">"+i+"</span></li>");
	}
	Gallery.prototype.lis = $(Gallery.prototype.paging).find("ul li");
	$(Gallery.prototype.lis).each(function() {
		$(this).css({ float:'left', width:"24px", height:"21px", paddingTop:"3px", textAlign:'center', cursor:'pointer', background:'url(images/button_backgrounds.gif)', marginLeft:"3px", position:"relative" });
		$(this).find(".bgHover").each(function(){
			$(this).css({ display:"block", width:"24px", height:"19px", paddingTop:"5px", background:"url(images/button_backgrounds.gif)", backgroundPosition:"bottom left", position:"absolute", top:0, left:0, zIndex:160 }).hide();	
		});
		$(this).find(".bText").each(function() {
			$(this).css({ zIndex:170, position:'relative', color:"#f4f4f4", textShadow:"0px -1px #000000" });
		});
	});
	$(Gallery.prototype.lis).eq(Gallery.prototype.current).find(".bgHover").fadeIn(400);
	$(Gallery.prototype.uls).find(".bgHover")
	$(Gallery.prototype.lis).click(function(){
		if(Gallery.prototype.animating == false) {
			clearTimeout(Gallery.prototype.t);
			Gallery.prototype.current = $(Gallery.prototype.lis).index(this);
			Gallery.prototype.changeTo($(Gallery.prototype.lis).index(this));
		};
	});
};

Gallery.prototype.loadImage = function(href) {
	//$(Gallery.prototype.overlay).fadeIn();
	clearTimeout(Gallery.prototype.t);
	var image = new Image();
	$(image).load(function() { Gallery.prototype.imageLoaded(this) }).attr("src", href);
};

///////////////////////////// event methods

Gallery.prototype.imageLoaded = function(image) {
	//$(Gallery.prototype.overlay).fadeOut();
	$(Gallery.prototype.holders[Gallery.prototype.holders.length-1]).find(".imageHolder").append(image);
	Gallery.prototype.scrollPosition -= $(Gallery.prototype.holder).width();
	var left = Gallery.prototype.scrollPosition+"px";
	Gallery.prototype.animating = true;
	$(Gallery.prototype.lis).each(function(){
		if($(Gallery.prototype.lis).index(this) == Gallery.prototype.current) {
			$(this).find(".bgHover").fadeIn(400);
		} else {
			$(this).find(".bgHover").fadeOut(400);
		}
	});
	$(Gallery.prototype.scrollSection).animate({ left:left }, 400, function(){ Gallery.prototype.startTimer() });
};

Gallery.prototype.startTimer = function() {
	Gallery.prototype.animating = false;
	while(Gallery.prototype.holders.length > 1) {
		$(Gallery.prototype.holders.shift()).remove();
	};
	Gallery.prototype.t = setTimeout("Gallery.prototype.changeNext()", 2500);
};

Gallery.prototype.changeNext = function() {
	Gallery.prototype.current ++;
	if(Gallery.prototype.current >= Gallery.prototype.imageURLs.length) Gallery.prototype.current = 0;
	Gallery.prototype.changeTo(Gallery.prototype.current);
};