var navigations = [];
navigations['mainnav']      = 'imgshift';
navigations['footernav']    = 'imgshift';
navigations['subnav']       = 'expand';
navigations['blog-archive'] = 'expand';
function addEvent(obj,evt,fn) {
  if (document.addEventListener) {
    addEvent = function (obj,evt,fn) {
      obj.addEventListener(evt,fn,false);
    }
  }
  else if (document.attachEvent) {
    addEvent = function (obj,evt,fn) {
      obj.attachEvent('on'+evt,fn);
    }
  }
  addEvent(obj,evt,fn);
}
function handleEvent(e, state, effect) {
    var target;
    if (!e)
        var e = window.event;
    if (e.target)
        target = e.target;
    else if (e.srcElement)
        target = e.srcElement;
    if (target.nodeType == 3) // defeat Safari bug
        target = entry.parentNode;

    if (effect == 'imgshift')
        imgshift(target, state);
    else if (effect == 'expand')
        expand(target);
}
function imgshift(target, state) {
    if (target.tagName != 'IMG' || target.style.display == 'none' || !target.complete)
        return;

    var height = target.height / 4; // 4 states in one file

    var base_offset = 0;
    if(hasClass(target, 'active'))
        base_offset = -3;

    // over event - show second image
    if (state == 1 || state == 3) {
        target.style.marginTop = -1 * height + 'px';
    }
    // out event - show first image
    else if (state == 0){
        target.style.marginTop = base_offset * height + 'px';
    }
    // down event - show third image
    else if (state == 2){
        target.style.marginTop = -2 * height + 'px';
    }
    // off event - show first image
    else {
        target.style.marginTop = base_offset * height + 'px';
    }
}
function expand(target) {
    if (!(target.tagName == 'A' || target.tagName == 'SPAN') || target.style.display == 'none')
        return;

    var branch = target.tagName == 'A' ? target : target.parentNode; // A tag not SPAN tag
    var ul = nextObject(branch);
    if (ul != null)
        branch = ul;
    else
        branch = branch.parentNode.parentNode; // ul


    // up event
    if (branch != null) {
        // find my top parent
        var openList = [];
        while (branch && branch.tagName == 'UL'){
            openList[openList.length] = branch;
            branch = branch.parentNode.parentNode; // ul li ul
        }
        // close all branches
        closeTree(openList[openList.length-1]);
        // open the selected branch and all its parents
        for (var i in openList){
            var obj = openList[i];
            obj.style.display = '';
            replaceClass(prevObject(obj), 'closed', 'open');
        }
    }
}
function getElementsByClassName( strClassName, obj, list ) {
    if (obj == null)
        return;

    if ( hasClass(obj, strClassName) )
        list[list.length] = obj;

    for ( var i = 0; i < obj.childNodes.length; i++ )
        getElementsByClassName( strClassName, obj.childNodes[i], list );
}
function hasClass (obj, strClassName){
    if (obj == null || obj.className == null)
        return 0;

    var found = obj.className.indexOf(strClassName) != -1 ? 1 : 0;
    return found;
}
function replaceClass(obj, oldClass, newClass){
    if (obj == null || obj.className == null)
        return 0;

    if (hasClass(obj, oldClass)){
        obj.className = obj.className.replace(RegExp("\\s*" + oldClass + "\\s*"),'');
    }
    if (!hasClass(obj, newClass))
        if (obj.className)
            obj.className = obj.className + ' ' + newClass;
        else
            obj.className = newClass;
}
function enhance(navobj, effect){
    if (effect == 'imgshift'){
        addEvent(navobj, 'mouseup',   function (e) { handleEvent(e, 3, 'imgshift'); });
        addEvent(navobj, 'mousedown', function (e) { handleEvent(e, 2, 'imgshift'); });
        addEvent(navobj, 'mouseover', function (e) { handleEvent(e, 1, 'imgshift'); });
        addEvent(navobj, 'mouseout',  function (e) { handleEvent(e, 0, 'imgshift'); });

        // if IE remove alt tags from navigation images and show the previous sibling span if image load failed
        if (navigator.appName == 'Microsoft Internet Explorer'){
            removeAltAttributeForIE(navobj);
        }
    }
    else if (effect == 'expand'){
        addEvent(navobj, 'mouseup',   function (e) { handleEvent(e, 0, 'expand'); });
    }

    var list = [];
    getElementsByClassName( 'active', navobj, list );
    for ( var i = 0; i < list.length; i++ ) {
        var obj = list[i];
        if (effect == 'imgshift')
            imgshift(obj, 0);
        else if (effect == 'expand')
            expand(obj);
    }
}
function nextObject(obj) {
    do obj = obj.nextSibling;
    while (obj && obj.nodeType != 1);
    return obj;
}
function prevObject(obj) {
    do obj = obj.previousSibling;
    while (obj && obj.nodeType != 1);
    return obj;
}
function closeTree(obj) {
    if (obj){
        for ( var i = 0; i < obj.childNodes.length; i++ ) {
            if (obj.tagName == 'UL' || obj.tagName == 'LI'){
                closeTree( obj.childNodes[i] );
            }
        }
        if (obj.tagName == 'UL'){
            obj.style.display = 'none';
            replaceClass(prevObject(obj), 'open', 'closed');
        }
    }
}
function removeAltAttributeForIE(obj) {
    if (obj){
        // only remove alt attribute value for completed images
        if (obj.tagName == 'IMG'){
            if (obj.complete){
                obj.alt = '';
            }
            else {
                prevObject(obj).style.display = 'inline';
                obj.style.display = 'none';
            }
        }
        else {
            for ( var i = 0; i < obj.childNodes.length; i++ ) {
                removeAltAttributeForIE( obj.childNodes[i] );
            }
        }
    }
}

// register event listeners
addEvent(window, 'load', function () {
    debugDiv    = document.getElementById('content-body');

    // nav image replacement on mouse event
    for( var i in navigations ) {
        var navobj = document.getElementById(i);
        // enhance experience
        if (navobj != null)
            enhance(navobj, navigations[i]);
    }
});