/**
 * Bind dependent lists
 */
function selectedChanged(e, element)
{
	if (element.value == '')
			return;
	
	if (element.i < nws.titlesCount-1)
	{
		// Clearing items
		for(var i = element.i+1; i < nws.titlesCount; i++)
			clearList(i);									
	
		// Finding q
		var q = ["", "", ""];
		for(var i = 0; i < element.i; i++)
			q[i] = getElement(i).value;
		
		var r = getDimensions(q[0], q[1], q[2], element.i + 1);
		bindOptions(r, element.i + 1);
		
		$('nws-variants').style.display = 'none';
		$('nws-buycontrols').style.display = 'none';
		$('addButtonRow').style.display = 'none';
	}
	else
	{
		Element.removeChildren('nws-variants');
				
		var table = domEl('table', null, []);
		var tbody = domEl('tbody', null, []);
		table.appendChild(tbody);

		// Selecting Items		
		var q = ["", "", ""];
		for(var i = 0; i < nws.titlesCount; i++)
			q[i] = getElement(i).value;
			
		var items = getItems(q[0], q[1], q[2]);
		
		var multi = items.length > 1;
		
		// Constructing rows
		for(var i = 0; i < items.length; i++)
		{
			var item = items[i];
			
			// Images
			if (i == 0 && item.images.length > 0)
			{
				renderImages(item);
			}
			else
			{
				// Render default image
				for(var j = 0; j < items.length; j++)
				{
					if (items[j].images.length)
					{
						renderImages(items[j]);
						break;
					}
				}
			}
			
			var tr = domEl('tr', null, []);
			
			// Row
			if (multi)
			{
				var td = domEl('td', '', [['class', 'option'], ['style', 'width: 15px;']]);
				td.innerHTML = '<input type="radio" name="item" value="'+item.id+'" />';
				tr.appendChild(td);
			}			
			else
			{
				var hidden = domEl('input', null, [['name', 'item'], ['value', item.id], ['type', 'hidden']]);
				$('nws-variants').appendChild(hidden);
			}
			
			var td = domEl('td', item.description, [['class', 'description']]);
			tr.appendChild(td);
			tbody.appendChild(tr);
		}		
		
		$('nws-variants').appendChild(table);
		$('nws-variants').style.display = 'block';
		
		if(items[0].available)
		{
			$('nws-buycontrols').style.display = 'block';
			$('addButtonRow').style.display = '';
			$('notAvailable').style.display = 'none';
		}
		else
		{
			$('nws-buycontrols').style.display = 'none';
			$('addButtonRow').style.display = 'none';
			$('notAvailable').style.display = 'block';
		}
	}
}

/**
 * Render thumbnail images for item
 */
function renderImages(item)
{
	var pc = $('PhotosContainer');
	Element.removeChildren('PhotosContainer');
	if (item.images.length)
	{
		var div = domEl('div', null, [['class', 'image']]);
		div.appendChild(domEl('img', null, [['id', 'BigPhoto']]));				
		pc.appendChild(div);
		pc.appendChild(domEl('div', 'Click for a larger view.', [['id', 'zoomNotice']]));
		
		var defImg = item.images[0];
		updateImage(defImg.full, defImg.original, defImg.originalWidth, defImg.originalHeight);
		
		pc.appendChild(domEl('p','More photos:'));
		
		var thumbnails = domEl('div', null, [['class', 'thumbnails']]);		
		pc.appendChild(thumbnails);
		
		for(var j = 0; j < item.images.length; j++)
		{
			var image = item.images[j];
			var img = domEl('img', null, [['src', image.thumb]]);
			img.full = image.full;
			img.original = image.original;
			img.originalWidth = image.originalWidth;
			img.originalHeight = image.originalHeight;
			img.style.cursor = 'pointer';
			addEvent(img, 'click', function(e){
				updateImage(this.full, this.original, this.originalWidth, this.originalHeight);
			});
			
			thumbnails.appendChild(img);
		}
	}
}

/**
 * Enable default option for the list
 */
function clearList(n)
{
	var element = getElement(n);
	element.options.length = 0;
	if (n > 0)
	{
		element.options[0] = new Option(String.format('[Select {0}]', nws.titles[n-1]), '');
		element.options[0].disabled = true;
		element.options[0].style.color = 'gray';
	}
}

/**
 * Return list with N's dimension
 */
function getElement(n)
{
	return $('detail'+n);
}

/**
 * r -- array of options which we will bind
 * n -- number of title which we will bind to
 */
function bindOptions(r, n)
{
	var element = getElement(n);
	element.options.length = 0;
	
	
	element.options[0] = new Option('-- Select --', '');
	for(var i = 0; i < r.length; i++)
	{
		element.options[i+1] = new Option(r[i], r[i]);
	}
}

/**
 * d1..d3 -- what we have now
 * n -- data for which details we want to have?
 */
function getDimensions(d0, d1, d2, n)
{
	var result = [];
	
	for(var i = 0; i < nws.items.length; i++)
	{
		var add = true;
		
		if (d0 && d0 != "" && nws.items[i].details[0] != d0)
			add = false;
			
		if (d1 && d1 != "" && nws.items[i].details[1] != d1)
			add = false;
			
		if (d2 && d2 != "" && nws.items[i].details[2] != d2)
			add = false;
			
		if (add)
		{
			var cand = nws.items[i].details[n];
			var exist = false;
												
			for(var j = 0; j < result.length; j++)
			{
				if (result[j] == cand)
				{
					exist = true;
					break;
				}
			}
			
			if (! exist)
			{
				result.push(cand);
			}
		}
	}
return result;
	
	/*return result.sort();*/
}

function getItems(d0, d1, d2)
{
	var result = [];
	
	for(var i = 0; i < nws.items.length; i++)
	{
		var add = true;
		
		if (d0 && d0 != "" && nws.items[i].details[0] != d0)
			add = false;
			
		if (d1 && d1 != "" && nws.items[i].details[1] != d1)
			add = false;
			
		if (d2 && d2 != "" && nws.items[i].details[2] != d2)
			add = false;
			
		if (add)
		{
			result.push(nws.items[i]);
		}
	}
	
	return result;
}