var ImageGallery_Class = function() {
	this.init();
};

ImageGallery_Class.prototype.init = function() {

	this.imagePaths = $("input.screenPath");
	this.imageSources = $("input.screenImages");
	this.thumbWidths = $("input.screenThumbWidth"); // Multiplier
	this.thumbHeights = $("input.screenThumbHeight"); // Multiplier

	this.screenShotContainers = $("div.screenShotContainer");

	this.screenImgs = $("input.screenImgs");
		
	this._buildThumbnails();
	this._buildControls();
	this._buildLightBox();
	this._assignEvents();
	
	this._showAllThumbnails();
	
};

ImageGallery_Class.prototype._preloadImages = function() {};

ImageGallery_Class.prototype._buildThumbnails = function() {
	
};

ImageGallery_Class.prototype._buildControls = function() {
	
};

ImageGallery_Class.prototype._buildLightBox = function() {
	
};

ImageGallery_Class.prototype._assignEvents = function() {
	
};

ImageGallery_Class.prototype._showFirstThumbnail = function() {
	
	var i, len, oEl;
	
	for (i = 0, len = this.screenImgs.length; i < len; i++) {
	
		var sImgObj = common.json(this.screenImgs[i].value);
		
		var firstObj = sImgObj[0]; // this should always have at least 1 object
		
		var iPath = firstObj.src;
		
		var wImg = parseFloat(firstObj.width) * parseFloat(this.thumbWidths[i].value);
		
		var hImg = parseFloat(firstObj.height) * parseFloat(this.thumbHeights[i].value);
		
		var thCont = Element.create("img", {alt: "Screen shot image", src: this.imagePaths[i].value + iPath, width: wImg, height: hImg}, null);
		
		$(this.screenShotContainers[i]).html(thCont);
		
	}
	
};

ImageGallery_Class.prototype._showAllThumbnails = function() {
	
	var i, len, oEl;
	
	for (i = 0, len = this.screenImgs.length; i < len; i++) {
		
		$(this.screenShotContainers[i]).html("");
		
		var sImgObj = common.json(this.screenImgs[i].value);
		
		for (var j = 0; j < sImgObj.length; j++) {
			
			var firstObj = sImgObj[j];
			
			var iPath = firstObj.src;
			
			var wImg = parseFloat(firstObj.width) * parseFloat(this.thumbWidths[i].value);
			
			var hImg = parseFloat(firstObj.height) * parseFloat(this.thumbHeights[i].value);
			
			var thCont = Element.create("div", {className: "screenshot fleft offsetRight10 offsetBottom10", style: "height: 200px; overflow:hidden;"}, 
				Element.create("img", {src: this.imagePaths[i].value + iPath, width: wImg, height: hImg}, null)
			);
			
			$(this.screenShotContainers[i]).append(thCont);
		
		}
		
	}
	
	var scshot = $("div.screenshot img");
	scshot.css({"cursor":"pointer"});
	scshot.bind("click", function() {
		
		window.open(this.src, "screenshot");
			
	});
	
};

ImageGallery_Class.prototype.showThumbnails = function(iThumbs) {
	
};

ImageGallery_Class.prototype.showNext = function() {
	
};

ImageGallery_Class.prototype.showPrev = function() {
	
};

var gallery = new ImageGallery_Class();