// JavaScript Document

function displayModal(event){
		var maskHeight = document.documentElement.clientHeight;
		var maskWidth = document.documentElement.clientWidth;
		var popHeight = $("#popup").height();
		var popWidth = $("#popup").width();
		$("#mask").css({"width":maskWidth,"height":maskHeight,"opacity":"0.7"});
		$("#popup").css({"top": maskHeight/2-popHeight/2, "left": maskWidth/2-popWidth/2}); 
		$("#mask").fadeIn("slow");
		$("#popup").fadeIn("slow");
		event.preventDefault();
}

function displayModal2(event){
		var maskHeight = document.documentElement.clientHeight;
		var maskWidth = document.documentElement.clientWidth;
		var popHeight = $("#resPopup").height();
		var popWidth = $("#resPopup").width();
		$("#mask").css({"width":maskWidth,"height":maskHeight,"opacity":"0.7"});
		$("#resPopup").css({"top": maskHeight/2-popHeight/2, "left": maskWidth/2-popWidth/2}); 
		$("#mask").fadeIn("slow");
		$("#resPopup").fadeIn("slow");
		event.preventDefault();
}

function closeModal(){
	$("#mask").fadeOut("fast");
	$("#popup").fadeOut("fast");	
	$("#modalMedia").html("");
	$("#modalContent").html("");
}
function closeModal2(){
	$("#mask").fadeOut("fast");
	$("#resPopup").fadeOut("fast");	
}
$("<div>").attr("id", "container").css({  
  position:"absolute"  
}).width($(".wrapper").length * 170).height(170).appendTo("div#viewer");  
  
//add images to container  
$(".wrapper").each(function() {  
  $(this).appendTo("div#container");  
});     
//work out duration of anim based on number of images (1 second for each image)  
var duration = $(".wrapper").length * 1000;  
  
//store speed for later  
var speed = (parseInt($("div#container").width()) + parseInt($("div#viewer").width())) / duration;  
  
//set direction  
var direction = "rtl";  
   
//set initial position and class based on direction  
(direction == "rtl") ? $("div#container").css("left", $("div#viewer").width()).addClass("rtl") : $("div#container").css("left", 0 - $("div#container").width()).addClass("ltr") ;