// JavaScript Document

var activeNavItem;
var activeSubNavItem;

// ---

var mainNavigation;
var subNavigation;

// ---

var about;
var work;
var contact;
var links;

function initNavigation() {

                // LABEL

                var label                      = document.createElement("a");
                var labelImage                 = document.createElement("img");

                label.href = "#";
                label.onclick = showNavigation;
                labelImage.src = "images/mainLabel.png"
                addAttribute(labelImage, "id", "mainNavigationLabel");
                label.appendChild(labelImage);

                mainNavigationNode.appendChild(label);

                mainNavigation        = document.createElement("span");

                // ABOUT

                about = document.createElement("img");

                var aboutLink          = document.createElement("a");
                aboutLink.appendChild(about);
                aboutLink.href = "#";
                mainNavigation.appendChild(aboutLink);

                about.src = "images/about.png";

                about.onclick          = function() { initAbout(about); };
                about.onmouseover = function() { mainNavOver(about); };
                about.onmouseout  = function() { mainNavOut(about); };

                // WORK

                work = document.createElement("img");

                var workLink           = document.createElement("a");
                workLink.appendChild(work);
                workLink.href = "#";
                mainNavigation.appendChild(workLink);


                work.src = "images/work.png";

                work.onclick         = function() { initWork(work); };
                work.onmouseover = function() { mainNavOver(work); };
                work.onmouseout  = function() { mainNavOut(work); };

                // CONTACT

                contact = document.createElement("img");

                var contactLink          = document.createElement("a");
                contactLink.appendChild(contact);
                contactLink.href = "#";
                mainNavigation.appendChild(contactLink);

                contact.src = "images/contact.png";

                contact.onclick            = function() { initContact(contact); };
                contact.onmouseover = function() { mainNavOver(contact); };
                contact.onmouseout  = function() { mainNavOut(contact); };

                // LINKS

                links = document.createElement("img");

                var linksLink            = document.createElement("a");
                linksLink.appendChild(links);
                linksLink.href = "#";
                mainNavigation.appendChild(linksLink);

                links.src = "images/links.png";

                links.onclick          = function() { initLinks(links); };
                links.onmouseover = function() { mainNavOver(links); };
                links.onmouseout  = function() { mainNavOut(links); };

                // ---

                mainNavigationNode.appendChild(mainNavigation);

        }

var isNavigationVisible = true;

function showNavigation() {

                if(isNavigationVisible) {
                        hideNavigation();
                        }

                else {
                        mainNavigationNode.appendChild(mainNavigation);
                        if(subNavigation != null) subNavigationNode.appendChild(subNavigation);
                         isNavigationVisible = true;
                        }

        }


function hideNavigation() {
	
		 removeTooltip();

         isNavigationVisible = false;

         try {
             mainNavigationNode.removeChild(mainNavigation);
             if(subNavigation != null) subNavigationNode.removeChild(subNavigation);
         } catch(e) {

         }

        }

function subNavOver(node) {
        if(node != activeSubNavItem && activeSubNavItem != null) changeStatusSub(activeSubNavItem);
        if(node != activeSubNavItem) changeStatusSub(node);
        }

function subNavOut(node) {
        if(node != activeSubNavItem && activeSubNavItem != null) changeStatusSub(activeSubNavItem);
        if(node != activeSubNavItem) changeStatusSub(node);
        }

function changeStatusSub(node) {

        var dashes = node.getElementsByTagName('img');

        if(dashes.length == 0) return;

        var src = dashes[0].src;

        if(src.indexOf("_hidden") != -1) {
                src = src.substring(0, src.indexOf("_hidden")) + src.substring(src.indexOf("_hidden") + ("_hidden").length);
                }

        else {
                src = src.substring(0, src.indexOf(".png")) + "_hidden" + ".png";
                }

        dashes[0].src = src;
        dashes[1].src = src;

        }

function mainNavOver(img) {
        if(img != activeNavItem && activeNavItem != null) changeStatus(activeNavItem);
        if(img != activeNavItem) changeStatus(img);
        }

function mainNavOut(img) {
        if(img != activeNavItem && activeNavItem != null) changeStatus(activeNavItem);
        if(img != activeNavItem) changeStatus(img);
        }


function changeStatus(node) {
	
        var src = node.src;

        if(src == null) return;
	
        if(src.indexOf("_over") != -1) {
                src = src.substring(0, src.indexOf("_over")) + src.substring(src.indexOf("_over") + ("_over").length);
                }

        else {
                src = src.substring(0, src.indexOf(".png")) + "_over" + ".png";
                }

        node.src = src;

        }