/** Util */
Util = function() {
}

Util.prototype.extractArgumentsFromURL = function(vUrl, vSeparator)
{
	var args = new Object();
	
	var tokens = vUrl.split(vSeparator);
	
	if (tokens.length > 1)
	{
		tokens = tokens[1].split("&");

		for(var i = 0; i < tokens.length; i++)
		{
			var part = tokens[i];
			
			var partTokens = part.split("=");
			
			if (partTokens.length == 2)
			{
				args[partTokens[0]] = partTokens[1];
			}
		}
	}

	return args;
}

Util = new Util();

/** ImagePreloader */
ImagePreloader = function(vSrcArray, vOnPreloadCompleteHandler, vHandlerTarget)
{
	this.onPreloadCompleteHandler = vOnPreloadCompleteHandler;
	this.handlerTarget = vHandlerTarget;

	this.loadedCount = 0;
	this.processedCount = 0;
	this.images = new Array;

	this.imageCount = vSrcArray.length;
 
	for (var i = 0; i < vSrcArray.length; i++) {
		this.preload(vSrcArray[i]);
	}
}

ImagePreloader.prototype.preload = function(imageSrc)
{
	var newImage = new Image;
	this.images.push(newImage);

	newImage.onload = ImagePreloader.prototype.onImageLoad;
	newImage.onerror = ImagePreloader.prototype.onImageError;
	newImage.onabort = ImagePreloader.prototype.onImageAbort;

	newImage.preloader = this;
	newImage.isLoaded = false;
	newImage.isError = false;
	newImage.isAbort = false;

	newImage.src = imageSrc;
}

ImagePreloader.prototype.postProcessImage = function(vImage, vIsLoaded, vIsError, vIsAbort)
{
	this.processedCount++;

	if (vIsLoaded) {
		this.loadedCount++;
	}

	vImage.onload = null;
	vImage.onerror = null;
	vImage.onabort = null;
	
	vImage.isLoaded = vIsLoaded;
	vImage.isError = vIsError;
	vImage.isAbort = vIsAbort;

	if (this.processedCount == this.imageCount) {
		this.onPreloadCompleteHandler.call(this.handlerTarget, this.images);
	}
}

ImagePreloader.prototype.onImageLoad = function()
{
   this.preloader.postProcessImage(this, true, false, false);
}

ImagePreloader.prototype.onImageError = function()
{
   this.preloader.postProcessImage(this, false, true, false);
}

ImagePreloader.prototype.onImageAbort = function()
{
   this.preloader.postProcessImage(this, false, false, true);
}

/** ScreenshotViewer */
ScreenshotViewer = function(vBaseScreenshotPath, vScreenshotArray, vThumbnailElementId, vImageElementId, vImageDescriptionElementId, vArgs) {
	this.baseScreenshotPath = vBaseScreenshotPath;
	this.screenshotArray = vScreenshotArray;
	this.args = args;

	this.thumbnailElement = window.document.getElementById(vThumbnailElementId);
	this.imageElement = window.document.getElementById(vImageElementId);
	this.descriptionElement = window.document.getElementById(vImageDescriptionElementId);
	
	this.loadedThumbsArray = new Array;
	this.loadedScreenshotsArray = new Array;
	this.imageSrcArray = new Array;
	this.visibleThumbsArray = new Array;

	for(var i = 0; i < this.screenshotArray.length; i++) {
		var screenshot = this.screenshotArray[i];

		this.imageSrcArray.push(this.baseScreenshotPath + screenshot.src + "-mini.png");
		this.imageSrcArray.push(this.baseScreenshotPath + screenshot.src + ".png");
	}

	this.imagePreloader = new ImagePreloader(this.imageSrcArray, this.onPreloadComplete, this);
	//<img class="screenshot" src="images/screenshots/import-mini.png" alt="Import Information" />
	//<a href="screenshot-import.html"><img class="screenshot" src="images/screenshots/import-mini.png" alt="Import Information" /></a>
	//<a href="screenshot-concept.html"><img class="screenshot-Link" src="images/screenshots/concept-saved-mini.png" alt="Concept Saved" /></a>
}

ScreenshotViewer.prototype.onPreloadComplete = function(vLoadedImagesArray) {
	for(var i = 0; i < vLoadedImagesArray.length; i++) {
		if (i % 2 == 0) {	// even -> thumb
			this.loadedThumbsArray.push(vLoadedImagesArray[i]);
		} else {	// odd -> image
			this.loadedScreenshotsArray.push(vLoadedImagesArray[i]);
		}
	}

	for(var i = 0; i < this.screenshotArray.length; i++) {
		var screenshotDescriptor = this.screenshotArray[i];
		var thumbImage = this.loadedThumbsArray[i];
		var screenshotImage = this.loadedScreenshotsArray[i];
		
		if (thumbImage && thumbImage.isLoaded && screenshotImage && screenshotImage.isLoaded) {
			screenshotImage.alt = screenshotDescriptor.tooltip;

			thumbImage.alt = screenshotDescriptor.tooltip;
			thumbImage.className = "screenshot-Link";
			thumbImage.screenshot = screenshotImage;
			thumbImage.screenshotDescriptor = screenshotDescriptor;
			thumbImage.screenshowViewer = this;

			if (thumbImage.addEventListener) {
				thumbImage.addEventListener("click", this.onThumbClicked, false); 
			} else if (thumbImage.attachEvent) {
				thumbImage.attachEvent("onclick", this.onThumbClicked);
			}

			this.thumbnailElement.appendChild(thumbImage);
			this.visibleThumbsArray.push(thumbImage);
		}
	}
	
	// Set initial screenshot
	var selectIndex = 0;
	if (this.args.set) {
		 for(var i = 0; i < this.visibleThumbsArray.length; i++) {
			var thumbImage = this.visibleThumbsArray[i];
			
			if (thumbImage.screenshotDescriptor.src == this.args.set) {
				selectIndex = i;
				break;
			}
		 }
	}
	
	if (selectIndex < this.visibleThumbsArray.length) {
		this.setScreenshot(this.visibleThumbsArray[selectIndex]);
	}
}

ScreenshotViewer.prototype.onThumbClicked = function() {
	var thumbImage;
	try {
		thumbImage = event.srcElement;
	} catch(ex) {
		thumbImage = this;
	}

	thumbImage.screenshowViewer.setScreenshot(thumbImage);
}

ScreenshotViewer.prototype.setScreenshot = function(vThumbImage) {
	var screenshotImage = vThumbImage.screenshot;

	this.imageElement.src = screenshotImage.src;

	for(var i = 0; i < this.visibleThumbsArray.length; i++) {
		var thumbImage = this.visibleThumbsArray[i];
		
		if (thumbImage == vThumbImage) {
			thumbImage.className = "screenshot";
		} else {
			thumbImage.className = "screenshot-Link";
		}
	}

	this.descriptionElement.innerHTML = vThumbImage.screenshotDescriptor.description;
}