https://visitkinosaki.com/vkcore/wp-content/themes/visit-kinosaki-2023/js/nu-script.js

1/**
2 * Parallax effect
3 */
4// window.addEventListener('load', function () {
5//     if (typeof simpleParallax !== "undefined") {
6//         var parallaxBoxes = document.querySelectorAll('.parallax');
7//         new simpleParallax(parallaxBoxes);
8//         window.dispatchEvent(new Event('resize'));
9//     }
10// });
11
12
13/**
14 * Youtube Video
15 */
16try {
17    var tag = document.createElement('script');
18    tag.src = "https://www.youtube.com/iframe_api";
19    var firstScriptTag = document.getElementsByTagName('script')[0];
20    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
21    var player;
22
23    function onYouTubeIframeAPIReady() {
24        player = new YT.Player('movie-player', {
25            width: '100%',
26            videoId: 'RXzztG4L4ys',
27            events: {
28                'onReady': onPlayerReady,
29                'onStateChange': onPlayerStateChange
30            },
31            playerVars: {
32                controls: 0,
33                showinfo: 0,
34                disablekb: 1,
35                rel: 0,
36                modestbranding: 1,
37            }
38        });
39    }
40
41    function onPlayerReady(event) {
42        event.target.playVideo();
43        event.target.mute();
44    }
45
46    function onPlayerStateChange(event) {
47        if (event.data == YT.PlayerState.ENDED) {
48            event.target.seekTo(0, true);
49            event.target.playVideo();
50        }
51    }
52} catch (error) {
53    console.error(error);
54}
55
56
57
58jQuery(window).on('load', function () {
59    /**
60     * Hero Slider
61     */
62    try {
63        $(".nu-hero__slider noscript").remove(); //HACK Stop noscript tags from interferring with slick calculations
64        $('.nu-hero__slider').slick({
65            dots: true,
66            infinite: true,
67            speed: 500,
68            fade: true,
69            arrows: false,
70            autoplay: true,
71            autoplaySpeed: 4000,
72            speed: 2000,
73        });
74
75        // Pause slider before bg fade-out then play when transition done
76        /*
77        console.log('Pausing slider');
78        $('.nu-hero__slider').slick('slickPause');
79        document.getElementById('js-loading-bg').addEventListener('transitionend', function(event) {
80            if (event.propertyName === 'opacity') {
81                console.log('Playing slider');
82                $('.nu-hero__slider').slick('slickPlay');
83            }
84        });
85        */
86    } catch (error) {
87        console.error(error);
88    }
89
90
91    /**
92     * Fade Slider
93     */
94    try {
95        var fadeSliders = $('.fade-slider');
96        fadeSliders.each(function (index, fadeSlider) {
97            $(fadeSlider).find('.fade-slider__slider').slick({
98                dots: false,
99                arrows: false,
100                slidesToShow: 1,
101                slidesToScroll: 1,
102                mobileFirst: true,
103                infinite: true,
104                loop: true,
105                responsive: [
106                    {
107                        breakpoint: 1100,
108                        settings: {
109                            centerMode: true,
110                        }
111                    },
112                    {
113                        breakpoint: 1400,
114                        settings: {
115                            centerMode: false,
116                        }
117                    },
118
119                ]
120            });
121
122            $(fadeSlider).find('.fade-slider__arrow--prev').on("click", function () {
123                $(fadeSlider).find('.fade-slider__slider').slick('slickPrev');
124            });
125            $(fadeSlider).find('.fade-slider__arrow--next').on("click", function () {
126                $(fadeSlider).find('.fade-slider__slider').slick('slickNext');
127            });
128
129            $(fadeSlider).on('beforeChange', function (event, slick, currentSlide, nextSlide) {
130                $(fadeSlider).find('.fade-slider__txt.js-active').removeClass('js-active');
131                $(fadeSlider).find('.fade-slider__txt[data-index="' + nextSlide + '"]').addClass('js-active');
132            });
133        });
134    } catch (error) {
135        console.error(error);
136    }
137
138    /**
139     * Panel Slider
140     */
141    try {
142        $('.panel-slider__slider').slick({
143            dots: false,
144            arrows: true,
145            infinite: true,
146            slidesToShow: 1,
147            slidesToScroll: 1,
148            fade: true,
149        });
150    } catch (error) {
151        console.error(error);
152    }
153
154
155    /**
156     * Focus Slider
157     */
158    try {
159        $('.nu-focus-slider').slick({
160            dots: false,
161            arrows: true,
162            infinite: true,
163            slidesToShow: 1,
164            slidesToScroll: 1,
165            centerMode: true,
166
167            mobileFirst: true,
168            responsive: [{
169                breakpoint: 750,
170                settings: {
171                    slidesToShow: 3,
172                }
173            },]
174        });
175    } catch (error) {
176        console.error(error);
177    }
178
179    /**
180     * Grid Slider
181     */
182    try {
183        $('.grid-slider').slick({
184            dots: false,
185            arrows: true,
186            infinite: true,
187            slidesToShow: 1,
188            slidesToScroll: 1,
189        });
190    } catch (error) {
191        console.error(error);
192    }
193});