﻿/*
This file controls the behavior for the marketing box on the home page. A few items to note:

#mbNav refers to the div that contains the items that are moused over - these items drive the content swap
#topWrapperMainImage loads every image on page load - we tried doing this w/bg images, but IE has a flicker issue, so we
   solved it w/z-indexes. We simply reset the z-index on the image that should be shown
#twContent contains the divs that hold the text on the image - by default, they are all hidden on load and shown when appropriated
#mbNav divs have IDs that correspond to #topWrapperMainImage div's classes - these must match, #twContent has divs w/ids that contain
   the #mbNav ids + the word 'Content' (eg. mbHomeContent) - again, these must match.
*/
$(document).ready(function()
{
  swapTimer = ""; //timer variable for mouseover/mouseout functions
  justSelected = "";  //also used in the mouseOvers and mouseOuts

  //load mainBarker - check hash tag
  var hash = window.location.hash.substring(1);   //trim off the #

  if (hash == "" || !document.getElementById("mb" + hash))  //no hash or bogus hash (need to add in mb - simply removed for aesthetics)
    justSelected = "#mbHome";
  else
    justSelected = "#mb" + hash;

  showContent();
  setInterval(pollHash, 100); //start polling the hash tag
  
  //attach mouseover/outs w/a delay
  $("#mbNav div").mouseover(function()
  {
    var x = $(this).attr("id");
    swapTimer = setTimeout(function()
    {
      window.location.hash = x.substring(2); //trim the mb - strictly so the url is readable
    }, 200);
  });

  $("#mbNav div").mouseout(function()
  {
    clearTimeout(swapTimer);
  });      
  

  //this function checks the hash on the interval set above - this enables the 'forward' and 'back' button
  //to work when the user is perusing the tabs as well as bookmarking
  function pollHash()
  {
    var h = window.location.hash.substring(1);

    if (justSelected == "#mb" + h || h == "" || !document.getElementById("mb" + h))
      return;  //no change
    else {
      justSelected = "#mb" + window.location.hash.substring(1);
      var currentlySelected = "#" + $("#mbNav div.selected").attr("id");       
      hideContent(currentlySelected);
      showContent();      
    }
  }
  
  function hideContent(currentlySelected)
  {
    $(currentlySelected).removeClass("selected"); //removes the angled text w/a border
    $(currentlySelected + "Content").hide();    //removes the text box
   $("#topWrapperMainImage div." + currentlySelected.substring(1)).css("z-index", 0); //moves the image to the back (flicker free)
  }

  function showContent()
  {
    $(justSelected).addClass("selected"); //adds the angled text w/a border
    $(justSelected + "Content").show();   //adds the text box content
    $("#topWrapperMainImage div." + justSelected.substring(1)).css("z-index", 1); //moves the image to the front (flicker free)
  }
  
});    
