// JavaScript Document

function LoadImage(NewImage) {
	var ImgContent = '<img src="resources/' + NewImage + '" />';
	document.getElementById("item_image_1").innerHTML=ImgContent;
	return false;
}

// Randomize an array of oredred numbers
function CreateRandNumArray(StartNum,EndNum) {
	var NumArray = new Array();
	var CountTotal = EndNum - StartNum;
	var ArrayNum = StartNum;
	var Count = 0;
	while (Count <= CountTotal) {
		NumArray[Count] = ArrayNum;
		Count++;
		ArrayNum++;
	}
	// randomize the array
	NumArray.sort(function() {return 0.5 - Math.random()})
	return NumArray;
}
// count the number of elements with a certain name with ordered number
function CountElementsFromIDName(eIDname) {
	// variables
	var eCounter = 1;
	var CheckElement = eIDname+eCounter;
	// First check that the element your trying to show exists
	if (document.getElementById(CheckElement)) {
		var ElementExists = "true";
		// get the number of elements
		while (ElementExists == "true") {
			// check if the next element is there
			if (!document.getElementById(CheckElement)) {
				var ElementExists = "false";
				break;
			}
			// add 1 to the counter
			eCounter++;
			var CheckElement = eIDname+eCounter;
		}
		// minus 1 off count as the final check is for theone that doesnt exist
		var NumberOfElements = eCounter-1;
	} else {
		// there is zero elements by that name
		var NumberOfElements = 0;
	}
	return NumberOfElements;
}

var SetIntervalItemsShow = 0;
var NumElements = 0;
var ElementIDname = 'ci';
var RandElementNum = 0;
function StartDisplayItemImgs() {
	// get number of elements	
	NumElements = CountElementsFromIDName(ElementIDname);
	if (NumElements > 0) {
		// create the random number array
		RandElementNum = CreateRandNumArray(1,NumElements)
		// start set interval
		SetIntervalItemsShow = setInterval('DisplayItemImgs()',20);
	}
}
var ElementCount = 0;
var ItemImgOpacity = 0;
var ElementID = 0;
function DisplayItemImgs() {
	ElementID = ElementIDname+RandElementNum[ElementCount];
	if (ElementCount < NumElements) {
		if (ItemImgOpacity > 100) {
			ElementCount += 1;
			ItemImgOpacity = 0;
		} else {
			var OpacityValue = ItemImgOpacity / 100;
			document.getElementById(ElementID).style.opacity = OpacityValue;
			document.getElementById(ElementID).style.filter = 'alpha(opacity='+ItemImgOpacity+')';
			ItemImgOpacity += 10;
		}
	} else {
		clearInterval(SetIntervalItemsShow);
	}
}

document.write("\
<style type=\"text/css\">\
<!--\
.category_item {opacity:0;filter:alpha(opacity=0);}\
-->\
</style>\
");