/* A more universal method for getElementById, which returns the base element.
    Use element.obj to access the object property, and element.style for the style property */
function getObj(name)
{
  if (document.getElementById)
  {
  	this.obj = document.getElementById(name);
	this.style = document.getElementById(name).style;
  }
  else if (document.all)
  {
	this.obj = document.all[name];
	this.style = document.all[name].style;
  }
  else if (document.layers)
  {
   	this.obj = document.layers[name];
   	this.style = document.layers[name];
  }
  return this;
}

/* This code  for Netscape 4 is not currently implemented */
function getObjNN4(obj,name)
{
	var x = obj.layers;
	var thereturn;
	for (var i=0;i<x.length;i++)
	{
		if (x[i].id == name)
		 	thereturn = x[i];
		else if (x[i].layers.length)
			var tmp = getObjNN4(x[i],name);
		if (tmp) thereturn = tmp;
	}
	return thereturn;
}


/* Opacity function (element, initial opacity, ending opacity, speed of fade) 
    Thanks to */

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;
    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

/* change the opacity for different browsers
  className change to visible */
function changeOpac(opacity, id) {
    if (!id.style) { var objStyle = getObj(id).style; } else (objStyle = id.style);
    // x.className="visible";
    if (objStyle.MozOpacity != null) { objStyle.MozOpacity = (opacity / 100); }
    else if (objStyle.opacity != null) { objStyle.opacity = (opacity / 100); }
    else if (objStyle.KhtmlOpacity != null) { objStyle.KhtmlOpacity = (opacity / 100); }
    else if (objStyle.filter != null) { objStyle.filter = "alpha(opacity=" + opacity + ")"; }
    else return;
}



/* CheckMouseEnter and Leave negate the effects of bubbling for mouseover and out events.
    They are also the cause of the mouseout not being recognized if the mouseenter event is still
    running while the mouseout occurs, which happens if the user mouses in and out too quickly */

function checkMouseEnter (element, evt) {
 stopEvent (evt); /* a function build into misc/drupal.js which stops the event from propogating (bubbling) */
 if (element.contains && evt.fromElement) {
    return !element.contains(evt.fromElement);
  }
  else if (evt.relatedTarget) {
    return !containsDOM(element, evt.relatedTarget);
  }
}

function checkMouseLeave (element, evt) {
 stopEvent (evt);
 if (element.contains && evt.toElement) {
    return !element.contains(evt.toElement);
  }
  else if (evt.relatedTarget) {
    return !containsDOM(element, evt.relatedTarget);
  }
}

function containsDOM (container, containee) {
  var isParent = false;
  do {
    if ((isParent = container == containee))
      break;
    containee = containee.parentNode;
  }
  while (containee != null);
  return isParent;
}



/* addEventX, addEvent, removeEventX, and removeEvent are written to be cross-platform compatible.  
    IE uses attachEvent/detachEvent, WC3 browsers use addEventListener/removeEventListener. */
/* Send arguments to addEvent for processing: (the object, "the event name", "the function to be run") */
function addEventX (obj, evt, fun) {
    if ( obj.addEventListener ) { obj.addEventListener(evt, function (e) {obj[fun] (e);}, false); }
    else if ( obj.attachEvent ) { obj.attachEvent ("on"+evt, function (e) {obj[fun] (e);} ); }
    else {
        var oldEvt = obj["on" + evt];
        if (oldEvt) {obj['on'+evt]=function(e) {oldEvt(e); obj[fun] (e); }; }
        else { obj['on'+evt]=obj[fun]; }
    }
}

var eventCt = 0;

function addEvent (obj, fun, evt) {
    if ( obj[fun+evt] ) { return; }
    obj['addEvent' + eventCt] = window[fun];
    obj[fun+evt] = true;
    addEventX (obj, evt, 'addEvent'+ eventCt);
    eventCt++;
}


function removeEventX (obj, evt, fun) {
    if ( obj.addEventListener ) { obj.removeEventListener(evt, function (e) {obj[fun] (e);}, false); }
    else if ( obj.attachEvent ) { obj.detachEvent ("on"+evt, function (e) {obj[fun] (e);} ); }
    else {
        var oldEvt = obj["on" + evt];
        if (oldEvt) {obj['on'+evt]=function(e) {oldEvt(e); obj[fun] (e); }; }
        else { obj['on'+evt]=obj[fun]; }
    }
}

var eventCt = 0;

function removeEvent (obj, fun, evt) {
    if ( obj[fun+evt] ) { return; }
    obj['addEvent' + eventCt] = window[fun];
    obj[fun+evt] = true;
    addEventX (obj, evt, 'addEvent'+ eventCt);
    eventCt++;
}


/* Function imgTags below creates an array and sets each element in the array's event handlers using
    rowEvents.  rowEvents accepts one element at a time and a switch 'property'. 
    On 'visible' (for mouseover) and 'hidden' (for mouseout) set the element's class and the 
        "News and Notices" banner to visible or hidden, create a border around the element,
        and resize the element to allow for the border space.
    On mouseclick, set the default background to the element, and change the border to white inset.
    On mouseout and mouseup, restore the images to their original state.
    */

var defaultBackground;  /* used as a global variable to store the currently selected default background */
    
function rowEvents (elem, prop) {
    var y = elem.id.charAt (6);
    var z = getObj ('bg' + y + '').obj;
    var title = getObj ('newstitle');
    switch (prop) {
        case "visible": {
            z.className = 'visible bg';
            title.style.backgroundColor = 'Transparent';
            if (y == 5) { elem.style.width = "69px"; }  /* the middle image's regular width is 73 px */
            else { elem.style.width = "83px"; }         /* subtract 4 for the border (2px * 2 sides) */
            elem.style.height = "54px";
            elem.style.border = "2px outset #ff9900";
            break; }
        case "hidden": {
            z.className = 'hidden bg';
            title.style.backgroundColor = 'Ivory';
            if (elem.id != defaultBackground.id) { 
                if (y == 5) { elem.style.width = "73px"; }
                    else { elem.style.width = "87px"; }
                elem.style.height = "58px";
                elem.style.border = 0; }
            else { elem.style.border = "2px groove #ff9900"; }
            break; }
        case "setDefaultBg": { 
            if (defaultBackground == elem) break;
            var defBg = getObj ('bg0');
            if (defBg.obj.currentStyle) {
                defBg.style.backgroundImage = z.currentStyle.backgroundImage; }
            else if (window.getComputedStyle) {
                defBg.style.backgroundImage = 
                document.defaultView.getComputedStyle(z,null).getPropertyValue('background-image'); }
            if (y == 5) { elem.style.width = "69px"; }
            else { elem.style.width = "83px"; }
            elem.style.height = "54px";
            elem.style.border = "2px inset #ff9900";
            /* code below keeps the border around the currently selected defaultBackground's footer */
            var defY = defaultBackground.id.charAt (6); 
            if (defY == 5) { defaultBackground.style.width = "73px"; }
            else { defaultBackground.style.width = "87px"; }
            defaultBackground.style.height = "58px";
            defaultBackground.style.border = 0;
            defaultBackground = elem;
            changeOpac (10, defBg);
            opacity (z.id, 10, 99, 400);
            setTimeout ("changeOpac (99, \'bg0\')", 400);
            break; }
        case "mouseup": { elem.style.border = "2px groove #ff9900"; break; }
        default: break; 
    }
}

function imgTags (parentId, tagId) {
    // pId is an array which store the 9 images 'footer1' through 'footer9')
    if (parentId.getElementsByTagName) {
        var pId = parentId.getElementsByTagName (tagId); }
    else if (parentId.all) {
        var pId = parentId.all.tags (tagId); }
    else { return; }  // return if these DOM functions are not available 
    /*  this for loop sets the mouseover and out events for the images.
        The anonymous functions run when the event fires, so vars y and z have to be retrieved at that time*/
    for (var i=0; i < pId.length; i++) {
        pId[i].onmouseover = function () { rowEvents (this, 'visible'); }
        pId[i].onmouseout = function () { rowEvents (this, 'hidden'); }
        pId[i].onmousedown = function () { rowEvents (this, 'setDefaultBg'); }
        pId[i].onmouseup = function () { rowEvents (this, 'mouseup'); }
    }
    return pId;
}



// function fadeinGr (event) { 
//    if (this.style.opacity < 99) { opacity (this.id, 98, 99, 0); } }


/* fade the background div 'news_fader' in when mouseovered and out when mouseouted */
function newsOver (event) {
    if (checkMouseEnter (this, event)) { 
        opacity ('news_fader', 10, 99, 200);
        changeOpac (99, 'graphics');
		this.className='scroll'; }  }

function newsOut (event) {
    if (checkMouseLeave (this, event)) { 
        opacity ('news_fader', 99, 10, 200);
        changeOpac (99, 'graphics');
		this.className='noscroll'; }  }

/* cause the graphics div to become transparent when 'image_row' is mouseovered, and opaque when mouseouted */
function imgRowOver (event) {
    if (checkMouseEnter (this, event)) { opacity ('graphics', 99, 10, 300); 
        opacity ('busi_site', 99, 10, 300); } }
function imgRowOut (event) {
    if (checkMouseLeave (this, event)) { opacity ('graphics', 10, 99, 300);
        opacity ('busi_site', 10, 99, 300); } }

function removeEv () {
    var news = getObj('news_front');
    removeEvent (news, 'newsOver', "mouseover");
    removeEvent (news, 'newsOut', "mouseout");
//    var grap = getObj ('graphics').obj;
//    addEvent (grap, 'fadeinGr', "mouseover");
    var iRow = getObj ('image_row').obj;
    var imgs = imgTags (iRow, 'img'); /* imgTags also sets the mouseover event for all 9 images in 'image_row' */
    removeEvent (iRow, 'imgRowOver', "mouseover");
    removeEvent (iRow, 'imgRowOut', "mouseout");
}

function loadEv () {
    defaultBackground = getObj ('footer5').obj;
        defaultBackground.style.width = "69px";
        defaultBackground.style.height = "54px";
        defaultBackground.style.border = "2px groove #ff9900";
    var news = getObj('news_front').obj;
    changeOpac (50, 'news_fader'); /* initially set 'news_fader' to paritally visible */
    addEvent (news, 'newsOver', "mouseover");
    addEvent (news, 'newsOut', "mouseout");
//    var grap = getObj ('graphics').obj;
//    addEvent (grap, 'fadeinGr', "mouseover");
    var iRow = getObj ('image_row').obj;
    var imgs = imgTags (iRow, 'img'); /* imgTags also sets the mouseover event for all 9 images in 'image_row' */
    addEvent (iRow, 'imgRowOver', "mouseover");
    addEvent (iRow, 'imgRowOut', "mouseout");
    //removeEv (window, 'removeEv', "onunload");
}

addLoadEvent (loadEv); 

/* load the event calls for the image row */
window.onunload = function () {removeEv};
// addLoadEvent (styleByHeight);