var testing = false;

var imagesArray = new Array();
function preloadImages() {
   
   var imgList = getImageList();
   
   for (var i=0; i<imgList.length; i++) {
      imagesArray.push(loadImage(imgList[i]));
   }
   
}

function loadImage(path) {
   if (document.images) {
      var img = new Image();
      img.src = path;
      return img;
   }
}

function getImageList() {
   var imgList = new Array(10 /* <-- number of images */);
   var pathToImages = "./images/topHovers/topHover_";      /* topHover_ is a prefix to all images taking
                                                               part in the hover. */

   /*Syntax:
     imgList[elem#inArray] = pathToImages + webpage name to which the hover corresponds to + ".jpg"; */
   imgList[0] = pathToImages + "index"                    + ".jpg";
   imgList[1] = pathToImages + "housing"                  + ".jpg";
   imgList[2] = pathToImages + "fss"                      + ".jpg";
   imgList[3] = pathToImages + "childCare"                + ".jpg";
   imgList[4] = pathToImages + "YouthandfamilyServices"   + ".jpg";
   imgList[5] = pathToImages + "recreation"               + ".jpg";
   imgList[6] = pathToImages + "communityDevelopment"     + ".jpg";
   imgList[7] = pathToImages + "youthCentre"              + ".jpg";
   imgList[8] = pathToImages + "Rock%20Bay/rockbay"      + ".jpg";
   imgList[9] = pathToImages + "upcomingEvents"          + ".jpg";


   return imgList;
}

var topHoverId;
function setUpHovers() {
   if (!document.getElementById)
      return false;
   
   preloadImages();
   
   topHoverId = document.getElementById("topHoverImg");
   var anchors = document.getElementById("leftNavLinks").getElementsByTagName("a");
   for (var j=0; j<anchors.length; j++) {
      anchors[j].onmouseover =
         function() {
            var result = this.href.split("/");  /* since the image name is the href. */
            var imgName = result[result.length-1].split(".")[0];
            topHoverId.src = "./images/topHovers/topHover_" + imgName + ".jpg";
            if (testing)
               alert(topHoverId.src);
         };
      
      anchors[j].onmouseout =
         function() {
            topHoverId.src = "./images/topHovers/topHover_index.jpg";;
         };
   }
   
   if (testing) {
      var imgList = getImageList();
      var res="";
      for (var lst=0; lst<imgList.length; lst++)
          res += imgList[lst] + "\n";
      alert("imgList: \n" + res + "\nsetUpHovers(): ended.");
   }
   
   // Window size handling
   resizeContent();
}

function resizeContent() {
   // The following code is referenced from:
   // http://www.quirksmode.org/viewport/compatibility.html
   var x,y;
   if (self.innerHeight) // all except Explorer
   {
      x = self.innerWidth;
      y = self.innerHeight;
   }
   else if (document.documentElement && document.documentElement.clientHeight)
      // Explorer 6 Strict Mode
   {
      x = document.documentElement.clientWidth;
      y = document.documentElement.clientHeight;
   }
   else if (document.body) // other Explorers
   {
      x = document.body.clientWidth;
      y = document.body.clientHeight;
   }
   // end reference.
   
   if (x>800) {
      document.getElementById("mainContent").style.width = "848px";
      document.getElementById("scrollableContent").style.margin = "90px 155px 0px 150px;";
   } else {
      document.getElementById("mainContent").style.width = "644px";
      document.getElementById("scrollableContent").style.margin = "90px 0px 0px 150px;";
   }
   
}

window.onresize = resizeContent;
window.onload = setUpHovers;