1(function ($) { 2 "use strict"; 3 4 var slideWrapper = $(".slider-gr-container"), 5 iframes = slideWrapper.find('.embed-player'); 6 7 // Initialize 8 slideWrapper.on("init", function(slick){ 9 slick = $(slick.currentTarget); 10 setTimeout(function(){ 11 playPauseVideo(slick,"play"); 12 }, 1000); 13 resizePlayer(iframes, 16/9); 14 }); 15 16 slideWrapper.on("beforeChange", function(event, slick) { 17 slick = $(slick.$slider); 18 playPauseVideo(slick,"pause"); 19 }); 20 21 slideWrapper.on("afterChange", function(event, slick) { 22 slick = $(slick.$slider); 23 playPauseVideo(slick,"play"); 24 }); 25 26 // Check if we have at least one video in the slider and if so make sure the non-video slides have the appropriate resposnive height sizing to keep the carousel neat and tidy! 27 if ($('.slider-gr-slide.video').length !== 0 || $('.slider-gr-slide.youtube').length !== 0 || $('.slider-gr-slide.youtube-sound').length !== 0) { 28 $('.slider-gr-slide:not(.video):not(.youtube):not(.youtube-sound) .slide-image').addClass('mixed-content'); 29 $('.slider-gr-slide:not(.video):not(.youtube):not(.youtube-sound) .slide-content').addClass('mixed-content'); 30 } 31 32 // POST commands to YouTube or Vimeo API 33 function postMessageToPlayer(player, command){ 34 if (player == null || command == null) return; 35 player.contentWindow.postMessage(JSON.stringify(command), "*"); 36 } 37 38 // When the slide is changing 39 function playPauseVideo(slick, control){ 40 var currentSlide, slideType, startTime, player, video; 41 42 currentSlide = slick.find(".slick-current"); 43 slideType = (currentSlide.length > 0 ? currentSlide.attr("class").split(" ")[1] : ''); 44 player = (currentSlide.length > 0 ? currentSlide.find("iframe").get(0) : null); 45 startTime = (currentSlide.length > 0 ? currentSlide.data("video-start") : 0); 46 47 if (slideType === "vimeo") { 48 switch (control) { 49 case "play": 50 if ((startTime != null && startTime > 0 ) && !currentSlide.hasClass('started')) { 51 currentSlide.addClass('started'); 52 postMessageToPlayer(player, { 53 "method": "setCurrentTime", 54 "value" : startTime 55 }); 56 } 57 postMessageToPlayer(player, { 58 "method": "play", 59 "value" : 1 60 }); 61 break; 62 case "pause": 63 postMessageToPlayer(player, { 64 "method": "pause", 65 "value": 1 66 }); 67 break; 68 } 69 } else if (slideType === "youtube-sound") { 70 switch (control) { 71 case "play": 72 postMessageToPlayer(player, { 73 "event": "command", 74 //"func": "mute" 75 }); 76 postMessageToPlayer(player, { 77 "event": "command", 78 "func": "playVideo" 79 }); 80 break; 81 case "pause": 82 postMessageToPlayer(player, { 83 "event": "command", 84 "func": "pauseVideo" 85 }); 86 break; 87 } 88 } else if (slideType === "youtube") { 89 switch (control) { 90 case "play": 91 postMessageToPlayer(player, { 92 "event": "command", 93 "func": "mute" 94 }); 95 postMessageToPlayer(player, { 96 "event": "command", 97 "func": "playVideo" 98 }); 99 break; 100 case "pause": 101 postMessageToPlayer(player, { 102 "event": "command", 103 "func": "pauseVideo" 104 }); 105 break; 106 } 107 } else if (slideType === "video") { 108 video = currentSlide.find('video').get(0); 109 110 // Load the video source based on the inital screen width 111 if ($(window).width() < 800){ 112 var getVideoSrc = currentSlide.find('video').data('videoMobileSrc'); 113 } else { 114 var getVideoSrc = currentSlide.find('video').data('videoSrc'); 115 } 116 117 if (video != null) { 118 video.src = getVideoSrc 119 currentSlide.find('video source').attr('src', '' + getVideoSrc + ''); 120 video.load(); 121 if (control === "play"){ 122 video.play(); 123 } else { 124 video.pause(); 125 } 126 } 127 } 128 } 129 130 // Resize player 131 function resizePlayer(iframes, ratio) { 132 if (!iframes[0]) return; 133 134 var win = $(".slider-gr-container"), 135 width = win.width(), 136 playerWidth, 137 height = win.height(),
138 playerHeight, 139 ratio = ratio || 16/9; 140 141 iframes.each(function(){ 142 var current = $(this); 143 if (width / ratio < height) { 144 playerWidth = Math.ceil(height * ratio); 145 current.width(playerWidth).height(height).css({ 146 left: (width - playerWidth) / 2, 147 top: 0 148 }); 149 } else { 150 playerHeight = Math.ceil(width / ratio); 151 current.width(width).height(playerHeight).css({ 152 left: 0, 153 top: (height - playerHeight) / 2 154 }); 155 } 156 }); 157 } 158 159 // Resize event 160 $(window).on("resize.slickVideoPlayer", function(){ 161 resizePlayer(iframes, 16/9); 162 }); 163 164})(jQuery);// JavaScript Document
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.