main = function () {
	//private menbers
	let pcWidth = 1440; // pc預設寬度
	let mbWidth = 992;  // ㄖㄩ預設寬度
	let defaultFz = 16; // 預設 wrapper字體大小
	let windowWidth;
	let headerH;
	let swiper_video;
	let swiper_history;
	let activeTimelineTl; // 歷史軌跡動態timeline
	let currentHistoryIdx = 0;  // 歷史軌跡第幾個idx
	let historySlideTl // 歷史軌跡倒數計時器
	let imgUrls = [];
	const section = $(".section"); // 取得所有section
	let currentId = null; // foces的區塊ID


	// 每個播放器的配置信息
	var playerConfigs = [
		{
			containerId: "player_expert",
			videoId: "IFYNhqJpCVw",
			category: "expert",
		},
		{
			containerId: "player_understand_1",
			// videoId: "Ipg40ew_xcU",
			category: "understand",
			link: "https://www.youtube.com/watch?v=Ipg40ew_xcU",
			title: "EP01 - mRNA有無限可能",
		},
		{
			containerId: "player_understand_2",
			// videoId: "3-8kzU-3QWc",
			category: "understand",
			link: "https://youtu.be/3-8kzU-3QWc?si=7MYgiBm88dyCHn2t",
			title: "EP02 - mRNA科學突破",
		},
		{
			containerId: "player_understand_3",
			// videoId: "iKoQ4l0LWd0",
			category: "understand",
			link: "https://youtu.be/iKoQ4l0LWd0?si=F98B30C9XnUfBfyM",
			title: "EP03 - mRNA三大核心發現",
		},
		{
			containerId: "player_understand_4",
			// videoId: "_YQHAtKixY8",
			category: "understand",
			link: "https://youtu.be/_YQHAtKixY8?si=VV2NBTlwqKOKtPUL",
			title: "EP04 - mRNA與癌症",
		},
		{
			containerId: "player_understand_5",
			// videoId: "_m-bMZhZT04",
			category: "understand",
			link: "https://youtu.be/_m-bMZhZT04?si=ixQkTgfuvLZdnf-6",
			title: "EP05 - mRNA疫苗研究",
		},
		{
			containerId: "player_proud",
			videoId: "5HYvR3I5vjw",
			category: "research",
		},
		{
			containerId: "player_feature",
			videoId: "1eS50Ng9x_M",
			category: "research",
		},
		{
			containerId: "player_show",
			videoId: "mA6C_-b2oE4",
			category: "research",
		},
	];

	// 創建播放器對象數組
	var players = [];

	//private methods
	function init() {
		console.log("main is loaded.");

		const urlParams = new URLSearchParams(window.location.search);
		const args = {};
		if (urlParams.get("cc")) {
			args.cc_code = urlParams.get("cc");
		}

		if (urlParams.get("tc")) {
			args.tc_code = urlParams.get("tc");
		}

		setGA.pageView('index', args);

		$("[data-gaEvent-label]").on('click', (event) => {
			const target = event.currentTarget;
			const category = target.getAttribute('data-gaEvent-category');
			const label = target.getAttribute('data-gaEvent-label');
			setGA.ButtonClick(category, label);
		});

		$(window).resize(function () {
			resizeWindow();
		});

		// if ($(window).width() > 992) {
		// 	// smooth scroll
		// 	lenisHandler();
		// }

		// $("#featureModal").modal('show');

		loadImagesAndPerformAction(imgUrls, startHandler);

		scrollToSection();

		// 點擊漢堡
		$(".header__hamburger").on("click", function () {
			if (!$(this).hasClass("active")) {
				$(this).addClass("active");
				$(".header__nav").addClass("active");
				openMenu();
			} else {
				$(this).removeClass("active");
				$(".header__nav").removeClass("active");
				closeMenu();
			}
		});

		// 點擊 專家影片 關閉此功能
		$(".modal__video .video__overlay").on("click", function () {
			let videoBox = $(this).parents(".video");
			// console.log(videoBox)
			if (!videoBox.hasClass("active")) {
				videoBox.addClass("active");
			} else {
				videoBox.removeClass("active");
			}
		});

		// 點擊 歷史軌跡 年份
		$(".history .history__timeline__year").on("click", function () {
			currentHistoryIdx = $(this).data("yearidx");
			autoPlayHistory(currentHistoryIdx);
		});

		$(".modal-test .modal__game__btns__btn").click(function () {
			console.log("modal__game__item click")
			let num = $(this).parents(".modal__game__item").data("num");
			modalGameItemAni(num)
			$(this).parents(".modal__game__item").addClass("active");
			$(this).parent(".modal__game__btns").hide();
		});

		$("#testModal").on('hidden.bs.modal', event => {
			$("#testModal .modal__game__item").removeClass("active");
			$("#testModal .modal__game__btns").css("display", "flex")
			$("#testModal .modal__game__ans").hide();
		})

		$(".modal-research .btn-close").on("click", function () {
			modalVideoStop();
		});

		// 測試用
		// gsap.to(".game__item-start", { duration: 0.5, autoAlpha: 0 });
		// gsap.to(".game__item-main", { duration: 0.5, autoAlpha: 0 });
		// gsap.to(".game__item-result", { duration: 0.3, autoAlpha: 1, delay: 0.3 });
		// totalScore = 16;
		// gameResultCal()
	}

	function modalGameItemAni(num) {
		$(".modal-test .modal__game__item:nth-child(" + num + ") .modal__game__ans").css("display", "flex");
	}

	// 開始程序
	function startHandler() {
		// 調整頁面font-size
		windowWidth = $(window).width();
		if (windowWidth > 992) {
			let pcScale = windowWidth / pcWidth;
			$(".wrapper").css("font-size", defaultFz * pcScale + "px");

			setTimeout(() => {
				headerH = $(".header").outerHeight();
				// console.log("headerH: " + headerH);
				$(".wrapper").css("padding-top", headerH);
			}, 800);
		} else {
			let mbScale = windowWidth / mbWidth;
			$(".wrapper").css("font-size", defaultFz * mbScale + "px");
			setTimeout(() => {
				headerH = $(".header").outerHeight();
				initMenu();;
			}, 800);
		}

		elementReset();

		understandVideoHandler();
		swiperHandler_history();

		setTimeout(() => {

			detectScrollSection();

			//元素動態
			elementAni();

			$(window).scroll(function () {
				detectScrollSection();
				ScrollTrigger.update();
			})

			if (!isMobile) {
				$(".qa__box__scroll").niceScroll({
					cursorcolor: "#2BD7DA", // 滾動條的顏色
					cursorwidth: "0.6em", // 滾動條寬度
					cursorborder: "1px solid #fff", // 滾動條邊框
					cursorborderradius: "5px", // 滾動條圓角
					touchbehavior: false, // 是否啟用拖曳行為
					autohidemode: false, // 不隱藏卷軸
					background: "", // 軌道背景色
					cursorminheight: 32, // 滾動條最小高度
					railpadding: { top: 0, right: 0, left: 0, bottom: 0 }, // 軌道內間距
					railalign: "center", // 對其垂直軌道
					railvalign: "center", // 對其水平軌道
					cursordragontouch: false, // 使用觸屏模式來實現拖曳
					grabcursorenabled: false,
					nativeparentscrolling: false, // 內容於底部時是否讓父級滾動
					enablescrollonselection: false,	// 當選擇文本時開啟內容自動滾動
				});
			} else {
				$(".qa__box__scroll").niceScroll({
					cursorcolor: "#2BD7DA", // 滾動條的顏色
					cursorwidth: "0.7em", // 滾動條寬度
					cursorborder: "1px solid #fff", // 滾動條邊框
					cursorborderradius: "5px", // 滾動條圓角
					touchbehavior: false, // 是否啟用拖曳行為
					autohidemode: false, // 不隱藏卷軸
					background: "", // 軌道背景色
					cursorminheight: 32, // 滾動條最小高度
					railpadding: { top: 0, right: 0, left: 0, bottom: 0 }, // 軌道內間距
					railalign: "center", // 對其垂直軌道
					railvalign: "center", // 對其水平軌道
					cursordragontouch: false, // 使用觸屏模式來實現拖曳
					grabcursorenabled: false,
					nativeparentscrolling: false, // 內容於底部時是否讓父級滾動
					enablescrollonselection: false,	// 當選擇文本時開啟內容自動滾動
				});

			}

			setTimeout(() => {
				gsap.to(".wapper-loading", {
					duration: 0.3, autoAlpha: 0, onComplete: function () {
						$(".wapper-loading").remove();
					}
				});

				$(".qa__box__scroll").getNiceScroll().resize();
				gsap.to(".wrapper", { duration: 0.3, autoAlpha: 1 });

				//開頭動態
				startAni();

			}, 500);

		}, 500);
	}

	// 桌機調整視窗大小
	function resizeWindow() {
		let currWindowWidth = $(window).width();
		if (currWindowWidth !== windowWidth) {
			if (currWindowWidth > 992) {
				let pcScale = currWindowWidth / pcWidth;
				let currFz = defaultFz * pcScale;
				$(".wrapper").css("font-size", currFz + "px");

				headerH = $(".header").outerHeight();
				$(".wrapper").css("padding-top", headerH);
			} else {
				let mbScale = currWindowWidth / mbWidth;
				let currFz = defaultFz * mbScale;
				$(".wrapper").css("font-size", currFz + "px");

				headerH = $(".header").outerHeight();
				$(".wrapper").css("padding-top", headerH);
			}
		}
	}

	// 宣導影片程序 MB
	async function understandVideoHandler() {
		await buildUnderstandVideo();
		await initIframeApi();
		// // 影片 swiper 程序
		await swiperHandler_video();
	}

	// 初始menu
	function initMenu() {
		let menuListH = $(".header__nav").outerHeight();
		// console.log("menuListH: "+menuListH)
		gsap.set(".header__nav", { top: -menuListH });
	}

	// 打開menu
	function openMenu() {
		let headerH = $(".header").outerHeight();
		gsap.to(".header__nav", { duration: 0.3, top: headerH });
	}

	// 關閉menu
	function closeMenu() {
		let menuListH = $(".header__nav").outerHeight();
		gsap.to(".header__nav", { duration: 0.3, top: -menuListH });
	}

	// smoothWheel
	function lenisHandler() {
		const lenis = new Lenis({
			duration: 0.3,
			smoothWheel: true,
		});

		lenis.on("scroll", (e) => {
			// console.log(e)
			ScrollTrigger.update();
		});

		function raf(time) {
			lenis.raf(time);
			requestAnimationFrame(raf);
		}

		requestAnimationFrame(raf);
	}

	// ====================  影片相關  ====================

	function initIframeApi() {
		return new Promise(resolve => {
			var script = document.createElement('script');
			script.src = 'https://www.youtube.com/iframe_api';
			script.onload = onLibraryLoaded;
			document.head.appendChild(script);
			resolve("initIframeApi complete");
		});
	}

	// 談談mRNA 影片DOM
	function buildUnderstandVideo() {
		return new Promise((resolve) => {
			console.log("buildUnderstandVideo")
			$(`.understand__swiper .swiper-wrapper`).html("");
			playerConfigs.forEach((videoData, idx) => {
				if (videoData.category == "understand") {
					$(`.understand__swiper .swiper-wrapper`)
						.append(`
						<div class="swiper-slide">
							<div class="video understand__video ${videoData.category}__video-${idx}">
								<div class="video__overlay">
									<div class="video__frame"></div>
									<div class="video__icon-box">
										<div class="video__icon">
											<img src="./images/video-icon.png" alt="">
										</div>
										<p>影片播放</p>
										<p class="video__title">${videoData.title}</p>
									</div>
								</div>
								<a href="${videoData.link}" target="_blank">
									<div class="video__player">
									</div>
								</a>
							</div>
						</div>
					`);
				}
			});
			resolve("buildPropagandaVideo complete");
		});
	}

	// 談談mRNA 影片程序
	function swiperHandler_video() {
		return new Promise((resolve) => {
			swiper_video = new Swiper(".understand__swiper", {
				// Optional parameters
				allowTouchMove: false,
				slidesPerView: 1,
				centeredSlides: false,
				pagination: {
					el: ".understand__swiper .swiper-pagination",
					clickable: true,
				},
				// spaceBetween: "5%",

				// Navigation arrows
				navigation: {
					nextEl: ".understand__swiper .swiper-button-next",
					prevEl: ".understand__swiper .swiper-button-prev",
				},
				breakpoints: {
					992: {
						// spaceBetween: 100,
					}
				},
				on: {
					init: function (swiper) {
						resolve("swiper_video init");
					},
					slideChangeTransitionEnd: function () {
						pauseAllVideos();
					},
				},
			});
		});
	}

	function onLibraryLoaded() {
		setTimeout(() => {
			onYouTubeIframeAPIReady();
		}, 2500);
	}

	function onYouTubeIframeAPIReady() {
		// 循環創建播放器
		for (var i = 0; i < playerConfigs.length; i++) {
			var config = playerConfigs[i];
			players[i] = new YT.Player(config.containerId, {
				videoId: config.videoId,
				loop: 1,
				rel: 0,
				events: {
					'onReady': onPlayerReady,
					'onStateChange': onPlayerStateChange,
				},
			});
		}
	}

	function onPlayerReady(event) {
		// 處理播放器準備好後的事件
		// event.target.mute(); // 靜音播放器
		// event.target.playVideo(); // 播放影片
	}

	function onPlayerStateChange(event) {
		// console.log(event.target.o.id)
		const iframe = event.target.getIframe();
		const patent = iframe.parentNode.parentNode;
		if (event.data == YT.PlayerState.PLAYING) {
			$(patent).find(".video__overlay").css('display', 'none');
		} else {
			$(patent).find(".video__overlay").css('display', 'block');
		}
		// // console.log(event.data)
		// if (event.data == -1) {

		// }
	}

	// 控制單個播放器播放
	function playVideo(playerIndex) {
		players[playerIndex].playVideo();
	}

	// 控制單個播放器暫停
	function pauseVideo(playerIndex) {
		players[playerIndex].pauseVideo();
	}

	// 控制單個播放器停止
	function stopVideo(playerIndex) {
		players[playerIndex].stopVideo();
	}

	// 控制所有播放器播放
	function playAllVideos() {
		for (var i = 0; i < players.length; i++) {
			players[i].playVideo();
		}
	}

	// 控制所有播放器暫停
	function pauseAllVideos() {
		for (var i = 0; i < players.length; i++) {
			players[i].pauseVideo();
		}
	}

	// 控制所有播放器停止
	function stopAllVideos() {
		for (var i = 0; i < players.length; i++) {
			players[i].stopVideo();
		}
	}

	function modalVideoStop() {
		for (var i = 6; i < players.length; i++) {
			players[i].stopVideo();
			// console.log(i)
		}
	}

	// ====================  時間軸相關  ====================

	// 踏上mRNA歷史軌跡 影片程序
	function swiperHandler_history() {
		return new Promise((resolve) => {
			resolve("swiper_history init");
			swiper_history = new Swiper(".history__swiper", {
				// Optional parameters
				autoplay: {
					delay: 10000,
					disableOnInteraction: false,
				},
				slidesPerView: 2,
				centeredSlides: true,
				allowTouchMove: true,


				// Navigation arrows
				navigation: {
					nextEl: ".history__swiper .swiper-button-next",
					prevEl: ".history__swiper .swiper-button-prev",
				},
				on: {
					init: function (swiper) {

						resetTimelineAni();
						currentHistoryIdx = 0;
						setTimeout(() => {
							autoPlayHistory(currentHistoryIdx);
						}, 1000);
					},
					transitionStart: function (swiper) {
						// console.log("transitionStart");
						resetTimelineAni();
					},
					slideChangeTransitionStart: function (swiper) {
						// console.log("slideChangeTransitionStart");
						timelineAni();
					},
				},
				breakpoints: {
					992: {
						autoplay: false,
						centeredSlides: false,
						spaceBetween: 0,
						speed: 500,
						loop: false,
						slidesPerView: "auto",
						allowTouchMove: false,
						watchSlidesProgress: true,
						virtualTranslate: true,
						watchSlidesVisibility: true,
					}
				},

			});
			// 解決 slidesPerView: "auto" 無法準確抓到最後一個的問題
			swiper_history.snapGrid = swiper_history.slidesGrid.slice(0);
			swiper_history.slideTo(0, 0)
		});
	}

	function autoPlayHistory(idx) {
		swiper_history.slideTo(idx, 0)
		if (!isMobile) {
			if (historySlideTl) {
				clearInterval(historySlideTl);
			}
			historySlideTl = setInterval(() => {
				if (idx < ($(".history .swiper-slide").length - 1)) {
					idx += 1;
					swiper_history.slideTo(idx, 0);
				}
				else {
					idx = 0
					swiper_history.slideTo(idx, 0);
				}
				// console.log("idx: "+idx)
			}, 10000);

		}
	}

	function resetTimelineAni() {
		if ($(window).width() > 992) {
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__item", { top: "4.8em", width: "13.5em" })
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__year", { top: "-2.5em", left: "-3.3em", width: "7em" })
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__year h3", { fontSize: "1.7em" }, 0)
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__branchline", { autoAlpha: 0, height: 0 }, 0)
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__desc", { autoAlpha: 0, y: "1em" }, 0)
		} else {
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__item", { top: "8.09em", width: "16em" })
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__year", { top: "-4em", left: "-3.8em", width: "9em" })
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__year h3", { fontSize: "2.1em" }, 0)
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__branchline", { autoAlpha: 0, height: 0 }, 0)
			gsap.set(".swiper-slide:not(.swiper-slide-active) .history__timeline__desc", { autoAlpha: 0, y: "1em" }, 0)
		}

	}

	function timelineAni() {
		if (activeTimelineTl) {
			activeTimelineTl.kill();
			animation = null;
		}
		if ($(window).width() > 992) {
			activeTimelineTl = gsap.timeline();
			activeTimelineTl.to(".swiper-slide-active .history__timeline__item", { duration: 0.3, width: "22em" })
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year", { duration: 0.3, left: "1.1em", width: "9.5em" }, 0)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__item", { duration: 0.3, top: 0 })
			activeTimelineTl.to(".swiper-slide-active .history__timeline__branchline", { duration: 0.5, height: "7.5em", autoAlpha: 1 }, 0.3)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year", { duration: 0.3, top: "-1.5em" }, 0.3)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year h3", { duration: 0.3, fontSize: "2.4em" }, "-=0.4")
			activeTimelineTl.to(".swiper-slide-active .history__timeline__desc", { duration: 0.3, autoAlpha: 1, y: 0 }, "-=0.1")
		} else {
			activeTimelineTl = gsap.timeline();
			activeTimelineTl.to(".swiper-slide-active .history__timeline__item", { duration: 0.3, width: "31em" })
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year", { duration: 0.3, left: "2em", width: "13.5em" }, 0)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__item", { duration: 0.3, top: 0 })
			activeTimelineTl.to(".swiper-slide-active .history__timeline__branchline", { duration: 0.5, height: "11.5em", autoAlpha: 1 }, 0.3)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year", { duration: 0.3, top: "-1.8em" }, 0.3)
			activeTimelineTl.to(".swiper-slide-active .history__timeline__year h3", { duration: 0.3, fontSize: "3.4em" }, "-=0.4")
			activeTimelineTl.to(".swiper-slide-active .history__timeline__desc", { duration: 0.3, autoAlpha: 1, y: 0 }, "-=0.1")
		}

	}

	// ====================  滑動動態  ====================


	// 初始元素動態
	function elementReset() {
		gsap.set(".expert__video", { y: 50, autoAlpha: 0 });
		gsap.set(".expert__title", { y: 50, autoAlpha: 0 });
		gsap.set(".understand .container", { y: 50, autoAlpha: 0 });
		gsap.set(".history .container", { y: 50, autoAlpha: 0 });
		gsap.set(".research .container", { y: 50, autoAlpha: 0 });
		gsap.set(".research .research__item", { autoAlpha: 0 });
		gsap.set(".qa .copywriting", { y: 50, autoAlpha: 0 });
		gsap.set(".qa .qa__desc", { y: 0, autoAlpha: 0 });
		gsap.set(".qa .qa__keypoint h3", { y: 50, autoAlpha: 0 });
		gsap.set(".moreref .container", { y: 50, autoAlpha: 0 });
		gsap.set(".qa .qa__keypoint__item:nth-child(1)", { x: 100, autoAlpha: 0 });
		gsap.set(".qa .qa__keypoint__item:nth-child(3)", { x: -100, autoAlpha: 0 });
	}

	function startAni() {
		if (!isMobile) {
			gsap.to(".expert__video", {
				duration: 1,
				y: 0,
				autoAlpha: 1,
				delay: 0.3,
			});
			gsap.to(".expert__title", {
				duration: 0.6,
				y: 0,
				autoAlpha: 1,
				delay: 0.6,
			});
		} else {
			gsap.to(".expert__video", {
				duration: 1,
				y: 0,
				autoAlpha: 1,
				delay: 0.3,
			});
			gsap.to(".expert__title", {
				duration: 0.6,
				y: 0,
				autoAlpha: 1,
				delay: 0.3,
			});
		}
	}

	function elementAni() {
		gsap.registerPlugin(ScrollTrigger);

		ScrollTrigger.defaults({
			toggleActions: "restart pause resume pause",
			scroller: "body",
		});

		gsap.to(".understand .container", {
			scrollTrigger: {
				trigger: ".understand",
				start: "top center",
				end: "+=" + ($(".understand").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".history .container", {
			scrollTrigger: {
				trigger: ".history",
				start: "top center",
				end: "+=" + ($(".history").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".research .container", {
			scrollTrigger: {
				trigger: ".research",
				start: "top center",
				end: "+=" + ($(".research").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".research .research__item", {
			scrollTrigger: {
				trigger: ".research",
				start: "top center",
				end: "+=" + ($(".history").height() / 2),
				scrub: 1,
			},
			stagger: 0.3,
			duration: 0.3,
			autoAlpha: 1,
		});

		gsap.to(".qa .copywriting", {
			scrollTrigger: {
				trigger: ".qa",
				start: "top center",
				end: "+=" + ($(".qa").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".qa .qa__desc", {
			scrollTrigger: {
				trigger: ".qa .qa__desc",
				start: "top center",
				end: "+=" + ($(".qa").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".qa .qa__keypoint h3", {
			scrollTrigger: {
				trigger: ".qa .qa__desc",
				start: "top center",
				end: "+=" + ($(".qa").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});

		gsap.to(".qa .qa__keypoint__item:nth-child(1)", {
			scrollTrigger: {
				trigger: ".qa",
				start: "top center",
				end: "+=" + ($(".qa").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			x: 0
		});

		gsap.to(".qa .qa__keypoint__item:nth-child(3)", {
			scrollTrigger: {
				trigger: ".qa",
				start: "top center",
				end: "+=" + ($(".qa").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			x: 0
		});

		gsap.to(".moreref .container", {
			scrollTrigger: {
				trigger: ".moreref",
				start: "top center",
				end: "+=" + ($(".moreref").height() / 3),
				scrub: 1,
			},
			duration: 0.3,
			autoAlpha: 1,
			y: 0
		});
	}

	function scrollToSection() {
		$(".header__nav__item[href^='https://event.leecy.org.tw/mrna']").on("click", function (e) {
			e.preventDefault();
			let anchor = $(this).data("anchor");

			let target = "#" + anchor;
			console.log("target: " + target);

			$(".header__nav__item").removeClass("active");
			$(".header__nav__item-" + anchor).addClass("active");

			$("html, body").animate({
				scrollTop: $(target).offset().top - $(".header").outerHeight() - 50,
			});

			if (windowWidth < 992) {
				closeMenu();
			}
		});
	}

	// 偵測滾動到哪一個section
	function detectScrollSection() {

		const scrollPosition = !isMobile ? $(window).scrollTop() + headerH : $(window).scrollTop();
		const windowH = $(window).height();
		const bodyH = $("body").height();
		let tempId = null;
		let isBlankSpace = true;

		// console.log("windowH: "+windowH);
		// console.log("bodyH: "+bodyH);
		// console.log("scrollPosition: "+scrollPosition);
		// console.log("headerH: "+headerH);

		if (scrollPosition < (bodyH - windowH)) {
			section.each(function (idx, section) {
				const sectionTop = $(section).offset().top;
				const sectionBottom = sectionTop + $(section).height();
				const sectionH = $(section).outerHeight();
				let tempBlankSpace = (windowH - sectionH) / 2
				if (tempBlankSpace < 0 && !isMobile) {
					isBlankSpace = false
				}

				if (isMobile) {
					isBlankSpace = false
				}

				let blankSpace = isBlankSpace ? tempBlankSpace : headerH;
				// console.log("tempBlankSpace: "+tempBlankSpace)
				// console.log("isBlankSpace: "+isBlankSpace)
				// console.log("blankSpace: "+blankSpace)


				if (scrollPosition >= (sectionTop - blankSpace) && scrollPosition < (sectionBottom - blankSpace)) {
					// console.log("blankSpace: "+blankSpace)
					tempId = section.id;
					if (tempId === "history") {
						tempId = "understand";
					}
					if (currentId !== tempId) {
						currentId = tempId;
						// console.log("focus: "+currentId);
						$(".header__nav__item").removeClass("active");
						$(".header__nav__item-" + currentId).addClass("active");
					}
				}


			});

		} else {
			tempId = "moreref";
			if (currentId !== tempId) {
				currentId = tempId;
				console.log("focus: " + currentId);
				$(".header__nav__item").removeClass("active");
				$(".header__nav__item-" + currentId).addClass("active");
			}
		}


	}

	{
		$(document).ready(function () {
			init();
		});
	}

	//public
	return {
	};
};

var main = new main();
