$(function() {  
    $layout = $('.metro-layout');
    $container = $('.metro-layout .content');  
    keydown=0;
    var clt=null;
    function changeLayoutMode(isHorizontal) { 
        $('.items', $layout).removeAttr('style');
        if (isHorizontal) {
            $('.items', $layout).css({
                width: $('.items', $layout).outerWidth()
            }).isotope({
                itemSelector: '.box',
                layoutMode: 'masonryHorizontal',
                animationEngine: 'css'
            });
        } else {
            $('.items', $layout).css({
                width: 'auto'
            }).isotope({
                itemSelector: '.box',
                layoutMode: 'masonry',
                animationEngine: 'css'
            });
        }  
    } 
    changeLayoutMode($layout.hasClass('horizontal')); 
    var $chaju=$container.width()-$('.items', $layout).outerWidth();  
    	$(window).resize(function() {
    		if(clt!=null)clearTimeout(clt);
    	  clt=setTimeout(function(){
    	  	changeLayoutMode($layout.hasClass('horizontal'));
    	  	$chaju=$container.width()-$('.items', $layout).outerWidth(); 
        $container.css({"margin-left":0});
    	  	},2000); 
        
});  
    $('.next').click(function(ev) {
         ev.preventDefault();    
       if($chaju<=parseFloat($container.css("margin-left"))){ 
        $container.stop().animate({ 
            "margin-left": '-='+($('body').innerWidth() / 1.8)+'px'
        },
        400);
      }
    });
    $('.prev').click(function(ev) {
        ev.preventDefault();
        if(parseFloat($container.css("margin-left"))<0){
        $container.stop().animate({
            "margin-left": '+='+($('body').innerWidth() / 1.8)+'px'
        },
        400);
      } 
    });  
   
    var lr=0,lr1=0,lrflag=false,lr1flag=false;
    var t=0,st=null; 
    $container.find(".items").mousedown(function(event){ 
      keydown=1; 
      lr=event.clientX;
    }).mouseup(
    function(){keydown=0;}
    ).mousemove(function(event){ 
    	if(keydown==1){
      lr1=event.clientX;
      lrflag=lr1<lr;
      lr1flag=lr1>lr;	 
     // alert($chaju);
    	if(lrflag){ 
    	if($chaju<=parseFloat($container.css("margin-left"))){
        $container.stop().animate({
            "margin-left": '-='+($('body').innerWidth() / 1.8)+'px'
        },
        300);
        keydown=0;
        }
       }else
       	{ 
        if(parseFloat($container.css("margin-left"))<0){
        $container.stop().animate({
            "margin-left": '+='+($('body').innerWidth() / 1.8)+'px'
        },{
        duration:300,complete:function(){
        	if(parseFloat($container.css("margin-left"))>=0){  
       	   $(this).stop().animate({
            "margin-left": '0px'
        },300);
        }
       }
        }
        );
        keydown=0;
      }   
       		}
    		}
      	
    	});
    	$("[pid]").click(function(){  
    		 if($(this).attr("pid")&&$(this).attr("pid").length>0)
    		 if($(this).attr("pid")=="index"){
    		 	$container.stop().animate({
            "margin-left": '0px'
        },
        500);
    		// $container.css({"margin-left":"0px"});
    		}else
    				$container.stop().animate({
            "margin-left": "-"+(parseFloat($('[tid="'+$(this).attr("pid")+'"]').css("left").replace("px",''))-20)+'px'
        },
        500);
    		  //  $container.css({"margin-left":"-"+$('[tid="'+$(this).attr("pid")+'"]').css("left")});
    		});
    	 
       /** 
    $container.dragscrollable({
        dragSelector: '.items',acceptPropagatedEvent: true,
        onScrollStart: function () {},				
        onScrollEnd: function () {}
    });  **/ 

		xfoot();
		
   if(wkstock._GET("pid")!='')
	{ 
			$container.css({
            "margin-left": "-"+(parseFloat($('[tid="'+$("[pid="+wkstock._GET("pid")+"]").attr("pid")+'"]').css("left").replace("px",''))-20)+'px'
     
		});
}	
});
