(function NavSetup() {
    //BEGIN CONFIGURATION
    //Button data to specify 
    var navButtons = [
        //Games
        {
            image: "menuimages/arcade_game.png",
            text: "Games",
            link: "gamescode.htm",
            details: "Over 100 original educational games in all subjects"
        },
        
        //Math
        {
            image: "menuimages/calculator.png",
            text: "Math",
            link: "mathcode.htm",
            details: "Award-winning math applications such as Drag N Drop Math and GraphMaster"
        },
        
        //Language Arts
        {
            image: "menuimages/book.png",
            text: "Language Arts",
            link: "langcode.htm",
            details: "Dozens of spelling, vocabulary, phonics, and reading comprehension resources"
        },
        
        //History
        {
            image: "menuimages/lincoln.png",
            text: "History",
            link: "historycode.htm",
            details: "Learn American history through interactive maps, research applications, and activity. "
        },
        
        //Geography
        {
            image: "menuimages/eart.png",
            text: "Geography",
            link: "circumcode.htm",
            details: "Learn about the world through numerous interactive maps and activities."
        },
        
        //USA and States
        {
            image: "menuimages/statue_liberty.png",
            text: "USA and States",
            link: "stateimageindex.htm",
            details: "Over 100 interactive maps of the U.S., its states, regions and more."
        },
        
        //Science
        {
            image: "menuimages/panda.png",
            text: "Science",
            link: "zoocode.htm",
            details: "Interactive learning resources on the Amazon, Birds, Reptiles, Biomes, and much more."
        },
        
        //Printables
        {
            image: "menuimages/printer.png",
            text: "Printables",
            link: "printables.htm",
            details: "Printables reading comprehension and interactive notebook activities."
        },
        
        //Videos
        {
            image: "menuimages/television_01.png",
            text: "Videos",
            link: "videos.htm",
            details: "Over 100 videos on animals, geography, history, the United States, and much more."
        },
        
        //Recess
        {
            image: "menuimages/board_game.png",
            text: "Recess",
            link: "arcade.htm",
            details: "Take a break from your studies and play some addictive games."
        },
        
        //About
        {
            image: "menuimages/about_me.png",
            text: "About",
            link: "about.htm",
            details: "Learn about me, take a tour of my actual classroom, and learn all about mrnussbaum.com"
        },
        
        //What's New?
        {
            image: "menuimages/whats_new_01.png",
            text: "What's New?",
            link: "newsletter.htm",
            details: "What's new on MrNussbaum.com?"
        },
        
        //Apps & Products
        {
            image: "menuimages/app_01.png",
            text: "Apps &amp; Products",
            link: "apps.htm",
            details: "Learn about mrnussbaum.com products such as mobile apps, licensing opportunities, and custom game development. "
        },
        
        //Labs
        {
            image: "menuimages/science_lab_02.png",
            text: "Mr.N Labs",
            link: "labs.htm",
            details: "Learn about my other free sites like mathtourney.com, mygreatmaps.com, and thelostlunchbox.com"
        },
        
        //Win Prizes
        {
            image: "menuimages/win_prizes_01.png",
            text: "Win Prizes",
            link: "contests.htm",
            details: "Join my Facebook fan page and you might win an awesome prize like an IPAD or Kindle."
        },
        
        //Parents & Teachers
        {
            image: "menuimages/apple.png",
            text: "Parents &amp; Teachers",
            link: "parentteacher.htm",
            details: "Information about how to use MrNussbaum.com for parents and teachers. "
        },
        
        //Site Map
        {
            image: "menuimages/site_map.png",
            text: "Site Map",
            link: "sitedirectory.htm",
            details: "Links to all MrNussbaum.com activities"
        },
        
        //Contact Me
        {
            image: "menuimages/contact_me.png",
            text: "Contact Me",
            link: "contact.htm",
            details: "Contact me via e-mail"
        }
    ];
    
    //Location of resource files (e.g. images)
    var resourceBase = '/'
    
    //Colors
    var buttonColor = '#00DDDD';
    var buttonHoverColor = '#33cc33';
    
    //END CONFIGURATION
    
    //Error assertion
    function assert(condition, error) {
        if(!condition) throw 'Assertion: ' + error;
    }
    
    //URL building functions
    function resourceURL(name) {
        return resourceBase + name;
    }
    
    function linkURL(pagename) {
        return pagename;
    }
    
    //The nav bar's parent div
    var parentDiv = document.getElementById('NavParent');
    
    assert(parentDiv, 'A DIV with id "NavParent" must be placed before the nav bar can be built.');
    
    
    parentDiv.style.width = '1060px';
    parentDiv.style.height = '135px';
    parentDiv.style.position = 'relative'
    var detailsDiv = document.createElement('div');;
    var buttonWidth = 115, buttonHeight = 50;
    var buttonMargin = 2;
    for(var i = 0; i < navButtons.length; i++) {
        var buttonData = navButtons[i];
        
        //Create the button div
        var buttonDiv = document.createElement('div');
        buttonDiv.style.position = 'absolute';
        buttonDiv.style.cssFloat = 'left';
        buttonDiv.style.cursor = 'pointer';
        buttonDiv.style.width = buttonWidth + 'px';
        buttonDiv.style.height = buttonHeight + 'px';
        buttonDiv.style.backgroundColor = buttonColor;
        
        //Set the location
        var gridX, gridY;
        gridX = i%9;
        gridY = Math.floor(i/9);
        buttonDiv.style.left = (gridX*(buttonWidth + buttonMargin))+'px';
        buttonDiv.style.top = (gridY*(buttonHeight + buttonMargin))+'px';
        
        //Place the image
        var imgDiv = document.createElement('div');
        imgDiv.style.position = 'absolute';
        imgDiv.style.top = '2px';
        imgDiv.style.width = '100%';
        imgDiv.style.textAlign = 'center';
        var img = document.createElement('img');
        img.src = resourceURL(buttonData.image);
        
        imgDiv.appendChild(img);
        buttonDiv.appendChild(imgDiv);
        
        //Place the caption
        var captionDiv = document.createElement('div');
        captionDiv.style.position = 'absolute';
        captionDiv.style.bottom = '4px';
        captionDiv.style.width = '100%';
        captionDiv.style.font = 'bold 12px Arial';
        captionDiv.style.textAlign = 'center';
        captionDiv.innerHTML = buttonData.text;
        buttonDiv.appendChild(captionDiv);
        
        //Set up events
        (function(buttonData) {
            buttonDiv.onmouseover = function() {
                this.style.backgroundColor = buttonHoverColor;
                detailsDiv.innerHTML = buttonData.details;
            }
            
            buttonDiv.onmouseout = function() {
                this.style.backgroundColor = buttonColor;
                detailsDiv.innerHTML = '';
            }
            
            buttonDiv.onclick = function() {
                location.href = linkURL(buttonData.link);
            }
        })(buttonData);
        
        parentDiv.appendChild(buttonDiv);
    }
    
    parentDiv.appendChild(document.createElement('br'));
    detailsDiv.style.width = '100%';
    detailsDiv.style.height = '30px';
    detailsDiv.style.position = 'absolute';
    detailsDiv.style.bottom = '0px';
    parentDiv.appendChild(detailsDiv);
    
})();
