var _IDX;

$(window).load(function(){
          $( ".lazyimg, .section2,  " ).addClass("move" );
});




$(window).scroll(function() {
	var qwer1 = $(window).height();
   if($(this).scrollTop() > qwer1+100) {
        $(".selectedBox").addClass ("move");
    } else {
        $(".selectedBox").removeClass ("move");
    };

//   if($(this).scrollTop() > qwer1 + 2200) {
//        $(".selectedBox").addClass ("move2");
//    } else {
//        $(".selectedBox").removeClass ("move2");
//    };

});



$(document).ready(function(){


            $(function() {
              $('a[href*="#"]:not([href="#"])').click(function() {
                if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
                  var target = $(this.hash);
                  target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
                  if (target.length) {
                    $('html, body').animate({
                      scrollTop: target.offset().top,
                      easing:"easeOutBounce"
                    }, 500);
                    return false;
                  }
                }
              });
            });

	var menuHeight = $( "div.menu" ).height();
	$(".menu").css("marginTop", -menuHeight/2);

    $(".nav i, .section1,  .section1 .start, .hand1, .hand2").addClass("move");

     setTimeout(function () {
        $(".slide.no01").addClass("move");
        $(".slideSelect .no01 div").addClass("move");
     }, 0);




    $(".section2 .grid.main li").click(function() {
		 $(".selectedBox").addClass("move");
	 })

    $(".section2 .grid.main li").mouseover(function() {
		 $(".section2 .grid.main li").addClass("move");
		 $(this).removeClass("move");
	 })

    $(".section2 .grid.main li	").mouseout(function() {
		 $(".section2 .grid li").removeClass("move");
	 })


    $(".inner > .grid >  li").click(function(){
		SetBigPhoto(this);
    });


    $(".selectedBox .start").click(function(){

		if ($(".selectedBox > .grid > li").length == 0)
		{
			alert("선택한 사진이 없습니다. 사진 에세이에 사진을 담아주세요.");
			return false;
		}

        $(".layer.make").addClass("move");
    });


	$(document).on("click", ".layer .remove", function() {
        $(".layer").removeClass("move");
    });

	// 왼쪽
	$(".fa-arrow-circle-o-left").click(function(){
		var pTotCnt = $(".inner > .grid >  li").length;
		if (_IDX-1 < 0) {
			_IDX = pTotCnt - 1;
		} else {
			_IDX = _IDX - 1;
		}
        var pObj = $(".inner > .grid >  li:eq(" + (_IDX) + ")").find("img");
		if (pObj.length == 0) pObj = $(".inner > .grid >  li:last").find("img");
		SetBigPhoto(pObj, _IDX);
    });


	// 오른쪽
	$(".fa-arrow-circle-o-right").click(function(){
		var pTotCnt = $(".inner > .grid >  li").length;
		if (_IDX+1 >= pTotCnt) {
			_IDX = 0;
		} else {
			_IDX = _IDX + 1;
		}
        var pObj = $(".inner > .grid >  li:eq(" + (_IDX) + ")").find("img");
		if (pObj.length == 0) pObj = $(".inner > .grid >  li:first").find("img");
		SetBigPhoto(pObj, _IDX);
    });

	// 삭제
	$(document).on("click", ".selectedBox > .grid > li", function() {
        $(this).remove();

		if ($(".selectedBox > .grid > li").length == 0)
		{
			$(".selectedBox").addClass("noneImg");
		}
    });



	// 위로이동
	$(document).on("click", ".cssUp", function(event){
		var pThis = $(this).parent().parent();
		if (pThis.get(0).tagName == 'LABEL' ) {
			var pPrev = pThis.prev();
			if (pPrev.length > 0)
			{
				if (pThis.get(0).tagName == 'LABEL'  && pPrev.attr("class") == "cssImg" ) {
					pPrev.insertAfter(pThis);
				}
			}
			
		}

		return false;	
	});

	// 아래로 이동
	$(document).on("click", ".cssDown", function(event){
		var pThis = $(this).parent().parent();
		if (pThis.get(0).tagName == 'LABEL' ) {
			var pNext = pThis.next();
			if (pNext.length > 0)
			{
				if (pThis.get(0).tagName == 'LABEL'  && pNext.attr("class") == "cssImg" ) {
					pNext.insertBefore(pThis);
				}
			}
		}
		return false;
	});
	


});

// 큰사진 가져오기
function SetBigPhoto(pObj, idxS) {
	var pSW_FNAME = $(pObj).attr("name");
		
	var pStr = $.ajax({
		url: "./ajax_common.php",
		async: false,
		type: "POST",
		data: ({
			std: "getimage",
			sw_fname: pSW_FNAME
		})
	}).responseText;

	$(".info").html(pStr);

	var idx = idxS;
	console.log('idxS', idx);

	if (idx == undefined) {
		idx = parseInt($(pObj).data("index"));
	}

	SetCount(idx + 1);

	_IDX = idx;

	$(".layer.photopopup").addClass("move");
}

// 카운트
function SetCount(pIdx) {
	var pTotCnt = $(".inner > .grid >  li").length;
	$(".page").html(pIdx + " / " + pTotCnt);
}


// 사진담기
function SetImage(pName) {


	if ($("#hdnMUID").val() == "") {
		$("#iptFbLogin").click();
		return false;
	}	
	else
	{
		if ($(".selectedBox > .grid > li").length > 9)
		{
			alert("사진은 10개 까지만 담을 수 있습니다.");
			return false;
		}
		else {
			$(".selectedBox > .grid").append('<li><img src="./img/small/' + pName +  '" name=' + pName + '></li>');
			$(".selectedBox").removeClass("noneImg");
		}
	}
}

// 계속진행
function GoAhead() {
	
	var pHTML = "";
	$(".selectedBox > .grid > li").each(function(i){
		var pSrc = $(this).find("img").attr("src");
		var pName = $(this).find("img").attr("name");
		var pIdx = i+1;

		pHTML += '<label class="cssImg">';
		pHTML += '		<div class="thumbnail" style="background-image:url('+pSrc+');"></div>';
		pHTML += '		<input type="hidden" value="' + pName + '" name="img'+pIdx+'_url" />';
		pHTML += '		<textarea placeholder="" tabindex="1" class="size12" name="img'+pIdx+'_cmt" required></textarea>';
		pHTML += '		<div class="buttonBox">';
		pHTML += '			<button  class="button cssUp"  >위로</button> <button class="button cssDown">아래로</button>';
		pHTML += '		</div>';
		pHTML += '</label>';

		$("#imgcnt").val(pIdx);
	});

	$(".cssImg").remove();

	$("#lblIntro").after(pHTML);


	

}


$(document).ready(function(){

            $("li.no01").mouseover(function(){
                    $(".slide, .slideSelect div").removeClass("move");
                    $(".slide.no01, .slideSelect .no01 div").addClass("move");
            });

            $("li.no02").mouseover(function(){
                    $(".slide, .slideSelect div").removeClass("move");
                    $(".slide.no02,  .slideSelect .no02 div").addClass("move");
            });

            $("li.no03").mouseover(function(){
                    $(".slide, .slideSelect div").removeClass("move");
                    $(".slide.no03, .slideSelect .no03 div").addClass("move");
            });
            
});