// The x and y coordinates of the mouse on the screen
var mouseX = 0;
var mouseY = 0;

// Indicates whether or not a popup window is visible 
var popup_showing = false;

// The ID of the currently-visible popup window
var popup_id = '';

// Indicates whether or not a mouseover window is visible
var mouseover_showing = false; 

// The ID of the currently-visible mouseover window
var mouseover_id = '';


// ****************************************************************************************************
// Center the popup window
// ****************************************************************************************************
function center_popup(){

  // Get the height and width of the browser window
  var browser_height = get_client_height();
  var browser_width = get_client_width();
  
  // Get the height and width of the popup window
  var popup_height = $("#window_" + popup_id).height();
  var popup_width = $("#window_" + popup_id).width();
  
  // Calculate the top and left of the popup window
  var popup_top = browser_height/2 - popup_height/2 + get_scroll_top();
  if (popup_top < 0) popup_top = 0;
  var popup_left = browser_width/2 - popup_width/2;
  if (popup_left < 0) popup_left = 0;
  
  // Make sure the background covers the whole browser window
  center_background();
  
  // Center the popup window
  $("#window_" + popup_id).css({
    "top": popup_top,
    "left": popup_left
  });
}



// ****************************************************************************************************
// Center the background
// ****************************************************************************************************
function center_background(){

  // Make sure the background covers the whole browser window
  $("#page_background").css({
    "height": get_page_height(),
    "width": get_page_width(),
    "top": 0,
    "left": 0,
    "position": "absolute"
  });
  /*
  if((navigator.userAgent.toLowerCase().indexOf('fireffox')>-1) || (navigator.userAgent.toLowerCase().indexOf('opgera')>-1)) {
    $("#page_background").css({
      "height": "100%",
      "width": "100%",
      "position": "fixed"
    });
  } else {
    $("#page_background").css({
      "height": document.documentElement.scrollHeight,
      "width": "100%",
      "top": 0,
      "left": 0,
      "position": "absolute"
    });
  }
  */
}



// ****************************************************************************************************
// Show the popup window
// ****************************************************************************************************
function show_popup(){

  // If a popup window isn't currently showing:
  if(!popup_showing){
  
    // Set the background opacity
    $("#page_background").css({
      "opacity": "0.7"
    });
    
    // Fade in the background and the popup window
    $("#page_background").fadeIn("slow");
    $("#window_" + popup_id).fadeIn("slow");
    
    // The popup window is now showing
    popup_showing = true;
  }
}  



// ****************************************************************************************************
// Hide the popup window
// ****************************************************************************************************
function hide_popup(){

  // If a popup window is currently showing:
  if(popup_showing){
  
    // Fade out the background and the popup window
    $("#page_background").fadeOut("slow");
    $("#window_" + popup_id).fadeOut("slow");
    
    // The popup window is no longer showing
    popup_showing = false;
    popup_id = '';
  }
}



// ****************************************************************************************************
// Position the mousover window
// ****************************************************************************************************
function position_mouseover(){

  // Get the height and width of the browser window
  var browser_height = get_client_height();
  var browser_width = get_client_width();
  
  // Get the height and width of the mouseover window
  var mouseover_height = $("#mouseover_" + mouseover_id).height();
  var mouseover_width = $("#mouseover_" + mouseover_id).width();
  
  // Calculate the top and left of the popup window
	var mouseover_top = mouseY + 20;
	var max_top = (get_scroll_top() + browser_height) - (mouseover_height + 30);
  if (mouseover_top < 0) mouseover_top = 20;
	if (mouseover_top > max_top) mouseover_top = max_top;
	
	var mouseover_left = mouseX + 20;
	var max_left = (get_scroll_left() + browser_width) - (mouseover_width + 30);
  if (mouseover_left < 0) mouseover_left = 20;
	if (mouseover_left > max_left) mouseover_left = max_left;

// Position the mouseover window just to the right and down from the cursor
  $("#mouseover_" + mouseover_id).css({
    "top": mouseover_top,
    "left": mouseover_left
  });
}



// ****************************************************************************************************
// Show the mousover window
// ****************************************************************************************************
function show_mouseover(){

  // If a mouseover window isn't currently showing:
  if(!mouseover_showing){
  
    // Fade in the mouseover window
    $("#mouseover_" + mouseover_id).fadeIn("fast");

    // The mouseover window is now showing
    mouseover_showing = true;
  }
}  



// ****************************************************************************************************
// Hide the mousover window
// ****************************************************************************************************
function hide_mouseover(){

  // If a popup window is currently showing:
  if(mouseover_showing){

    // Fade out the mouseover window
    $("#mouseover_" + mouseover_id).fadeOut("fast");

    // The mouseover window is no longer showing
    mouseover_showing = false;
  }
}



// ****************************************************************************************************
// Get the total height of the page
// http://expsharing.blogspot.com/2007/09/documentbody-doctype-scroll-bar-height.html
// ****************************************************************************************************
function get_page_height() {
    var page_height = 0;
    if (document.documentElement && document.documentElement.scrollHeight) {
      page_height = document.documentElement.scrollHeight;
    } else if (document.body && document.body.offsetHeight) {
      page_height = document.body.offsetHeight;
    } else if (document.body && document.body.scrollHeight) {
      page_height = document.body.scrollHeight;
    }
    
    if (popup_showing) {
      var popup_height = $("#window_" + popup_id).height();
      if (popup_height > page_height) {
        page_height = popup_height;
      }
    }
    
    if (page_height == 0) page_height = "100%";
    
    return page_height;
}



// ****************************************************************************************************
// Get the width of the page showing in the browser window.
// http://expsharing.blogspot.com/2007/09/documentbody-doctype-scroll-bar-height.html
// ****************************************************************************************************
function get_page_width() {
    var page_width = 0;
    if (document.documentElement && document.documentElement.scrollWidth) {
      page_width = document.documentElement.scrollWidth;
    } else if (document.body && document.body.scrollWidth) {
      page_width = document.body.scrollWidth;
    }
    
    if (popup_showing) {
      var popup_width = $("#window_" + popup_id).width();
      if (popup_width > page_width) {
        page_width = popup_width;
      }
    }
    
    if (page_width == 0) page_width = "100%";
    
    return page_width;
}



// ****************************************************************************************************
// Get the height of the page showing in the browser window.
// ****************************************************************************************************
function get_client_height() {
    var client_height = "100%";
    if (document.documentElement && document.documentElement.clientHeight) {
      client_height = document.documentElement.clientHeight;
    } else if (document.body && document.body.clientHeight) {
      client_height = document.body.clientHeight;
    } else if (typeof(window.innerHeight) == 'number') {
      client_height = window.innerHeight;
    }
    return client_height;
}



// ****************************************************************************************************
// Get the width of the page showing in the browser window.
// ****************************************************************************************************
function get_client_width() {
    var client_width = "100%";
    if (document.documentElement && document.documentElement.clientWidth) {
      client_width = document.documentElement.clientWidth;
    } else if (document.body && document.body.clientWidth) {
      client_width = document.body.clientWidth;
    } else if (typeof(window.innerWidth) == 'number') {
      client_width = window.innerWidth;
    }
    
    if (popup_showing) {
      var popup_width = $("#window_" + popup_id).width();
      if (popup_width > client_width) {
        client_width = popup_width;
      }
    }
    return client_width;
}



// ****************************************************************************************************
// Get the top-most point showing in the browser window.
// ****************************************************************************************************
function get_scroll_top() {
    var scroll_top = 0;
    if (document.documentElement && document.documentElement.scrollTop) {
      scroll_top = document.documentElement.scrollTop;
    } else if (document.body && document.body.scrollTop) {
      scroll_top = document.body.scrollTop;
    } else if (typeof(window.scrollTop) == 'number') {
      scroll_top = window.scrollTop;
    } 
    return scroll_top;
}



// ****************************************************************************************************
// Get the left-most point showing in the browser window.
// ****************************************************************************************************
function get_scroll_left() {
    var scroll_left = 0;
    if (document.documentElement && document.documentElement.scrollLeft) {
      scroll_left = document.documentElement.scrollLeft;
    } else if (document.body && document.body.scrollLeft) {
      scroll_left = document.body.scrollLeft;
    } else if (typeof(window.scrollLeft) == 'number') {
      scroll_left = window.scrollLeft;
    } 
    return scroll_left;
}



// ****************************************************************************************************
// Displays the map after the last image has loaded
// ****************************************************************************************************
function wait_for(last_image){
  if(!document.images[last_image].complete && !(navigator.userAgent.toLowerCase().indexOf('opera')>-1)){
    imgWait = setTimeout('wait_for(last_image)', 250);
  } else {
    $("#loading").css({ "display": "none"});
    $("#floorplan").css({ "display": "block"});
    $("#instructions").css({ "display": "block"});
    $("#disclaimer").css({ "display": "block"});
  }
} 



// ****************************************************************************************************
// Attaches the events once the page has loaded
// ****************************************************************************************************
$(document).ready(function(){

  // If CSS is enabled:
  if (css_enabled) {
  
    //$("#loading").hide("fast");
    //wait_for(last_image); 
    
    // --------------------------------------------------------------------------------------------------
    // Shows the popup window when the user clicks an area on the imagemap.
    // --------------------------------------------------------------------------------------------------
		$("area").click(function(){
    
      // Close any mouseover windows
      //hide_mouseover();
    
      // Get the id of the area that was clicked
      //popup_id = $(this).attr("id");
  
      // Center the popup window
      //center_popup();
      
      // Load the popup window
      //show_popup();
      
      // Clear the click event
      return(false);
    });
  
    // --------------------------------------------------------------------------------------------------
    // Closes the popup window when the user:
    //  - clicks the X on the window
    //  - clicks the background of the page
    //  - presses the escape key
    // --------------------------------------------------------------------------------------------------
    $(".popup_close").click(function(){
      hide_popup();
      return(false);
    });
    $("#page_background").click(function(){
      hide_popup();
    });
    $(document).keypress(function(e){
      if(e.keyCode==27) hide_popup();
    });
    
    // --------------------------------------------------------------------------------------------------
    // Shows the mouseover window when the user mouses over an area on the imagemap.
    // --------------------------------------------------------------------------------------------------
    $("area").mouseover(function(){
    
      // Get the id of the area that was moused over
      mouseover_id = $(this).attr("id");
      
      // Position the mouseover window
      position_mouseover();
      
      // Load the mouseover window
      show_mouseover();
    });
  
    // --------------------------------------------------------------------------------------------------
    // Hides the mouseover window when the user mouses out of an area on the imagemap.
    // --------------------------------------------------------------------------------------------------
    $("area").mouseout(function(){
      hide_mouseover();
    });
  
    // --------------------------------------------------------------------------------------------------
    // Gets the x and y coordinates of the mouse on the screen
    // --------------------------------------------------------------------------------------------------
    $().mousemove( function(e) {
      mouseX = e.pageX;
      mouseY = e.pageY;
    });
  
    // --------------------------------------------------------------------------------------------------
    // Re-centers the popup window if the browser is resized or scrolled
    // --------------------------------------------------------------------------------------------------
    $(window).resize( function(e) {
      if (popup_showing) {
        center_popup();
      }
    });
    $(window).scroll( function(e) {
      if (popup_showing) {
        center_background();
      }
    });
  }
});