// Developed by Brian Wung, for a quicker Javascript solution to sorting/filtering

var itemsAssoc, columns, totalWidth, allCells = new Array(0), copylength = 0;

function displayItems(varType, varOrder) {
	var width = totalWidth / columns;
	var colspan = columns;
	var localContent = "";
	var length = itemsAssoc.length;
	var i = 0;
	var itemsAssocCopy = {};
	var cell = "";
	copylength = length;

	if (allCells.length < 1 && length > 0) {
		var table = document.getElementById("contents-items-table");
		for (i = 0; i < table.rows.length; i++)
			for (x = 0; x < table.rows[i].cells.length; x++) {
				allCells.push(table.rows[i].cells[x].innerHTML);
			}
	}

	if (allCells.length > 0) {
		switch (varType) {
			case 'name':
				cell = 0;
				for (i = 0; i < length; i++)
					itemsAssocCopy[i] = itemsAssoc[i][cell];
				itemsAssocCopy = sortAssoc(itemsAssocCopy, varType, varOrder);
				if (varOrder == 'ascending')
					localContent += '<a href="#products" onClick="javascript:displayItems(\'default\');">Default Sort</a>&nbsp;&nbsp;|&nbsp;&nbsp;<b><a href="#products" onClick="javascript:displayItems(\'name\', \'descending\');">Name</a></b> <span style="font-size:9px;">(<b>A-Z</b> | <a href="#products" onClick="javascript:displayItems(\'name\', \'descending\');">Z-A</a>)</span>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Price</a> <span style="font-size:9px;">(<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Low to High</a> | <a href="#products" onClick="javascript:displayItems(\'price\', \'descending\');">High to Low</a>)</span>';
				else if (varOrder == 'descending')
					localContent += '<a href="#products" onClick="javascript:displayItems(\'default\');">Default Sort</a>&nbsp;&nbsp;|&nbsp;&nbsp;<b><a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">Name</a></b> <span>(<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">A-Z</a> | <b>Z-A</b>)</span>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Price</a> <span>(<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Low to High</a> | <a href="#products" onClick="javascript:displayItems(\'price\', \'descending\');">High to Low</a>)</span>';
				break;
			case 'price':
				cell = 1;
				for (i = 0; i < length; i++)
					itemsAssocCopy[i] = itemsAssoc[i][cell];
				itemsAssocCopy = sortAssoc(itemsAssocCopy, varType, varOrder);
				if (varOrder == 'ascending')
					localContent += '<a href="#products" onClick="javascript:displayItems(\'default\');">Default Sort</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">Name</a> <span>(<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">A-Z</a> | <a href="#products" onClick="javascript:displayItems(\'name\', \'descending\');">Z-A</a>)</span>&nbsp;&nbsp;|&nbsp;&nbsp;<b><a href="#products" onClick="javascript:displayItems(\'price\', \'descending\');">Price</a></b> <span>(<b>Low to High</b> | <a href="#products" onClick="javascript:displayItems(\'price\', \'descending\');">High to Low</a>)</span>';
				else if (varOrder == 'descending')
					localContent += '<a href="#products" onClick="javascript:displayItems(\'default\');">Default Sort</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">Name</a> <span>(<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">A-Z</a> | <a href="#products" onClick="javascript:displayItems(\'name\', \'descending\');">Z-A</a>)</span>&nbsp;&nbsp;|&nbsp;&nbsp;<b><a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Price</a></b> <span>(<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Low to High</a> | <b>High to Low</b>)</span>';
				break;
			case 'filter':
				for (i = 0; i < length; i++)
					itemsAssocCopy[i] = i;
				itemsAssocCopy = filterAssoc(itemsAssocCopy, varOrder);
				break;
			default:
				varType = 'default';
				for (i = 0; i < length; i++)
					itemsAssocCopy[i] = i;
				localContent += '<b>Default Sort</b>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">Name</a> <span>(<a href="#products" onClick="javascript:displayItems(\'name\', \'ascending\');">A-Z</a> | <a href="#products" onClick="javascript:displayItems(\'name\', \'descending\');">Z-A</a>)</span>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Price</a> <span>(<a href="#products" onClick="javascript:displayItems(\'price\', \'ascending\');">Low to High</a> | <a href="#products" onClick="javascript:displayItems(\'price\', \'descending\');">High to Low</a>)</span>';
		}
	}
	localContent += '</div>';

	//document.write(itemsAssocCopy.toSource());

	i = 0;
	localContent += '<table cellpadding="0" cellspacing="0" id="contents-items-table" width="' + totalWidth + '">';

	if (copylength < 1) {
		localContent += '<tr><td colspan="' + colspan + '" align="center" style="color:red; font-weight:bold;">This category currently has no available items.</td></tr>';
	}
	else {
		for (var index in itemsAssocCopy) {
			if (i % columns == 0)
				localContent += '<tr>';
			localContent += '<td style="width:' + width + 'px;">' + allCells[index] + '</td>';
			if (i % columns == columns - 1)
				localContent += '</tr>';
			i++;
		}
		if (i % columns < columns - 1) {
			for (;i % columns < columns - 1; i++)
				localContent += '<td></td>';
			localContent += '</tr>';
		}
	}
	localContent += '</table>';
	document.getElementById("contents-items").innerHTML = localContent;
}

function sortAssoc(aInput, varType, varOrder) {
    var aTemp = [];
	if (varType == "name")
		for (var sKey in aInput)
	        aTemp.push([sKey, aInput[sKey].toLowerCase()]);
	else
	    for (var sKey in aInput)
	        aTemp.push([sKey, aInput[sKey]]);

	switch (varType) {
		case "name":
			aTemp.sort(function () {return arguments[0][1] < arguments[1][1]});
			break;
		case "price":
			aTemp.sort(function () {return arguments[0][1] - arguments[1][1]});
			break;
		default:
			break;
	}
	//document.write(aTemp.toSource());
	
	if (varOrder == "ascending")
		aTemp.reverse();

    var aOutput = {};
    for (var nIndex = aTemp.length-1; nIndex >=0; nIndex--)
        aOutput[aTemp[nIndex][0]] = aTemp[nIndex][1];

    return aOutput;
}

function filterAssoc(itemsAssocCopy, varOrder) {
// types = armband, battery, case, cable, charger, dock, headset, speaker, skin, misc
	var search = '';
	for (var i in itemsAssocCopy) {
		//check by model of product
		if (varOrder == 'silicon' || varOrder == 'plastic')
			search = itemsAssoc[i][4].toLowerCase().search(varOrder);
		else
			search = itemsAssoc[i][3].toLowerCase().search(varOrder);
		if (search == -1) {
			delete itemsAssocCopy[i];
			copylength--;
		}
		/*//check by type of product
		else if (typeof(document.productFilter.types) !== "undefined" && document.productFilter.types.value !== "" && itemsAssoc[i][3].toLowerCase().search(document.productFilter.types.value) == -1) {
			delete itemsAssocCopy[i];
			copylength--;
		}
		// check by price of product
		else if (typeof(document.productFilter.prices) !== "undefined" && document.productFilter.prices.value !== "" && !(parseInt(itemsAssoc[i][1]) <= document.productFilter.prices.value || document.forms['productFilter'].prices.value == "all")) {
			delete itemsAssocCopy[i];
			copylength--;
		}
		// check by color of product
		else if (typeof(document.productFilter.colors) !== "undefined" && document.productFilter.colors.value !== "" && itemsAssoc[i][5].toLowerCase().search(document.productFilter.colors.value) == -1) {
			delete itemsAssocCopy[i];
			copylength--;
		}*/
	}
	return itemsAssocCopy;
}