﻿// JScript File
// Class: Sample
function Sample()
{
	this.Name = "";
	this.Img = "";
}

// Static Method: Parse the given XML Node
Sample.ParseXML = function(xm)
{
	var smp = new Sample();
	
	smp.Name = xm.getAttribute("name");
	smp.Img = xm.getAttribute("img");
	
	return smp;
}

//Instance Method: Cache the current Sample
Sample.prototype.PreCache = function()
{
	var img = new Image(200,200);
	img.src = "/Thumbnail.ashx?f=" + this.Img + "&w=200";
}

// Class: Range
function Range()
{
	this.Name = "";
	this.Description = "";
	this.Samples = new Array();
}

// Static Method: Parse the given XML Node
Range.ParseXML = function(xm)
{
	var rng = new Range();
	
	rng.Name = xm.getAttribute("name");
	rng.Description = xm.getAttribute("description");
	
	if (xm.hasChildNodes())
	{
		for (var i = 0; i < xm.childNodes.length; i++)
		{
			if (xm.childNodes[i].nodeType != 3)
			{
				rng.Samples[rng.Samples.length] = Sample.ParseXML(xm.childNodes[i]);
			}
		}
	}
	
	return rng;
}

// Class: Samples
function Samples()
{
	this.Http = null;
	this.Loaded = false;
	this.Failed = false;
	this.Ranges = new Array();
}

// Instance Method: Populate the given container with Sample thumbnails from the given Range
Samples.prototype.getThumbnails = function(Ranges, divId, rangeName, divImage)
{
	// TODO: Generate Thumbnails
	var div = document.getElementById(divId);
	
	while(div.childNodes.length > 0)
		div.removeChild(div.childNodes[0]);
	
	for (var i = 0; i < Ranges.length; i++)
	{
		if (Ranges[i].Name == rangeName)
		{
			for (var j = 0; j < Ranges[i].Samples.length; j++)
			{
				var smp = Ranges[i].Samples[j];
				smp.PreCache();
				
				var img = document.createElement("img");
				
				img.src = "/Thumbnail.ashx?f=" + smp.Img + "&w=50";
				img.alt = smp.Name;
				img.title = smp.Name;
				img.width = 50;
				img.height = 50;
				img.style.borderColor = "#0095d9";
				img.style.borderWidth = "1px";
				img.style.borderStyle = "solid";
				img.style.margin = "2px";
				img.fSrc = smp.Img;
				img.divImage = divImage;
				img.onmouseover = function()
				{
					var img = document.getElementById(this.divImage);
					img.src = "/Thumbnail.ashx?f=" + this.fSrc + "&w=200";
					img.alt = this.alt;
					img.title = this.title;
					this.style.borderColor = "#FFFF00";
				}
				img.onmouseout = function()
				{
					this.style.borderColor = "#0095d9";
				}
				
				div.appendChild(img);
				
				if (j == 0)
					img.onmouseover();
			}
		}
	}
}

// Instance Method: Populate the given container with Range tabs
Samples.prototype.generateTabs = function(divId, divThumbs, divImage, paraId, headId)
{
	var div = document.getElementById(divId);
	
	for (var i = 0; i < div.childNodes.length; i++)
		div.removeChild(div.childNodes[i]);
		
	for (var i = 0; i < this.Ranges.length; i++)
	{
		var tab = document.createElement("div");
		
		tab.style.zIndex = "1000";
		tab.style.borderColor = "#E0E0E0";
		tab.style.borderWidth = "2px";
		tab.style.borderStyle = "solid";
		tab.style.backgroundColor = "#FFFFFF";
		tab.style.textAlign = "center";
		tab.style.width = "150px";
		tab.style.margin = "0 -2px -2px 0";
		//tab.style.margin = "0";
		//tab.style.borderCollapse = "collapse";
		tab.style.padding = "0";
		tab.divThumbs = divThumbs;
		tab.rngName = this.Ranges[i].Name;
		tab.rngDesc = this.Ranges[i].Description;
		tab.divImage = divImage;
		tab.headId = headId;
		tab.samples = this;
		tab.paraId = paraId;
		tab.style.cssFloat = "left";
		tab.style.styleFloat = "left";
		tab.style.position = "relative";
		
		var p = document.createElement("p");
		p.style.textAlign = "center";
		p.appendChild(document.createTextNode(this.Ranges[i].Name));
		
		tab.onclick = function()
		{
			var div = document.getElementById(this.divThumbs);
			this.samples.getThumbnails(this.samples.Ranges, this.divThumbs, this.rngName, this.divImage);
			
			var head = document.getElementById(headId);
			for (var i = 0; i < head.childNodes.length; i++)
				head.removeChild(head.childNodes[i]);
			head.appendChild(document.createTextNode(this.rngName));
			
			var para = document.getElementById(paraId);
			for (var i = 0; i < para.childNodes.length; i++)
				para.removeChild(para.childNodes[i]);
			para.appendChild(document.createTextNode(this.rngDesc));
			
			for(var i = 0; i < this.parentNode.childNodes.length; i++)
				this.parentNode.childNodes[i].style.borderBottom = "solid 2px #E0E0E0";
			this.style.borderBottom = "solid 2px #FFFFFF";
		}
		tab.onmouseover = function()
		{
			this.style.backgroundColor = "#E0E0E0";
		}
		tab.onmouseout = function()
		{
			this.style.backgroundColor = "#FFFFFF";
		}
		
		tab.appendChild(p);
		div.appendChild(tab);
	
		if (i == 0)
			tab.onclick();
	}
	
	
}

// Instance Method: Returns the relevant XMLRequest Object
Samples.prototype.getHTTPObject = function()
{ 
	if (typeof XMLHttpRequest != 'undefined') 
	{ 
		return new XMLHttpRequest(); 
	} 
	try 
	{ 
		return new ActiveXObject("Msxml2.XMLHTTP"); 
	} 
	catch (e) 
	{ 
		try 
		{ 
			return new ActiveXObject("Microsoft.XMLHTTP"); 
		} 
		catch (e) 
		{
		} 
	} 
	
	return false;
}

// Static Method: Parse the given XML Document
Samples.ReadXML = function(filename)
{
	
	var sm = new Samples();
	
	sm.Http = sm.getHTTPObject ();
	
	filename += "?ran=" + Math.random();
	
	sm.Http.open("GET", filename, false);
	sm.Http.send(null);

	if ((sm.Http != null) && (sm.Http.readyState == 4) && (sm.Http.status == 200))
	{		
		var xDoc = sm.Http.responseXML;
		var smx = xDoc.getElementsByTagName("samples");
		var smn = smx[0].childNodes;
		var i = 0;

		while (i < smn.length)
		{
			if (smn[i].nodeType != 3)
			{
				sm.Ranges[sm.Ranges.length] = Range.ParseXML(smn[i]);
			}
			i++;
		}		
		
		sm.Loaded = true;
		sm.Failed = false;
	}
	
	return sm;	
}