1/** 2 * NodeList.forEach polyfill for IE 3 * 4 * @see https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach 5 */ 6if (window.NodeList && !NodeList.prototype.forEach) { 7 NodeList.prototype.forEach = Array.prototype.forEach; 8} 9 10/** 11 * Custom Event polyfill for >= IE9 12 * 13 * @see https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#Polyfill 14 */ 15(function () { 16 if (typeof window.CustomEvent === "function") return false; 17 18 function CustomEvent(event, params) { 19 params = params || { bubbles: false, cancelable: false, detail: null }; 20 var evt = document.createEvent("CustomEvent"); 21 evt.initCustomEvent( 22 event, 23 params.bubbles, 24 params.cancelable, 25 params.detail 26 ); 27 return evt; 28 } 29 30 window.CustomEvent = CustomEvent; 31})(); 32 33(function ($) { 34 var config = { 35 // General animation speed. 36 speed: 250, 37 // Loading video needs a request to server. Waiting for it a bit can make the transition looks smoother. 38 videoWaitingTime: 400, 39 arrow: { 40 // Arrow's width. 41 size: 40, 42 // Arrow's gap to the video. 43 gap: 10, 44 }, 45 }; 46 47 var state = { 48 activeGallery: null, 49 activePopup: null, 50 }; 51 52 var popups = []; 53 var galleries = {}; 54 55 function init() { 56 popups = document.querySelectorAll(".wp-video-popup-wrapper"); 57 if (!popups.length) return; 58 59 setupOpenActions(); 60 setupCloseActions(); 61 62 window.addEventListener("resize", function () { 63 adjustPopupVideosHeight(state.activePopup); 64 adjustGalleryVideosHeight(state.activeGallery); 65 }); 66 } 67 68 function setupOpenActions() { 69 // Setup autoplay. 70 window.addEventListener("load", function () { 71 // Only allow 1 autoplay instance. 72 var autoplayAssigned = false; 73 74 popups.forEach(function (popup) { 75 if (!popup.dataset.wpVideoPopupAutoplay) return; 76 if (autoplayAssigned) return; 77 78 if (popup.dataset.wpVideoPopupGallery) { 79 setupGallery(popup, true); 80 } else { 81 openPopup(popup, true); 82 } 83 84 autoplayAssigned = true; 85 }); 86 }); 87 88 // Setup open triggers. 89 var specificSelectors = []; 90 91 popups.forEach(function (popup) { 92 var id = popup.dataset.wpVideoPopupId; 93 94 if (id) { 95 var firstCharIsNumber = id.charAt(0).match(/^\d+$/); 96 var selector = ""; 97 98 if (firstCharIsNumber) { 99 selector = '[class~="' + id + '"]'; 100 } else { 101 selector = "." + id; 102 } 103 104 specificSelectors.push(selector); 105 setupOpenTriggers(selector, popup); 106 } 107 }); 108 109 // Setup triggers for the default class (targeting the first popup if multiple exist). 110 // Exclude triggers that were already handled by a specific popup ID to avoid 111 // opening multiple popups at the same time when a trigger has both the generic 112 // class and a specific popup ID class. 113 setupOpenTriggers(".wp-video-popup", null, specificSelectors); 114 setupOpenTriggers(".ryv-popup", null, specificSelectors); 115 } 116 117 function setupOpenTriggers(triggerSelector, popup, excludeSelectors) { 118 var triggers = document.querySelectorAll(triggerSelector); 119 if (!triggers.length) return; 120 121 triggers.forEach(function (trigger) { 122 // Skip triggers that already have a specific popup ID handler assigned, 123 // so they don't also receive the generic fallback handler (which would 124 // open a second popup at the same time). 125 if (excludeSelectors && excludeSelectors.length) { 126 var isExcluded = excludeSelectors.some(function (sel) { 127 return trigger.matches(sel); 128 }); 129 if (isExcluded) return; 130 } 131 132 trigger.addEventListener("click", function (e) { 133 e.preventDefault(); 134 135 var targetPopup = popup || popups[0]; 136 137 if (targetPopup) { 138 if (targetPopup.dataset.wpVideoPopupGallery) { 139 openGallery(targetPopup); 140 } else { 141 openPopup(targetPopup); 142 } 143 } 144 }); 145 }); 146 } 147 148 function setupCloseActions() { 149 popups.forEach(function (popup) { 150 // Close on click. 151 popup.addEventListener("click", function (e) { 152 if ( 153 e.target == this || 154 e.target.classList.contains("wp-video-popup-close") 155 ) { 156 if (!popup.dataset.wpVideoPopupGallery) closePopup(this); 157 } 158 }); 159 }); 160 161 // Close on escape. 162 document.addEventListener("keyup", function (e) { 163 if (e.key !== "Escape" && e.key !== "Esc" && e.keyCode !== 27) return; 164 165 popups.forEach(function (popup) { 166 if ($(popup).is(":visible")) { 167 if (popup.dataset.wpVideoPopupGallery) { 168 closeGallery(popup.dataset.wpVideoPopupGallery); 169 } else { 170 closePopup(popup); 171 } 172 } 173 }); 174 }); 175 } 176 177 function adjustPopupVideosHeight(popup) { 178 if (!popup) return; 179 180 var videos = document.querySelectorAll( 181 ".wp-video-popup-wrapper .wp-video-popup-video" 182 ); 183 var activeVideo = popup.querySelector(".wp-video-popup-video"); 184 185 if (!videos || !activeVideo) return; 186 187 var height = activeVideo.clientWidth * 0.5625; 188 189 videos.forEach(function (video) { 190 if (video.classList.contains("is-resizable")) 191 video.style.height = height + "px"; 192 }); 193 } 194 195 function adjustGalleryVideosHeight(gallery) { 196 if (!gallery) return; 197 198 var videos = gallery.querySelectorAll(".wp-video-popup-video"); 199 var activeVideo = gallery.querySelector( 200 ".active-slide .wp-video-popup-video" 201 ); 202 203 if (!videos || !activeVideo) return; 204 205 var leftPos = 206 activeVideo.getBoundingClientRect().left + document.body.scrollLeft; 207 var width = activeVideo.clientWidth; 208 var height = activeVideo.clientWidth * 0.5625; 209 210 videos.forEach(function (video) { 211 if (video.classList.contains("is-resizable")) 212 video.style.height = height + "px"; 213 }); 214 215 adjustArrowsPosition(gallery, leftPos, width); 216 } 217 218 function adjustArrowsPosition(gallery, videoLeftPos, videoWidth) { 219 var leftArrow = gallery.querySelector(".wp-video-popup-arrow-left"); 220 var rightArrow = gallery.querySelector(".wp-video-popup-arrow-right"); 221 222 if (leftArrow) 223 leftArrow.style.left = 224 videoLeftPos - config.arrow.gap - config.arrow.size + "px"; 225 226 if (rightArrow) { 227 rightArrow.style.left = 228 videoLeftPos + videoWidth + config.arrow.gap + "px"; 229 rightArrow.style.right = "auto"; 230 } 231 } 232 233 function openPopup(popup, autoOpen) { 234 autoOpen = autoOpen || false; 235 236 document.body.insertBefore(popup, document.body.firstChild); 237 238 $(popup).css({ display: "flex" }).stop().animate( 239 { 240 opacity: 1, 241 },
242 config.speed 243 ); 244 245 playVideo(popup.querySelector(".wp-video-popup-video"), autoOpen); 246 state.activePopup = popup; 247 248 // Adjust video's height when it starts showing up. 249 setTimeout(function () { 250 adjustPopupVideosHeight(popup); 251 }, config.videoWaitingTime); 252 } 253 254 function closePopup(popup) { 255 $(popup) 256 .stop() 257 .animate( 258 { 259 opacity: 0, 260 }, 261 config.speed, 262 function () { 263 popup.style.display = "none"; 264 } 265 ); 266 267 stopVideo(popup.querySelector(".wp-video-popup-video")); 268 state.activePopup = null; 269 } 270 271 function setupGallery(popup, autoOpen) { 272 var galleryName = popup.dataset.wpVideoPopupGallery; 273 var wrappers = document.querySelectorAll( 274 '[data-wp-video-popup-gallery="' + galleryName + '"]' 275 ); 276 if (!wrappers.length) return; 277 autoOpen = autoOpen || false; 278 279 // Don't setup the gallery if it only contains 1 popup. 280 if (wrappers.length <= 1) { 281 delete wrappers[0].dataset.wpVideoPopupGallery; 282 283 var closeButton = document.createElement("div"); 284 closeButton.className = "wp-video-popup-close"; 285 wrappers[0].insertBefore(closeButton, wrappers[0].firstChild); 286 287 openPopup(wrappers[0], autoOpen); 288 return; 289 } 290 291 var gallery = document.createElement("div"); 292 gallery.className = 293 "wp-video-popup-gallery wp-video-popup-gallery-" + galleryName; 294 gallery.dataset.wpVideoPopupGalleryName = galleryName; 295 296 var slides = document.createElement("div"); 297 slides.className = "wp-video-popup-slides"; 298 299 var closeButton = document.createElement("div"); 300 closeButton.className = "wp-video-popup-close"; 301 302 var leftArrow = document.createElement("img"); 303 leftArrow.className = 304 "wp-video-popup-arrow wp-video-popup-arrow-left prev-slide"; 305 leftArrow.src = 306 wpVideoPopupOpts.pluginUrl + "inc/img/wp-video-popup-left.png"; 307 leftArrow.alt = "left arrow"; 308 309 var rightArrow = document.createElement("img"); 310 rightArrow.className = 311 "wp-video-popup-arrow wp-video-popup-arrow-right next-slide"; 312 rightArrow.src = 313 wpVideoPopupOpts.pluginUrl + "inc/img/wp-video-popup-right.png"; 314 rightArrow.alt = "right arrow"; 315 316 wrappers.forEach(function (wrapper, i) { 317 wrapper.dataset.wpVideoPopupSlide = i; 318 wrapper.className = "wp-video-popup-slide slide-" + i; 319 320 if (i === 0) wrapper.classList.add("first-slide"); 321 if (i === wrappers.length - 1) wrapper.classList.add("last-slide"); 322 323 slides.appendChild(wrapper); 324 }); 325 326 gallery.appendChild(leftArrow); 327 gallery.appendChild(slides); 328 gallery.appendChild(rightArrow); 329 gallery.appendChild(closeButton); 330 document.body.insertBefore(gallery, document.body.firstChild); 331 332 leftArrow.addEventListener("click", onArrowClick); 333 rightArrow.addEventListener("click", onArrowClick); 334 335 gallery.addEventListener("click", function (e) { 336 if ( 337 e.target.classList.contains("wp-video-popup-slide") || 338 e.target.classList.contains("wp-video-popup-close") 339 ) { 340 closeGallery(galleryName); 341 } 342 }); 343 344 document.addEventListener("keydown", function (e) { 345 if ( 346 e.key !== "ArrowLeft" && 347 e.key !== "ArrowRight" && 348 e.keyCode !== 37 && 349 e.keyCode !== 39 350 ) 351 return; 352 if (!state.activeGallery) return; 353 354 var direction = 355 e.key === "ArrowLeft" || e.keyCode === 37 ? "prev" : "next"; 356 357 if (direction === "prev") { 358 gotoPrevSlide(state.activeGallery); 359 } else { 360 gotoNextSlide(state.activeGallery); 361 } 362 }); 363 364 galleries[galleryName] = { 365 total: wrappers.length, 366 el: gallery, 367 }; 368 369 openGallery(popup, autoOpen); 370 } 371 372 function onArrowClick(e) { 373 var direction = this.classList.contains("next-slide") ? "next" : "prev"; 374 375 if (direction === "prev") { 376 gotoPrevSlide(this.parentNode); 377 } else { 378 gotoNextSlide(this.parentNode); 379 } 380 } 381 382 function gotoPrevSlide(gallery) { 383 var currentIndex = parseInt(gallery.dataset.wpVideoPopupCurrentIndex, 10); 384 var slides = gallery.querySelectorAll(".wp-video-popup-slide"); 385 386 if (currentIndex === 0) { 387 return; 388 } 389 390 stopVideo(slides[currentIndex].querySelector(".wp-video-popup-video")); 391 setAsCurrentSlide(slides[currentIndex - 1]); 392 playVideo(slides[currentIndex - 1].querySelector(".wp-video-popup-video")); 393 } 394 395 function gotoNextSlide(gallery) { 396 var currentIndex = parseInt(gallery.dataset.wpVideoPopupCurrentIndex, 10); 397 var slides = gallery.querySelectorAll(".wp-video-popup-slide"); 398 399 if (currentIndex === slides.length - 1) { 400 return; 401 } 402 403 stopVideo(slides[currentIndex].querySelector(".wp-video-popup-video")); 404 setAsCurrentSlide(slides[currentIndex + 1]); 405 playVideo(slides[currentIndex + 1].querySelector(".wp-video-popup-video")); 406 } 407 408 function setAsCurrentSlide(targetSlide) { 409 var galleryName = targetSlide.dataset.wpVideoPopupGallery; 410 var gallery = galleries[galleryName].el; 411 if (!gallery) return; 412 var slides = gallery.querySelectorAll(".wp-video-popup-slide"); 413 var currentIndex = 0; 414 415 if (slides.length) {
416 slides.forEach(function (slide, i) { 417 gallery.classList.remove("showing-slide-" + i); 418 419 if (slide != targetSlide) { 420 slide.classList.remove("active-slide"); 421 } else { 422 slide.classList.add("active-slide"); 423 currentIndex = i; 424 } 425 }); 426 } 427 428 gallery.dataset.wpVideoPopupCurrentIndex = currentIndex; 429 gallery.dataset.wpVideoPopupCurrentSlide = "slide-" + currentIndex; 430 431 gallery.classList.add("showing-slide-" + currentIndex); 432 gallery.classList.remove("showing-last-slide"); 433 gallery.classList.remove("showing-first-slide"); 434 435 if (currentIndex === 0) { 436 gallery.classList.add("showing-first-slide"); 437 } else if (currentIndex === slides.length - 1) { 438 gallery.classList.add("showing-last-slide"); 439 } 440 } 441 442 function openGallery(popup, autoOpen) { 443 autoOpen = autoOpen || false; 444 var galleryName = popup.dataset.wpVideoPopupGallery; 445 if (!galleryName) return; 446 447 if (!galleries[galleryName]) { 448 setupGallery(popup, autoOpen); 449 return; 450 } 451 452 setAsCurrentSlide(popup); 453 454 var gallery = document.querySelector( 455 ".wp-video-popup-gallery-" + galleryName 456 ); 457 458 $(gallery).css({ display: "flex" }).stop().animate( 459 { 460 opacity: 1, 461 }, 462 config.speed 463 ); 464 465 playVideo(gallery.querySelector(".active-slide .wp-video-popup-video")); 466 gallery.classList.add("is-opened"); 467 state.activeGallery = gallery; 468 469 // Adjust video's height when it starts showing up. 470 setTimeout(function () { 471 adjustGalleryVideosHeight(gallery); 472 }, config.videoWaitingTime); 473 } 474 475 function closeGallery(galleryName) { 476 var gallery = document.querySelector( 477 ".wp-video-popup-gallery-" + galleryName 478 ); 479 var videos = gallery.querySelectorAll(".wp-video-popup-video"); 480 481 $(gallery) 482 .stop() 483 .animate( 484 { 485 opacity: 0, 486 }, 487 config.speed, 488 function () { 489 gallery.style.display = "none"; 490 } 491 ); 492 493 if (videos.length) { 494 videos.forEach(function (video) { 495 stopVideo(video); 496 }); 497 } 498 499 gallery.classList.remove("is-opened"); 500 state.activeGallery = null; 501 } 502 503 function playVideo(video, autoOpen) { 504 if (!video) return; 505 506 var videoUrl = video.getAttribute("data-wp-video-popup-url"); 507 508 if (videoUrl) { 509 video.setAttribute("src", videoUrl); 510 } 511 512 if (video.classList.contains("is-self-hosted")) { 513 if (autoOpen) video.muted = true; 514 video.load(); 515 video.play(); 516 } 517 518 // The delay is to wait the video to load, so that the fadeIn looks smoother. 519 $(video).stop().delay(config.videoWaitingTime).fadeIn(config.speed); 520 } 521 522 function stopVideo(video) { 523 if (!video) return; 524 if (video.classList.contains("is-self-hosted")) video.pause(); 525 526 $(video) 527 .stop() 528 .fadeOut(config.speed, function () { 529 video.setAttribute("src", ""); 530 }); 531 } 532 533 $(document).ready(function () { 534 init(); 535 }); 536})(jQuery);
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.