var ie7 = (document.all && !window.opera && window.XMLHttpRequest) ? true : false;

// This function will display only groups which
// fall under the given filter. The filter in this case
// is the a-z symbol selected e.g A, B, C
function loadAZSelection(groupSet,group){
	
	// Hide all the category on display
	groupSet = groupSet.split("[-#]");
	for(i=0;i<groupSet.length;i++){
		subGroupCats = getSelectionByName('selectionGroup_' + groupSet[i]);
		for(x=0;x<subGroupCats.length;x++){
			subGroupCats[x].style.display="none";
		}
	}	

	// Reset the selection panel display
	for(i=0;i<groupSet.length;i++){
		alphabetLink = document.getElementById('alphabetLink_' + groupSet[i]);
		alphabetLink.style.color="#229BD5";
	}
	alphabetLink = document.getElementById('alphabetLink_false');
	alphabetLink.style.color="#229BD5";

	if(group=='false'){
		// Hide all the category on display
		for(i=0;i<groupSet.length;i++){
			subGroupCats = getSelectionByName('selectionGroup_' + groupSet[i]);
			for(x=0;x<subGroupCats.length;x++){
				subGroupCats[x].style.display="block";
			}
		}	
	}else{
		
		// Display only the items which are requested
		var groupCats = getSelectionByName('selectionGroup_' + group);	
		for(i=0;i<groupCats.length;i++){
			groupCats[i].style.display="block";
		}	
	}
	
	// highlight the new one
	var currentKey = document.getElementById("alphabetLink_" + group);
	currentKey.style.color="red";
	

}

// This function is required because of IE7 does not allow getElementsByName on certain
// elements, This is standard compliant according to MSDN 
// http://msdn.microsoft.com/en-us/library/ms536438%28VS.85%29.aspx

function getSelectionByName(filter){
	var elemArray = new Array();
	if(ie7){
		var elem = document.getElementsByTagName("p");  
		for (var i = 0; i < elem.length; i++) {   
			var name = elem[i].getAttribute("name");   
			if (name == filter ) {   
				elemArray[elemArray.length] = elem[i];
			}  
		}  	
		
		return elemArray;
	}else{
		return document.getElementsByName(filter);
	}
}

function showIconPanel(){
	var iconSelectionPanel = document.getElementById("iconSelectionPanel");
	
	
	if(divHidden(iconSelectionPanel)){
		iconSelectionPanel.style.display="block";
	}else{
		iconSelectionPanel.style.display="none";
	}
	
}



function divHidden(theDiv){

	if(theDiv.style.display=="none"){
		return true;
	}else{
		return false;
	}
	
}


function updateCatName(item){
	
	document.getElementById('catName').value = item.value;
	
	document.getElementById("iconSelectorPreview").innerHTML = "<img src='/images/" + document.getElementById('oldicon_file').value + "' /><span>" + document.getElementById('catName').value + "</span>";
}	


var catIconSelected = null;


function selectCatIcon(selectedIcon){


	if(catIconSelected == null){

		
		catIconSelected = selectedIcon;
		
		catIconSelected.style.background='#229BD5';
		
		document.getElementById('oldicon').value='1';
		
		document.getElementById('oldicon_file').value=catIconSelected.firstChild.alt;
		
		document.getElementById("iconSelectorPreview").innerHTML = "<img src='/images/" + document.getElementById('oldicon_file').value + "' /><span>" + document.getElementById('catName').value + "</span>";
		
	}else{
		
		catIconSelected.style.background='none';
		
		document.getElementById('oldicon').value='0';
		
		document.getElementById('oldicon_file').value='';
		
		catIconSelected = selectedIcon;
		
		catIconSelected.style.background='#229BD5';
		
		document.getElementById('oldicon').value='1';
		
		document.getElementById('oldicon_file').value= catIconSelected.firstChild.alt;
		
		document.getElementById("iconSelectorPreview").innerHTML = "<img src='/images/" + document.getElementById('oldicon_file').value + "' /><span>" + document.getElementById('catName').value + "</span>";
	
	}
}


//~ var origionalGroupOptionList = "";
//~ var origionalGroupDropDown = "";
//~ var origionalGroupOptionGroups = "";

// holds origional html as we want to repopulate
// the select box when the filter changes. Otherwise
// we will loose the origional data set
var origionalGroupInnerHTML = "";

function saveDefaultGroupList(){
	
	// Save the origional html of the select
	origionalGroupInnerHTML = document.getElementById("dropDownIr").innerHTML;
}

function getGroupListing(){
	
	var dropdown = document.getElementById("dropDownIr");
	
	// We want to reset this origional select before we continue applying new filter
	dropdown.innerHTML = origionalGroupInnerHTML;
	
	// Get all the optgroups from the select
	var optGroups = dropdown.childNodes;
		
	// Get the filter text
	var searchFilterValue = document.getElementById("groupFilterSearch").value.toLowerCase();
	
	// The children of an optgroup
	var optGroupChildren = "";
	
	// The text of a option, used to compare against filter
	var optionText = "";
	
	// The position the filter was found in the optionText
	var positionOfString = "";
	
	var removeItems = "";
	
	var newSelectCode = "";

	// Loop through the option groups
	for(i=0;i<optGroups.length;i++){
		
		// If we have a valid option group, we want to scan each option within
		// and remove it if it is not required.
		if(optGroups[i]){
			
			// Add the optgroup to select if it contains sub elements
			newSelectCode += '<optgroup label="' + optGroups[i].label + '">';
			
			// Get all the children of this option group
			optGroupChildren = optGroups[i].childNodes;
			
			// Loop through each option and remove if filter does not apply
			for(x=0;x<optGroupChildren.length;x++){
				
				// Check the input type is an option, not some other tag
				if(optGroupChildren[x].tagName == "OPTION"){
					
					// Get the text of the current option
					optionText = optGroupChildren[x].text.toLowerCase();
					
					// If the text is not empty, check against filter
					if(optionText != ""){
						
						// find the position of the filter in text
						positionOfString = optionText.indexOf(searchFilterValue,0);
						
						// If the filter applies to text, then add item to new code listing
						if(positionOfString != -1){
							
							newSelectCode += '<option value="'+optGroupChildren[x].value+'">'+optGroupChildren[x].text+'</option>';
							
						}						
					}
				}
			}
			
			newSelectCode += '</optgroup>';
		}
	}
	
	dropdown.innerHTML = "<option value='0'>(none)</option>" + newSelectCode;

}