$(function () {
	
	$.ajax({
		type: 'GET',
		url: '/gallery/gallery.php',
		data: {
			GalleryNumber: GalleryNumber,
			stylesheet:'/gallery/gallery.xsl'
		},
		success: loadGallery
	});
	
	function loadGallery (data) {
		
		$('#gallery').html(data);
		
		var page = 0, NoOfPhoto = $('.filmstrip li').size(), maxPage = (NoOfPhoto-NoOfPhoto%4)/4+1, viewPage=(NoOfPhoto-NoOfPhoto%20)/20+1, pageWidth = 595;
		//$('ul.filmstrip').css("width",maxPage*600+600);
		$('.gallery').css("height",750);
    
        //var width = 600*viewPage;
        
        $('.filmstrip').css({
	            'width': 600*viewPage+'px',
	            'height': '100%'
	    });
        $('.thumbnails').css({
            'height': '93%'
        });
		
		function goToPage(number,speed) {

			$('.filmstrip').animate({
				left: (-pageWidth*number)+'px'
			},speed||1000,'swing');

			$('.arrowleft').css('cursor',(page==0) ? 'default' : 'pointer');
			$('.arrowright').css('cursor',(page==maxPage) ? 'default' : 'pointer');
 
		}

		$('.arrowleft')
			.click(function () {
				page = ( page > 0 ) ? page - 1 : page;
				goToPage(page);
			})
			.mousedown(function () {
				return false;
			}); 
			
		$('.arrowright')
			.click(function () {
				page = ( page < (maxPage-1) ) ? page + 1 : page;
				goToPage(page);
			})
			.mousedown(function () {
				return false;
			});  


        var pictureNumber,widthNew,heightNew;

		$('ul.filmstrip li').click(function (event) {
		
			var left = $(event.target).offset().left-9, 
				top  = $(event.target).offset().top-10;
	
			var id = $(event.target).closest('li').attr('id');
			
			pictureNumber = id.split('_')[1];
		
			//var widthOld  = $('.main:visible:not(#picture_'+pictureNumber+')').width(),
			//heightOld = $('.main:visible:not(#picture_'+pictureNumber+')').height();
			
			$('.main:visible:not(#picture_'+pictureNumber+')')
				.css('z-index',1)
/*				.animate({ 
					left: 600,
					top: 500,
					width: 0, 
					height: 0,
					opacity: 0
				}, function () {
					$(this)
						.width(widthOld)
						.height(heightOld);
				}); */
				.fadeOut(500);		
				
                ajustPic(pictureNumber);

			$('#picture_'+pictureNumber+':not(:visible)')
				.css('left',left)
				.css('top',top)
				.css('width',80)
				.css('height',50)
				.css('opacity',0)
				.css('z-index',100)
				.css('display','block')
				.animate({
					left: 0,
					top: 160,
				    width: widthNew,
    				height:heightNew,
					opacity: 1
				},500)
				.animate({
					opacity: 1
				},250);
				
				$('ul.filmstrip').css("width",$('li').size()/4*600+600);
        		$('.filmstrip').css('height','120px');
                $('.thumbnails').css('height','120px');
                $('.prePhoto').css("display","block");
                $('.nextPhoto').css("display","block");
                
                var nthPhoto = $(this).prevAll().size()+1;
                var filmPage = 0;
                for(;nthPhoto>0;nthPhoto=nthPhoto-4){
                    filmPage++; 
                }
                page = filmPage-1
                goToPage(page);
		});
		
		function ajustPic(pictureNumber){
			
			widthNew  = $('#picture_'+pictureNumber).width(),
    		heightNew = $('#picture_'+pictureNumber).height();
			
			var max_size = 640;


              if (heightNew > widthNew) {

                var w = max_size;

                var h = Math.ceil( heightNew/widthNew * max_size);


              } else {

                var w = max_size;

                var h = Math.ceil(heightNew/ widthNew* max_size);

              }

              widthNew = w;
              heightNew = h;
              
              $('div.gallery').css("height",heightNew+180);	
        }
		
		$('.prePhoto').click(function (){

		     pictureNumber = pictureNumber||$('.main:visible').attr('id').split('_')[1];
		     
		     $('#picture_'+pictureNumber).fadeOut(500);
		     
		     pictureNumber = $('#picture_'+pictureNumber).prevAll('img:first').attr("id").split('_')[1];
		     
		     //if($('#picture_'+pictureNumber).prev().attr("id").split('_')[1]==null){
			if($('#picture_'+pictureNumber).prev().length==0){
		         $('.prePhoto').css("display","none");
		     }else{
		         $('.nextPhoto').css("display","block");
		     }
		     ajustPic(pictureNumber);

		     $('#picture_'+pictureNumber).fadeIn(500).css("height",heightNew).css("width",widthNew);

		});
		
		$('.nextPhoto').click(function (){

            pictureNumber = $('.main:visible').attr('id').split('_')[1];
            
    		pictureNumber = nextPhoto(pictureNumber);
    		
    	});
    	
    	function showNow (){
    	    ajustPic($('.main:first').attr('id').split('_')[1]);
    	    $('#'+$('.main:first').attr('id')).fadeIn(100).css("height",heightNew).css("width",widthNew);
    	}
    	
    	
    	function nextPhoto (pictureNumber){
    	        	    
    	    $('#picture_'+pictureNumber).fadeOut(500);
    		var next = $('#picture_'+pictureNumber).nextAll('img:first').attr("id");
 	       
            if($("#"+next).nextAll('img').length==0){
    
		         $('.nextPhoto').css("display","none");
		    }else{
				$('.prePhoto').css("display","block");
			}
 
    		 if(next == null){
		         pictureNumber = null;
		     }else{
		         pictureNumber = next.split('_')[1];
		         //$('.prePhoto').css("display","block");
		         //$('.nextPhoto').css("display","block");
		         ajustPic(pictureNumber);
                 $('#picture_'+pictureNumber).fadeIn(500).css("height",heightNew).css("width",widthNew);    
		     }
    	
    		return pictureNumber;
    	}
    	
    	$(".viewAll").click(function (){
    	    
    	        $(".main").css("display","none");
                $('.controlBar').css("display","none");
                $('.gallery').css('height','750px');
    	        $('.filmstrip').animate({
    	            'height': '100%'
    	        });
    	        $('.filmstrip').css({
        	            'width': 600*viewPage+'px'
        	    });
    	        $('.thumbnails').animate({
                    'height': '93%'
                },1000);
                page = 0;
                goToPage(page);
                
        });
        
        var stopID;
        $(".slideShow,.play").click(function (){
     
            $('.play').css("display","none");
            $('.stop1').css("display","block");
            $('ul.filmstrip').css("width",$('li').size()/4*600+600);
       		$('.filmstrip').css('height','120px');
            $('.thumbnails').css('height','120px');
            status = 'stop';
            
              stopID = setInterval(function (){  
                   var currentPhoto; 

                    currentPhoto = $('.main:visible').attr('id')||$('.main:first').attr('id');
                    
                    if($('.main:visible').attr('id')==null){
                        showNow();
                        //setTimeout(nextPhoto(currentPhoto.split('_')[1]),4000);
                    }else{
                        nextPhoto(currentPhoto.split('_')[1]);
                    }

                    },2000);
                       
               $(".slideShow").css('display','none');
               $('.stop').css('display','block');
               
        });
		
		 $(".stop,.stop1").click(function (){

                $('.stop').css('display','none');
                $(".slideShow").css('display','block');
                clearInterval(stopID);
                
                var nthPhoto = $('.main:visible').prevAll('.main').size()+1;

                var filmPage = 0;
                for(;nthPhoto>0;nthPhoto=nthPhoto-4){
                    filmPage++; 
                }
                goToPage(filmPage-1);
                status = 'start';
        });
		
		var status = 'start';
		
		$('.AllImg')
		    .mouseover(function () {
		        $('.controlBar').fadeIn(300);
		     
		        if(status =='start'){
		            $('.stop1').css("display","none");
		            $('.play').css("display","block");
		        }else{
		            $('.play').css("display","none");
		            $('.stop1').css("display","block");
		        }
		        
		    })
		    .mouseout(function (event) {
		       
		        if ( !$(event.toElement).is('.controlBar,.nextPhoto,.prePhoto,.play,.stop1')) {
		            $('.controlBar').fadeOut(300);
		        }
		    });
		    

		    $("ul.filmstrip li").mouseover(function (){
	
		        if(navigator.appName!="Microsoft Internet Explorer"){
		             $("#"+$(this).attr("id")+" img").css( "border","1px solid red");
		        }
		        
		        $("#"+$(this).attr("id")+" .alt").css("z-index","100");
		    })
		    .mouseout(function (){
		        
		        if(navigator.appName!="Microsoft Internet Explorer"){
    		        $("#"+$(this).attr("id")+" img").css("border","1px solid #777777");
    		    }
		        
		        $("#"+$(this).attr("id")+" .alt").css("z-index","-1");
		    });
		   
	}
	
});