https://www.pays-bergerac-tourisme.com/themes/theme_bergerac_site/js/slider-accueil.js?tlphqh

1/*global jQuery, window, navigator, videojs */
2/*eslint no-undef: "error"*/
3(function ($) {
4  var start = Date.now(),
5    slider = $('.slider-accueil'),
6    videoActive = (navigator.test.mobile() === null)
7
8  slider.royalSlider({
9    keyboardNavEnabled: true,
10    imageScaleMode: 'fill',
11    autoScaleSlider: true,
12    controlNavigation: 'bullets',
13    arrowsNav: false,
14    navigateByClick: false,
15    loop: true, //fonctionne à partir de 3 images
16    slidesSpacing: 0,
17    transitionSpeed: 1000,
18    autoPlay: {
19      // autoplay options go gere
20      enabled: true,
21      pauseOnHover: true,
22      delay: 5000
23    },
24    block: {
25      moveEffect: "bottom",	// direction of move effect, can be 'left', 'right', 'top', 'bottom' or 'none'
26      moveOffset: "100",// distance of move effect in pixels
27      speed: "300"// transition speed of block, in ms
28    },
29    video: {
30      autoHideBlocks: true,
31      autoHideArrows: true,
32      youTubeCode: '<div class="video-container">' +
33      '<iframe src="https://www.youtube.com/embed/%id%?autoplay=1&controls=0&disablekb=1&fs=0&rel=0&showinfo=0&iv_load_policy=3" frameborder="no"></iframe>' +
34      '</div>'
35    }
36  })
37
38  var royalslider = slider.data('royalSlider')
39
40  royalslider.slides[ 0 ].holder.on('rsAfterContentSet', function (e) {
41    resize()
42    slider.css('visibility', 'visible')
43    if ((e.timeStamp - start) < 5000 && videoActive) royalslider.playVideo()
44    else if (!videoActive) {
45      $('.rsVideoContainer .rsBtnCenterer').remove()
46    }
47    //else slider
48  });
49
50  royalslider.ev.on('rsOnCreateVideoElement', function (e, url) {
51    // url - path to video from data-rsVideo attribute
52    // royalslider.videoObj - jQuery object that holds video HTML code
53    // royalslider.videoObj must be IFRAME, VIDEO or EMBED element, or have class rsVideoObj
54    if ((typeof royalslider.videoObj[ 0 ] == 'undefined')) {
55      var id = 'video_' + (new Date().getTime() + Math.floor((Math.random() * 10000) + 1)).toString(16)
56      var video = '<video id="' + id + '" class="vjs-laetis video-js vjs-default-skin" style="opacity: 0">' +
57        '<source src="' + url + '.webm" type="video/webm">' +
58        '<source src="' + url + '.mp4" type="video/mp4">' +
59        '<p class="vjs-no-js">' +
60        'To view this video please enable JavaScript, and consider upgrading to a web browser that' +
61        '<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>' +
62        '</p>' +
63        '</video>'
64      royalslider.videoObj = $(video)
65
66      slider.on('DOMNodeInserted', function (obj) {
67        $(obj.target).find('video').on("loadstart", function () {
68          $(this).css('opacity', 1)
69          var config = {
70            autoplay: true,
71            loop: true,
72            fluid: true,
73            muted: true,
74            width: $('.rsVideoFrameHolder ').width()
75          }
76          videojs(this, config, function () {
77            this.on('click', function (e) {
78              if (e.target.paused) e.target.play()
79              else e.target.pause()
80            })
81          })
82        })
83      });
84    }
85  });
86
87  function resize () {
88    var resize = true,
89      slider_height = $(window).height() - ($('#main-header').offset().top + $('#main-header').height())
90
91    if (slider.height() < slider_height) {
92      resize = false
93      slider_height = slider.height()
94    }
95
96    if (resize) {
97      slider.css('height', slider_height)
98      slider.find('.rsOverflow').css('height', slider_height)
99    }
100  }
101
102  $(window).on('resize', function () {
103    //time out important
104    setTimeout(function () {
105      resize()
106    }, 200)
107  })
108})(jQuery)