/****************************************/
/*  Name: 나뚜르
/*  PART: main Swipe
/*  Version: 1.0
/*  Author: SKH
/****************************************/

$(function(){
	var page_name = "facebook";

	$("#main_slider").touchSlider({
		flexible : true,
		initComplete : function (e) {
			$("#main_slider_paging").html("");
			var num = 1;
			$("#main_slider ul li").each(function (i, el) {
				if((i+1) % e._view == 0) {
					$("#main_slider_paging").append('<a href="#" class="btn_page"><span class="hidden">mainbanner' + (num++) + '</a>');
				}
			});
			$("#main_slider_paging .btn_page").bind("click", function (e) {
				var i = $(this).index();
				$("#main_slider").get(0).go_page(i);
			});
		},
		counter : function (e) {
			$("#main_slider_paging .btn_page").removeClass("on").eq(e.current-1).addClass("on");
		}
	});
	
	$('.main_sns .sns_tab li').on('click', function(){
		var index = $(this).index();
		$(this).siblings().removeClass('on');
		$(this).addClass('on');
		$('.main_sns #sns_cont .cont').siblings().removeClass('on');
		$('.main_sns #sns_cont .cont').eq(index).addClass('on');

        var gap = parseInt($('#main_slider').css('height'))-parseInt($('section').css('margin-top'));

		if($('.sns_list.facebook').parent().hasClass('on')){
	    	page_name = "facebook";
	    	//snsFunc(page_name);
	    }else if($('.sns_list.twitter').parent().hasClass('on')){
	    	page_name = "twitter";
	    	//snsFunc(page_name);
	    }else if($('.sns_list.insta').parent().hasClass('on')){
	    	page_name = "insta";
	    	//snsFunc(page_name);
	    }
        resizeScroll('html,body',gap);
		return false;
	});
	
	 function resizeScroll(target,gap){
        $(target).velocity("scroll", { 
            offset:gap,
            mobileHA: false
         });
    }
	
	/********************  메인 sns 롤링 START ********************/
    /*var sns_visual = $(' .cont > .sns_list.facebook > ul > li');
    var menu_total = sns_visual.size();
	var menu_current = 0;
    
    // 페이징 개수만큼 버튼 생성
    var menu_buttonul = "";
    var menu_button_list = "";
    var menu_page = 0
    var menu_button = $('.sns_button > a');

    snsFunc("facebook");

    function snsFunc(page_name){
    	if(page_name == 'facebook'){
    		sns_visual = $('.cont > .sns_list.facebook > ul > li');
    		menu_total = sns_visual.size();
    		menu_page = parseInt((menu_total-1)/2)+1; // 페이징 개수
    		menu_buttonul = $('.sns_list.facebook');
		}else if(page_name == 'twitter'){
    		sns_visual = $('.cont > .sns_list.twitter > ul > li');
    		menu_total = sns_visual.size();
    		menu_page = parseInt((menu_total-1)/2)+1; // 페이징 개수
    		menu_buttonul = $('.sns_list.twitter');
	    }else if(page_name == 'insta'){
            sns_visual = $('.cont > .sns_list.insta > ul > li');
	    	menu_total = sns_visual.size();
	    	menu_page = parseInt((menu_total-1)/6)+1; // 페이징 개수
            menu_buttonul = $('.sns_list.insta');
	    }

	    $('.sns_button').remove();
	    buttonAdd(page_name,menu_page,menu_buttonul);
	    
	    if(page_name == 'facebook'){
    		menu_button = $('.sns_button.facebook > a');
		}else if(page_name == 'twitter'){
    		menu_button = $('.sns_button.twitter > a');
	    }else if(page_name == 'insta'){
	    	menu_button = $('.sns_button.insta > a');
	    }
	}

    function buttonAdd(page_name,menu_page,menu_buttonul){
    	menu_button_list = "";
    	menu_button_list += '<div class="sns_button '+page_name+'">';

	    for ( var j = 0 ; j < menu_page ; j++){
	        if(j == 0){
	            menu_button_list += '<a href="#" class="button_page on"><span class="hidden">'+page_name+' 게시물'+(j+1)+'</span></a>';
	        }else{
	            menu_button_list += '<a href="#" class="button_page"><span class="hidden">'+page_name+' 게시물'+(j+1)+'</span></a>';
	        }
	    }
	    menu_button_list += '</div>';
	    menu_buttonul.after(menu_button_list);
    }
    
	var menu_startX = 0; 
    var menu_startY = 0; 
    var menu_endX = 0;
    var menu_endY = 0;
    var menu_sensitive = 90;
    var menu_gap = 0;
    
    $(".sns_list.insta").bind('touchstart mousedown', function(e) {
        e.preventDefault();
        if (e.type == 'touchstart' || e.type == 'touchmove'
            || e.type == 'touchend' || e.type == 'touchcancel') {
        var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
        menu_startX = touch.pageX;
        menu_startY = touch.pageY;
        } else if (e.type == 'mousedown' || e.type == 'mouseup'
                || e.type == 'mousemove' || e.type == 'mouseover'
                || e.type == 'mouseout' || e.type == 'mouseenter'
                || e.type == 'mouseleave') {
            menu_startX = e.pageX;
            menu_startY = e.pageY;
        }
    });
     
    $(".sns_list.insta").bind('touchend mouseup', function(e) {
        e.preventDefault();
 
        if (e.type == 'touchstart' || e.type == 'touchmove'
                || e.type == 'touchend' || e.type == 'touchcancel') {
            var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
            menu_endX = touch.pageX;
            menu_endY = touch.pageY;
        } else if (e.type == 'mousedown' || e.type == 'mouseup'
                || e.type == 'mousemove' || e.type == 'mouseover'
                || e.type == 'mouseout' || e.type == 'mouseenter'
                || e.type == 'mouseleave') {
            menu_endX = e.pageX;
            menu_endY = e.pageY;
        }

        var menu_idx = 0;
        if(menu_startX + menu_sensitive/2 < menu_endX){ // 좌측으로 롤링시 실행
            menu_idx = menu_current-1;
            
            if( menu_idx <=-1 ){
                menu_idx = menu_page-1;
            }
            if(page_name == 'facebook' || page_name == 'twitter'){
            	moveLeftMenu(menu_idx);
            }else if(page_name == 'insta'){
            	moveInstaLeftMenu(menu_idx);
            }
        }else if(menu_startX > menu_endX + menu_sensitive/2) {  // 우측으로 롤링시 실행
            menu_idx = menu_current+1;
            if(menu_idx > menu_page ){
                menu_idx = 0;
            }
            if(page_name == 'facebook' || page_name == 'twitter'){
            	moveMenu(menu_idx);
            }else if(page_name == 'insta'){
            	moveInstaMenu(menu_idx);
            }
        }else if(menu_startY + menu_sensitive/2 < menu_endY){  // 위에서 아래로 터치시 실행
            menu_gap = $(window).scrollTop() + parseInt(menu_startY-menu_endY) - (menu_sensitive*2);
            resizeScroll('html,body',menu_gap);
        }else if(menu_startY > menu_endY + menu_sensitive/2){ // 아래에서 위로 터치시 실행
            menu_gap = $(window).scrollTop() + parseInt(menu_startY-menu_endY) + menu_sensitive;
            resizeScroll('html,body',menu_gap);
        }

    });

   

    // 메뉴 버튼 클릭시
    menu_button.on('click',function(e){
    	e.preventDefault();
        var index = $(this).index();
        moveMenu(index);
    });
    
    // 메뉴 아이템 우측에서 좌측으로 롤링시 실행 ( facebook, twitter )
    function moveMenu(index){
        var startIndex = 0;
        if( index != menu_current){
            if(index > 0){
                startIndex = index * 2;
            }
            if(startIndex > (menu_page-1)*2){ // 시작 인덱스가 페이지 개수보다 클 경우
                startIndex = 0;
            }
            if(index >= menu_page){ // 현재 인덱스가 메뉴 페이지 보다 클 경우
                index = 0;
            }

            var currIndex = startIndex-2;
            var nextIndex = startIndex-1;
            var index3 = startIndex;
            var index4 =  startIndex+1;

            if( startIndex == 0 ){
                currIndex = menu_page * 2 - 2;
                nextIndex = menu_page * 2 - 1;
            }
            sns_visual.hide();
            
            console.log("currIndex : "+currIndex+" nextIndex : "+nextIndex+" index3 : "+index3+" index4 : "+index4);
            if(page_name == 'facebook'){
            	sns_visual.eq(currIndex).css({'left':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-18.374em'});
	            sns_visual.eq(nextIndex).css({'left':'9.187em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-9.187em'});
	            sns_visual.eq(index3).css({'left':'20em', 'opacity':'1', 'display':'block'}).stop().animate({left:'0'});
	            sns_visual.eq(index4).css({'left':'29.187em', 'opacity':'1', 'display':'block'}).stop().animate({left:'9.187em'});
            }else if(page_name == 'twitter'){
            	sns_visual.eq(currIndex).css({'left':'0', 'top':'0','opacity':'0.5', 'display':'block'}).stop().animate({left:'-26em'});
	            sns_visual.eq(nextIndex).css({'left':'0', 'top':'5.937em','opacity':'0.5', 'display':'block'}).stop().animate({left:'-26em'});
	            sns_visual.eq(index3).css({'left':'26em','top':'0','opacity':'1', 'display':'block'}).stop().animate({left:'0'});
	            sns_visual.eq(index4).css({'left':'26em','top':'5.937em','opacity':'1', 'display':'block'}).stop().animate({left:'0'});
            }
            menu_current = index;
        }
        button_on_add(index);
    }

    //버튼 이미지 on 클래스 추가, 삭제
    function button_on_add(index){
        menu_button.removeClass('on');
        menu_button.eq(index).addClass('on');
    }
    
    // 메뉴 아이템 좌측에서 우측으로 롤링시 실행 ( facebook, twitter )
    function moveLeftMenu(index){
        var startIndex = 0;
        if(index > 0){
            startIndex = index * 2;
        }
        if( index != menu_current){
            var currIndex = startIndex+2;
            var nextIndex = startIndex+3;
            var index3 = startIndex; // 이제 보여질 이미지
            var index4 =  startIndex+1;
            
            if((menu_total-startIndex)<2 || currIndex == menu_total){  
                currIndex = 0;
                nextIndex = 1;
            }
            sns_visual.hide();
            
            if(page_name == 'facebook'){
            	sns_visual.eq(currIndex).css({'left':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'20em'});
            	sns_visual.eq(nextIndex).css({'left':'9.187em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'29.187em'});
            	sns_visual.eq(index3).css({'left':'-18.374em', 'opacity':'1', 'display':'block'}).stop().animate({left:'0'});
            	sns_visual.eq(index4).css({'left':'-9.187em', 'opacity':'1', 'display':'block'}).stop().animate({left:'9.187em'});
            }else if(page_name == 'twitter'){
            	sns_visual.eq(currIndex).css({'left':'0', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'26em'});
	            sns_visual.eq(nextIndex).css({'left':'0', 'top':'5.937em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'26em'});
	            sns_visual.eq(index3).css({'left':'-26em', 'opacity':'1', 'display':'block'}).stop().animate({'left':'0', 'top':'0'});
	            sns_visual.eq(index4).css({'left':'-26em', 'opacity':'1', 'display':'block'}).stop().animate({'left':'0', 'top':'5.937em'});
            }
            menu_current = index;
        }
        button_on_add(index);
    }

    // 메뉴 아이템 우측에서 좌측으로 롤링시 실행 ( 인스타그램 )
    function moveInstaMenu(index){
        var startIndex = 0;
        if( index != menu_current){
            if(index > 0){
                startIndex = index * 6;
            }
            if(startIndex > (menu_page-1)*6){ // 시작 인덱스가 페이지 개수보다 클 경우
                startIndex = 0;
            }
            if(index >= menu_page){ // 현재 인덱스가 메뉴 페이지 보다 클 경우
                index = 0;
            }

            var index_6 = startIndex-6;
            var index_5 = startIndex-5;
            var index_4 = startIndex-4;
            var index_3 = startIndex-3;
            var index_2 = startIndex-2;
            var index_1 = startIndex-1;
            var startindex_0 = startIndex;
            var startindex_1 =  startIndex+1;
            var startindex_2 =  startIndex+2;
            var startindex_3 =  startIndex+3;
            var startindex_4 =  startIndex+4;
            var startindex_5 =  startIndex+5;

            if( startIndex == 0 ){
                index_6 = menu_page * 6 - 6;
                index_5 = menu_page * 6 - 5;
                index_4 = menu_page * 6 - 4;
                index_3 = menu_page * 6 - 3;
                index_2 = menu_page * 6 - 2;
                index_1 = menu_page * 6 - 1;
            }
            sns_visual.hide();
            
            sns_visual.eq(index_6).css({'left':'0', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-29.25em'});
            sns_visual.eq(index_5).css({'left':'6.125em', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-24.125em'});
            sns_visual.eq(index_4).css({'left':'12.25em', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-18em'});
            sns_visual.eq(index_3).css({'left':'0', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-29.25em'});
            sns_visual.eq(index_2).css({'left':'6.125em', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-24.125em'});
            sns_visual.eq(index_1).css({'left':'12.25em', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'-18em'});
            
            sns_visual.eq(startindex_0).css({'left':'20em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({left:'0'});
            sns_visual.eq(startindex_1).css({'left':'26.125em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({left:'6.125em'});
            sns_visual.eq(startindex_2).css({'left':'31.25em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({left:'12.25em'});
            sns_visual.eq(startindex_3).css({'left':'20em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({left:'0'});
            sns_visual.eq(startindex_4).css({'left':'26.125em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({left:'6.125em'});
            sns_visual.eq(startindex_5).css({'left':'31.25em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({left:'12.25em'});
            
            menu_current = index;
        }
        button_on_add(index);
    }

    // 메뉴 아이템 좌측에서 우측으로 롤링시 실행 ( 인스타그램 )
    function moveInstaLeftMenu(index){
        var startIndex = 0;
        if(index > 0){
            startIndex = index * 6;
        }
        if( index != menu_current){
            var index_6 = startIndex+6;
            var index_7 = startIndex+7;
            var index_8 = startIndex+8;
            var index_9 = startIndex+9;
            var index_10 = startIndex+10;
            var index_11 = startIndex+11;

            var startindex_0 = startIndex; // 이제 보여질 이미지
            var startindex_1 =  startIndex+1;
            var startindex_2 =  startIndex+2;
            var startindex_3 =  startIndex+3;
            var startindex_4 =  startIndex+4;
            var startindex_5 =  startIndex+5;
            
            if((menu_total-startIndex)<6 || index_6 == menu_total){
                index_6 = 0;
                index_7 = 1;
                index_8 = 2;  
                index_9 = 3;
                index_10 = 4;
                index_11 = 5;
            }
            sns_visual.hide();
            
            sns_visual.eq(index_6).css({'left':'0', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'20em'});
            sns_visual.eq(index_7).css({'left':'6.125em', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'22.125em'});
            sns_visual.eq(index_8).css({'left':'12.25em', 'top':'0', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'28.25em'});
            sns_visual.eq(index_9).css({'left':'0', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'20em'});
            sns_visual.eq(index_10).css({'left':'6.125em', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'22.125em'});
            sns_visual.eq(index_11).css({'left':'12.25em', 'top':'6.125em', 'opacity':'0.5', 'display':'block'}).stop().animate({left:'28.25em'});
           
            sns_visual.eq(startindex_0).css({'left':'-30.25em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({'left':'0'});
            sns_visual.eq(startindex_1).css({'left':'-24.125em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({'left':'6.125em'});
            sns_visual.eq(startindex_2).css({'left':'-18em', 'top':'0', 'opacity':'1', 'display':'block'}).stop().animate({left:'12.25em'});
            sns_visual.eq(startindex_3).css({'left':'-30.25em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({'left':'0'});
            sns_visual.eq(startindex_4).css({'left':'-24.125em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({'left':'6.125em'});
            sns_visual.eq(startindex_5).css({'left':'-18em', 'top':'6.125em', 'opacity':'1', 'display':'block'}).stop().animate({'left':'12.25em'});
            
            menu_current = index;
        }

        button_on_add(index);
    }
	*/
   
});