$(document).ready(function(){



	var body = $("body");
	var winWidth = $(window).width();
	var winHeight = $(window).height();
	var header = $("#header");
	var headerHeight = header.innerHeight(); // 210702 �섏젙 : innerHeight濡� �섏젙
	var nowScrollTop = $(window).scrollTop();
	var quick = $("#quick");
	var elm = $("[class*='sec_main']");
	var elmMoveSpeed = 700;
	var elmMoveDelay = 100;
	var elmMoveEaseing = "easeOutExpo";
	var onIndex = 0;
	var changeSpeed = 1000;
	var delaySpeed = 7000;
	var currentSlide = 0;
	var isAnimating = false;
	var mobile = 1200;
	var delta = 5;



	/* load top scroll
	$(window).on("beforeunload", function(){
		$(window).scrollTop(0);
	});
	*/

	// resize
	$(window).resize(function(){
		winWidth = $(window).width();
		winHeight = $(window).height();
		headerHeight = header.innerHeight(); // 210702 �섏젙 : innerHeight濡� �섏젙
		secFull();
		moveSectionInit();
		visualImgChange();
		initSwiper();
		productSwiperInit();
		flagLg();
		shortCutAdd();
	});

	// section height 100%
	function secFull(){
		$(".sec_main_visual").innerHeight(winHeight); // 210702 �섏젙 : innerHeight濡� �섏젙
		if ( winWidth > mobile ){
			$(".sec_main_product").innerHeight(winHeight); // 210702 �섏젙 : innerHeight濡� �섏젙
		}
		else {
			$(".sec_main_product").removeAttr("style");
		};
	};
	secFull();

	/* 210705 �섏젙 , 210707 �섏젙 : IE�먯꽌 �ㅻ쪟 諛쒖깮�쇰줈 main.html �섏씠吏�濡� ���.
	let vh = window.innerHeight * 0.01;
	document.documentElement.style.setProperty('--vh', `${vh}px`);
	210705 �섏젙 */

	// section scroll
	var stopAnimation = function() {
		setTimeout(function() {
			isAnimating = false;
		}, elmMoveDelay);
	};
	var bottomIsReached = function($elem) {
		var rect = $elem[0].getBoundingClientRect();
		return rect.bottom <= $(window).height();
	};
	var topIsReached = function($elem) {
		var rect = $elem[0].getBoundingClientRect();
		return rect.top >= 0;
	};
	function moveSection(event){
		currentSlide = $("[class*='sec_main'].on").index();
		var $currentSlide = $(elm[currentSlide]);
		if (isAnimating) {
			event.preventDefault();
			return;
		};

		var direction = -event.deltaY;

		if (direction < 0) {
			// next
			if (currentSlide + 1 >= elm.length) return;
			if (!bottomIsReached($currentSlide)) return;
			event.preventDefault();
			currentSlide++;
			var $slide = $(elm[currentSlide]);
			var offsetTop = $slide.offset().top;
			isAnimating = true;
		}
		else {
			// back
			if (currentSlide - 1 < 0) return;
			if (!topIsReached($currentSlide)) return;
			event.preventDefault();
			currentSlide--;
			var $slide = $(elm[currentSlide]);
			var offsetTop = $slide.offset().top;
			isAnimating = true;
		};

		$("html, body").animate({ scrollTop: offsetTop }, elmMoveSpeed, elmMoveEaseing, stopAnimation );
	};
	function moveSectionInit(){
		if ( winWidth > mobile ){
			if ( document.addEventListener ){
				document.addEventListener("wheel", moveSection, { passive: false });
			}
			else if ( document.attachEvent ){
				document.attachEvent("wheel", moveSection, { passive: false });
			};
		}
		else {
			if ( document.removeEventListener ){
				document.removeEventListener("wheel", moveSection, { passive: false });
			}
			else if ( document.detachEvent ){
				document.detachEvent("wheel", moveSection, { passive: false });
			};


		};
	};
	moveSectionInit();

	$(window).scroll(function(){
		nowScrollTop = $(window).scrollTop();
		secScroll();
	});

	function secScroll(){
		elm.each(function(index){
			var secTop = $(this).offset().top;

			if ( nowScrollTop >= secTop - 5 ){
				onIndex = index;
			};
		});

		if ( elm.eq(onIndex).is(".on") != true ){
			elm.removeClass("on");
			elm.eq(onIndex).addClass("on");

			// �듬찓��
			if ( quick.length > 0 ){
				var h = quick.find("li").outerHeight();
				var move = onIndex * h;

				if ( onIndex != quick.find("li").length ){
					quick.find("li").removeClass("on");
					quick.find("li").eq(onIndex).addClass("on");
					$(".bar_quick").stop().animate({ "top": move }, 200 );
				};
			};
		};

		// �쒕쾲�ㅽ뻾 class
		if ( $(".once").is(".on")){
			$(".once").addClass("start");
		};

		// �듬찓�� show/hide
		if ( quick.length > 0 ){
			if ( $(".sec_main_visual").is(".on") ){
				quick.removeClass("on");
			}
			else {
				quick.addClass("on");
			};
		};

		// product 泥ル쾲吏� �щ씪�대뱶濡� 珥덇린��
		if ( $(".sec_main_news").is(".on") || $(".sec_main_features").is(".on") ){
			$(".product_menu_list li:first-child a").trigger("click");
		};
	};
	secScroll();

	// �듬찓��
	function shortCutAdd(){
		if ( winWidth > mobile ){
			if ( quick.length > 0 && $(".bar_quick").length < 1 ){
				var h = quick.find("li").outerHeight();
				quick.append("<div class='bar_quick' style='height: " + h + "px;'></div>");
			};
		};
	};
	shortCutAdd();
	function shortCut(e){
		e.preventDefault();

		var flag = true;
		var target = $(this).attr("href");
		var top = $(target).offset().top;

		if ( flag == true ){
			flag = false;
			$("html, body").stop().animate({ "scrollTop": top }, elmMoveSpeed, elmMoveEaseing, function(){
				flag == true;
			});
		};
	};
	$(document).on("click", "#quick a", shortCut);

	// visual �щ씪�대뱶
	var mainSliderSelector = '.visual_slide';
	var interleaveOffset = 0.5;

	// visual �대�吏� change (pc/mobile)
	function visualImgChange(){
		$(".visual_slide .bg").each(function(){
			var urlPc = $(this).attr("data-image-pc");
			var urlMobile = $(this).attr("data-image-mobile");

			if ( winWidth > mobile ){
				$(this).css("background-image", urlPc);
			}
			else {
				$(this).css("background-image", urlMobile);
			};
		});
	};
	visualImgChange();

	var mainSliderOptions = {
		loop: true,
		speed: changeSpeed,
		loopAdditionalSlides: 10,
		grabCursor: true,
		watchSlidesProgress: true,
		autoplay:{
			delay: delaySpeed,
			disableOnInteraction: false,
		},
		pagination: {
			el: '.swiper-pagination',
			type: 'fraction',
			clickable: true
		},
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
		on: {
			init: function(){
				this.autoplay.stop();
			},
			imagesReady: function(){
			  this.autoplay.start();
			},
			slideChangeTransitionEnd: function(){
				var swiper = this;
				listClass = swiper.el.querySelectorAll('.show');
				/* 210709 �섏젙 */
				for (var i = 0; i < listClass.length; i++) { 
					if(listClass[i].classList.contains('show')) { 
						listClass[i].classList.remove('show');
					}																										
				}
				/* 210709 �섏젙 */
				swiper.slides[swiper.activeIndex].classList.add('show');
			},
			progress: function(){
				var swiper = this;
				for (var i = 0; i < swiper.slides.length; i++) {
					var slideProgress = swiper.slides[i].progress,
					innerOffset = swiper.width * interleaveOffset,
					innerTranslate = slideProgress * innerOffset;

					/*
					swiper.slides[i].querySelector(".bg").style.transform =
					"translateX(" + innerTranslate + "px)";
					*/

					swiper.slides[i].querySelector(".bg").style.left =
					innerTranslate + "px";
				}
			},
			touchStart: function() {
				var swiper = this;
				for (var i = 0; i < swiper.slides.length; i++) {
					swiper.slides[i].style.transition = "";
				}
			},
			setTransition: function(speed) {
				var swiper = this;
				for (var i = 0; i < swiper.slides.length; i++) {
					swiper.slides[i].style.transition = speed + "ms";
					swiper.slides[i].querySelector(".bg").style.transition =
					speed + "ms";
				}
			}
		}
	};

	setTimeout(function(){
		var visualSwiper = new Swiper(mainSliderSelector, mainSliderOptions);

		visualSwiper.on("slideChange", function(){
			delaySpeed = $(".visual_slide .swiper-slide").eq(visualSwiper.activeIndex).attr("data-swiper-autoplay");
			$('.pie_progress').asPieProgress('destroy').remove();
			$(".swiper-button-loading").prepend("<div class='pie_progress' role='progressbar' data-barcolor='#fff' data-barsize='8'><span class='pie_progress__number'>0%</span></div>");
			progressInit();


			/*
			$('.pie_progress').asPieProgress('reset');
			$('.pie_progress').asPieProgress('start');
			*/

			if ( $(".swiper-button-pause").is(".on") ){
				$(".swiper-button-pause").removeClass("on");
			};

			if ( $(".visual_slide .swiper-slide").eq(visualSwiper.activeIndex).find("video").length > 0 ){
				$(".visual_slide video").each(function(){
					/* 210712 �섏젙 */
					$(this).get(0).pause();
					//$(this).get(0).currentTime = 0;
					/* //210712 �섏젙 */
				});
				var video = $(".visual_slide .swiper-slide").eq(visualSwiper.activeIndex).find("video")[0];
				video.play();
			};
		});

		// �щ씪�대뱶 (�쒖옉, �뺤�)
		$(document).on("click", ".swiper-button-pause", function(){
			$(this).toggleClass("on");
			if ( $(this).is(".on") ){
				visualSwiper.autoplay.stop();
				$('.pie_progress').asPieProgress('stop');
			}
			else {
				visualSwiper.autoplay.start();
				$('.pie_progress').asPieProgress('start');
			};
		});
	}, changeSpeed);

	// visual �щ씪�대뱶 (change 濡쒕뵫)
	if ( $(".visual_slide .swiper-slide:first-child").attr("data-swiper-autoplay") ){
		delaySpeed = $(".visual_slide .swiper-slide:first-child").attr("data-swiper-autoplay");
	};
	function progressInit(){
		$('.pie_progress').asPieProgress({
			namespace: 'pie_progress',
			speed: (delaySpeed / 100) + (changeSpeed / 100),
			easing: 'linear'
		});
		$('.pie_progress').asPieProgress('start');
	};
	progressInit();



	// swiper responsive
	var impactSwiper = undefined;
	var featuresSwiper = undefined;
	function initSwiper(){
		if ( winWidth > mobile ){
			// our impact slide
			if ( impactSwiper != undefined ){
				impactSwiper.destroy();
				impactSwiper = undefined;
				$(".our_impact_slide .swiper-wrapper").removeAttr("style");
				$(".our_impact_slide .swiper-slide").removeAttr("style");
				$(".our_impact_slide .swiper-pagination > *").remove();
			};
		}
		else if ( winWidth <= mobile ){
			// our impact slide
			var settingsImpact = {
				speed: 265,
				slidesPerView: 1,
				spaceBetween: 20,
				pagination: {
					el: '.swiper-pagination',
					clickable: true
				},
			};
			if ( impactSwiper == undefined ){
				impactSwiper = new Swiper('.our_impact_slide', settingsImpact);
			};
		};
	};
	initSwiper();

	// product slide
	var settingsProduct = {
		//direction: 'vertical',
		effect: 'fade',
		speed: 265,
		slidesPerView: 1,
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
		breakpoints: {
			1200: {
				mousewheel: false,
				mousewheelReleaseOnEdges: false,
			},
		},
	};
	var productSwiper = new Swiper('.main_product_slide', settingsProduct);
	var productSlideLeng = $(".main_product_slide .swiper-slide").length;
	var activeIndex = $(".main_product_slide .swiper-slide-active").index();

	function productSwiperInit(){
		$(".product_menu_list li").eq(activeIndex).addClass("on");

		if ( winWidth > mobile ){
			var swiperEvent = "slideChangeTransitionStart";
			$(".product_menu_list").append("<div class='bg_bar'></div>");
		}
		else {
			var swiperEvent = "setTransition";
			$(".bg_bar").remove();
		};

		productSwiper.on(swiperEvent, function(){
			activeIndex = $(".main_product_slide .swiper-slide-active").index();
			$(".product_menu_list li").eq(activeIndex).addClass("on").siblings().removeClass("on");
			if ( winWidth > mobile ){
				$(".bg_bar").css("top", activeIndex * 20 + "%");
			};
		});
	};
	productSwiperInit();

	$(document).on("click", ".product_menu_list li a", function(){
		var index = $(this).parent().index();
		productSwiper.slideTo(index, changeSpeed);
	});
	$(document).on("click", ".btn_skip", function(e){
		e.preventDefault();
		var targetSkip =  $(".sec_main_news").offset().top;
		$("html, body").animate({ scrollTop: targetSkip }, elmMoveSpeed, "easeOutExpo");
	});

	// features slide
	var settingsFeatures = {
		autoplay:{
			delay: 3000,
			disableOnInteraction: false,
		},
		centeredSlides:true,
		slidesPerView: 1,
		spaceBetween: 0,
		speed: 500,
		scrollbar: {
			el: '.swiper-scrollbar',
			draggable: true,
		},
		breakpoints: {
			1200: {
				slidesPerView: 2.4,
				spaceBetween: 20,
			},
			768: {
				slidesPerView: 1.2,
				spaceBetween: 20,
			},
		},
	};
	var featuresSwiper = new Swiper('.features_slide.forWeb', settingsFeatures);
	$(document).on('mouseenter', '.features_slide', function(e){
		featuresSwiper.autoplay.stop();
	});
	$(document).on('mouseleave', '.features_slide', function(e){
		featuresSwiper.autoplay.start();
	});
	
	var settingsFeaturesForMobile = {
		autoplay:{
			delay: 3000,
			disableOnInteraction: false,
		},
		centeredSlides:true,
		slidesPerView: 2.4,
		spaceBetween: 20,
		speed: 500,
		scrollbar: {
			el: '.swiper-scrollbarForMobile'
		},
		breakpoints: {
			768: {
				slidesPerView: 1.2,
				spaceBetween: 20,
			},
		},
	};
	var featuresSwiperForMobile = new Swiper('.features_slide.forMobile', settingsFeaturesForMobile);
});