jQuery(document).ready(function($){
	//check if a .cd-tour-wrapper exists in the DOM - if yes, initialize it
	$('.cd-tour-wrapper').exists() && initTour();

	function initTour() {
		var tourWrapper = $('.cd-tour-wrapper'),
			tourSteps = tourWrapper.children('li'),
			stepsNumber = tourSteps.length,
			coverLayer = $('.cd-cover-layer'),
			tourStepInfo = $('.cd-more-info'),
			tourTrigger = $('#cd-tour-trigger');

		//create the navigation for each step of the tour
		createNavigation(tourSteps, stepsNumber);

		tourTrigger.on('click', function(){
			//start tour
			if(!tourWrapper.hasClass('active')) {
				//in that case, the tour has not been started yet
				tourWrapper.addClass('active');
				showStep(tourSteps.eq(0), coverLayer);
			}
		});

		//if(tourTrigger.hasClass("on"))
			tourTrigger.click();

		//change visible step
		tourStepInfo.on('click', '.cd-prev', function(event){
			if($(".is-selected").attr("prev-page") != undefined && $(".is-selected").attr("prev-page") != "") {
				var prevpage = $(".is-selected").attr("prev-page");
			}
			//go to prev step - if available
			if(prevpage != undefined)  {
				location.href=prevpage;
			} else if( !$(event.target).hasClass('inactive') ) {
				changeStep(tourSteps, coverLayer, 'prev');
			}
//			( !$(event.target).hasClass('inactive') ) && changeStep(tourSteps, coverLayer, 'prev');
		});

		tourStepInfo.on('click', '.cd-next', function(event){

			if($(".is-selected").attr("next-page") != undefined && $(".is-selected").attr("next-page") != "") {
				var nextpage = $(".is-selected").attr("next-page");
			}

			//go to next step - if available

			if(nextpage != undefined)  {
				location.href=nextpage;
			} else if( !$(event.target).hasClass('inactive') ) {
				changeStep(tourSteps, coverLayer, 'next');
			}
		});

		//close tour
		tourStepInfo.on('click', '.cd-close', function(event){
			closeTour(tourSteps, tourWrapper, coverLayer);
		});

		tourStepInfo.on('click', '.cd-wclose', function(event){
			window.close();
		});

		//detect swipe event on mobile - change visible step
		tourStepInfo.on('swiperight', function(event){
			//go to prev step - if available
			if( !$(this).find('.cd-prev').hasClass('inactive') && viewportSize() == 'mobile' ) changeStep(tourSteps, coverLayer, 'prev');
		});
		tourStepInfo.on('swipeleft', function(event){
			//go to next step - if available
			if( !$(this).find('.cd-next').hasClass('inactive') && viewportSize() == 'mobile' ) changeStep(tourSteps, coverLayer, 'next');
		});

		//keyboard navigation
		$(document).keyup(function(event){
			if( event.which=='37' && !tourSteps.filter('.is-selected').find('.cd-prev').hasClass('inactive') ) {
				changeStep(tourSteps, coverLayer, 'prev');
			} else if( event.which=='39' && !tourSteps.filter('.is-selected').find('.cd-next').hasClass('inactive') ) {
				changeStep(tourSteps, coverLayer, 'next');
			} else if( event.which=='27' ) {
				closeTour(tourSteps, tourWrapper, coverLayer);
			}
		});
	}

	function createNavigation(steps, n) {
		var tourNavigationHtml = '<div class="cd-nav"><span><b class="cd-actual-step">1</b> of '+n+'</span><ul class="cd-tour-nav"><li><a href="#0" class="cd-prev">&#171; 이전</a></li><li><a href="#0" class="cd-next">다음 &#187;</a></li></ul></div><a href="#0" class="cd-close">Close</a>';
		var tourNavigationEndHtml = '<div class="cd-nav"><span><b class="cd-actual-step">1</b> of '+n+'</span><ul class="cd-tour-nav"><li><a href="#0" class="cd-prev">&#171; 이전</a></li><li><a href="#0" class="cd-wclose">닫기 &#187;</a></li></ul></div><a href="#0" class="cd-close">Close</a>';

		steps.each(function(index){
			var html = "";
			var step = $(this),
				stepNumber = index + 1;

			var np = $("#step"+stepNumber).attr("next-page");
			var pp = $("#step"+stepNumber).attr("prev-page");

			if(np != undefined) {
				nextClass = '';
				html = tourNavigationHtml;
			} else {
				nextClass = ( stepNumber < n ) ? '' : 'inactive';
				html = ( stepNumber < n ) ? tourNavigationHtml : tourNavigationEndHtml;
			}

			if(pp != undefined) {
				prevClass = '';
			} else {
				prevClass = ( stepNumber == 1 ) ? 'inactive' : '';
			}

//			prevClass = ( stepNumber == 1 ) ? 'inactive' : '';

			var nav = $(html).find('.cd-next').addClass(nextClass).end().find('.cd-prev').addClass(prevClass).end().find('.cd-actual-step').html(stepNumber).end().appendTo(step.children('.cd-more-info'));
		});
	}

	function showStep(step, layer) {
		step.addClass('is-selected').removeClass('move-left');
		smoothScroll(step.children('.cd-more-info'));
		showLayer(layer);
	}

	function smoothScroll(element) {
//		(element.offset().top < $(window).scrollTop()) && $('body,html').animate({'scrollTop': element.offset().top}, 100);
//		(element.offset().top + element.height() > $(window).scrollTop() + $(window).height() ) && $('body,html').animate({'scrollTop': element.offset().top + element.height() - $(window).height()}, 100);

		var off = $("#guide_scr").offset();
		var box_hc = element.offset().top + element.height()/2;
		var par_hc = $("#guide_scr").height()/2;

		if(box_hc>par_hc) {
			var mv = box_hc-par_hc;
			var stp = $("#guide_scr").scrollTop()+mv
			$("#guide_scr").animate({'scrollTop': stp}, 300);
		} else if(box_hc<par_hc) {
			var mv = par_hc+Math.abs(box_hc);
			var stp = $("#guide_scr").scrollTop()-mv
			$("#guide_scr").animate({'scrollTop': stp}, 300);

		}
		//console.log(box_hc,par_hc);
		//(element.offset().top > $("#aaaaa").scrollTop()) && $("#aaaaa").animate({'scrollTop': element.offset().top}, 100);
		//(element.offset().top + element.height() > $("#aaaaa").scrollTop() + $("#aaaaa").height() ) && $("#aaaaa").animate({'scrollTop': element.offset().top + element.height() - $("#aaaaa").height()}, 100);
	}

	function showLayer(layer) {
		layer.addClass('is-visible').on('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(){
			layer.removeClass('is-visible');
		});
	}

	function changeStep(steps, layer, bool) {
		var visibleStep = steps.filter('.is-selected'),
			delay = (viewportSize() == 'desktop') ? 300: 0;
		visibleStep.removeClass('is-selected');

		(bool == 'next') && visibleStep.addClass('move-left');

		setTimeout(function(){
			( bool == 'next' )
				? showStep(visibleStep.next(), layer)
				: showStep(visibleStep.prev(), layer);
		}, delay);
	}

	function closeTour(steps, wrapper, layer) {
		steps.removeClass('is-selected move-left');
		wrapper.removeClass('active');
		layer.removeClass('is-visible');
	}

	function viewportSize() {
		/* retrieve the content value of .cd-main::before to check the actua mq */
		return window.getComputedStyle(document.querySelector('.cd-tour-wrapper'), '::before').getPropertyValue('content').replace(/"/g, "").replace(/'/g, "");
	}
});

//check if an element exists in the DOM
jQuery.fn.exists = function(){ return this.length > 0; }