/// <reference path="jquery-intellisense.js"/>
//@copyright nondesigns.com
//no code here may be used without permission from the web developer of nondesigns.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;
        
        if (y < 250) 
        {
            if ((!($("#leftArrowLink").is(":animated"))) && (!($("#rightArrowLink").is(":animated"))))
            {
                if((x < 150))
                {
                   showArrow("#leftArrowLink");
                }
                else if ((x > 570))
                {
                    showArrow("#rightArrowLink");
                }
                else
                {
                    hideArrow("#leftArrowLink");
                    hideArrow("#rightArrowLink");
                }
            }

        }
         
                
    });

    $("#pressWindow").mousedown(function (e){
       
      
        function backgroundPosition()
        {

	    try {
            var p = $("#pressWindow").css('background-position');
		}
		catch(err)
		{
			return $("#pressWindow").css('background-position-x') + ' ' + $("#pressWindow").css('background-position-y');
		}

            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)
             {
                //get background position
                
                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]; 
                    
                }
                
               
                
               // alert(bgPosition);
                
                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;
                
          
               // $("#myinfo").text("start: " + startX + " " + startY + "  mouse: " + x + " " + y + "  current:" + currentX + " " + currentY + "  final:" + finalX + " " + finalY);
                
                 // before we allow the mouse move any further, we need to calculate
                // whether we are at the end of the image. 
                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");
                 
                 // hide arrows when the background is being moved
                // hideArrow("#pressLeftArrow");
                //hideArrow("#pressRightArrow");
             }
             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
	    
        //make press arrows invisible
        $("#leftArrowLink").css("display", "none");
        $("#rightArrowLink").css("display", "none");
        
            $("#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); 
    	        
	            //$("#leftArrowLink").show();
                //$("#rightArrowLink").show();
            });
	    
        }); 
    }

    $("#leftArrowLink").click(function(e){
        //exit if we need to 
        var itemIndex = $("#currentIndex").text();
        if (Number(itemIndex) == 0){e.stopPropagation();return;}
        itemIndex = itemIndex - 1;
        
        setImageByIndex(itemIndex);
    });
    
    $("#rightArrowLink").click(function(e){
        //exit if we need to 
        var itemIndex = Number($("#currentIndex").text());
        var maxIndex = Number($("#maxIndex").text());
        
        if (Number(itemIndex) >= Number(maxIndex)){e.stopPropagation();return;}
        
        itemIndex = Number(itemIndex) + 1;
       
        setImageByIndex(itemIndex);
    });
    
	//select all the a tag with name equal to modal
	$('a[name=modal]').click(function(e) {
		//Cancel the link behavior
		e.preventDefault();
		//Get the A tag
		//var id = $(this).attr('href');
        var id = "#pressWindow";
        
		//Set heigth and width to mask to fill up the whole screen
		$('#mask').css({'width':'100%','height':'100%'});
		
		//transition effect		
		$('#mask').fadeTo(0,0.75);	
		$('#mask').fadeIn(200);	
		
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
              
		//Set the popup window to center
		$(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();
		}
	});			
	
});
  
  
// corners  
$(document).ready(function() {	
if (($.browser.safari) || ($.browser.mozilla))
{
    $("#pressWindow").corners("30px");
}
});