

function ImagePreview(containerElement, type)
{
	this.containerElement = containerElement;
	
	this.type = type;
	
	if (type == ImagePreview.SCREENSHOT)
	{
		this.imageElement = YAHOO.util.Dom.getElementsByClassName("screenshot", null, containerElement)[0];
		this.borderElement = YAHOO.util.Dom.getElementsByClassName("screenshot_border", null, containerElement)[0];
		YAHOO.util.Event.addListener(this.borderElement, "click", this.open, this, true);
	}
	else if (type == ImagePreview.WALLPAPER)
	{
		this.imageElement = YAHOO.util.Dom.getElementsByClassName("wallpaper_thumbnail", null, containerElement)[0];
		YAHOO.util.Event.addListener(this.imageElement, "click", this.open, this, true);
	}

}

ImagePreview.SCREENSHOT = 1;
ImagePreview.WALLPAPER = 2;

ImagePreview.prototype.open = function()
{
	this.loadImage();
}

ImagePreview.prototype.loadImage = function()
{
	var temp = this.imageElement.src.split("/");
	
	if (this.type == ImagePreview.SCREENSHOT)
	{
		var imageAddress = temp[0];
		for (var i=1; i<temp.length; i++)
		{
			if (temp[i] != "thumbs")
			{
				imageAddress += "/" + temp[i];
			}
		}
		
		this.loadingImage = new Image();
		YAHOO.util.Event.addListener(this.loadingImage, "load", this.imageLoaded, this, true);
	}
	else if (this.type == ImagePreview.WALLPAPER)
	{
		var imageName = temp[temp.length - 1];
		imageName = imageName.substring(0, imageName.lastIndexOf("."));
		
		var imageAddress = "/downloads/wallpapers/" + imageName + "-800x600.jpg";
		this.loadingImage = new Image();
		YAHOO.util.Event.addListener(this.loadingImage, "load", this.imageLoaded, this, true);
	}
	
	this.loadingImage.src = imageAddress;
}

ImagePreview.prototype.imageLoaded = function()
{
	imageViewer.open(this.loadingImage);
	this.loadingImage = null;
}

function ImageViewer()
{
	this.overlayElement = document.getElementById("image_viewer_overlay");
	this.imageElement = document.getElementById("overlay_image");
	this.closeElement = document.getElementById("image_viewer_close");
	
	this.subsectionContainerElement = YAHOO.util.Dom.getElementsByClassName("subsection_container", null, this.overlayElement)[0];
	this.subsectionContentElement = YAHOO.util.Dom.getElementsByClassName("subsection_content", null, this.overlayElement)[0];
	
	this.overlayElement.parentNode.removeChild(this.overlayElement);
	
	document.body.appendChild(this.overlayElement);
	
	YAHOO.util.Event.addListener(this.overlayElement, "click", this.close, this, true);
	YAHOO.util.Event.addListener(window, "resize", this.windowResize, this, true);
	
	this.animation = null;
	this.state = false;
}

ImageViewer.prototype.open = function(imagePreview)
{
	var screenHeight = parseInt(document.body.offsetHeight * .90, 10);
	var screenWidth = parseInt(document.body.offsetWidth * .90, 10);
	
	var ratio = 1;
	if (imagePreview.width > screenWidth)
	{
		ratio = screenWidth / imagePreview.width;
	}
	if (imagePreview.height > screenHeight)
	{
		var newRatio = screenHeight / imagePreview.height;
		if (newRatio < ratio)
		{
			ratio = newRatio;
		}
	}
	
	this.imageElement.src = imagePreview.src;
	this.imageElement.width = parseInt(imagePreview.width * ratio);
	this.imageElement.height = parseInt(imagePreview.height * ratio);
	
	this.subsectionContainerElement.style.width = (imagePreview.width * ratio + 26) + "px";
	this.subsectionContentElement.style.height = (imagePreview.height * ratio - 26) + "px";
	
	this.overlayElement.style.marginLeft = (parseInt(-(imagePreview.width * ratio) / 2, 10) - 14) + "px";
	this.overlayElement.style.marginTop = (parseInt(-(imagePreview.height * ratio) / 2, 10) - 14) + "px";
	
	this.animateOpen();
}

ImageViewer.prototype.windowResize = function()
{
	if (!this.state)
	{
		return;
	}
	
	var tempImage = new Image();
	tempImage.src = this.imageElement.src;

	var width = tempImage.width;
	var height = tempImage.height;
	
	var screenHeight = parseInt(document.body.offsetHeight * .90, 10);
	var screenWidth = parseInt(document.body.offsetWidth * .90, 10);
	
	var ratio = 1;
	if (width > screenWidth)
	{
		ratio = screenWidth / width;
	}
	if (height > screenHeight)
	{
		var newRatio = screenHeight / height;
		if (newRatio < ratio)
		{
			ratio = newRatio;
		}
	}
	
	this.imageElement.width = parseInt(width * ratio);
	this.imageElement.height = parseInt(height * ratio);
	
	this.subsectionContainerElement.style.width = (width * ratio + 26) + "px";
	this.subsectionContentElement.style.height = (height * ratio - 26) + "px";
	
	this.overlayElement.style.marginLeft = (parseInt(-(width * ratio) / 2, 10) - 14) + "px";
	this.overlayElement.style.marginTop = (parseInt(-(height * ratio) / 2, 10) - 14) + "px";
}

ImageViewer.prototype.close = function()
{
	this.animateClose();
}

ImageViewer.prototype.animateOpen = function()
{
	setOpacity(this.overlayElement, 0);
	this.overlayElement.style.display = "block";
	
	this.state = true;
	
	if (this.animation)
	{
		this.animation.stop();
	}
	
	var animation = new YAHOO.util.Anim(this.overlayElement);
	animation.attributes.opacity = {from: 0, to: 1};
	animation.duration = .2;
	animation.method = YAHOO.util.Easing.easeNone;
	animation.onComplete.subscribe(this.animateComplete, this, true);
	
	animation.animate();
	this.animation = animation;
}

ImageViewer.prototype.animateClose = function()
{
	this.state = false;
	
	if (this.animation)
	{
		this.animation.stop();
	}
	
	var animation = new YAHOO.util.Anim(this.overlayElement);
	animation.attributes.opacity = {from: 1, to: 0};
	animation.duration = .2;
	animation.method = YAHOO.util.Easing.easeNone;
	animation.onComplete.subscribe(this.animateComplete, this, true);
	
	animation.animate();
	this.animation = animation;
}

ImageViewer.prototype.animateComplete = function()
{
	this.animation = null;
	
	if (this.state == false)
	{
		this.overlayElement.style.display = "";
	}
}

var imageViewer = null;

function initializeImageViewer()
{
	imageViewer = new ImageViewer();
	
	
	var screenshotContainers = YAHOO.util.Dom.getElementsByClassName("screenshot_container");
	
	for (var i=0; i<screenshotContainers.length; i++)
	{
		new ImagePreview(screenshotContainers[i], ImagePreview.SCREENSHOT);
	}
	
	var wallpaperContainers =  YAHOO.util.Dom.getElementsByClassName("wallpaper_thumbnail_container");
	
	for (var i=0; i<wallpaperContainers.length; i++)
	{
		new ImagePreview(wallpaperContainers[i], ImagePreview.WALLPAPER);
	}
}

YAHOO.util.Event.onDOMReady(initializeImageViewer);