https://www.firicot.com/build/assets/custom-343485e4.js

1/*!
2 * Chieh-Han Chang v20220408
3 * Copyright 2019-2022
4 * Licensed under Tonghe 2022 Tonghe Marketing Co.,Ltd .
5 */
6
7
8var whois = "We Are 通和行銷！"
9
10//當前視窗寬度為wdth
11wdth = $(window).width()
12
13//設定響應式斷點
14function getScrollbarWidth() {
15    return window.innerWidth - document.documentElement.clientWidth;
16}
17mediawdth_desktop = 1270 - getScrollbarWidth()
18mediawdth_tablet = 768 - getScrollbarWidth()
19
20if (wdth < mediawdth_desktop) {
21    screenmode = 2
22} else {
23    screenmode = 0
24}
25
26$(document).ready(function() {
27
28    // Run after webpage load finished
29    searchbar()
30    menutogglecontrol()
31    Navbartoggle()
32    Swiper_initial()
33    copyrightYear() //版權年份自動填入
34    safariHacks() //解決手機版safari & chrome 在100vh會包含網址列的問題
35    sociallinkAnimation() //footer sociallink按鈕 hover動畫
36    productboxControl()
37    NavbarStyle() //整個navbar在捲動一定距離時給予特別樣式
38    navheadStyleControl() //當分頁.navhead變色
39    specboxControl() //點擊選擇規格
40    dropdownControl() //dropdown通用展開縮合
41    Tenpercentile() //使用.js-Tenpercentile的欄位會自動做千位處理
42        // reload when window resizes through the breakpoints
43        // WebReload([mediawdth_tablet, mediawdth_desktop])
44    SidecaseWithBacktotop()
45    tabboxControl()
46    removeEmptyParagraphs() //移除僅含一個<br>的 p 標籤，Quill自己產的
47        // niceScroll_initial()
48    policyblock()
49    mMenuToggle() //share頁的手機版選單展開縮合
50
51    // Custom element setting
52    // style_checkbox();
53    checkboxGiveId()
54    radioGiveId()
55    style_select_init() //custom select style
56    editorStyleAdjust() //編輯器內樣式調整
57
58    // For RWD JS running & specific page JS running
59    RUNFUNCRWD()
60    JSPAGEcontrol() //note:run only once
61
62
63
64})
65
66$(window).resize(function() {
67    wdth = $(window).width()
68    RUNFUNCRWD()
69})
70
71function WebReload(reloadpoints) {
72    var firstwdth = $(window).width()
73    reloadpoints.forEach(function(breakpoint) {
74        $(window).resize(function() {
75            if (firstwdth >= breakpoint) {
76                // console.log(breakpoint)
77                $(window).width() <= breakpoint ? location.reload() : ''
78            } else {
79                $(window).width() > breakpoint ? location.reload() : ''
80            }
81        })
82    })
83}
84
85//RUN func() when switch to desktop or mobile device
86//screenmode=0代表已調整為手機版  =1代表已調整為平板版  =2代表已調整為電腦版
87function RUNFUNCRWD() {
88    if (wdth < mediawdth_tablet) {
89        if (screenmode != 0) {
90            screenheight = $(window).innerHeight()
91
92            //調整成手機版後要run的func
93
94            $(".opentoggle").siblings("ul").slideUp()
95
96
97            screenmode = 0
98            console.log("JS程式-已執行運行手機版")
99        }
100    } else if (wdth < mediawdth_desktop) {
101        if (screenmode != 1) {
102            screenheight = $(window).innerHeight()
103
104            //調整成平板版後要run的func
105
106            $(".opentoggle").siblings("ul").slideUp()
107
108
109            screenmode = 1
110            console.log("JS程式-已執行運行平板版")
111        }
112    } else {
113        if (screenmode != 2) {
114            screenheight = $(window).innerHeight()
115
116            //調整成電腦版後要run的func
117            $(".opentoggle").siblings("ul").show()
118            $(".navitem-group").removeClass("js-navitem-group--open")
119            $(".screenmask").removeClass("screenmask--active")
120            $(".wrapper-searchwindow").removeClass("is-softshow")
121            $(".menu-toggle").find("span").removeClass("menu-toggle__span--active")
122            $(".navhead ul").removeClass("h100")
123            $(".navhead-a-active").removeClass("navhead-a-active")
124            $(".sticker-triangle-active").removeClass("sticker-triangle-active")
125
126            screenmode = 2
127            console.log("JS程式-已執行運行電腦版")
128        }
129    }
130}
131
132function JSPAGEcontrol() {
133    //在index.html才執行
134    if ($currentpage == "INDEX") {
135        newsbarControl() //消息跳動
136        Tenpercentile_productbox() //productbox價格處理為千分位
137    }
138
139    if ($currentpage == "PRODUCTS" || $currentpage == "SEARCH") {
140        Tenpercentile_productbox() //productbox價格處理為千分位
141    }
142
143    if ($currentpage == "DISCOUNT" || $currentpage == "GUIDELINE") {
144
145        Tenpercentile_productbox()
146        discountboxShow() //discount.html 裡.discountbox出現的動畫

147        discountboxTimeCounting() //即將結束分頁裡的.discountbox倒數計時
148    }
149
150    if ($currentpage == "COUPON") {
151
152        tipwindowControl()
153    }
154
155    if ($currentpage == "ACCOUNT") {
156
157        tipwindowControl()
158        smallwindowControl()
159    }
160
161    if ($currentpage == "PRODUCTSDETAIL") {
162        choosewindowControl()
163    }
164
165    if ($currentpage == "DISCOUNTDETAIL") {
166        Tenpercentile_productbox()
167        smallwindowControl()
168        choosewindowControl()
169        blockReadyaddControl() //有關待加入購物車清單的控制
170
171        let sidecaseControl = () => {
172            //手機版隱藏#sidecase
173            if (wdth < mediawdth_tablet) {
174                $('#sidecase').hide()
175            } else {
176                $('#sidecase').show()
177            }
178        }
179        sidecaseControl()
180
181        $(window).resize(function() {
182            sidecaseControl()
183        })
184
185    }
186
187    if ($currentpage == "ABOUT") {
188        ScrollReachRun($('.block-about-context__right'), 200, 200, false, function() {
189            var timediff = 300
190            $('.aboutbanner').addClass('js-aboutbanner--active')
191            $('.box').each(function() {
192                setTimeout(() => {
193                    $(this).addClass('fadeInUp animated')
194                }, timediff += 500)
195            })
196        })
197    }
198
199    if ($currentpage == "PRODUCTSDETAIL") {
200
201    }
202
203    if ($currentpage == "NEWS") {
204
205        timestampToDate()
206    }
207
208    if ($currentpage == "ALBUM") {
209        timestampToDate()
210    }
211
212    if ($currentpage == "SITEMAP") {
213        var timediff = 200
214        $('.smbox-group__column').each(function() {
215            setTimeout(() => {
216                $(this).addClass('fadeInUp slower animated')
217            }, timediff += 300)
218        })
219    }
220
221
222}
223
224// new WOW().init();
225// wow = new WOW({
226//     boxClass: "wow", // default
227//     animateClass: "animated", // default
228//     offset: 160, // default
229//     mobile: true, // default
230//     live: true, // default
231// })
232// wow.init()
233
234setTimeout(() => {
235    AOS.init({
236        // Global settings:
237        // disable: function() {
238        //     return window.innerWidth < mediawdth_tablet;
239        // },
240        startEvent: 'DOMContentLoaded', // name of the event dispatched on the document, that AOS should initialize on
241        initClassName: 'aos-init', // class applied after initialization
242        animatedClassName: 'aos-animate', // class applied on animation
243        useClassNames: false, // if true, will add content of `data-aos` as classes on scroll
244        disableMutationObserver: false, // disables automatic mutations' detections (advanced)
245        debounceDelay: 50, // the delay on debounce used while resizing window (advanced)
246        throttleDelay: 99, // the delay on throttle used while scrolling the page (advanced)
247
248
249        // Settings that can be overridden on per-element basis, by `data-aos-*` attributes:
250        offset: 40, // offset (in px) from the original trigger point
251        delay: 0, // values from 0 to 3000, with step 50ms
252        duration: 1000, // values from 0 to 3000, with step 50ms
253        easing: 'ease', // default easing for AOS animations
254        once: true, // whether animation should happen only once - while scrolling down
255        mirror: false, // whether elements should animate out while scrolling past them
256        anchorPlacement: 'top-bottom', // defines which position of the element regarding to window should trigger the animation
257
258    });
259}, 1000);
260
261// 點擊hamburger bar後
262function menutogglecontrol() {
263    $(".menu-toggle").click(function() {
264        console.log("點了menu-toggle")
265        $(".navitem-group").toggleClass("js-navitem-group--open")
266        $(this).find("span").toggleClass("menu-toggle__span--active")
267
268        // $header.removeClass("topbar--mobile-shrink");
269
270        if ($(".navitem-group").hasClass("js-navitem-group--open")) {
271            $(".screenmask").addClass("screenmask--active")
272        } else if ($(".wrapper-searchwindow").hasClass("is-softshow")) {} else {
273            $(".screenmask").removeClass("screenmask--active")
274        }
275    })
276    $(".screenmask").click(function() {
277        $(this).removeClass("screenmask--active")
278        $(".navitem-group").removeClass("js-navitem-group--open")
279        $(".menu-toggle").find("span").removeClass("menu-toggle__span--active")
280        $(".wrapper-searchwindow").removeClass("is-softshow")
281    })
282}
283
284//Navbar 次選單opentoggle
285function Navbartoggle() {

286    $(".opentoggle").click(function() {
287        if (wdth < mediawdth_desktop) {
288            // 展開點的該層
289            // $(this).siblings('ul').toggleClass('h100');
290            $(this).siblings("ul").slideToggle()
291
292            // 先移除其他層的"激活"樣式
293            // $(this).parent().siblings('li').find('ul').removeClass('h100');
294            $(this).parent().siblings("li").find("ul").slideUp()
295            $(this).parent().siblings("li").removeClass("navhead-active")
296            $(this).parent().siblings("li").find('.sticker-triangle').removeClass("sticker-triangle-active")
297            $(this).parent().siblings("li").find('a').removeClass("navhead-a-active")
298            $(this).parent().siblings("li").removeClass("sub-navhead-active")
299
300            $(this).siblings('ul').find('li .sticker-triangle').removeClass("sub-navhead__sticker-triangle-active")
301            $(this).siblings('ul').find('li a').removeClass("sub-navhead-a-active")
302            $(this).siblings('ul').find('li ').removeClass("sub-navhead-active")
303            $(this).siblings("ul").find('ul').slideUp()
304
305            $(this).parent().siblings("li").find('.sticker-triangle').removeClass("sub-navhead__sticker-triangle-active")
306            $(this).parent().siblings("li").find('a').removeClass("sub-navhead-a-active")
307
308            // 檢查是在哪一層選單,激活相關樣式
309            if ($(this).parent().hasClass("sub-navhead")) {
310                $(this).find(".sticker-triangle").toggleClass("sub-navhead__sticker-triangle-active")
311                $(this).parent().toggleClass("sub-navhead-active")
312                $(this).siblings("a").toggleClass("sub-navhead-a-active")
313            } else {
314                $(this).find(".sticker-triangle").toggleClass("sticker-triangle-active")
315                $(this).parent().toggleClass("navhead-active")
316                $(this).siblings("a").toggleClass("navhead-a-active")
317            }
318        }
319
320    })
321}
322
323// Searchbar
324function searchbar() {
325
326    $('.funcbtn--search').click(function() {
327        $('.main-menu__box-search').slideToggle()
328        $('ul.menulist').removeClass('js-menulist--open')
329        $('.screenmask').removeClass('screenmask--active')
330    })
331
332    $('.box-search__closebtn').click(function() {
333        $('.main-menu__box-search').slideUp()
334
335    })
336}
337
338
339//  backtotop, transfer the window to topside
340function SidecaseWithBacktotop() {
341
342    if ($("#sidecase").length) {
343
344        $(window).scroll(function() {
345            Initial()
346        })
347
348        var Initial = function() {
349            scrollTrigger = $(window).height() / 3 * 2 // px
350            scrollTrigger_footer = $(document).height() - $(window).height() - $('footer').height() + 2.5 / 100 * $(window).width() // px
351        }
352        Initial()
353
354        sidecaseShowControl = function() {
355            var scrollTop = $(window).scrollTop()
356            if ($currentpage == 'INDEX') {
357                if (scrollTop > scrollTrigger) {
358                    $("#sidecase").addClass("sidecase--show")
359                } else {
360                    $("#sidecase").removeClass("sidecase--show")
361                }
362            }
363
364            //滑到footer了黑字變白
365            if (scrollTop > scrollTrigger_footer) {
366                $("#sidecase").addClass("sidecase--white")
367            } else {
368                $("#sidecase").removeClass("sidecase--white")
369            }
370        }
371
372        if ($currentpage !== 'INDEX') { //若非首頁, #sidecase常駐
373            $("#sidecase").addClass("sidecase--show")
374        }
375
376        sidecaseShowControl()
377        $(window).on("scroll", function() {
378            sidecaseShowControl()
379        })
380        $("#back-to-top").on("click", function(e) {
381            e.preventDefault()
382            $("html,body").animate({
383                    scrollTop: 0,
384                },
385                700,
386                "swing"
387            )
388        })
389    }
390
391    //手機版時socialbtnSwitch才出現社群按鈕
392    $('.socialbtnSwitch').click(function() {
393        $('.socialbtnSwitch').toggleClass('socialbtnSwitch--active')
394        $('.socialbtn-group').toggleClass('socialbtn-group--active')
395    })
396}
397
398//News context too long will be cut
399function textlengthcut(classname, len_sm, len_md, len_lg) {
400
401    $(classname).each(function() {
402        if ($(this).attr('title') == undefined) {
403            $(this).attr('title', $(this).text())
404        }
405    })
406
407    docutting = function() {
408        $(classname).each(function() {
409            if (wdth >= mediawdth_desktop) {
410                if ($(this).attr('title').length > len_lg) {
411                    var text = $(this).attr('title').substring(0, len_lg) + '...'
412                    $(this).text(text)
413                }
414            } else if (wdth >= mediawdth_tablet && wdth < mediawdth_desktop) {
415                if ($(this).attr('title').length > len_md) {
416                    var text = $(this).attr('title').substring(0, len_md) + '...'
417                    $(this).text(text)
418                }
419            } else {
420                if ($(this).attr('title').length > len_sm) {
421                    var text = $(this).attr('title').substring(0, len_sm) + '...'
422                    $(this).text(text)
423                }
424            }
425        })
426    }
427
428    docutting()
429
430    $(window).resize(function() {
431        docutting()
432    })
433
434}
435
436//Slick initial
437function Slick_initial(nowpage) {
438    if (nowpage == "INDEX") {
439        //-- 首頁 產品櫥窗
440        $(".slick-productarea").slick({
441            infinite: false,
442            slidesToShow: 3,
443            slidesToScroll: 3,
444            autoplay: true,
445            autoplaySpeed: 5000,
446            pauseOnHover: false,
447            pauseOnFocus: false,
448            draggable: false,

449            arrows: false,
450            dots: true,
451            dotsClass: "slick-dots",
452            //has customized at slick-theme.css
453            cssEase: "ease",
454            responsive: [{
455                    breakpoint: 1269,
456                    settings: {
457                        slidesToShow: 1,
458                        slidesToScroll: 1,
459                        draggable: true,
460                        pauseOnHover: false,
461                        pauseOnFocus: false,
462                        centerMode: true,
463                    },
464                },
465                {
466                    breakpoint: 767,
467                    settings: {
468                        slidesToShow: 1,
469                        slidesToScroll: 1,
470                        centerMode: false,
471                    },
472                },
473            ],
474        })
475    }
476}
477
478
479//Swiper initial
480function Swiper_initial() {
481
482    //後台可以在一頁創建多個jumbotron
483    if ($('.swiper-jumbotron').length) {
484        $('.swiper-jumbotron').each(function(i, el) {
485            const swiper_jumbotron = new Swiper(el, {
486                direction: 'horizontal',
487                allowTouchMove: false,
488                loop: true,
489                slidesPerView: 1,
490                speed: 1500,
491                effect: 'fade',
492                fadeEffect: {
493                    crossFade: true,
494                },
495                autoplay: {
496                    delay: 4000
497                },
498                pagination: {
499                    el: '.swiper-jumbotron .swiper-pagination',
500                    clickable: true
501                },
502
503                navigation: {
504                    nextEl: '.swiper-jumbotron .swiper-button-next',
505                    prevEl: '.swiper-jumbotron .swiper-button-prev',
506                }
507            });
508        })
509    }
510
511    if ($('.swiper-cetificate').length) {
512        $('.swiper-cetificate').each(function(i, el) {
513            const swiper_cetificate = new Swiper(el, {
514                direction: 'horizontal',
515                allowTouchMove: true,
516                loop: false,
517                slidesPerView: 2,
518                spaceBetween: 15,
519                speed: 1000,
520                effect: 'slide',
521                navigation: {
522                    nextEl: '.swiper-cetificate-btnouter .swiper-button-next',
523                    prevEl: '.swiper-cetificate-btnouter .swiper-button-prev',
524                },
525                breakpoints: {
526                    768: {
527                        slidesPerView: 4,
528                        spaceBetween: 22
529                    },
530                    1269: {
531                        slidesPerView: 4,
532                        spaceBetween: 22
533                    }
534                }
535            });
536        })
537    }
538
539    if ($('.swiper-video').length) {
540        $('.swiper-video').each(function(i, el) {
541            // $(el).find('.swiper-slide').click(function(){
542            //     alert('123')
543            // })
544            const swiper_about_video = new Swiper('.swiper-video', {
545                direction: 'horizontal',
546                allowTouchMove: true,
547                loop: false,
548                centeredSlides: true,
549                slidesPerView: 4,
550                spaceBetween: 21,
551                speed: 1200,
552                navigation: {
553                    nextEl: '.swiper-video-btnouter .swiper-button-next',
554                    prevEl: '.swiper-video-btnouter .swiper-button-prev',
555                },
556                breakpoints: {
557                    // when window width is >= 320px
558                    320: {
559                        slidesPerView: 1,
560                        spaceBetween: 10
561                    },
562                    // when window width is >= 480px
563                    768: {
564                        slidesPerView: 2,
565                        spaceBetween: 0
566                    },
567                    // when window width is >= 640px
568                    1269: {
569                        slidesPerView: 3,
570                        spaceBetween: 0
571                    }
572                },
573                on: {
574                    slideChangeTransitionEnd: function() {
575                        $(el).find('.swiper-slide').not('.swiper-slide-active').each(function() {
576                            var src = $(this).find('iframe').attr("src");
577                            $(this).find('iframe').attr("src", src);
578                        })
579                    }
580                }
581            });
582        })
583    }
584
585    if ($('.swiper-recommendarea').length) {
586        $('.swiper-recommendarea').each(function(i, el) {
587            const swiper_recommendarea = new Swiper('.swiper-recommendarea', {
588                direction: 'horizontal',
589                allowTouchMove: true,
590                loop: false,
591                slidesPerView: 1,
592                speed: 1000,
593                effect: 'slide',
594                autoHeight: true,
595                fadeEffect: {
596                    crossFade: true,
597                },
598                // autoplay: {
599                //     delay: 2000
600                // },
601                navigation: {
602                    nextEl: '.swiper-recommendarea-btnouter .swiper-button-next',
603                    prevEl: '.swiper-recommendarea-btnouter .swiper-button-prev',
604                },
605                pagination: {
606                    el: '.swiper-recommendarea-btnouter .swiper-pagination',
607                    clickable: true
608                },
609                breakpoints: {
610                    // when window width is >= 320px
611                    320: {
612                        slidesPerView: 1,
613                        spaceBetween: 15
614                    },
615                    // when window width is >= 480px
616                    768: {
617                        slidesPerView: 2,
618                        spaceBetween: 15
619                    },
620                    // when window width is >= 640px
621                    1269: {
622                        slidesPerView: 3,
623                        spaceBetween: 16
624                    }
625                },
626                // scrollbar: {
627                //     el: '.swiper-scrollbar',
628                // },
629            });
630        })
631    }
632
633    if ($('.swiper-treatment').length) {
634        $('.swiper-treatment').each(function(i, el) {
635            const swiper_about_treatment = new Swiper('.swiper-treatment', {
636                direction: 'horizontal',
637                allowTouchMove: true,
638                loop: false,
639                slidesPerView: 4,
640                spaceBetween: 21,
641                speed: 1200,
642                navigation: {
643                    nextEl: '.swiper-treatment-btnouter .swiper-button-next',
644                    prevEl: '.swiper-treatment-btnouter .swiper-button-prev',
645                },
646                pagination: {
647                    el: '.swiper-treatment-btnouter .swiper-pagination',
648                    clickable: true
649                },
650                breakpoints: {
651                    // when window width is >= 320px
652                    320: {
653                        slidesPerView: 1,
654                        spaceBetween: 15
655                    },
656                    // when window width is >= 480px
657                    768: {
658                        slidesPerView: 2,
659                        spaceBetween: 15
660                    },
661                    // when window width is >= 640px
662                    1269: {
663                        slidesPerView: 4,
664                        spaceBetween: 20
665                    }
666                },
667            });
668        })
669    }
670
671    if ($('.swiper-clinic').length) {
672        $('.swiper-clinic').each(function(i, el) {
673            const swiper_clinic = new Swiper('.swiper-clinic', {
674                direction: 'horizontal',
675                allowTouchMove: true,
676                loop: false,
677                slidesPerView: 1,
678                spaceBetween: 20,
679                speed: 1200,
680                navigation: {
681                    nextEl: '.swiper-clinic-outer .swiper-button-next',
682                    prevEl: '.swiper-clinic-outer .swiper-button-prev',
683                },
684                pagination: {
685                    el: '.swiper-clinic-outer .swiper-pagination',
686                    clickable: true
687                },
688                breakpoints: {
689                    768: {
690                        slidesPerView: 2,
691                        spaceBetween: 24
692                    }
693                },
694            });
695        })
696    }
697
698    if ($('.swiper-caseShare').length) {
699        $('.swiper-caseShare').each(function(i, el) {
700            const swiper_caseShare = new Swiper('.swiper-caseShare', {
701                direction: 'horizontal',
702                allowTouchMove: true,
703                loop: false,
704                slidesPerView: 1,
705                spaceBetween: 20,
706                speed: 1200,
707                navigation: {
708                    nextEl: '.swiper-caseShare-btnouter .swiper-button-next',
709                    prevEl: '.swiper-caseShare-btnouter .swiper-button-prev',
710                },
711                pagination: {
712                    el: '.swiper-caseShare-btnouter .swiper-pagination',
713                    clickable: true
714                },
715                breakpoints: {
716                    768: {
717                        slidesPerView: 2,
718                        spaceBetween: 24
719                    }
720                },
721            });
722        })
723    }
724
725    if ($('.swiper-experience').length) {
726        $('.swiper-experience').each(function(i, el) {
727            var el_prev = $(this).closest('.swiper-experience-btnouter').find('.swiper-button-prev')[0]
728            var el_next = $(this).closest('.swiper-experience-btnouter').find('.swiper-button-next')[0]
729            var el_pagination = $(this).closest('.swiper-experience-btnouter').find('.swiper-pagination')[0]
730            swiper_experience = new Swiper(this, {
731                direction: 'horizontal',
732                allowTouchMove: true,
733                loop: false,
734                slidesPerView: 1,
735                spaceBetween: 20,
736                speed: 1200,
737                navigation: {
738                    nextEl: el_next,
739                    prevEl: el_prev,
740                },
741                pagination: {
742                    el: el_pagination,
743                    clickable: true
744                },
745                breakpoints: {
746                    768: {
747                        slidesPerView: 3,
748                        spaceBetween: 16
749                    }
750                },
751            });
752        })
753    }
754
755    if ($('.swiper-pagebanner').length) {
756      $('.swiper-pagebanner').each(function(i, el) {
757          const swiper_pagebanner = new Swiper(this, {
758              direction: 'horizontal',
759              allowTouchMove: true,
760              loop: true,
761              slidesPerView: 1,
762              speed: 2000,

763              autoHeight: true,
764              effect: 'slide',
765              autoplay: {
766                  delay: 4000
767              },
768              pagination: {
769                  el: '.swiper-pagination',
770                  clickable: true
771              },
772              navigation: {
773                  nextEl: '.swiper-pagebanner .swiper-button-next',
774                  prevEl: '.swiper-pagebanner .swiper-button-prev',
775              },
776          });
777      })
778    }
779
780    if ($('.swiper-courseShareCard').length) {
781        $('.swiper-courseShareCard').each(function(i, el) {
782            const swiper_courseShareCard = new Swiper(this, {
783                direction: 'horizontal',
784                allowTouchMove: true,
785                loop: false,
786                slidesPerView: 1,
787                spaceBetween: 20,
788                speed: 1200,
789                navigation: {
790                    nextEl: $(this).siblings('.swiper-button-next')[0],
791                    prevEl: $(this).siblings('.swiper-button-prev')[0],
792                },
793                pagination: {
794                    el: $(this).siblings('.swiper-pagination')[0],
795                    clickable: true
796                },
797            });
798        })
799    }
800
801    if ($currentpage == "INDEX") {
802
803        const swiper_newsarea = new Swiper('.swiper-newsarea', {
804            direction: 'horizontal',
805            allowTouchMove: true,
806            loop: false,
807            slidesPerView: 1,
808            speed: 1000,
809            effect: 'slide',
810            fadeEffect: {
811                crossFade: true,
812            },
813            // autoplay: {
814            //     delay: 2000
815            // },
816            navigation: {
817                nextEl: '.swiper-newsarea-btnouter .swiper-button-next',
818                prevEl: '.swiper-newsarea-btnouter .swiper-button-prev',
819            },
820            breakpoints: {
821                // when window width is >= 320px
822                320: {
823                    slidesPerView: 1,
824                    spaceBetween: 15
825                },
826                // when window width is >= 480px
827                768: {
828                    slidesPerView: 3,
829                    spaceBetween: 15
830                },
831                // when window width is >= 640px
832                1269: {
833                    slidesPerView: 4,
834                    spaceBetween: 21
835                }
836            },
837            // scrollbar: {
838            //     el: '.swiper-scrollbar',
839            // },
840        });
841
842        const swiper_indexbanner = new Swiper('.swiper-indexbanner', {
843            direction: 'horizontal',
844            allowTouchMove: true,
845            loop: true,
846            slidesPerView: 1,
847            speed: 1000,
848            effect: 'slide',
849            fadeEffect: {
850                crossFade: true,
851            },
852            autoplay: {
853                delay: 3000
854            },
855            pagination: {
856                el: '.swiper-pagination',
857                clickable: true
858            },
859        });
860    }
861
862    if ($currentpage == "ABOUT") {
863
864        const swiper_about_newsarea = new Swiper('.swiper-newsarea', {
865            direction: 'horizontal',
866            allowTouchMove: true,
867            loop: false,
868            slidesPerView: 1,
869            speed: 1000,
870            effect: 'slide',
871            fadeEffect: {
872                crossFade: true,
873            },
874            // autoplay: {
875            //     delay: 2000
876            // },
877            navigation: {
878                nextEl: '.swiper-newsarea-btnouter .swiper-button-next',
879                prevEl: '.swiper-newsarea-btnouter .swiper-button-prev',
880            },
881            breakpoints: {
882                // when window width is >= 320px
883                320: {
884                    slidesPerView: 1,
885                    spaceBetween: 15
886                },
887                // when window width is >= 480px
888                768: {
889                    slidesPerView: 2,
890                    spaceBetween: 15
891                },
892                // when window width is >= 640px
893                1269: {
894                    slidesPerView: 4,
895                    spaceBetween: 21
896                }
897            },
898            // scrollbar: {
899            //     el: '.swiper-scrollbar',
900            // },
901        });
902
903
904    }
905
906    if ($currentpage == "PRODUCTSDETAIL") {
907        const swiper_thumb = new Swiper('.swiper-thumb', {
908            direction: 'horizontal',
909            allowTouchMove: true,
910            loop: false,
911            spaceBetween: 8,
912            slidesPerView: 4,

913            speed: 800,
914            freeMode: true,
915            watchSlidesProgress: true,
916            effect: 'slide',
917            fadeEffect: {
918                crossFade: true,
919            },
920            navigation: {
921                nextEl: '.swiper-thumb-btnouter .swiper-button-next',
922                prevEl: '.swiper-thumb-btnouter .swiper-button-prev',
923            },
924            scrollbar: {
925                el: '.swiper-thumb-btnouter .swiper-scrollbar',
926                draggable: true,
927            },
928        });
929
930        const swiper_nail = new Swiper('.swiper-nail', {
931            direction: 'horizontal',
932            allowTouchMove: true,
933            loop: false,
934            slidesPerView: 1,
935            speed: 1000,
936            effect: 'slide',
937            thumbs: {
938                swiper: swiper_thumb
939            },
940            controller: {
941                inverse: true,
942            },
943        });
944
945
946        $('.swiper-thumb-btnouter .swiper-button-next').mouseenter(function() {
947            $(this).trigger('click')
948            thumbMoveNextInterval = setInterval(() => {
949                $(this).trigger('click')
950            }, 600)
951        })
952        $('.swiper-thumb-btnouter .swiper-button-next').mouseleave(function() {
953            clearInterval(thumbMoveNextInterval)
954        })
955        $('.swiper-thumb-btnouter .swiper-button-prev').mouseenter(function() {
956            $(this).trigger('click')
957            thumbMovePrevInterval = setInterval(() => {
958                $(this).trigger('click')
959            }, 600)
960        })
961        $('.swiper-thumb-btnouter .swiper-button-prev').mouseleave(function() {
962            clearInterval(thumbMovePrevInterval)
963        })
964
965        const swiper_plusbuy = new Swiper('.swiper-plusbuy', {
966            direction: 'horizontal',
967            allowTouchMove: true,
968            loop: false,
969            spaceBetween: 10,
970            slidesPerView: 1,
971            speed: 1300,
972            effect: 'slide',
973            navigation: {
974                nextEl: '.swiper-plusbuy-btnouter .swiper-button-next',
975                prevEl: '.swiper-plusbuy-btnouter .swiper-button-prev',
976            },
977            breakpoints: {
978                // when window width is >= 480px
979                768: {
980                    slidesPerView: 2,
981                    spaceBetween: 10
982                },
983                // when window width is >= 640px
984                1269: {
985                    slidesPerView: 3,
986                    spaceBetween: 10
987                }
988            },
989        });
990    }
991
992    if ($currentpage == "ALBUM") {
993        const swiper_thumb = new Swiper('.swiper-thumb', {
994            direction: 'horizontal',
995            allowTouchMove: true,
996            loop: false,
997            spaceBetween: 5,
998            slidesPerView: 4,
999            speed: 800,
1000            freeMode: true,
1001            watchSlidesProgress: true,
1002            effect: 'slide',
1003            fadeEffect: {
1004                crossFade: true,
1005            },
1006            scrollbar: {
1007                el: '.swiper-thumb-btnouter .swiper-scrollbar',
1008                draggable: true,
1009            },
1010            breakpoints: {
1011                // when window width is >= 320px
1012                768: {
1013                    spaceBetween: 11
1014                }
1015            },
1016        });
1017
1018        const swiper_nail = new Swiper('.swiper-nail', {
1019            direction: 'horizontal',
1020            allowTouchMove: true,
1021            loop: false,
1022            slidesPerView: 1,
1023            speed: 1000,
1024            effect: 'slide',
1025            thumbs: {
1026                swiper: swiper_thumb
1027            },
1028            navigation: {
1029                nextEl: '.swiper-nail-btnouter .swiper-button-next',
1030                prevEl: '.swiper-nail-btnouter .swiper-button-prev',
1031            },
1032            controller: {
1033                inverse: true,
1034            },
1035        });
1036
1037
1038        $('.swiper-thumb-btnouter .swiper-button-next').hover(function() {
1039            $(this).trigger('click')
1040        })
1041        $('.swiper-thumb-btnouter .swiper-button-prev').hover(function() {
1042            $(this).trigger('click')
1043        })
1044
1045        const swiper_products = new Swiper('.swiper-products', {
1046            direction: 'horizontal',
1047            allowTouchMove: true,
1048            loop: false,
1049            spaceBetween: 6,
1050            slidesPerView: 2,
1051            speed: 1000,
1052            effect: 'slide',
1053            controller: {
1054                inverse: true,
1055            },
1056            pagination: {
1057                el: '.swiper-products-outer .swiper-pagination',
1058                clickable: true
1059            },
1060            breakpoints: {
1061                // when window width is >= 320px
1062                768: {
1063                    slidesPerView: 3,
1064                    spaceBetween: 11
1065                }
1066            },
1067
1068        });
1069    }
1070}
1071
1072//首頁新聞欄
1073function newsbarControl() {
1074    if ($('#newsbar').length > 0) {
1075        setInterval(function() {

1076            $('#newsbar li:first-child').slideUp(function() {
1077                $(this).appendTo($('#newsbar ul')).slideDown()
1078            })
1079        }, 5000)
1080    }
1081}
1082
1083// Flexslider initial
1084function Flexslider_initial() {
1085    if ($(".flexslider").length > 0) {
1086        //>0，避免找不到執行失敗而導致後續js無法執行
1087        $(".flexslider").flexslider({
1088            animation: "slide",
1089            controlNav: "thumbnails",
1090            directionNav: false,
1091        })
1092    }
1093}
1094
1095function style_checkbox() {
1096    $('.inquirylist__item').click(function() {
1097        if ($(this).find('input').prop('checked') == true) {
1098            $(this).removeClass('bg-color--gray')
1099            $(this).addClass('bg-color--primary')
1100            $(this).removeClass('color--contentblack')
1101            $(this).addClass('color--white')
1102            $(this).find('.inquirylist__checkbox::before').css('visibility', 'visible')
1103            $(this).find('.inquirylist__checkbox::after').css('visibility', 'visible')
1104        } else {
1105            $(this).removeClass('bg-color--primary')
1106            $(this).addClass('bg-color--gray')
1107            $(this).removeClass('color--white')
1108            $(this).addClass('color--contentblack')
1109        }
1110    })
1111}
1112
1113
1114//Control the .faqbox shrink and stretch
1115function faqboxcontrol(allsw) {
1116
1117    //Step1. faqbox 按鈕高度RWD調整
1118    $('.faqbox__arrowbtn').each(function() {
1119        $(this).css('height', '0')
1120        var queheight = $(this).parent().css('height')
1121        $(this).css('height', queheight)
1122    })
1123
1124
1125    $('.faqbox__head').click(function() {
1126        if ($(this).parent('.faqbox').hasClass('faqbox--active')) {
1127            //點擊的項目移除active, 點擊的項目答案關閉
1128            $(this).parent('.faqbox').removeClass('faqbox--active')
1129            $(this).siblings('.faqbox__ans').slideUp()
1130        } else {
1131            if (allsw === true) {
1132                //所有移除active, 答案關閉
1133                $('.faqbox').removeClass('faqbox--active')
1134                $('.faqbox__head').siblings('.faqbox__ans').slideUp()
1135            }
1136
1137            //點擊的項目新增active, 點擊的項目答案打開
1138            $(this).parent('.faqbox').addClass('faqbox--active')
1139            $(this).siblings('.faqbox__ans').slideDown()
1140        }
1141    })
1142
1143}
1144
1145function dropdownControl() {
1146
1147    $('.js-dropdown').each(function() {
1148        if ($(this).attr('data-dropdown-open') == 'true') {
1149            $(this).find('.js-dropdown__body').show()
1150            $(this).find('.js-dropdown__head').addClass('js-dropdown__head--active')
1151        } else {
1152            $(this).find('.js-dropdown__body').hide()
1153        }
1154    })
1155
1156    $('.js-dropdown__head').click(function() {
1157        $(this).toggleClass('js-dropdown__head--active')
1158        $(this).closest('.js-dropdown').children('.js-dropdown__body').slideToggle()
1159        if ($(this).closest('.js-dropdown').attr('data-dropdown-individual') == "true") {} else {
1160            $(this).closest('.js-dropdown').siblings('.js-dropdown').find('.js-dropdown__head').removeClass('js-dropdown__head--active')
1161            $(this).closest('.js-dropdown').siblings('.js-dropdown').find('.js-dropdown__body').slideUp()
1162        }
1163
1164        // proitem樣式補丁
1165        // if($(this).closest('.js-dropdown').attr('data-dropdown-individual')=="true"){}else{
1166        //     $(this).closest('.proitem').siblings('.proitem').find('.proitem__head').removeClass('bg-color--primary color--white')
1167        // }
1168        // if ($(this).hasClass('js-dropdown__head--active')) {
1169        //     $(this).closest('.proitem').find('.proitem__head').addClass('bg-color--primary color--white')
1170        // } else {
1171        //     $(this).closest('.proitem').find('.proitem__head').removeClass('bg-color--primary color--white')
1172        // }
1173    })
1174}
1175
1176//自動為input[type="checkbox"]的id及下一個label的for 冠上對應編號
1177function checkboxGiveId() {
1178    var id = 0
1179    $('input[type="checkbox"]').each(function() {
1180        $(this).attr('id', 'c' + id)
1181        $(this).next('label').attr('for', 'c' + id)
1182        id++
1183    })
1184}
1185
1186//自動為input[type="radio"]的id及下一個label的for 冠上對應編號
1187function radioGiveId() {
1188    var id = 0
1189    $('input[type="radio"]').each(function() {
1190        $(this).attr('id', 'r' + id)
1191        $(this).next('label').attr('for', 'r' + id)
1192        id++
1193    })
1194}
1195
1196//抓取並執行客製化select
1197function style_select_init() {
1198    $(".js-slt-styleoutter").each(function(i) {
1199        var selectName = "customSelect-" + (i + 1)
1200        $(this).attr("id", selectName)
1201        style_select(selectName)
1202    })
1203}
1204
1205//執行客製化select
1206function style_select(custumSelect) {
1207    var custumSelect = "#" + custumSelect
1208    $(custumSelect).find($(".slt-style").hide())
1209    $(custumSelect).find(".slt-style").css('opacity', '1')
1210    var select_totalnum = $(custumSelect)
1211        .find(".slt-style")
1212        .find(".slt-style__option").length
1213    var j = 0 // id初始值
1214    var idArrar = []
1215    var is_showChange = $(custumSelect).data('show-change') //點擊option後 show的文字是否改變
1216    if ($(custumSelect).find(".slt-style-show").html() == '') {
1217        $(custumSelect)
1218            .find(".slt-style-show")
1219            .html($(custumSelect).find(".slt-style__option").eq(0).html())
1220    }
1221
1222    // 為個別__option建立data-mother-id序號
1223    $(custumSelect).find('.slt-style__option').each(function(i) {
1224        $(this).attr('data-mother-id', i)
1225    })
1226
1227    // 將個別__option的data-value傳給select裡的option
1228    $(custumSelect)
1229        .find(".slt-style__option")
1230        .each(function() {
1231            idArrar[j] = $(this).attr("data-value")
1232            j++
1233        })
1234
1235    //建立option
1236    for (let i = 0; i < select_totalnum; i++) {
1237        $(custumSelect).find(".slt-style").siblings('select').append('<option value="' + idArrar[i] + '"data-child-id="' + i + '">' + idArrar[i] + "</option>")
1238    }
1239
1240    // 在第一位添增一個valer為空的選項，使該select預設選項為空值
1241    $(custumSelect).find(".slt-style").siblings('select').prepend('<option value="" selected></option>')
1242
1243
1244    //點擊show之後做的事
1245    $(custumSelect)
1246        .find(".slt-style-show")
1247        .click(function() {
1248            if ($(this).siblings('.slt-style').hasClass('slt-style--opened')) {

1249                //點擊,收起完成後移除.slt-style--opened
1250                $(this).siblings('.slt-style').slideUp(300, function() {
1251                    $(this).removeClass('slt-style--opened')
1252                }).siblings(".slt-styleoutter__arrow").removeClass("is-upside-down--top50")
1253            } else {
1254                //點擊,開啟完成後增加.slt-style--opened
1255                $(this).siblings('.slt-style').slideDown(300, function() {
1256                    $(this).addClass('slt-style--opened')
1257                }).siblings(".slt-styleoutter__arrow").addClass("is-upside-down--top50")
1258            }
1259        })
1260
1261    //點擊客製選項option做的事
1262    $(custumSelect)
1263        .find(".slt-style__option")
1264        .click(function() {
1265            $(this).parent().slideToggle()
1266            $(custumSelect)
1267                .find(".slt-styleoutter__arrow")
1268                .toggleClass("is-upside-down--top50")
1269            var select_html = $(this).html()
1270            var select_id = $(this).attr("data-mother-id")
1271            if (is_showChange !== false) {
1272                $(custumSelect).find(".slt-style-show").html(select_html)
1273            }
1274            $(custumSelect)
1275                .find(".slt-style")
1276                .siblings('select')
1277                .children()
1278                .removeAttr("selected", "")
1279            $(custumSelect)
1280                .find(".slt-style")
1281                .siblings('select')
1282                .children()
1283                .each(function() {
1284                    if ($(this).attr("data-child-id") == select_id) {
1285                        $(this).attr("selected", "")
1286                    }
1287                })
1288            $(custumSelect).find(".slt-style").siblings('select').change()
1289        })
1290
1291    // 搜尋功能
1292    $(custumSelect)
1293        .find(".slt-style__search .slt-style__search-input").keyup(function() {
1294            var keyword = $(this).val().toLowerCase(); // 取得輸入的關鍵字並轉小寫
1295
1296            // 尋找所有選項
1297            $(this).closest('.slt-style').find('.slt-style__option').each(function() {
1298                var optionText = $(this).text().toLowerCase(); // 取得選項文字並轉小寫
1299                // 檢查選項文字是否包含關鍵字
1300                if (optionText.indexOf(keyword) > -1) {
1301                    $(this).show(); // 包含關鍵字則顯示
1302                } else {
1303                    $(this).hide(); // 不包含關鍵字則隱藏
1304                }
1305            });
1306        })
1307
1308    $('body').click(function(e) {
1309        // 檢查點擊的目標為.js-slt-styleoutter這個元件，且選單本來就是展開時，就不收起選單。(是為了A選單開啟時，點擊其他的選單也要收起A選單。但若是點擊非選單的地方也要收起選單)
1310        if ($(e.target).closest('.js-slt-styleoutter').length && $(e.target).closest('.slt-style').hasClass('slt-style--opened')) {} else {
1311            $('.slt-style.slt-style--opened').slideUp(300, function() {
1312                $(this).removeClass('slt-style--opened')
1313            }).siblings(".slt-styleoutter__arrow").removeClass("is-upside-down--top50")
1314        }
1315    })
1316}
1317
1318function sociallinkAnimation() {
1319    $('.sociallink').hover(function() {
1320        console.log($(this))
1321        if ($(this).hasClass('sociallink--active')) {} else {
1322            $(this).addClass('sociallink--active')
1323            setTimeout(() => {
1324                $(this).removeClass('sociallink--active')
1325            }, 1100)
1326        }
1327    })
1328}
1329
1330function productboxControl() {
1331
1332    //我的最愛商品樣式
1333    $('.productbox').each(function() {
1334        if ($(this).hasClass('productbox--favoriteAdded')) {
1335            $(this).find('.productbox__favorite').html('<i class="fa-solid fa-heart"></i>')
1336        }
1337    })
1338
1339    //新品上市, 熱銷排行 冠 tag小標籤
1340    switch ($currentpage) {
1341        case 'BESTSELLER':
1342            for (let i = 0; i < 4; i++) {
1343                $('.productbox-group .productbox').eq(i).append('<div class="productbox__tag productbox__tag--top"><span>TOP</span><span>' + (i + 1) + '</span></div>')
1344            }
1345            break;
1346        case 'NEWARRIVAL':
1347            for (let i = 0; i < 4; i++) {
1348                $('.productbox-group .productbox').eq(i).append('<div class="productbox__tag productbox__tag--new"><span>NEW</span></div>')
1349            }
1350            break;
1351    }
1352}
1353
1354function tabboxControl() {
1355
1356    $('.tabbox').each(function() {
1357        var whichPage = $(this).data('current')
1358        var that = $(this)
1359        var mother = []
1360        if (whichPage != undefined) {
1361            that.children('.tabbox__mothers').children('.tabbox__mother').eq(whichPage - 1).addClass('tabbox__mother--active')
1362        } else {
1363            that.children('.tabbox__mothers').children('.tabbox__mother').eq(0).addClass('tabbox__mother--active')
1364        }
1365        that.children('.tabbox__mothers').children('.tabbox__mother').each(function() {
1366            mother.push($(this))
1367        })
1368        if (whichPage != undefined) {
1369            that.children('.tabbox__children').children('.tabbox__child').eq(whichPage - 1).addClass('tabbox__child--active')
1370        } else {
1371            that.children('.tabbox__children').children('.tabbox__child').eq(0).addClass('tabbox__child--active')
1372        }
1373        mother.forEach(function(v, i) {
1374            v.click(function() {
1375                v.siblings('.tabbox__mother').removeClass('tabbox__mother--active')
1376                v.addClass('tabbox__mother--active')
1377                that.children('.tabbox__children').children('.tabbox__child').removeClass('tabbox__child--active')
1378                that.children('.tabbox__children').children('.tabbox__child').eq(i).addClass('tabbox__child--active')
1379            })
1380        })
1381    })
1382
1383}
1384
1385function discountboxShow() {
1386
1387    $('.discountbox-group').each(function() {
1388        var timediff = 100 //出現的時間差
1389        $(this).children('.discountbox').each(function() {
1390            $(this).css('animation-delay', timediff + 'ms')
1391            timediff += timediff
1392        })
1393    })
1394}
1395
1396
1397function timestampToDate() {
1398    var timestamp = Number($('.js-date').find('span').text())
1399    var date = new Date(timestamp * 1000)
1400    var year = date.getFullYear()

1401    var month = date.getMonth()
1402    var day = date.getDate()
1403
1404    switch (month) {
1405        case 1:
1406            month = "January";
1407            break;
1408        case 2:
1409            month = "February";
1410            break;
1411        case 3:
1412            month = "March";
1413            break;
1414        case 4:
1415            month = "April";
1416            break;
1417        case 5:
1418            month = "May";
1419            break;
1420        case 6:
1421            month = "June";
1422            break;
1423        case 7:
1424            month = "July";
1425            break;
1426        case 8:
1427            month = "August";
1428            break;
1429        case 9:
1430            month = "September";
1431            break;
1432        case 10:
1433            month = "October";
1434            break;
1435        case 11:
1436            month = "November";
1437            break;
1438        case 12:
1439            month = "December";
1440            break;
1441    }
1442
1443    $('.js-date span').text(month + ' ' + day + ', ' + year)
1444}
1445
1446function inputTYPEcheck() {
1447    $('input[type="tel"]').change(function() {
1448        if (isNaN($(this).val())) {
1449            alert(
1450                "＊＊＊＊＊貼心提醒＊＊＊＊＊\n\n 輸入的電話號碼請為數字半形唷！：）"
1451            )
1452            $(this).val("")
1453        }
1454    })
1455
1456    //E-MAIL格式檢查
1457    $('input[type="email"]').change(function() {
1458        $Emailchecking = IsEmail($(this).val())
1459        if ($Emailchecking == false) {
1460            alert("＊＊＊＊＊貼心提醒＊＊＊＊＊\n\n 請填寫正確的E-MAIL格式唷！：）")
1461            $(this).val("")
1462            $(this).blur() //離開焦點
1463        }
1464    })
1465
1466    //電話格式檢查
1467    $("#telephone").change(function() {
1468        var regex = /^(\d{2,3}-?|\(\d{2,3}\))\d{3,4}-?\d{4}$/
1469        if (!regex.test($(this).val())) {
1470            alert(
1471                "＊＊＊＊＊貼心提醒＊＊＊＊＊\n\n 輸入的文字須符合電話格式(且為半形文字)！"
1472            )
1473            $(this).val("")
1474        }
1475    })
1476
1477    //Email格式檢查
1478    function IsEmail(email) {
1479        var regex =
1480            /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/
1481        if (!regex.test(email)) {
1482            return false
1483        } else {
1484            return true
1485        }
1486    }
1487
1488    //密碼＆再次輸入密碼 需相同
1489    $("#repassword").change(function() {
1490        var pswd = $("#password").val()
1491        if (pswd == $(this).val()) {} else {
1492            alert("密碼須相同")
1493            $(this).val("")
1494        }
1495    })
1496
1497    $("#password").change(function() {
1498        var pswdre = $("#repassword").val()
1499        if (pswdre == $(this).val()) {} else {
1500            if (pswdre.length == 0) {} else {
1501                alert("密碼須相同")
1502                $("#repassword").val("")
1503            }
1504        }
1505    })
1506
1507    // Class套用
1508    $('input[type="text"]').change(function() {
1509        if ($(this).val() == "") {
1510            $(this).removeClass("input-style-A--success")
1511        } else {
1512            $(this).addClass("input-style-A--success")
1513        }
1514    })
1515
1516    $("textarea").change(function() {
1517        if ($(this).val() == "") {
1518            $(this).removeClass("input-style-A--success")
1519        } else {
1520            $(this).addClass("input-style-A--success")
1521        }
1522    })
1523
1524    $(".input-style-C").focus(function() {
1525        $(this)
1526            .parent(".input-style-C-outter")
1527            .addClass("input-style-C-outter--success")
1528    })
1529
1530    $(".input-style-C").blur(function() {
1531        if ($(this).val() == "") {
1532            $(this)
1533                .parent(".input-style-C-outter")
1534                .removeClass("input-style-C-outter--success")
1535        } else {
1536            $(this)
1537                .parent(".input-style-C-outter")
1538                .addClass("input-style-C-outter--success")
1539        }
1540    })
1541}
1542
1543
1544// item appear way
1545function waterfallshow(cp) {
1546    //cp = $currentpage
1547    //Give .wow.fadeIn class in DOM's target
1548
1549    if (cp == 'PRODUCTS') {
1550        var j = 1;
1551        $('.productbox').each(function() {
1552            // $(this).attr('id', 'pc' + i);
1553            j++;
1554            $(this).attr('data-wow-delay', (j / 10) + 's');
1555            $(this).attr('data-wow-offset', -20000);
1556        })
1557    }
1558
1559}
1560
1561function BLOCKAnimation(nowpage) {
1562    var scrollTrigger = 400 // px
1563    var wh = $(window).height()
1564
1565    if (nowpage == "INDEX") {
1566        Animation_aboutarea_done = false
1567        Animation_newsarea_done = false
1568
1569        Detectblock = function() {
1570            //首頁Aboutarea 進場動畫
1571            Animation_aboutarea = function() {
1572                $(".aboutarea__meatball").addClass("fadeIn")
1573                $(".aboutarea__meatball").addClass("animated")
1574
1575                setTimeout(function() {
1576                    $(".aboutarea__sauce").addClass("fadeIn")
1577                    $(".aboutarea__sauce").addClass("animated")
1578                }, 500)
1579
1580                setTimeout(function() {
1581                    $(".newsarea__seafood").addClass("fadeIn")
1582                    $(".newsarea__seafood").addClass("animated")
1583                }, 800)
1584
1585                setTimeout(function() {
1586                    $(".block-aboutarea .heading-index").addClass("ghostInDown")
1587                }, 1100)
1588
1589                setTimeout(function() {
1590                    $(".aboutarea__content").addClass("ghostInUp")
1591                }, 1300)
1592
1593                setTimeout(function() {
1594                    $(
1595                        ".block-aboutarea .heading-index .heading-index__cloud img"
1596                    ).addClass("ghostInRightUp")
1597                }, 1500)
1598
1599                Animation_aboutarea_done = true
1600            }
1601
1602            //首頁Newsarea 進場動畫
1603            Animation_newsarea = function() {
1604                setTimeout(function() {
1605                    $(".newsarea__title").addClass("fadeInLeft")
1606                    $(".newsarea__title").addClass("animated")
1607                }, 500)
1608
1609                Animation_newsarea_done = true
1610            }
1611            if (Animation_aboutarea_done == true) {} else {
1612                var Distance_aboutarea =
1613                    wh - ($(".aboutarea").offset().top - $(window).scrollTop())
1614                if (Distance_aboutarea <= scrollTrigger) {} else if (Distance_aboutarea > wh) {} else {
1615                    Animation_aboutarea()
1616                }
1617            }
1618
1619            if (Animation_newsarea_done == true) {} else {
1620                var Distance_newsarea =
1621                    wh - ($(".newsarea").offset().top - $(window).scrollTop())
1622                if (Distance_newsarea <= scrollTrigger) {} else if (Distance_newsarea > wh) {} else {
1623                    Animation_newsarea()
1624                }
1625            }
1626        }
1627
1628        Detectblock()
1629        $(window).on("scroll", function() {
1630            Detectblock()
1631        })
1632    }
1633}
1634
1635//目標物$(''), 目標物離window底部距離多少觸發(偵測的是目標物的頂), 目標物離window頂部距離多少觸發(偵測的是目標物的底), 重複執行函式?, 觸發的函式
1636// ScrollReachRun($('.test'), 200, 200, false, function() {
1637//     console.log('func')
1638// })
1639
1640function ScrollReachRun(target, TriggerDistance_bottom, TriggerDistance_top, isRepeat, func) {
1641    if (target.length > 0) {
1642        var flag_done = false
1643        var wh = $(window).height()
1644        $(window).resize(function() {
1645            wh = $(window).height()
1646        })
1647        const SrollDetectblock = function(func, isRepeat) {
1648            var Distance_target = wh - (target.offset().top - $(window).scrollTop())
1649            if (Distance_target <= TriggerDistance_bottom) {} else if (Distance_target - target.height() + TriggerDistance_top > wh) {} else {
1650                func()
1651                if (isRepeat == false) {
1652                    flag_done = true
1653                }
1654            }
1655        }
1656        SrollDetectblock(func, isRepeat)
1657        $(window).on("scroll", function() {
1658            if (flag_done == false) {
1659                SrollDetectblock(func, isRepeat)
1660            }
1661        })
1662    }
1663}
1664
1665function navheadStyleControl() {
1666    $('.navhead').each(function() {
1667        // console.log($(this).data('page'))
1668        if ($(this).data('page') == $currentpage) {
1669            $(this).addClass('navhead--current')
1670        }
1671    })
1672}
1673
1674// 將cookie以陣列形式儲存
1675function parseCookie() {
1676    var cookieObj = {}
1677    var cookieAry = document.cookie.split(";")
1678    var cookie
1679
1680    for (var i = 0, l = cookieAry.length; i < l; ++i) {
1681        cookie = jQuery.trim(cookieAry[i])
1682        cookie = cookie.split("=")

1683        cookieObj[cookie[0]] = cookie[1]
1684    }
1685
1686    return cookieObj
1687}
1688
1689//讀取cookie,引數填變數名稱,會回傳值
1690function getCookieByName(name) {
1691    var value = parseCookie()[name]
1692    if (value) {
1693        value = decodeURIComponent(value)
1694    }
1695
1696    return value
1697}
1698
1699function policyblock() {
1700
1701    var websitename = $('head title').text()
1702
1703    //中文版隱私權政策
1704    $(".block-policy--cht").html(
1705        "<article class='policy_page'> <div class='policy_pageBlank'> <div class='policy_wp'> <div class='policy_content'> <div class='policy_title1'>隱私權政策 Private Policy</div> 非常歡迎您光臨「" + websitename + "」（以下簡稱本網站），為了讓您能夠安心的使用本網站的各項服務與資訊，特此向您說明本網站的隱私權保護政策，以保障您的權益，請您詳閱下列內容： <br><br> <div class='policy_title2'>一、隱私權保護政策的適用範圍</div> 隱私權保護政策內容，包括本網站如何處理在您使用網站服務時收集到的個人識別資料。隱私權保護政策不適用於本網站以外的相關連結網站，也不適用於非本網站所委託或參與管理的人員。 <br> <br> <div class='policy_title2'>二、個人資料的蒐集、處理及利用方式</div> 當您造訪本網站或使用本網站所提供之功能服務時，我們將視該服務功能性質，請您提供必要的個人資料，並在該特定目的範圍內處理及利用您的個人資料；非經您書面同意，本網站不會將個人資料用於其他用途。 <br> 本網站在您使用服務信箱、問卷調查等互動性功能時，會保留您所提供的姓名、電子郵件地址、聯絡方式及使用時間等。 <br> 於一般瀏覽時，伺服器會自行記錄相關行徑，包括您使用連線設備的IP位址、使用時間、使用的瀏覽器、瀏覽及點選資料記錄等，做為我們增進網站服務的參考依據，此記錄為內部應用，決不對外公佈。 <br> 為提供精確的服務，我們會將收集的問卷調查內容進行統計與分析，分析結果之統計數據或說明文字呈現，除供內部研究外，我們會視需要公佈統計數據及說明文字，但不涉及特定個人之資料。 <br> <br> <div class='policy_title2'>三、資料之保護</div> 本網站主機均設有防火牆、防毒系統等相關的各項資訊安全設備及必要的安全防護措施，加以保護網站及您的個人資料採用嚴格的保護措施，只由經過授權的人員才能接觸您的個人資料，相關處理人員皆簽有保密合約，如有違反保密義務者，將會受到相關的法律處分。 <br> 如因業務需要有必要委託其他單位提供服務時，本網站亦會嚴格要求其遵守保密義務，並且採取必要檢查程序以確定其將確實遵守。 <br> <br> <div class='policy_title2'>四、網站對外的相關連結</div> 本網站的網頁提供其他網站的網路連結，您也可經由本網站所提供的連結，點選進入其他網站。但該連結網站不適用本網站的隱私權保護政策，您必須參考該連結網站中的隱私權保護政策。 <br> <br> <div class='policy_title2'>五、與第三人共用個人資料之政策</div> 本網站絕不會提供、交換、出租或出售任何您的個人資料給其他個人、團體、私人企業或公務機關，但有法律依據或合約義務者，不在此限。 <br> <br> 前項但書之情形包括不限於： <br> <br> 經由您書面同意。 <br> 法律明文規定。 <br> 為免除您生命、身體、自由或財產上之危險。 <br> 與公務機關或學術研究機構合作，基於公共利益為統計或學術研究而有必要，且資料經過提供者處理或蒐集者依其揭露方式無從識別特定之當事人。 <br> 當您在網站的行為，違反服務條款或可能損害或妨礙網站與其他使用者權益或導致任何人遭受損害時，經網站管理單位研析揭露您的個人資料是為了辨識、聯絡或採取法律行動所必要者。 <br> 有利於您的權益。 <br> 本網站委託廠商協助蒐集、處理或利用您的個人資料時，將對委外廠商或個人善盡監督管理之責。 <br> <br> <div class='policy_title2'>六、Cookie之使用</div> 為了提供您最佳的服務，本網站會在您的電腦中放置並取用我們的Cookie，若您不願接受Cookie的寫入，您可在您使用的瀏覽器功能項中設定隱私權等級為高，即可拒絕Cookie的寫入，但可能會導致網站某些功能無法正常執行 。<br> <br> <div class='policy_title2'>七、隱私權保護政策之修正</div> 本網站隱私權保護政策將因應需求隨時進行修正，修正後的條款將刊登於網站上。 <br> <div class='policy_page_bottom'> <input type='button' value='關閉' name='Close' class='policy_btn close_WindowBtn'> </div> </div> </div> </div> </article> <article class='policy_LinkBlank'> <div class='policy_LinkWindow'> <div class='policy_wp'> <div class='policy_title3'>隱私權政策聲明</div> <p>為達到最佳的瀏覽體驗，本網站使用cookies，若您繼續瀏覽本網站代表您同意我們的隱私權政策。</p> <div class='flexSB'> <a href='javascript:' class='policy_link window_OpenLink'> Learn more</a> <input type='button' value='好' name='Agree' class='policy_btn agree_btn'> </div> </div> </div> </article>"
1706    )
1707
1708    //英文版隱私權政策
1709    $(".block-policy--en").html(
1710        " <article class='policy_page'> <div class='policy_pageBlank'> <div class='policy_wp'> <div class='policy_content'> <div class='policy_title1'>Privacy Statement</div> <div>This page informs you of our policies regarding the collection, use, and disclosure of personal data when you use our Service and the choices you have associated with that data. </div> <div>We may use your data in improving the user experience. By using the website and the service, you agree the collection and use of information in accordance with this policy. Unless otherwise defined in this Privacy Policy, terms used in this Privacy Policy have the same meanings as in our Terms and Conditions, accessible from </div> <div class='policy_part'> <div class='policy_title2'>Information Collection and Use</div> <div>We collect different types of information for various purposes to provide and improve our Website to you.</div> </div> <div class='policy_part'> <div class='policy_title2'>Types of Data Collected</div> <br/> <h5>(a)Personal Data</h5> <div>When you fill the 'Contact Us' form in our website, you provide us with certain personally identifiable information that can be used to contact or identify you ('Personal Data'). Personal Data be stored only if you choose to submit it to us. </div> <div>Personally identifiable information may include, but is not limited to: </div> <ul> <li>Email address</li> <li>First name and last name</li> <li>Phone number</li> <li>Address, state, province, ZIP/postal code, city and country</li> </ul> <hr> <h5>(b)Usage Data</h5> <div>

1710We may also collect information on how the Website is accessed and used ('Usage Data'). This Usage Data may include information such as your computer's Internet Protocol address (e.g. IP address), browser type, browser version, the pages of our Website that you visit, the time and date of your visit, the time spent on those pages, unique device identifiers and other diagnostic data. </div> <hr> <h5>(c)Tracking Cookies Data</h5> <div>Cookies are small files stored on your desktop, laptop or mobile device by websites visited by you. They enable us to e.g. recognize whether there has been a previous connection between your device and our websites, take into account your preferred language or other settings, offer you certain functionalities or recognize your interests on the basis of previous use. Cookies can also contain personal information.</div> </div> <div class='policy_part'> <div>You can also visit our websites without consenting to the use of cookies by such use. In other words, you can reject the use of cookies and delete them at any time by making the appropriate settings to your device. </div> </div> <div class='policy_part'> <div class='policy_title2'>Examples of Cookies we use:</div> <ul> <li><strong>Session Cookies: </strong>We use Session Cookies to operate our Service.</li> <li><strong>Preference Cookies: </strong>We use Preference Cookies to remember your preferences and various settings.</li> <li><strong>Security Cookies: </strong>We use Security Cookies for security purposes.</li> </ul> </div> <div class='policy_part'> <div class='policy_title2'>Use of Data</div> <div>We uses the collected data for various purposes:</div> <ul> <li>To provide and maintain the Website.</li> <li>To notify you about changes to our Website.</li> <li>To allow you to participate in interactive features of our Website when you choose to do so.</li> <li>To provide customer care and support.</li> <li>To provide analysis or valuable information so that we can improve our Website to you.</li> <li>To monitor the usage of the Website.</li> <li>To detect, prevent and address technical issues.</li> </ul> </div> <div class='policy_part'> <div class='policy_title2'>Transfer of Data</div> <div>Your information, including Personal Data, may be transferred to — and maintained on — computers located outside of your state, province, country or other governmental jurisdiction where the data protection laws may differ than those from your jurisdiction. </div> <div>If you are located outside Taiwan and choose to provide information to us, please note that we transfer the data, including Personal Data, to Taiwan and process it there.</div> <div>Your consent to this Privacy Policy followed by your submission of such information represents your agreement to that transfer. </div> <div>We will take all steps reasonably necessary to ensure that your data is treated securely and in accordance with this Privacy Policy and no transfer of your Personal Data will take place to an organization or a country unless there are adequate controls in place including the security of your data and other personal information.</div> </div> <div class='policy_part'> <div class='policy_title2'>Disclosure of Data</div> <div>We may disclose your Personal Data in the good faith belief that such action is necessary to:</div> <ul> <li>To comply with a legal obligation.</li> <li>To protect and defend the rights or property of We.</li> <li>To prevent or investigate possible wrongdoing in connection with the Website.</li> <li>To protect the personal safety of users of the Website or the public.</li> <li>To protect against legal liability.</li> </ul> </div> <div class='policy_part'> <div class='policy_title2'>Security of Data</div> <div>The security of your data is important to us, but remember that no method of transmission over the Internet, or method of electronic storage is 100% secure. While we strive to use commercially acceptable means to protect your Personal Data, we cannot guarantee its absolute security. </div> </div> <div class='policy_part'> <div class='policy_title2'>Third Party Service Providers</div> <div>We may employ third party companies and individuals to facilitate our Service ('Service Providers'), to provide the Service on our behalf, to perform Service-related services or to assist us in analyzing how our Website is used. </div> <div>These third parties have access to your Personal Data only to perform these tasks on our behalf and are obligated not to disclose or use it for any other purpose. </div> </div> <div class='policy_part'> <div class='policy_title2'>Links to Other Sites</div> <div>Our Service may contain links to other sites, including sites provided by social media service providers, that are not operated by us. If you click on a third party link, you will be directed to that third party's site. We strongly advise you to review the Privacy Policy of every site you visit.</div> <div>We have no control over and assume no responsibility for the content, privacy policies or practices of any third party sites or services.</div> </div> <div class='policy_part'> <div class='policy_title2'>Right to Information, Correction, Deletion and Blocking of Data</div> <div>You have the right to be informed at any time about your personal data, free of charge, if you request that any incorrect information to be corrected, and any personal data should be deleted and blocked. </div> </div> <div class='policy_part'> <div class='policy_title2'>Changes to This Privacy Policy</div> <div>We may update our Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on this page. </div> <div>You are advised to review this Privacy Policy periodically for any changes. Changes to this Privacy Policy are effective when they are posted on this page.</div> </div> <div><strong>Contact Us</strong><br/>If you have any questions about this Privacy Policy, please contact us. </div> <div>This Privacy Policy is updated on <strong>May. 10. 2021</strong>.</div> <div class='policy_page_bottom'> <input type='button' value='Close' name='Close' class='policy_btn close_WindowBtn'> </div> </div> </div> </div> </article> <article class='policy_LinkBlank'> <div class='policy_LinkWindow'> <div class='policy_wp'> <div class='policy_title3'>Privacy Statement</div> <div>We use cookies to improve our website, to make it easier for users to operate and to continuously upgrade. By continuing to use this page, you agree to the use of cookies.</p> <div class='flexSB'> <a href='javascript:' class='policy_link window_OpenLink'>Learn more</a> <input type='button' value='Agree' name='Agree' class='policy_btn agree_btn'></div> </div> </div> </article>"
1711    )
1712
1713    //使用cookie判斷 近期是否有按過同意
1714    if (getCookieByName("privacy") === "true") {} else {
1715        $("#block-policy").show()
1716        $(".policy_btn.agree_btn").click(function() {
1717            document.cookie = "privacy=true; max-age=259200; path=/;"
1718        })
1719    }
1720
1721    //隱私權視窗
1722    $(".agree_btn").click(function() {
1723        $(".policy_LinkBlank").css("display", "none")
1724    })
1725    $(".window_OpenLink").click(function() {
1726        $(".policy_LinkBlank").css("display", "none")
1727        $(".policy_pageBlank").css("display", "block")
1728        $("body").addClass("blackBg")
1729            // $("body").find('.policy_content').niceScroll({ cursorcolor: "#00A4EA", background: "#EFEFEF", cursorborder: "0.5px solid #00A4EA" });
1730    })
1731    $(".close_WindowBtn").click(function() {
1732            $(".policy_pageBlank").css("display", "none")
1733            $("body").removeClass("blackBg")
1734        })
1735        //判斷手機版的方向(直式與橫式)
1736        // window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
1737        //     if (window.orientation === 90 || window.orientation === -90) {
1738        //         $('.policy_content').css('max-height', '200px');

1739        //         $('.policy_pageBlank').css('height', '280px');
1740        //         //目前螢幕為橫向！
1741        //     }
1742        //     if (window.orientation === 180 || window.orientation === 0) {
1743        //         $('.policy_content').css('max-height', '350px');
1744        //         $('.policy_pageBlank').css('height', '430px');
1745        //         //目前螢幕為縱向！
1746        //     }
1747        // }, false);
1748}
1749
1750// function niceScroll_initial() {
1751//     $('html').niceScroll({
1752//         cursorcolor: "#054786",
1753//         scrollspeed: 40, // 滾動時間
1754//         mousescrollstep: 45, // 滾動速度
1755//         cursorwidth: "8px"
1756//     });
1757// }
1758
1759function recaptchaAlert() {
1760    alert("請勾選我不是機器人驗證，謝謝！")
1761}
1762
1763//國家列表下拉選單
1764function SelectCountryLoad() {
1765    var countrylist = `
1766    <option value='AD'>安道爾 Andorra</option>
1767    <option value='AE'>阿拉伯聯合大公國 United Arab Emirates</option>
1768    <option value='AF'>阿富汗 Afghanistan</option>
1769    <option value='AG'>安地卡巴布達 Antigua and Barbuda</option>
1770    <option value='AI'>安圭拉 Anguilla</option>
1771    <option value='AL'>阿爾巴尼亞 Albania</option>
1772    <option value='AM'>亞美尼亞 Armenia</option>
1773    <option value='AN'>荷屬安地列斯 Netherlands Antilles</option>
1774    <option value='AO'>安哥拉 Angola</option>
1775    <option value='AQ'>南極洲 Antarctica</option>
1776    <option value='AR'>阿根廷 Argentina</option>
1777    <option value='AS'>美屬薩摩亞 American Samoa</option>
1778    <option value='AT'>奧地利 Austria</option>
1779    <option value='AU'>澳大利亞 Australia</option>
1780    <option value='AW'>阿魯巴 Aruba</option>
1781    <option value='AX'>奧蘭群島 Åland Islands</option>
1782    <option value='AZ'>亞塞拜然 Azerbaijan</option>
1783    <option value='BA'>波士尼亞赫塞哥維納 Bosnia and Herzegovina</option>
1784    <option value='BB'>巴貝多 Barbados</option>
1785    <option value='BD'>孟加拉 Bangladesh</option>
1786    <option value='BE'>比利時 Belgium</option>
1787    <option value='BF'>布吉納法索 Burkina Faso</option>
1788    <option value='BG'>保加利亞 Bulgaria</option>
1789    <option value='BH'>巴林 Bahrain</option>
1790    <option value='BI'>蒲隆地 Burundi</option>
1791    <option value='BJ'>貝南 Benin</option>
1792    <option value='BM'>百慕達 Bermuda</option>
1793    <option value='BN'>汶萊 Brunei Darussalam</option>
1794    <option value='BO'>玻利維亞 Bolivia</option>
1795    <option value='BR'>巴西 Brazil</option>
1796    <option value='BS'>巴哈馬 Bahamas</option>
1797    <option value='BT'>不丹 Bhutan</option>
1798    <option value='BV'>波維特島 Bouvet Island</option>
1799    <option value='BW'>波札那 Botswana</option>
1800    <option value='BY'>白俄羅斯 Belarus</option>
1801    <option value='BZ'>貝里斯 Belize</option>
1802    <option value='CA'>加拿大 Canada</option>
1803    <option value='CC'>可可斯群島 Cocos (Keeling) Islands</option>
1804    <option value='CD'>剛果民主共和國 The Democratic Republic of The Congo</option>
1805    <option value='CF'>中非共和國 Central African Republic</option>
1806    <option value='CG'>剛果 Congo</option>
1807    <option value='CH'>瑞士 Switzerland</option>
1808    <option value='CI'>象牙海岸 Côte D'Ivoire</option>
1809    <option value='CK'>庫克群島 Cook Islands</option>
1810    <option value='CL'>智利 Chile</option>
1811    <option value='CM'>喀麥隆 Cameroon</option>
1812    <option value='CN'>中國 China</option>
1813    <option value='CO'>哥倫比亞 Colombia</option>
1814    <option value='CR'>哥斯大黎加 Costa Rica</option>
1815    <option value='CU'>古巴 Cuba</option>
1816    <option value='CV'>維德角 Cape Verde</option>
1817    <option value='CX'>聖誕島 Christmas Island</option>
1818    <option value='CY'>賽普勒斯 Cyprus</option>
1819    <option value='CZ'>捷克 Czech Republic</option>
1820    <option value='DE'>德國 Germany</option>
1821    <option value='DJ'>吉布地 Djibouti</option>
1822    <option value='DK'>丹麥 Denmark</option>
1823    <option value='DM'>多米尼克 Dominica</option>
1824    <option value='DO'>多明尼加 Dominican Republic</option>
1825    <option value='DZ'>阿爾及利亞 Algeria</option>
1826    <option value='EC'>厄瓜多 Ecuador</option>
1827    <option value='EE'>愛沙尼亞 Estonia</option>
1828    <option value='EG'>埃及 Egypt</option>
1829    <option value='EH'>西撒哈拉 Western Sahara</option>
1830    <option value='ER'>厄利垂亞 Eritrea</option>
1831    <option value='ES'>西班牙 Spain</option>
1832    <option value='ET'>衣索比亞 Ethiopia</option>
1833    <option value='FI'>芬蘭 Finland</option>
1834    <option value='FJ'>斐濟 Fiji</option>
1835    <option value='FK'>福克蘭群島 Falkland Islands (Malvinas)</option>
1836    <option value='FM'>密克羅尼西亞聯邦 Federated States of Micronesia</option>
1837    <option value='FO'>法羅群島 Faroe Islands</option>
1838    <option value='FR'>法國 France</option>
1839    <option value='GA'>加彭 Gabon</option>
1840    <option value='GB'>英國 United Kingdom</option>
1841    <option value='GD'>格瑞那達 Grenada</option>
1842    <option value='GE'>喬治亞 Georgia</option>
1843    <option value='GF'>法屬圭亞那 French Guiana</option>
1844    <option value='GG'>根息 Guernsey</option>
1845    <option value='GH'>迦納 Ghana</option>
1846    <option value='GI'>直布羅陀 Gibraltar</option>
1847    <option value='GL'>格陵蘭 Greenland</option>
1848    <option value='GM'>甘比亞 Gambia</option>
1849    <option value='GN'>幾內亞 Guinea</option>
1850    <option value='GP'>哥德洛普 Guadeloupe</option>
1851    <option value='GQ'>赤道幾內亞 Equatorial Guinea</option>
1852    <option value='GR'>希臘 Greece</option>
1853    <option value='GS'>南喬治亞南桑威奇群島 South Georgia and The South Sandwich Islands</option>
1854    <option value='GT'>瓜地馬拉 Guatemala</option>
1855    <option value='GU'>關島 Guam</option>
1856    <option value='GW'>幾內亞比索 Guinea-Bissau</option>
1857    <option value='GY'>蓋亞那 Guyana</option>
1858    <option value='HK'>香港 Hong Kong</option>
1859    <option value='HM'>赫德麥當勞群島 Heard Island and Mcdonald Islands</option>
1860    <option value='HN'>宏都拉斯 Honduras</option>
1861    <option value='HR'>克羅埃西亞 Croatia</option>
1862    <option value='HT'>海地 Haiti</option>
1863    <option value='HU'>匈牙利 Hungary</option>
1864    <option value='ID'>印尼 Indonesia</option>
1865    <option value='IE'>愛爾蘭 Ireland</option>
1866    <option value='IL'>以色列 Israel</option>
1867    <option value='IM'>曼島 Isle of Man</option>
1868    <option value='IN'>印度 India</option>
1869    <option value='IO'>英屬印度洋地區 British Indian Ocean Territory</option>
1870    <option value='IQ'>伊拉克 Iraq</option>
1871    <option value='IR'>

1871伊朗 Islamic Republic of Iran</option>
1872    <option value='IS'>冰島 Iceland</option>
1873    <option value='IT'>義大利 Italy</option>
1874    <option value='JE'>澤西 Jersey</option>
1875    <option value='JM'>牙買加 Jamaica</option>
1876    <option value='JO'>約旦 Jordan</option>
1877    <option value='JP'>日本 Japan</option>
1878    <option value='KE'>肯亞 Kenya</option>
1879    <option value='KG'>吉爾吉斯 Kyrgyzstan</option>
1880    <option value='KH'>柬埔寨 Cambodia</option>
1881    <option value='KI'>吉里巴斯 Kiribati</option>
1882    <option value='KM'>葛摩 Comoros</option>
1883    <option value='KN'>聖克里斯多福 Saint Kitts and Nevis</option>
1884    <option value='KP'>北韓 Democratic People's Republic of Korea</option>
1885    <option value='KR'>南韓 Republic of Korea</option>
1886    <option value='KW'>科威特 Kuwait</option>
1887    <option value='KY'>開曼群島 Cayman Islands</option>
1888    <option value='KZ'>哈薩克 Kazakhstan</option>
1889    <option value='LA'>寮國 Lao People's Democratic Republic</option>
1890    <option value='LB'>黎巴嫩 Lebanon</option>
1891    <option value='LC'>聖露西亞 Saint Lucia</option>
1892    <option value='LI'>列支敦斯登 Liechtenstein</option>
1893    <option value='LK'>斯里蘭卡 Sri Lanka</option>
1894    <option value='LR'>賴比瑞亞 Liberia</option>
1895    <option value='LS'>賴索托 Lesotho</option>
1896    <option value='LT'>立陶宛 Lithuania</option>
1897    <option value='LU'>盧森堡 Luxembourg</option>
1898    <option value='LV'>拉脫維亞 Latvia</option>
1899    <option value='LY'>利比亞 Libyan Arab Jamahiriya</option>
1900    <option value='MA'>摩洛哥 Morocco</option>
1901    <option value='MC'>摩納哥 Monaco</option>
1902    <option value='MD'>摩爾多瓦 Republic of Moldova</option>
1903    <option value='ME'>蒙特內哥羅 Montenegro</option>
1904    <option value='MG'>馬達加斯加 Madagascar</option>
1905    <option value='MH'>馬紹爾群島 Marshall Islands</option>
1906    <option value='MK'>馬其頓 Republic of Macedonia</option>
1907    <option value='ML'>馬利 Mali</option>
1908    <option value='MM'>緬甸 Myanmar</option>
1909    <option value='MN'>蒙古 Mongolia</option>
1910    <option value='MO'>澳門 Macao</option>
1911    <option value='MP'>北馬里亞納群島 Northern Mariana Islands</option>
1912    <option value='MQ'>馬丁尼克 Martinique</option>
1913    <option value='MR'>茅利塔尼亞 Mauritania</option>
1914    <option value='MS'>蒙特色拉 Montserrat</option>
1915    <option value='MT'>馬爾他 Malta</option>
1916    <option value='MU'>模里西斯 Mauritius</option>
1917    <option value='MV'>馬爾地夫 Maldives</option>
1918    <option value='MW'>馬拉威 Malawi</option>
1919    <option value='MX'>墨西哥 Mexico</option>
1920    <option value='MY'>馬來西亞 Malaysia</option>
1921    <option value='MZ'>莫三比克 Mozambique</option>
1922    <option value='NA'>納米比亞 Namibia</option>
1923    <option value='NC'>新喀里多尼亞 New Caledonia</option>
1924    <option value='NE'>尼日 Niger</option>
1925    <option value='NF'>諾福克島 Norfolk Island</option>
1926    <option value='NG'>奈及利亞 Nigeria</option>
1927    <option value='NI'>尼加拉瓜 Nicaragua</option>
1928    <option value='NL'>荷蘭 Netherlands</option>
1929    <option value='NO'>挪威 Norway</option>
1930    <option value='NP'>尼泊爾 Nepal</option>
1931    <option value='NR'>諾魯 Nauru</option>
1932    <option value='NU'>紐埃 Niue</option>
1933    <option value='NZ'>紐西蘭 New Zealand</option>
1934    <option value='OM'>阿曼 Oman</option>
1935    <option value='PA'>巴拿馬 Panama</option>
1936    <option value='PE'>秘魯 Peru</option>
1937    <option value='PF'>法屬波里尼西亞 French Polynesia</option>
1938    <option value='PG'>巴布亞紐幾內亞 Papua New Guinea</option>
1939    <option value='PH'>菲律賓 Philippines</option>
1940    <option value='PK'>巴基斯坦 Pakistan</option>
1941    <option value='PL'>波蘭 Poland</option>
1942    <option value='PM'>聖皮耶密克隆 Saint Pierre and Miquelon</option>
1943    <option value='PN'>皮特康 Pitcairn</option>
1944    <option value='PR'>波多黎各 Puerto Rico</option>
1945    <option value='PS'>巴勒斯坦 Palestinian Territory, Occupied</option>
1946    <option value='PT'>葡萄牙 Portugal</option>
1947    <option value='PW'>帛琉 Palau</option>
1948    <option value='PY'>巴拉圭 Paraguay</option>
1949    <option value='QA'>卡達 Qatar</option>
1950    <option value='RE'>留尼旺 Réunion</option>
1951    <option value='RO'>羅馬尼亞 Romania</option>
1952    <option value='RS'>塞爾維亞 Serbia</option>
1953    <option value='RU'>俄羅斯 Russian Federation</option>
1954    <option value='RW'>盧安達 Rwanda</option>
1955    <option value='SA'>沙烏地阿拉伯 Saudi Arabia</option>
1956    <option value='SB'>索羅門群島 Solomon Islands</option>
1957    <option value='SC'>塞席爾 Seychelles</option>
1958    <option value='SD'>蘇丹 Sudan</option>
1959    <option value='SE'>瑞典 Sweden</option>
1960    <option value='SG'>新加坡 Singapore</option>
1961    <option value='SH'>聖赫勒拿 Saint Helena</option>
1962    <option value='SI'>斯洛維尼亞 Slovenia</option>
1963    <option value='SJ'>斯瓦爾巴尖棉 Svalbard and Jan Mayen</option>
1964    <option value='SK'>斯洛伐克 Slovakia</option>
1965    <option value='SL'>獅子山 Sierra Leone</option>
1966    <option value='SM'>聖馬利諾 San Marino</option>
1967    <option value='SN'>塞內加爾 Senegal</option>
1968    <option value='SO'>索馬利亞 Somalia</option>
1969    <option value='SR'>蘇利南 Suriname</option>
1970    <option value='ST'>聖多美普林西比 Sao Tome and Principe</option>
1971    <option value='SV'>薩爾瓦多 El Salvador</option>
1972    <option value='SY'>敘利亞 Syrian Arab Republic</option>
1973    <option value='SZ'>史瓦濟蘭 Swaziland</option>
1974    <option value='TC'>托克斯寇克斯群島 Turks and Caicos Islands</option>
1975    <option value='TD'>查德 Chad</option>
1976    <option value='TF'>法屬南部屬地 French Southern Territories</option>
1977    <option value='TG'>多哥 Togo</option>
1978    <option value='TH'>泰國 Thailand</option>
1979    <option value='TJ'>塔吉克 Tajikistan</option>
1980    <option value='TK'>托克勞 Tokelau</option>
1981    <option value='TL'>東帝汶 Timor-Leste</option>
1982    <option value='TM'>土庫曼 Turkmenistan</option>
1983    <option value='TN'>突尼西亞 Tunisia</option>
1984    <option value='TO'>東加 Tonga</option>
1985    <option value='TR'>土耳其 Turkey</option>
1986    <option value='TT'>千里達托貝哥 Trinidad and Tobago</option>
1987    <option value='TV'>吐瓦魯 Tuvalu</option>
1988    <option value='TW'>台灣 Taiwan (ROC)</option>
1989    <option value='TZ'>坦尚尼亞 Tanzania</option>
1990    <option value='UA'>烏克蘭 Ukraine</option>
1991    <option value='UG'>烏干達 Uganda</option>
1992    <option value='UM'>美屬邊疆群島 United States Minor Outlying Islands</option>
1993    <option value='US'>美國 United States</option>
1994    <option value='UY'>烏拉圭 Uruguay</option>
1995    <option value='UZ'>烏茲別克 Uzbekistan</option>
1996    <option value='VA'>教廷(梵蒂岡) Holy See (Vatican City State)</option>
1997    <option value='VC'>聖文森 Saint Vincent and The Grenadines</option>
1998    <option value='VE'>委內瑞拉 Venezuela</option>
1999    <option value='VG'>英屬維爾京群島 Virgin Islands, British</option>
2000    <option value='VI'>美屬維京群島 Virgin Islands, U.S.</option>
2001    <option value='VN'>越南 Viet Nam</option>
2002    <option value='VU'>萬那杜 Vanuatu</option>
2003    <option value='WF'>華里斯福他納 Wallis and Futuna</option>
2004    <option value='WS'>薩摩亞 Samoa</option>
2005    <option value='YE'>葉門 Yemen</option>
2006    <option value='YT'>美亞特 Mayotte</option>
2007    <option value='ZA'>南非 South Africa</option>
2008    <option value='ZM'>尚比亞 Zambia</option>
2009    <option value='ZW'>辛巴威 Zimbabwe</option>
2010    `
2011    $("#js-globalcountry").append(countrylist)
2012}
2013
2014function safariHacks() {
2015
2016    DefineVh = function() {
2017        let windowsVH = window.innerHeight / 100;
2018        // console.log(windowsVH)
2019        document.querySelector('body').style.setProperty('--vh', windowsVH + 'px');
2020    }
2021    $(document).ready(function() {
2022        DefineVh()
2023            // window.addEventListener('resize', function() {
2024            //     DefineVh()
2025            // });
2026    })
2027
2028}
2029
2030function copyrightYear() {
2031    var today = new Date()
2032    var year = today.getFullYear()
2033    $('#copyrightYear').text(year)
2034}
2035
2036if ($currentpage != "GUIDELINE") {
2037    // 點擊a連擊滾動頁面
2038    // $("a").on('click', function(event) {
2039    //     /* Make sure this.hash has a value before overriding default behavior */
2040    //     if (this.hash !== "" && this.hash !== "#!") {
2041    //         /* Prevent default anchor click behavior */
2042    //         event.preventDefault();
2043    //         /* Store hash */
2044    //         var hash = this.hash;
2045    //         /* Using jQuery's animate() method to add smooth page scroll*/
2046    //         /* The optional number (800) specifies the number of milliseconds it takes to 

2046scroll to the specified area*/
2047    //         $('html, body').animate({
2048    //             scrollTop: $(hash).offset().top
2049    //         }, 800, function() {
2050    //             /* Add hash (#) to URL when done scrolling (default click behavior)*/
2051    //             window.location.hash = hash;
2052    //         });
2053    //     } /* End if */
2054    // });
2055}
2056
2057function Tenpercentile_productbox() {
2058    //productbox 價格欄位
2059    $('.productbox').each(function() {
2060        var $old = $(this).find('.productbox__oldprice span')
2061        var $new = $(this).find('.productbox__newprice span')
2062
2063        var formatPriceText = function(txt) {
2064            if (txt == null) return ''
2065            var str = String(txt).trim()
2066                // 區間價格：同時格式化左右兩端
2067            if (str.indexOf('~') !== -1) {
2068                var parts = str.split('~')
2069                var left = parts[0] != null ? parts[0].trim() : ''
2070                var right = parts[1] != null ? parts[1].trim() : ''
2071                var leftNum = parseInt(left.replace(/[^0-9\.-]/g, ''))
2072                var rightNum = parseInt(right.replace(/[^0-9\.-]/g, ''))
2073                if (!isNaN(leftNum) && !isNaN(rightNum)) {
2074                    return AppendComma(leftNum) + ' ~ ' + AppendComma(rightNum)
2075                }
2076                // 若無法解析為數字，原樣回傳
2077                return str
2078            }
2079
2080            // 單價：提取數字後做千分位；解析失敗則原樣
2081            var num = parseInt(str.replace(/[^0-9\.-]/g, ''))
2082            if (!isNaN(num)) {
2083                return AppendComma(num)
2084            }
2085            return str
2086        }
2087
2088        $old.text(formatPriceText($old.text()))
2089        $new.text(formatPriceText($new.text()))
2090    })
2091}
2092
2093function Tenpercentile() {
2094    $('.js-Tenpercentile').each(function() {
2095        $(this).text(AppendComma(parseInt($(this).text())))
2096    })
2097}
2098
2099//數字處理為有千分位
2100function AppendComma(n) {
2101    // https://kevintsengtw.blogspot.com/2011/10/jquery.html
2102    if (n < 0) {
2103        n = '0';
2104    }
2105    if (!/^((-*\d+)|(0))$/.test(n)) {
2106        var newValue = /^((-*\d+)|(0))$/.exec(n);
2107        if (newValue != null) {
2108            if (parseInt(newValue, 10)) {
2109                n = newValue;
2110            } else {
2111                n = '0';
2112            }
2113        } else {
2114            n = '0';
2115        }
2116    }
2117    if (parseInt(n, 10) == 0) {
2118        n = '0';
2119    } else {
2120        n = parseInt(n, 10).toString();
2121    }
2122
2123    n += '';
2124    var arr = n.split('.');
2125    var re = /(\d{1,3})(?=(\d{3})+$)/g;
2126    // console.log(arr[0].replace(re, '$1,') + (arr.length == 2 ? '.' + arr[1] : ''))
2127    return arr[0].replace(re, '$1,') + (arr.length == 2 ? '.' + arr[1] : '');
2128}
2129
2130function specboxControl() {
2131    //init
2132    $('.specbox').removeClass('specbox--choose')
2133        // $('.specbox').eq(0).addClass('specbox--choose')
2134
2135    $('.specbox').click(function() {
2136        $(this).siblings('.specbox').removeClass('specbox--choose')
2137        $(this).addClass('specbox--choose')
2138    })
2139}
2140
2141function discountboxTimeCounting() {
2142
2143    $('.js-timecounter').each(function() {
2144        var that = $(this)
2145        var nowtime = Math.floor(Date.now() / 1000)
2146        var deadtime = that.find('span').text()
2147        var lasttime = deadtime - nowtime
2148        var seconds = 0
2149        var mins = 0
2150        var hours = 0
2151        var days = 0
2152
2153        var define_Time = function() {
2154            seconds = parseInt(lasttime % 60)
2155            mins = parseInt(lasttime / 60 % 60)
2156            hours = parseInt(lasttime / 60 / 60 % 24)
2157            days = parseInt(lasttime / 60 / 60 / 24)
2158        }
2159        define_Time()
2160
2161        //打印剩餘時間
2162        var printTime = function() {
2163            if (days == 0) {
2164                that.find('span').text(hours + '小時 ' + mins + '分 ' + seconds + '秒')
2165            } else {
2166                that.find('span').text(days + '天 ' + hours + '小時 ' + mins + '分 ' + seconds + '秒')
2167            }
2168        }
2169
2170        //秒數倒數
2171        var timeCounting = setInterval(() => {
2172            lasttime--
2173            define_Time()
2174            printTime()
2175            if (lasttime <= 0) {
2176                clearInterval(timeCounting)
2177                that.text('優惠已結束')
2178            }
2179        }, 1000)
2180    })
2181}
2182
2183function openSmallwindow(pageNum) {
2184    $('.smallwindow').addClass('js-smallwindow--open')
2185    $('.screenmask2').addClass('screenmask2--active')
2186
2187    if (pageNum != undefined) {
2188        $('.smallwindow .smallwindow__inner').hide()
2189        $('.smallwindow .smallwindow__inner[data-smallwindowPage="' + pageNum + '"]').show()
2190    }
2191
2192}
2193
2194function closesmallwindow() {
2195    $('.smallwindow').removeClass('js-smallwindow--open')
2196    $('.screenmask2').removeClass('screenmask2--active')
2197    setTimeout(() => {
2198        $('.smallwindow .smallwindow__inner').hide()
2199        $('.smallwindow .smallwindow__inner').eq(0).show()
2200    }, 400)
2201}
2202
2203function smallwindowControl() {
2204    $('.screenmask2').click(function() {
2205        $(this).removeClass('screenmask2--active')
2206        $('.smallwindow').removeClass('js-smallwindow--open')
2207    })
2208}
2209
2210function openChoosewindow() {
2211    $('.choosewindow').addClass('js-choosewindow--open')
2212    $('.screenmask2').addClass('screenmask2--active')
2213}
2214
2215function closeChoosewindow() {
2216    $('.choosewindow').removeClass('js-choosewindow--open')
2217    $('.screenmask2').removeClass('screenmask2--active')
2218}
2219
2220function choosewindowControl() {
2221    $('.choosewindow__btn-add').click(function() {
2222        $(this).parents('.choosewindow').removeClass('js-choosewindow--open')
2223        $('.screenmask2').removeClass('screenmask2--active')
2224    })
2225    $('.screenmask2').click(function() {
2226        $(this).removeClass('screenmask2--active')
2227        $('.choosewindow').removeClass('js-choosewindow--open')
2228    })
2229}
2230
2231function openTipwindow() {
2232    $('.tipwindow').addClass('js-tipwindow--open')
2233    $('.screenmask2').addClass('screenmask2--active')
2234}
2235
2236function tipwindowControl() {
2237    $('.tipwindow__btn').click(function() {
2238        $(this).parents('.tipwindow').removeClass('js-tipwindow--open')
2239        $('.screenmask2').removeClass('screenmask2--active')
2240    })
2241    $('.screenmask2').click(function() {
2242        $(this).removeClass('screenmask2--active')
2243        $('.tipwindow').removeClass('js-tipwindow--open')
2244    })
2245}
2246
2247function blockReadyaddControl() {
2248
2249    $('.block-readyadd__toggle').click(function() {
2250        $(this).toggleClass('block-readyadd__toggle--reverse')
2251        $(this).siblings('.block-readyadd__list').slideToggle()
2252    })
2253
2254}
2255
2256//Sitenav shrink when scrolldown
2257function NavbarStyle() {
2258    $header = $(".main-menu")
2259    $headerBlankSpace = $(".header__blank-space")
2260    isJunbotronExist = $('.swiper-jumbotron').length > 0
2261
2262    // console.log(isJunbotronExist)
2263    // 沒有輪播時，main-menu使用有底色的樣式
2264    if (!isJunbotronExist) {
2265        if (wdth < mediawdth_desktop) {
2266            $header.addClass("main-menu--mobile-style")
2267            $headerBlankSpace.addClass("header__blank-space--style")
2268        } else {
2269            $header.addClass("main-menu--style")
2270            $headerBlankSpace.addClass("header__blank-space--style")
2271        }
2272    }
2273
2274    $(window).on("resize", function() {
2275        if (wdth < mediawdth_desktop) {
2276            if (isJunbotronExist) {
2277                $header.removeClass("main-menu--style")
2278                $headerBlankSpace.removeClass("header__blank-space--style")
2279            }
2280        } else {
2281            if (isJunbotronExist) {
2282                $header.removeClass("main-menu--mobile-style")
2283                $headerBlankSpace.removeClass("header__blank-space--style")
2284            }
2285        }
2286    })
2287
2288    $(window).on("scroll", function() {
2289        var scrollDistance = $(window).scrollTop()
2290            // 手機版navbar點開時,即使捲動 main-menu也不會縮小
2291        if ($(".navitem-group").hasClass("js-navitem-group--open")) {} else {
2292            if (wdth < mediawdth_desktop) {
2293                if (scrollDistance > 500) {
2294                    $header.addClass("main-menu--mobile-style")
2295                    $headerBlankSpace.addClass("header__blank-space--style")
2296                } else {
2297                    if (isJunbotronExist) {
2298                        $header.removeClass("main-menu--mobile-style")
2299                        $headerBlankSpace.removeClass("header__blank-space--style")
2300                    }
2301                }
2302            } else {
2303                if (scrollDistance > 500) {
2304                    $header.addClass("main-menu--style")
2305                    $headerBlankSpace.addClass("header__blank-space--style")
2306                } else {
2307                    if (isJunbotronExist) {
2308                        $header.removeClass("main-menu--style")
2309                        $headerBlankSpace.removeClass("header__blank-space--style")
2310                    }
2311                }
2312            }
2313        }
2314    })
2315}
2316
2317function removeEmptyParagraphs() {
2318    $('p').each(function() {
2319        var $p = $(this);
2320        if ($p.html().trim() === '<br>') {
2321            $p.remove();
2322        }
2323    });
2324}
2325
2326function editorStyleAdjust() {
2327    $('.editor').find('table').each(function() {
2328        $(this).wrap('<div class="u-overxauto"></div>');
2329    });
2330}
2331
2332function mMenuToggle() {
2333    $('.m-menuHead__toggle').click(function() {
2334        $(this).closest('.m-menuHead__title').siblings('.m-menuHead__list').slideToggle()
2335    })
2336}