/// <reference path="jquery-intellisense.js"/>
//@copyright eventmakers.com
//no code here may be used without permission from the web developer of eventmakers.com

/*
height of image: 1275
width of image: 1754

below is an example of how to calculate max values
h - 1275 x 2 - 720 = 1830
v - 1754 x 2 - 540 = 2968

1830 - 720 = 1110 / 2 = 555
2968 - 540 = 2428 / 2 = 1214

(negative values?)
h = (1275 - 720) = 555
v = (1754 - 540) = 1214
*/

$(window).load(function(){
    var mouseBusy = 0;


    
    function showArrow(id)
    {
        if ($(id).css("display") == "none")
        {
             $(id).hide();
            $(id).css("display", "block");
           $(id).fadeTo(200, 1);
        }
    }
    
    function hideArrow(id)
    {
    
         if ($(id).css("display") != "none")
            {
                $(id).fadeTo(200, 0, function(){
                    $(id).css("display", "none");
                });
                
            }
    }
    
    $("#pressWindow").mousemove(function (e){
        if (mouseBusy == 1) {  return; } 

        var x = e.clientX - $("#pressWindow").offset().left;
        var y = e.clientY -  $("#pressWindow").offset().top;
        
         
                
    });

    $("#pressWindow").mousedown(function (e){
       
      
        function backgroundPosition()
        {
            var p = $("#pressWindow").css('background-position');
            if(p == null) 
            {
                return $("#pressWindow").css('background-position-x') + ' ' + $("#pressWindow").css('background-position-y');
            }
            else return p;
        }

        var startX = e.clientX - $("#pressWindow").offset().left;
        var startY = e.clientY -  $("#pressWindow").offset().top;
               
        var exit = 0;
        $(this).mousemove(function (e){
              mouseBusy = 1;
               
             if (exit == 0)
             {
                var bgPosition = backgroundPosition();
                $("#myinfo").text(bgPosition);
               
                var currentX = 0;
                var currentY = 0;
               
                if (bgPosition.indexOf("px") > 0)
                {
                    var values = bgPosition.replace(/px/g, "").split(" ");
                    currentX = values[0];
                    currentY = values[1]; 
                    
                }
                
                
                var x = e.clientX - $("#pressWindow").offset().left;
                var y = e.clientY -  $("#pressWindow").offset().top;
                
                finalX = (Number(x) - Number(startX)) + Number(currentX);
                finalY = (Number(y) - Number(startY)) + Number(currentY);
                
                startX = x;
                startY = y;
                        
                 var maxX = Number($("#maxX").text())
                var maxY = Number($("#maxY").text())
                if (finalY > 0) { finalY = 0 }
                if (finalX > 0) { finalX = 0}
                if (finalX <= maxX) { finalX = maxX; }  
                if (finalY <= maxY) { finalY = maxY; }  
                
               $("#pressWindow").css("backgroundPosition", finalX + "px " + finalY + "px");
                 
 
             }
             else
             {
                mouseBusy = 0;
                e.stopPropagation();
             }
        })
        .mouseup(function(e){ exit = 1;})
        .mouseout(function(e){ exit = 1;});
        
        
    });
  

});
  
  
  
// modal, this launches the modal
$(document).ready(function() {	

    function setImageByIndex(itemIndex)
    {
        $("#pressWindow").fadeOut(200, function(){
         //set new background image
	    
     
            $("#loader").show()

            var background = $("#press" + itemIndex).attr('href');
            $("#pressImage").attr("src", background);
            
            $("#pressImage").load(function(e){
                $("#pressWindow").hide();
                $("#pressWindow").css("background-image", "url('" + background + "')");
	            $("#pressWindow").css("backgroundPosition", "0px 0px");
    	        
	            var maxX = $("#x" + itemIndex).text();
	            var maxY = $("#y" + itemIndex).text();
	            $("#maxX").text(maxX);
	            $("#maxY").text(maxY);
	            
	    
	   
                // set title
                var title = $("#t" + itemIndex).text();
                $("#pressWindowTitle").text(title);
                
	            $("#currentIndex").text(itemIndex);
    	        
	            $("#loader").hide();
	            $("#pressWindow").fadeIn(500); 
    	        

            });
	    
        }); 
    }

	//select all the a tag with name equal to modal
	$('a[name=modal]').click(function(e) {
		//Cancel the link behavior
		e.preventDefault();
        var id = "#pressWindow";
		$('#mask').css({'width':'100%','height':'100%'});
		$('#mask').fadeTo(0,0.75);	
		$('#mask').fadeIn(200);	

		var winH = $(window).height();
		var winW = $(window).width();

		$(id).css('top',  winH/2-$(id).height()/2);
		$(id).css('left', winW/2-$(id).width()/2);
		
		$("#loader").css('top',  winH/2-$("#loader").height()/2 + "px");
		$("#loader").css('left', winW/2-$("#loader").width()/2) + "px";

	    $(window).bind('resize', function() {

	        var winH = $(window).height();
		    var winW = $(window).width();
		
	        $(id).css('top',  winH/2-$(id).height()/2);
		    $(id).css('left', winW/2-$(id).width()/2);
		    
		    $("#loader").css('top',  winH/2-$("#loader").height()/2 + "px");
		    $("#loader").css('left', winW/2-$("#loader").width()/2 + "px");
		    
	    });
	
	
        var itemIndex = $(this).attr('id').replace("press", "");
	    setImageByIndex(itemIndex);

	});
	

	
	//if mask is clicked
	$('#mask').click(function () {
		if (!$("#pressWindow").is(":animated"))
	    {
		    $(this).hide();
		    $("#pressWindow").hide();
		}
	});			
	
});