// file that contains common JS used across site

// constants that dictate the image path suffixs
var nrmImgSuffix = '0.gif';
var hvrImgSuffix = '1.gif';
var selImgSuffix = '2.gif';
var sel2ImgSuffix = '3.gif';
var timer = null;
// variable that stores the listModule state
var listModuleState = new Object();

// function that is execute on the body's onload event
function initialisePage() {
    // first set the state for each of the listModules
    var listModuleDivName;
    for(listModuleDivName in listModuleState) {
        // first get the list module div
        var listModuleDiv = document.getElementById(listModuleDivName);
        // get the view type
        var viewType = listModuleState[listModuleDivName];
        // then get the iconBar div (this should allways be the first div
        var iconsDiv = listModuleDiv.getElementsByTagName('div')[0];
        // get the icon anchor
        var iconAnchor = getIconAnchor(iconsDiv,viewType + 'Icon');
        // then call the changeListModuleView function
        changeListModuleView(iconAnchor);
 
    }
    // call to remove margin on browsers with 800 x 600 resolution
    // REMOVED because problem only happens on IE6
    //overrideMargin();
    var agt=navigator.userAgent.toLowerCase();
    if (agt.indexOf("safari") != -1 && agt.indexOf("85.") != -1) {
        document.getElementById('ucTopNav_subNav').style.overflow = 'auto';
        document.getElementById('ucTopNav_subNav').style.cssFloat = 'none';
    }
    initialiseNav();
}

// function to change the navigation image
function changeBtnImage(img, isHover) {
    // modify the src
    var imgSrc = img.src;
    // check that it's not a selected image
    if(imgSrc.indexOf(selImgSuffix)==-1&&imgSrc.indexOf(sel2ImgSuffix)==-1) {
        if(isHover) {
            // put the hover image on
            // replace the imgSrc with the 1.gif
            imgSrc = imgSrc.substr(0,imgSrc.length-hvrImgSuffix.length) + hvrImgSuffix;
            img.src = imgSrc;
        }
        else {
            // turn the hover image off
            // replace the imgSrc with the 0.gif
            imgSrc = imgSrc.substr(0,imgSrc.length-nrmImgSuffix.length) + nrmImgSuffix;
            img.src = imgSrc;                    
        }
    }
}

// function to switch a listModules view around
function changeListModuleView(lnk) {
    try {
         // first get a reference to the listModules container div
        var iconDiv = lnk.parentNode;
        var iconsDiv = iconDiv.parentNode;
        var listModuleDiv = iconsDiv.parentNode;
        // then get a reference to the listModules icon images
        var listImg = getIconImg(iconsDiv,'listIcon');
        var mixedImg = getIconImg(iconsDiv,'mixedIcon');
        var imagesImg = getIconImg(iconsDiv,'imagesIcon');
        // set their src to be the unselected image
        listImg.src = listImg.src.substr(0,listImg.src.length-nrmImgSuffix.length) + nrmImgSuffix;
        mixedImg.src = mixedImg.src.substr(0,mixedImg.src.length-nrmImgSuffix.length) + nrmImgSuffix;
        imagesImg.src = imagesImg.src.substr(0,imagesImg.src.length-nrmImgSuffix.length) + nrmImgSuffix;
        // now set this image to be selected
        var curImg = lnk.getElementsByTagName('img')[0];
        curImg.src = curImg.src.substr(0,curImg.src.length-selImgSuffix.length) + selImgSuffix;
        // now set the display of the divs
        var listDiv = getListDiv(listModuleDiv,'list');
        var mixedDiv = getListDiv(listModuleDiv,'mixed');
        var imagesDiv = getListDiv(listModuleDiv,'images');
        listDiv.style.display = "none";
        mixedDiv.style.display = "none";
        imagesDiv.style.display = "none";
        // then set the current div to have display:block
        var selState = iconDiv.className.replace('Icon','');
        var contentDiv = getListDiv(listModuleDiv,selState);
        contentDiv.style.display = "block";
    }
    catch (ex) {
        // do nothing
        // TODO: put in alert for testing on Entriq
    }
}

function switchContentView(containerParentIdx, lnk, viewIdx) {
    // first loop through the parent elements to find the containing div
    var containerDiv = lnk;
    for(prntIdx = 0; prntIdx<containerParentIdx; prntIdx++) {
        containerDiv = containerDiv.parentNode;
    }
    // now loop through all the child divs and hide / show them
    var viewChildIdx = 0;
    var counter = 0;
    for(divIdx = 0; divIdx < containerDiv.childNodes.length; divIdx++) {
        var curDiv = containerDiv.childNodes[divIdx];
        if(curDiv.tagName=='DIV'&&(curDiv.className=='hidden'||curDiv.className=='visible')) {
            counter++;
            if(counter==viewIdx) {
                viewChildIdx = divIdx;
            }
            // hide it
            curDiv.style.display = "none";
        }
    }
    // then show the active one
    containerDiv.childNodes[viewChildIdx].style.display = "block";
}

function getIconImg(iconsDiv, divClass) {
    // loop through all sub divs and find the div with the divClass
    var iconDivs = iconsDiv.getElementsByTagName('div');
    for(iconCtr=0;iconCtr<iconDivs.length;iconCtr++) {
        var iconDiv = iconDivs[iconCtr];
        if(iconDiv.className == divClass) {
            return iconDiv.getElementsByTagName('img')[0];
        }
    }
    return null;
}

function getIconAnchor(iconsDiv, divClass) {
    // loop through all sub divs and find the div with the divClass
    var iconDivs = iconsDiv.getElementsByTagName('div');
    for(iconCtr=0;iconCtr<iconDivs.length;iconCtr++) {
        var iconDiv = iconDivs[iconCtr];
        if(iconDiv.className == divClass) {
            return iconDiv.getElementsByTagName('a')[0];
        }
    }
    return null;
}

function getListDiv(iconsDiv, divClass) {
    // loop through all sub divs and find the div with the divClass
    var iconDivs = iconsDiv.getElementsByTagName('div');
    for(iconCtr=0;iconCtr<iconDivs.length;iconCtr++) {
        var iconDiv = iconDivs[iconCtr];
        if(iconDiv.className == divClass) {
            return iconDiv;
        }
    }
    return null;
}

// kludge function to override css margin to prevent scrollbars
// when in 800x600 screen res, currently not implemented
function overrideMargin() {
    if(screen.width<=800) {
        var frmTag = document.getElementById("formContent");
        frmTag.style.margin = "0";
        // set the body style instead
        document.body.style.margin = "20px auto 20px 9px";
    }
}

// Used on sub genre page to display a grey shaded highlight behind letter links
function showLetterBg(letter) {
	document.getElementById(letter).style.background='url(/images/search/gra_bg_letter_highlight.gif) no-repeat center center';
}

function hideLetterBg(letter) {
	document.getElementById(letter).style.backgroundImage='none';
}

// function to clear the text when clicking on an input box
function activateInputBox(inputBox, defaultVal) {
    if(inputBox.value == defaultVal) inputBox.value = "";
}

function mainNavOver(el, subNavId){
    clearTimeout(timer);
    var navigation = document.getElementById('ucTopNav_mainNav');
    var navElements = navigation.getElementsByTagName('li');
    var navigationLinks = navigation.getElementsByTagName('a');
    var subNav = document.getElementById(subNavId);
    var subNavDiv = document.getElementById('ucTopNav_subNav');
    var subNavElements = subNavDiv.getElementsByTagName('ul');
    
    if(el.parentNode.getAttribute('originalClass')){
        el.parentNode.className = el.parentNode.getAttribute('originalClass');
    }
    for(i = 0; i < navigationLinks.length; i++){
        navigationLinks[i].className = '';
    }
    if(el.getAttribute('class') != 'over' || !el.getAttribute('class')){
        el.className = 'over';  
    } 
    for(i = 0; i < subNavElements.length; i++){
        subNavElements[i].style.visibility = 'hidden';
    }

    for(i = 0; i < navigationLinks.length; i++){
        if(navigationLinks[i].id != el.id){
            navigationLinks[i].className = 'out';           
        }else{
            navigationLinks[i].className = 'over';
        }
    }
    
    subNav.style.visibility = 'visible';
}

function initialiseNav(){     
    var subNavDiv = document.getElementById('ucTopNav_subNav');
    var subNav = subNavDiv.getElementsByTagName('ul');
    var mainNav = document.getElementById('ucTopNav_nav');
    var mainNavLinks = mainNav.getElementsByTagName('a');
        
    for(i = 0; i < subNav.length; i++){

        repositionSubNav(document.getElementById('subNav_'+subNav[i].id), subNav[i]);

    }
    
    for(i = 0; i < subNav.length; i++){

        if(subNav[i].className == 'active'){
            subNav[i].style.visibility = 'visible';
        }
    }

    
    // Add event listeners to the nav elements
    for(i = 0; i < mainNavLinks.length; i++){
        if(mainNavLinks[i].id != ""){
            mainNavLinks[i].onmouseover = function() {
                mainNavOver(this, this.id.replace('subNav_', ''));
            }
            
            mainNavLinks[i].onmouseout = function(){
                mainNavOut(this);
            }
        }
    }
    
    document.getElementById('ucTopNav_subNav').onmouseout = function(){
        mainNavOut()
		
    }
    
    document.getElementById('ucTopNav_subNav').onmouseover = function(){
        holdMainNav()
		
    }
	
	
	
}

function repositionSubNav(menuItem, subNav){
    subNav.style.left = '0px';
    var subNavDiv = document.getElementById('ucTopNav_subNav');
    var subNavDivCor = findPos(subNavDiv);
    var subNavDivRightCor = subNavDivCor[0] + subNavDiv.offsetWidth;
    var menuItemCor = findPos(menuItem);
    var subNavCor = findPos(subNav);
    var menuItemMiddle = menuItemCor[0] + (menuItem.offsetWidth / 2);
    var subNavMiddle = subNavCor[0] + (subNav.offsetWidth / 2);
    var newSubNavPos = menuItemMiddle - subNavMiddle;
    var subNavRightCor = (newSubNavPos + subNavDivCor[0]) + subNav.offsetWidth;
    
    if((newSubNavPos + subNavDivCor[0]) < subNavDivCor[0]) return false;
    if(subNavRightCor > subNavDivRightCor) return false;
    
    subNav.style.left = newSubNavPos + 'px';

}

function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return [curleft,curtop];
}

function mainNavOut(){
    timer = setTimeout("restoreMainNav()", 50);
}

function holdMainNav(){
    clearTimeout(timer);
}

function restoreMainNav(){
    var navigation = document.getElementById('ucTopNav_mainNav');
    var navElements = navigation.getElementsByTagName('li');
    var navLinks = navigation.getElementsByTagName('a');
    var subNav = document.getElementById('ucTopNav_subNav');
    var subNavElements = subNav.getElementsByTagName('ul');
    for(i = 0; i < navLinks.length; i++){
        navLinks[i].className = '';
    }
    for(i = 0; i < navLinks.length; i++){
        navLinks[i].removeAttribute('style');
        if(navLinks[i].className == 'over'){
            navLinks[i].className = '';
        }
    }
    for(i = 0; i < subNavElements.length; i++){
        if(subNavElements[i].className != 'active'){
            subNavElements[i].style.visibility = 'hidden';
        }else{
			
		 sNav =  subNavElements[i].style.visibility = 'visible';
	
        }
    }
}

function showHide(container, image) {
	var container = document.getElementById(container);
	var image = document.getElementById(image);
	var imageSrc = image.src;
	if (container.style.display == "none" || container.style.display == "") {
		container.style.display = "block";
		image.src = imageSrc.replace(/\+/,"-");
	} else {
		container.style.display = "none";
		image.src = imageSrc.replace(/\-/,"+");
	}
}








// to load multiple function at the same time without conflict
function initOn(){
	window.onload = initGo;
}

function initGo(){
	for(var i = 0;i < init.length;i++)
		eval(init[i]);
}

function initAdd(func){
	init[init.length] = func;
}

var init = new Array();