// this is jquery's way of saying execute this after the page loads
$(function(){

	// After the page loads, append the div with an id of overlay to the body, 
	// fade it in with a speed of 300 milliseconds.
    $('<div id="overlay" />').appendTo('#body').fadeIn(300);
    $('<div id="opt_out"></div>').appendTo('#flash_container');
    $('#overlay').animate({ opacity : .85 });	
	
	// because internet explorer needs a color specified otherwise it will not be clickable upon 
	// loading the opt out button. So i must set the color in css and then make the opacity 0 using javascript
	$('#opt_out').animate({ opacity : 0 });	
	
    // select the element with the id of flash header, and then load/replace the contents
    // of flash_promo.html inside of it, display it. We will absolutely position it over
    // the location on the flash file that says "skip promo"
    $('#flash_header').load("flash_promo.html");    
    
    // if the invisible opt out div is clicked, then execute the following code.
    // one() means execute it only one time, when clicked again do not execute anything. 
    // If we do not specify then everytime the user clicks the mouse, it will load the
    // file again and start all over. I do this for the opt out div, and for the body div 
    // just to make sure the user can opt out, different browsers treat this functionality 
    // slightly different. 
    $('#opt_out').one("click", function(){
    	
    	// after clicked, fade out the overlay div over the span of 300 milliseconds
    	$('#overlay').fadeOut(300);
    	$('#opt_out').fadeOut(300);
    	
    	// select the element with the id of flash header, and then load/replace the contents
    	// of flash_homepage.html inside of it, display it. 
    	$('#flash_header').load("flash_homepage.html");
    	
    }); // end opt out click function
    
    // if anything within the body tag is clicked, then execute the following code.
    // one() means execute it only one time, when clicked again do not execute anything. 
    // If we do not specify then everytime the user clicks the mouse, it will load the
    // file again and start all over. 	
   	$('body').one("click", function(){
    	
    	// after clicked, fade out the overlay div over the span of 300 milliseconds
    	$('#overlay').fadeOut(300);
    	$('#opt_out').fadeOut(300);
    	
    	// select the element with the id of flash header, and then load/replace the contents
    	// of flash_homepage.html inside of it, display it. 
    	$('#flash_header').load("flash_homepage.html");
    	
    }); // end body click function     
});