// Global navigation script
// Inspired by http://www.alistapart.com/articles/whereami
// Modified February 6, 2007, granroth@msu.edu
//
// Show where you are.
//  Provide a custom id, #active, on the global link for the section you are in.
// 
// The first argument is the id of the global navigation container element.
// The second argument is the depth of the directory that contains the sections.
// i.e., if <ul id="nav"> and the main sections are the first level directories, 
//   use globalNav("nav",1)

function globalNav(id,categoryDepth) 
{    
    // Get the category from the URL
    var currentCat = getCategory(window.location.pathname, categoryDepth);
    
    // Collect the anchors in the global navigation as an array.
    var navNode = document.getElementById(id);
    var navLinks = navNode.getElementsByTagName("a");    
    
    // Compare category from URL to categories in the anchors
    if (currentCat.length > 0) {
        for (var i=0; i<navLinks.length; i++){
            var navLink = navLinks[i].pathname;
            var navCat = getCategory(navLink, categoryDepth);
            // If the categories match, tag the anchor with id="active"
            if (navCat == currentCat){
                navLinks[i].setAttribute("id","active");
                return true;
            }
        }
    } else {
        // There is no category, so assume root level of the site.
        // Set the "Home" link, first in the array, as a match.
        navLinks[0].setAttribute("id","active");
        return true;
    }
    return false;
}


function getCategory(path,depth)
{

    // IE does not start some paths with a slash, while other browsers do. 
    // Make sure there is a slash at the beginning of the file path.
    if (path.substr(0,1) !== "/"){
        path = "/"+path;
    }
    var splitPath = path.split("/");
    var category = splitPath[depth];
    
    return category;
}





// Dec 12, 2006
// Need another script, this one to do the random img load for the banners.
function randomimg(linkId, imgId) 
{
if(document.getElementById(linkId)) {
	// 1. Create array of img src values
		var srcvalue = Array();
		
		srcvalue[0] = Array(
			"/images/hp-graphics/Broadcasting-Services.gif",
			"http://wkar.org",
			"MSU Broadcasting Services"
		);
		
		srcvalue[1] = Array(
			"/images/hp-graphics/computerstore.gif",
			"http://www.cstore.msu.edu/",
			"The MSU Computer Store"
		);
	
		srcvalue[2] = Array(
			"/images/hp-graphics/library-2.gif",
			"http://www.lib.msu.edu/",
			"MSU Libraries"
		);
	
		srcvalue[3] = Array(
			"/images/hp-graphics/vudat.gif",
			"http://vudat.msu.edu/",
			"Virtual University Design and Technology"
		);
		
	
	// 2. Pick a random value from srcvalue array
		var img = Math.floor(srcvalue.length * Math.random());
	
	// 3. Replace the src attribute value of #randomImg with value from 2
		document.getElementById(linkId).setAttribute("href",srcvalue[img][1]);
		document.getElementById(imgId).setAttribute("src",srcvalue[img][0]);
		document.getElementById(imgId).setAttribute("alt",srcvalue[img][2]);
	}
}



// Feb. 6, 2007
// How about a function instead that ties a custom image to a specific category?
// Build an array that ties a category name to a specific image, then check the category and load that image.
function categoryImg(imgId, categoryDepth) 
{
    var category = Array();
    category["about"]               = "/images/banner/hpcc-attendees-1.jpg";
    category["bestpractices"]       = "/images/banner/hand-mouse.jpg";
    category["contact"]             = "/images/banner/network-cables.jpg";
    category["guidelines-policies"] = "/images/banner/code.jpg";
    category["resources-documents"] = "/images/banner/pen-diagram.jpg";
    category["index.html"]          = "/images/banner/tech1.jpg";
    category[""]                    = "/images/banner/tech1.jpg";
    
    var cat = getCategory(window.location.pathname, categoryDepth);
    // alert(cat);
    // Does category[cat] have a value?
    // If it matches an existing category key, use the corresponding value.
    // Otherwise, return false.
    if(category[cat].length > 0) {
        var imgsrc = category[cat];
        document.getElementById(imgId).setAttribute("src",imgsrc);
        return true;
    } else {
        return false;
    }
    
    
}

// extensions, addClass, and classifyLinks are used to append a class 
// to a elements whose href values end with certain extensions. 
// It also adds a target="_blank" to those a elements.
function extension(ext) {
	var exts = document.getElementsByTagName("a"),
		extMatch = new Array(), index, attr;
		
	for(var i=0; i<exts.length; i++) {
		attr = exts[i].getAttribute('href');
		index = attr.indexOf('.' + ext);
		//the extension is located at the end of the href
		if(index != -1 && index + ext.length == (attr.length - 1)) {
			extMatch[extMatch.length] = exts[i];
		}
	}
	return extMatch;
}

function addClass(el, className) {
	if(el.className == '')
		el.className = className;
	else {
		var currClasses = el.className;
		currClasses = currClasses + ' ' + className;
		el.className = currClasses;
	}
}

function classifyLinks(ext) {
	var links = extension(ext);
	for(var i=0; i<links.length; i++) {
		addClass(links[i], ext);
		links[i].setAttribute('target', '_blank');
	}
}



// Fire up the globalNav using the adddomloadevent.js function
// When posting files to the actual lct web document root, 2nd argument will have to be changed to 1.
addDOMLoadEvent(function () {
    // globalNav('globalNav',1);
	categoryImg('randomImg',1);
	classifyLinks('pdf');
});

// This one needs to come last, or it short circuits the others. Because it returns false?
addDOMLoadEvent(function() {
    randomimg('linkid', 'hpFeature');
});