https://www.toyotavanderheyden.be/js/app.js?impv=8d3567e542a2145e5fca5b45ae882afe

1var app = {};
2
3app.$root = $('html, body');
4
5app.windowSize = function () {
6    var e = window,
7            a = 'inner';
8    if (!('innerWidth' in window)) {
9        a = 'client';
10        e = document.documentElement || document.body;
11    }
12    return {
13        width: e[a + 'Width'],
14        height: e[a + 'Height']
15    };
16}
17
18;
19(function () {
20    if ($(["data-website"]).length) {
21        $("body").addClass("site-" + $("#page-body-container").attr("data-website"));
22    }
23
24    if ($("[data-website='crosscamp']").length) {
25        $("body").addClass("dark-mode");
26    }
27})();
28
29var _upload = function () {
30    var upstart = Date.now();
31    var buttonLabel = $("#file_upload").data("button-label");
32    $('#file_upload').uploadifive({
33        'auto': true, // Automatically upload a file when it's added to the queue
34        'buttonClass': "btn", // A class to add to the UploadiFive button
35        'buttonText': buttonLabel, // The text that appears on the UploadiFive button
36        'checkScript': false/*'check-exists.php'*/, // Path to the script that checks for existing file names
37        'dnd': false, // Allow drag and drop into the queue
38        'dropTarget': false, // Selector for the drop target
39        'fileObjName': 'Filedata', // The name of the file object to use in your server-side script
40        'fileSizeLimit': 0, // Maximum allowed size of files to upload
41        'fileType': "image", // Type of files allowed (image, etc), separate with a pipe character |
42        'formData': {
43            'timestamp': upstart,
44            'token': upstart
45        }, // Additional data to send to the upload script
46        'height': 30, // The height of the button
47        'itemTemplate': false, // The HTML markup for the item in the queue
48        'method': 'post', // The method to use when submitting the upload
49        'multi': true, // Set to true to allow multiple file selections
50        'overrideEvents': [], // An array of events to override
51        'queueID': false, // The ID of the file queue
52        'queueSizeLimit': 10, // The maximum number of files that can be in the queue
53        'removeCompleted': false, // Set to true to remove files that have completed uploading
54        'simUploadLimit': 10, // The maximum number of files to upload at once
55        'truncateLength': 0, // The length to truncate the file names to
56        'uploadLimit': 10, // The maximum number of files you can upload
57        'uploadScript': '/uploadifive.php', // The path to the upload script
58        'onUploadComplete': function (file, data) {
59            if (data == "data") {
60                ribbon("Fichier invalide");
61            } else {
62                $(".form-with-upload").prepend('<input type="hidden" data-file="' + file.name + '" class="queuedfiles" name="file' + ($(".queuedfiles").length + 1) + '" value="' + data + '" />');
63            }
64
65        },
66        'onCancel': function (file) {
67            $("[data-file='" + file.name + "']").remove();
68
69        }
70    });
71
72    $(document).on("submit", "[name=apply-form]", function (e) {
73        e.preventDefault();
74        var f = $(this);
75        $.ajax({

76            url: "/ajaxCalls.php",
77            type: "post",
78            data: f.serialize(),
79            dataType: "json",
80            success: function (response)
81            {
82                ribbon(response.message);
83                if (response.code == 1) {
84                    f[0].reset();
85                    $("#uploadifive-file_upload-queue").html("");
86                }
87            }
88        });
89
90    });
91}
92
93
94// scroll to top button
95var _scrollTopBtn = function () {
96    var scrollTopBtnFlag = true;
97    var $scrollTopBtn = $('.scroll-top-btn');
98
99    $scrollTopBtn.click(function () {
100        app.$root.animate({
101            scrollTop: 0
102        }, 1000);
103        return false;
104    });
105
106    $(window).scroll(function () {
107        // reveal scroll top button
108        if ($(this).scrollTop() > 500) {
109            if (scrollTopBtnFlag) {
110                $scrollTopBtn.addClass('reveal-btn');
111                scrollTopBtnFlag = false;
112            }
113        } else {
114            if (!scrollTopBtnFlag) {
115                $scrollTopBtn.removeClass('reveal-btn');
116                scrollTopBtnFlag = true;
117            }
118        }
119
120        if ($(window).scrollTop() + $(window).height() == $(document).height()) {
121            $scrollTopBtn.removeClass('reveal-btn');
122            scrollTopBtnFlag = true;
123        }
124    });
125}
126
127// navbar
128var _navbar = function () {
129    var $toggler = $('.navbar-toggler');
130    var $navbar = $('.navbar');
131    var $body = $('body');
132    var $backdrop = $('<div class="menu-backdrop"></div>');
133
134    $toggler.click(function () {
135        $navbar.toggleClass('expand');
136        $body.toggleClass('menu-offcanvas-active');
137
138        if ($('.menu-backdrop').length) {
139            $('.menu-backdrop').remove();
140        } else {
141            $body.append($backdrop);
142        }
143    })
144
145    $(document).on('click', '.menu-backdrop', function () {
146        $navbar.removeClass('expand');
147        $body.removeClass('menu-offcanvas-active');
148        $('.menu-backdrop').remove();
149    })
150}
151
152// sliders
153var _sliders = function () {
154
155    $(".model-overview-slider:not(.slick-initialized)").slick({
156        dots: true,
157        arrows: false,
158        autoplay: true,
159        autoplaySpeed: 5000,
160    })
161
162
163    if ($(".wide-slider-slide-sizer").length) {
164        const resizeObserver = new ResizeObserver((entries) => {
165            for (let entry of entries) {
166                let width = entry.contentRect.width;
167    
168                $(".wide-slider .wide-slider-item").css("width", width);
169                $(".wide-slider").slick("setPosition");
170            }
171        });
172
173        resizeObserver.observe($(".wide-slider-slide-sizer")[0]);
174    }
175
176
177    if ($(".wide-slider").length) {
178        $(".wide-slider:not(.slick-initialized)").slick({
179            dots: false,
180            infinite: false,
181            variableWidth: true,
182            touchMove: true, 
183            swipeToSlide: true,
184            draggable: true, 
185            appendArrows: $(".wide-slider-arrows"),
186        })
187    }
188
189    if ($(".generic-img-slider").length) {
190        $(".generic-img-slider:not(.slick-initialized)").each(function(index, el) {
191            let speed = index & 2 !== 0 ? 3300 : 3000;
192            
193            $(el).slick({
194                dots: true,
195                arrows: false,
196            }).slickLightbox({
197                src: "src",
198                itemSelector: ".card-img img",
199                closeOnBackdropClick: true,
200                slick: {
201                    infinite: false,
202                }
203            });
204        });
205    }
206
207    if ($('.team-slider').length) {
208        $('.team-slider:not(.slick-initialized)').slick({
209            dots: false,
210            variableWidth: true,
211            infinite: false
212        })
213    }
214
215    if ($(".text-slider").length) {
216        $(".text-slider:not(.slick-initialized)").slick({
217            dots: true,
218            arrows: false,
219            adaptiveHeight: true,
220        })
221    }
222
223    if ($("#product-preview-slider").length && $("#product-preview-slider:not(.slick-initialized)").length) {
224        $('#product-preview-slider').slick({
225            dots: false,

226            arrows: false,
227            infinite: false,
228        })
229
230        $('#product-preview-slider').slickLightbox({
231            src: 'src',
232            itemSelector: '.product-slide img',
233            closeOnBackdropClick: false,
234            slick: {
235                infinite: false,
236                afterChange: function () {
237
238                }
239            }
240        }).on({
241            'show.slickLightbox': function () {
242                $(".slick-lightbox").prepend("<div class='slick-lightbox-pager'></div>");
243
244                $(".slick-lightbox-pager").text(($(".slick-current.slick-active").index() + 1) + " de " + $(".slick-lightbox-slick-item").length);
245
246                $(".slick-lightbox-slick").on("afterChange", function (event, slick, currentSlide) {
247                    $(".slick-lightbox-pager").text((currentSlide + 1) + " de " + $(".slick-lightbox-slick-item").length);
248                })
249            },
250        });
251
252        $('#preview-nav-slider').slick({
253            variableWidth: true,
254            infinite: false,
255            arrows: true,
256            rows: 0,
257            outerEdgeLimit: true
258        })
259
260        $('#product-preview-slider').on('afterChange', function (event, slick, currentSlide) {
261            var slide = $('#product-preview-slider .slick-current').data('slick-index');
262            $('#preview-nav-slider .slick-slide.item-active').removeClass('item-active');
263            $('#preview-nav-slider .slick-slide[data-slick-index="' + slide + '"]').addClass('item-active');
264        })
265
266        $('#preview-nav-slider').on('click', '.slick-slide', function (e) {
267            var itemSelected = $(this).data('slick-index');
268            $('#product-preview-slider').slick('slickGoTo', itemSelected);
269        })
270
271        $("#preview-nav-slider").on("afterChange", function (event, slick) {
272            var itemsWidth = $("#preview-nav-slider .slick-slide").outerWidth(true) * $("#preview-nav-slider .slick-slide").length;
273            var moved = Math.abs(getMatrix($("#preview-nav-slider .slick-track")[0]).x);
274
275            if (($("#preview-nav-slider").width() + moved) > itemsWidth) {
276                $("#preview-nav-slider .slick-next").addClass("slick-disabled");
277            } else {
278                $("#preview-nav-slider .slick-next").removeClass("slick-disabled");
279            }
280        })
281
282        setTimeout(function () {
283            $("#product-preview-slider").slick("setPosition");
284            $("#preview-nav-slider").slick("setPosition");
285        }, 500);
286    }
287
288    function getMatrix(element) {
289        const values = element.style.transform.split(/\w+\(|\);?/);
290        const transform = values[1].split(/,\s?/g).map(parseInt);
291
292        return {
293            x: transform[0],
294            y: transform[1],
295            z: transform[2]
296        };
297    }
298}
299
300// adjustMargins
301var _adjustGarageSection = function () {
302    if (app.windowSize().width > 991) {
303        $('#garages-map a .branch').each(function (i) {
304            console.log($(this)[0].getBBox());
305            var x = $(this)[0].getBBox().x - 80;
306
307
308            var y = $(this)[0].getBBox().y - 140;
309
310
311            $(this).closest('a').find('foreignObject').attr('x', x).attr('y', y);
312        })
313    }
314}
315
316// toggle elements per page requirements
317var _toggleElements = function () {
318    if ($('.is-homepage').length) {
319        $('body').addClass('homepage');
320    } else {
321        $('body').removeClass('homepage');
322    }
323
324    if ($(".theme-eurekar").length) {
325        $(".theme-eurekar").removeClass("theme-eurekar");
326        $("body").addClass("theme-eurekar");
327    } else {
328        $("body").removeClass("theme-eurekar");
329    }
330    
331
332    if ($(".eurekar-car-details-section").length) {
333        $("body").addClass("eurekar-car-details-page");
334    } else {
335        $("body").removeClass("eurekar-car-details-page");
336    }
337
338    if ($("body .page-layout-2").length) {
339        $("body").addClass("page-layout-2");
340    } else {
341        $("body").removeClass("page-layout-2");
342    }
343}
344
345// page transition
346var _pageTransition = (function () {
347    if (app.windowSize().width > 991) {
348        var cachedDirection;
349        var cachedScrolledTop;
350
351
352
353        $(document).on('click', '.vdh-link', function (e) {
354            e.preventDefault();
355            var $this = $(this);
356            var title = $(this).text();
357            var url = $(this).attr('href');

358            var $navbar = $('.navbar');
359            var $body = $('body');
360            var direction = $(this).data('direction') ? $(this).data('direction') : 'right';
361            var navigation = $(this).data("navigation") ? $(this).data("navigation") : "forward";
362            var referent = $(this).data("referent") ? $(this).data("referent") : "";
363
364            $('body').append('<div class="transition-overlay"></div>');
365
366            $body.removeClass('menu-offcanvas-active');
367            $('.menu-backdrop').remove();
368            $navbar.removeClass('expand');
369
370            cachedScrolledTop = navigation == "back" ? cachedScrolledTop : $(".content-overflow-scroll").scrollTop();
371
372            loadPage({
373                url: url,
374                direction: direction,
375                navigation: navigation,
376                referent: referent,
377                title: title
378            });
379
380        })
381
382        $(window).on('popstate', function (e) {
383            var state = e.originalEvent.state;
384            var direction = "";
385
386            if (state !== null) {
387                switch (cachedDirection) {
388                    case "right":
389                        direction = "left";
390                        break;
391                    case "bottom":
392                        direction = "top";
393                        break;
394                    default:
395                        direction = "left";
396                        break;
397                }
398
399                loadPage({
400                    url: state.url,
401                    direction: direction,
402                    navigation: "back"
403                });
404            } else {
405                window.location.href = window.location.href;
406            }
407        });
408    }
409
410    function loadPage( {url, direction, navigation, referent, title}) {
411        $(".vertical-text-label").fadeOut(150, function () {
412            $(".vertical-text-label").html("")
413        });
414        $.ajax({

415            url: url,
416            success: function (html) {
417                html = $(html);
418
419                var transitionClass;
420                $(".navbar-brand .brand img").attr("src", html.find(".navbar-brand .brand img").attr("src"));
421                switch (direction) {
422                    case "top":
423                        $('#page-body-container').prepend(html.find('.page-body').addClass('top-page'));
424                        transitionClass = "scrolling-to-top";
425
426                        break;
427                    case "bottom":
428                        $('#page-body-container').append(html.find('.page-body').addClass('bottom-page'));
429                        transitionClass = "scrolling-to-bottom";
430
431                        break;
432                    case "left":
433                        $('#page-body-container').prepend(html.find('.page-body').addClass('prev-page'));
434                        transitionClass = "scrolling-to-left";
435
436                        break;
437                    case "right":
438                        $('#page-body-container').append(html.find('.page-body').addClass('next-page'));
439                        transitionClass = "scrolling-to-right";
440
441                        break;
442                    default:
443                        break;
444                }
445                $(".vertical-text-label").fadeIn(150);
446                if (referent != "" && $("[data-navigation='back']").length) {
447                    $("[data-navigation='back']").attr("href", referent);
448                }
449
450                $("body").addClass("page-in-transition");
451
452                setTimeout(function () {
453                    $(document).trigger('beforePageChange');
454                    $('#page-body-container').addClass(transitionClass);
455
456                    if (navigation == "back") {
457                        $(".content-overflow-scroll").scrollTop(cachedScrolledTop);
458                    }
459                }, 100);
460
461                setTimeout(function () {
462                    $('.page-body').removeClass('next-page prev-page bottom-page top-page');
463                    $('#page-body-container').removeClass(transitionClass);
464
465                    if (direction == "right" || direction == "bottom") {
466                        $('.page-body:first-child').remove();
467                    } else {
468                        $('.page-body:last-child').remove();
469                    }
470
471                    $(document).trigger('pageChange');
472                    $('.transition-overlay').remove();
473
474                    if (typeof _map === 'function') {
475                        _map();
476                    }
477
478                    $("#funding [name=credit_type]").trigger("change");
479
480                    $("body").removeClass("page-in-transition");
481
482                }, 1100);
483
484                $('.navbar-nav .vdh-link.active').removeClass('active');
485                $('.navbar-nav .vdh-link[href="' + url + '"]').addClass('active');
486
487                cachedDirection = direction;
488
489                window.history.pushState({page: title, direction: direction, url: url}, title, url);
490            }
491        }).fail(function () {
492            console.log("page not found");
493            $('.transition-overlay').remove();
494        })
495    }
496
497    return {
498        loadPage: loadPage
499    }
500})();
501
502// banner video
503var _responsiveVideo = function () {
504    if ($(".responsive-video-canvas").length) {
505        var timeoutId;
506        var $responsiveVideoAspect = $(".responsive-video-aspect");
507        var $responsiveVideoWidth = $(".responsive-video-width");
508        var videoAspect = $responsiveVideoAspect.outerHeight() / $responsiveVideoAspect.outerWidth();
509
510        function responsiveVideoAdopt() {
511            windowAspect = ($('.banner-section').height() / $('.banner-section').width());
512            if (windowAspect > videoAspect) {
513                $responsiveVideoWidth.width((windowAspect / videoAspect) * 100 + '%');
514            } else {
515                $responsiveVideoWidth.width(100 + "%");
516            }
517        }
518
519        if (app.windowSize().width > 991) {
520            $(window).resize(function () {
521                clearTimeout(timeoutId);
522                timeoutId = setTimeout(responsiveVideoAdopt, 100);
523            });
524        }
525        
526        $(window).on("orientationchange", function () {
527            clearTimeout(timeoutId);
528            timeoutId = setTimeout(responsiveVideoAdopt, 100);
529        });
530        $(window).scroll(function () {
531            responsiveVideoAdopt();
532        })
533        responsiveVideoAdopt();
534    }
535}
536
537var _youtubeBanner = function () {
538    if ($('#youtube-video-canvas').length) {
539        app.videoId = $('#youtube-video-canvas').data('video');
540
541        if (window["YT"]) {
542            setTimeout(function () {
543                createPlayer();
544            }, 100);
545        } else {
546            var tag = document.createElement("script");
547            tag.id = "youtubeApiScript";
548            tag.src = "https://www.youtube.com/iframe_api";
549            var firstScriptTag = document.getElementsByTagName("script")[0];
550            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
551
552            window.onYouTubeIframeAPIReady = function () {
553                createPlayer();
554            };
555        }
556
557        function createPlayer() {
558            _responsiveVideo();
559
560            app.youtubePlayerObj = new YT.Player("youtube-video-canvas", {
561                playerVars: {
562                    autoplay: 1,
563                    controls: 0,
564                    rel: 0,
565                    fs: 0,
566                    mute: 1,
567                },
568                videoId: app.videoId,
569                events: {
570                    onReady: onPlayerReady,
571                    onStateChange: onPlayerStateChange,
572                },
573            });
574        }
575
576        function onPlayerReady(event) {
577            event.target.stopVideo();
578            event.target.setPlaybackQuality("hd1080");
579            event.target.playVideo();
580            event.target.mute();
581        }
582
583        function onPlayerStateChange(event) {
584            if (event.data === YT.PlayerState.ENDED) {
585                event.target.playVideo();
586            }
587            if (event.data == YT.PlayerState.PLAYING) {
588                event.target.setPlaybackQuality("hd1080");
589                $("#youtube-video-canvas").css("opacity", "1");
590                console.log("video quality = " + event.target.getPlaybackQuality());
591            }
592        }
593    }
594}
595
596$(document).on('beforePageChange', function () {
597    _adjustGarageSection();
598    
599    
600
601    // special case for the unique layout for car details page.
602    if ($(".eurekar-car-details-page").length) {
603        $(".eurekar-car-details-page").removeClass("eurekar-car-details-page");
604    }
605})
606
607// catalog filter
608var _catalogFilter = function() {
609    // Attach event listener for changes on filters using delegation
610    document.addEventListener('change', function(event) {
611        if (event.target.classList.contains('category-filter-input')) {
612            filterItems();

613        }
614    });
615
616    // Attach event listener for "display all cars" button using delegation
617    document.addEventListener('click', function(event) {
618        if (event.target.closest("#display-all-cars")) {
619            displayAllCars();
620        }
621    });
622
623    function filterItems() {
624        document.getElementById("display-all-cars").classList.remove("active");
625
626        // Get all selected filters
627        const filters = document.querySelectorAll('.category-filter-input');
628        const selectedFilters = Array.from(filters)
629            .filter(filter => filter.checked)
630            .map(filter => filter.value);
631
632        // Get all catalog items
633        const catalogItems = document.querySelectorAll('.model-item');
634        catalogItems.forEach(item => {
635            const categories = JSON.parse(item.getAttribute('data-category'));
636            const matches = selectedFilters.some(filter => categories.includes(filter));
637
638            if (selectedFilters.length === 0 || matches) {
639                item.parentElement.style.display = '';
640            } else {
641                item.parentElement.style.display = 'none';
642            }
643        });
644    }
645
646    function displayAllCars() {
647        // Clear all category filters
648        const filters = document.querySelectorAll('.category-filter-input');
649        filters.forEach(checkbox => {
650            checkbox.checked = false;
651            checkbox.parentNode.classList.remove('active');
652        });
653
654        // Render all cars
655        filterItems();
656
657        document.getElementById("display-all-cars").classList.add("active");
658    }
659};
660
661$(document).on('pageChange', function () {
662    _sliders();
663    _toggleElements();
664    _youtubeBanner();
665    _catalogFilter();
666    _upload();
667
668    // custom alert
669    $(document).on("click", ".custom-alert-toggle", function(e) {
670        $(".custom-alert-container").toggleClass("active");
671    })
672
673    
674    // match height
675    $(".card-v2 .card-details").matchHeight();
676    $(".mh-1").matchHeight();
677    $(".mh-2").matchHeight();
678
679    function hasVerticalScroll(element) {
680        var r=false;
681        if(element!==undefined){
682            r=element.scrollHeight > element.clientHeight;
683        }
684        return r;
685    }
686
687    if (hasVerticalScroll($(".overflow-scroll")[0]) && $(".site-toyotavdh").length) {
688        $(".navbar").addClass("navbar-bg");
689    }
690
691    if ($("#crosscamp-configurator-app").length) {
692        _crossCampConfigurator.init();
693    } else {
694        if (app.crosscampConfiguratorApp !== undefined) {
695            _crossCampConfigurator.destroy();
696        }
697    }
698
699    if ($("[data-website='crosscamp']").length) {
700        var forceMapSizeFlag = false;
701        if ($("#booking-form").length) {
702            _bookingForm.init();
703        } else {
704            _bookingForm.destroy();
705        }
706
707        $(window).on("resize orientationchange", function () {
708            forceMapSize();
709        })
710
711        forceMapSize();
712
713        function forceMapSize() {
714            if ($(".svg-map-canvas").length) {
715                if ($(".svg-map-canvas img").outerHeight(true) >

715 app.windowSize().height) {
716                    if (!forceMapSizeFlag) {
717                        $(".svg-map-canvas").addClass("h-100");
718                        forceMapSizeFlag = true;
719                    }
720                } else if ($(".svg-map-canvas img").outerHeight(true) < $(".svg-map-canvas").outerHeight(true) - 50) {
721                    if (forceMapSizeFlag) {
722                        $(".svg-map-canvas").removeClass("h-100");
723                        forceMapSizeFlag = false;
724                    }
725                }
726            }
727        }
728        ;
729    }
730
731
732    if ($(".col-inner-content > .bottom-links").length) {
733        $(".content-left-col > .col-inner").append($(".col-inner-content > .bottom-links"));
734    }
735
736    $(".col-inner").addClass("show");
737    $(".page-body-inner-v2").addClass("show");
738
739    if ($('form[data-recaptcha]').length) {
740        impRecaptcha();
741    }
742})
743
744var i18n = {
745    midnight: 'Midnight',
746    noon: 'Noon',
747    previousMonth: 'Previous Month',
748    nextMonth: 'Next Month',
749    months: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'],
750    weekdays: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'],
751    weekdaysShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam']
752}
753
754
755
756
757$(document).ready(function () {
758    _navbar();
759    _scrollTopBtn();
760    _sliders();
761    _adjustGarageSection();
762
763    $(document).trigger('pageChange');
764
765    //impadd
766    $(document).on("change", "[name=object]", function (e) {
767        $("[name=message]:not(.edited)").html($(this).find("option:selected").data("message"));
768    });
769
770    $(document).on("keypress", "[name=message]", function (e) {
771        $(this).addClass("edited");
772    });
773
774    $(document).on('click', ".banner-caption", function (e) {
775        if (e.target !== this)
776            return;
777        $(this).find("a").trigger("click");
778    })
779
780    // video dialog
781    var videoModalSrc;
782
783    $(document).on("click", ".video-dialog-toggle-container .play-button", function () {
784        let videoEl = $(this).closest(".video-dialog-toggle-container").find("iframe")[0].outerHTML;
785        let captionEl = $(this).closest(".video-dialog-toggle-container").find(".video-caption")[0]?.outerHTML;
786        captionEl = captionEl ? captionEl : "";
787
788        let modalHTML = `
789            <div class="modal-head"><button type="button" class="bootbox-close-button close" aria-hidden="true">×</button></div>
790            <div class="modal-video-container">${videoEl}</div> ${captionEl}`;
791
792        bootbox.dialog({
793            className: "video-dialog-modal",
794            size: "xl",
795            message: modalHTML,
796            centerVertical: true,
797            close: false,
798            backdrop: true
799        })
800    })
801
802    $(document).on("shown.bs.modal", ".video-dialog-modal", function (e) {
803        videoModalSrc = $(".video-dialog-modal iframe").attr("src");
804        videoModalSrc = videoModalSrc.replace("controls=0", "controls=1");
805
806        let autoplaySrc = videoModalSrc + "&mute=1&autoplay=1";
807        $(".video-dialog-modal iframe").attr("src", autoplaySrc);
808        $(".video-dialog-modal iframe").attr("allow", "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share");
809        $(".video-dialog-modal iframe").attr("refferpolicy", "strict-origin-when-cross-origin");
810
811        console.log("shown modal");
812    })
813
814    $(document).on("hide.bs.modal", ".video-dialog-modal", function (e) {
815        $(".video-modal-modal iframe").attr("src", videoModalSrc);
816        console.log("hide modal");
817    })
818
819    $(document).on('click', ".videos-filters a", function (e) {
820        e.preventDefault(); // Empêche le comportement par défaut du lien
821        $(".videos-filters a").removeClass("active");
822        $(this).addClass("active");
823        var filterValue = $(this).data('filter');
824
825        // Si le filtre est "all", on montre tous les éléments
826        if (filterValue === 'all') {
827            $('.videos-list [data-filter]').show();
828        } else {
829            // Masquer tous les éléments
830            $('.videos-list [data-filter]').hide();
831
832            // Montrer uniquement ceux qui ont le filtre correspondant
833            $('.videos-list [data-filter]').filter(function () {
834                var filters = $(this).data('filter').split(' ');
835                return filters.includes(filterValue);
836            }).show();
837        }
838    });

839    
840    try {
841        if (boxmodal) {
842            setTimeout(function () {
843                $(".custom-alert-container").addClass("active")
844            }, $(".custom-alert-container").data("delay"));
845        }
846    } catch (error) {
847        console.log(error.message);
848    }
849
850
851});
852
853
854function ribbon(msg) {
855    $(".ribbonMsg").remove();
856    var tag = $("<div class='ribbonMsg'><div style='padding: 20px;'>" + msg + "</div></div>");
857    tag.css({
858        "max-height": $(window).height() + "px"
859    });
860    var close = $("<span class='fa fa-times'></span>");
861    close.css({
862        position: "absolute",
863        top: "5px",
864        right: "25px"
865    });
866    tag.append(close);
867    $("body").append(tag);
868    var th = tag.height(),
869            wh = $(window).height();
870    tag.animate({top: (wh / 2) - (th / 2)}, 400);
871    close.on("click", function () {
872        tag.animate({top: "-800px"}, 400, function () {
873            $(this).remove();
874        })
875    });
876}
877;