1/*! 2 * Name : Video Background Extension for Jarallax 3 * Version : 1.0.1 4 * Author : nK <https://nkdev.info> 5 * GitHub : https://github.com/nk-o/jarallax 6 */ 7/******/ (function(modules) { // webpackBootstrap 8/******/ // The module cache 9/******/ var installedModules = {}; 10/******/ 11/******/ // The require function 12/******/ function __webpack_require__(moduleId) { 13/******/ 14/******/ // Check if module is in cache 15/******/ if(installedModules[moduleId]) { 16/******/ return installedModules[moduleId].exports; 17/******/ } 18/******/ // Create a new module (and put it into the cache) 19/******/ var module = installedModules[moduleId] = { 20/******/ i: moduleId, 21/******/ l: false, 22/******/ exports: {} 23/******/ }; 24/******/ 25/******/ // Execute the module function 26/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 27/******/ 28/******/ // Flag the module as loaded 29/******/ module.l = true; 30/******/ 31/******/ // Return the exports of the module 32/******/ return module.exports; 33/******/ } 34/******/ 35/******/ 36/******/ // expose the modules object (__webpack_modules__) 37/******/ __webpack_require__.m = modules; 38/******/ 39/******/ // expose the module cache 40/******/ __webpack_require__.c = installedModules; 41/******/ 42/******/ // define getter function for harmony exports 43/******/ __webpack_require__.d = function(exports, name, getter) { 44/******/ if(!__webpack_require__.o(exports, name)) { 45/******/ Object.defineProperty(exports, name, { 46/******/ configurable: false, 47/******/ enumerable: true, 48/******/ get: getter 49/******/ }); 50/******/ } 51/******/ }; 52/******/ 53/******/ // getDefaultExport function for compatibility with non-harmony modules 54/******/ __webpack_require__.n = function(module) { 55/******/ var getter = module && module.__esModule ? 56/******/ function getDefault() { return module['default']; } : 57/******/ function getModuleExports() { return module; }; 58/******/ __webpack_require__.d(getter, 'a', getter); 59/******/ return getter; 60/******/ }; 61/******/ 62/******/ // Object.prototype.hasOwnProperty.call 63/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; 64/******/ 65/******/ // __webpack_public_path__ 66/******/ __webpack_require__.p = ""; 67/******/ 68/******/ // Load entry module and return exports 69/******/ return __webpack_require__(__webpack_require__.s = 7); 70/******/ }) 71/************************************************************************/ 72/******/ ([ 73/* 0 */ 74/***/ (function(module, exports, __webpack_require__) { 75 76"use strict"; 77/* WEBPACK VAR INJECTION */(function(global) { 78 79var win; 80 81if (typeof window !== "undefined") { 82 win = window; 83} else if (typeof global !== "undefined") { 84 win = global; 85} else if (typeof self !== "undefined") { 86 win = self; 87} else { 88 win = {}; 89} 90 91module.exports = win; 92/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(2))) 93 94/***/ }), 95/* 1 */ 96/***/ (function(module, exports, __webpack_require__) { 97 98"use strict"; 99 100 101module.exports = function (callback) { 102 103 if (document.readyState === 'complete' || document.readyState === 'interactive') { 104 // Already ready or interactive, execute callback 105 callback.call(); 106 } else if (document.attachEvent) { 107 // Old browsers 108 document.attachEvent('onreadystatechange', function () { 109 if (document.readyState === 'interactive') callback.call(); 110 }); 111 } else if (document.addEventListener) { 112 // Modern browsers 113 document.addEventListener('DOMContentLoaded', callback); 114 } 115}; 116 117/***/ }), 118/* 2 */ 119/***/ (function(module, exports, __webpack_require__) { 120 121"use strict"; 122 123 124var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; 125 126var g; 127 128// This works in non-strict mode 129g = function () { 130 return this; 131}(); 132 133try { 134 // This works if eval is allowed (see CSP) 135 g = g || Function("return this")() || (1, eval)("this"); 136} catch (e) { 137 // This works if the window reference is available 138 if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === "object") g = window; 139} 140 141// g can still be undefined, but nothing to do about it... 142// We return undefined, instead of nothing here, so it's 143// easier to handle this case. if(!global) { ...} 144 145module.exports = g; 146 147/***/ }), 148/* 3 */ 149/***/ (function(module, exports, __webpack_require__) { 150 151"use strict"; 152 153 154module.exports = __webpack_require__(9); 155 156/***/ }), 157/* 4 */, 158/* 5 */, 159/* 6 */, 160/* 7 */ 161/***/ (function(module, exports, __webpack_require__) { 162 163module.exports = __webpack_require__(8); 164 165 166/***/ }), 167/* 8 */ 168/***/ (function(module, exports, __webpack_require__) { 169 170"use strict"; 171 172 173var _videoWorker = __webpack_require__(3); 174 175var _videoWorker2 = _interopRequireDefault(_videoWorker); 176 177var _global = __webpack_require__(0); 178 179var _global2 = _interopRequireDefault(_global); 180 181var _liteReady = __webpack_require__(1); 182 183var _liteReady2 = _interopRequireDefault(_liteReady); 184 185var _jarallaxVideo = __webpack_require__(10); 186 187var _jarallaxVideo2 = _interopRequireDefault(_jarallaxVideo); 188 189function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 190 191// add video worker globally to fallback jarallax < 1.10 versions 192_global2.default.VideoWorker = _global2.default.VideoWorker || _videoWorker2.default; 193 194(0, _jarallaxVideo2.default)(); 195 196// data-jarallax-video initialization 197(0, _liteReady2.default)(function () { 198 if (typeof jarallax !== 'undefined') { 199 jarallax(document.querySelectorAll('[data-jarallax-video]')); 200 } 201}); 202 203/***/ }), 204/* 9 */ 205/***/ (function(module, exports, __webpack_require__) { 206 207"use strict"; 208 209 210Object.defineProperty(exports, "__esModule", { 211 value: true 212}); 213 214var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; 215 216var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); 217 218function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 219 220// Deferred 221// thanks http://stackoverflow.com/questions/18096715/implement-deferred-object-without-using-jquery 222function Deferred() { 223 this._done = []; 224 this._fail = []; 225} 226Deferred.prototype = {
227 execute: function execute(list, args) { 228 var i = list.length; 229 args = Array.prototype.slice.call(args); 230 while (i--) { 231 list[i].apply(null, args); 232 } 233 }, 234 resolve: function resolve() { 235 this.execute(this._done, arguments); 236 }, 237 reject: function reject() { 238 this.execute(this._fail, arguments); 239 }, 240 done: function done(callback) { 241 this._done.push(callback); 242 }, 243 fail: function fail(callback) { 244 this._fail.push(callback); 245 } 246}; 247 248var ID = 0; 249var YoutubeAPIadded = 0; 250var VimeoAPIadded = 0; 251var loadingYoutubePlayer = 0; 252var loadingVimeoPlayer = 0; 253var loadingYoutubeDefer = new Deferred(); 254var loadingVimeoDefer = new Deferred(); 255 256var VideoWorker = function () { 257 function VideoWorker(url, options) { 258 _classCallCheck(this, VideoWorker); 259 260 var self = this; 261 262 self.url = url; 263 264 self.options_default = { 265 autoplay: false, 266 loop: false, 267 mute: false, 268 volume: 100, 269 showContols: true, 270 271 // start / end video time in seconds 272 startTime: 0, 273 endTime: 0 274 }; 275 276 self.options = self.extend({}, self.options_default, options); 277 278 // check URL 279 self.videoID = self.parseURL(url); 280 281 // init 282 if (self.videoID) { 283 self.ID = ID++; 284 self.loadAPI(); 285 self.init(); 286 } 287 } 288 289 // Extend like jQuery.extend 290 291 292 _createClass(VideoWorker, [{ 293 key: 'extend', 294 value: function extend(out) { 295 var _arguments = arguments; 296 297 out = out || {}; 298 Object.keys(arguments).forEach(function (i) { 299 if (!_arguments[i]) { 300 return; 301 } 302 Object.keys(_arguments[i]).forEach(function (key) { 303 out[key] = _arguments[i][key]; 304 }); 305 }); 306 return out; 307 } 308 }, { 309 key: 'parseURL', 310 value: function parseURL(url) { 311 // parse youtube ID 312 function getYoutubeID(ytUrl) { 313 // eslint-disable-next-line no-useless-escape 314 var regExp = /.*(?:youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=)([^#\&\?]*).*/; 315 var match = ytUrl.match(regExp); 316 return match && match[1].length === 11 ? match[1] : false; 317 } 318 319 // parse vimeo ID 320 function getVimeoID(vmUrl) { 321 // eslint-disable-next-line no-useless-escape 322 var regExp = /https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^\/]*)\/videos\/|album\/(\d+)\/video\/|video\/|)(\d+)(?:$|\/|\?)/; 323 var match = vmUrl.match(regExp); 324 return match && match[3] ? match[3] : false; 325 } 326 327 // parse local string 328 function getLocalVideos(locUrl) { 329 // eslint-disable-next-line no-useless-escape 330 var videoFormats = locUrl.split(/,(?=mp4\:|webm\:|ogv\:|ogg\:)/); 331 var result = {}; 332 var ready = 0; 333 videoFormats.forEach(function (val) { 334 // eslint-disable-next-line no-useless-escape 335 var match = val.match(/^(mp4|webm|ogv|ogg)\:(.*)/); 336 if (match && match[1] && match[2]) { 337 // eslint-disable-next-line prefer-destructuring 338 result[match[1] === 'ogv' ? 'ogg' : match[1]] = match[2]; 339 ready = 1; 340 } 341 }); 342 return ready ? result : false;
343 } 344 345 var Youtube = getYoutubeID(url); 346 var Vimeo = getVimeoID(url); 347 var Local = getLocalVideos(url); 348 349 if (Youtube) { 350 this.type = 'youtube'; 351 return Youtube; 352 } else if (Vimeo) { 353 this.type = 'vimeo'; 354 return Vimeo; 355 } else if (Local) { 356 this.type = 'local'; 357 return Local; 358 } 359 360 return false; 361 } 362 }, { 363 key: 'isValid', 364 value: function isValid() { 365 return !!this.videoID; 366 } 367 368 // events 369 370 }, { 371 key: 'on', 372 value: function on(name, callback) { 373 this.userEventsList = this.userEventsList || []; 374 375 // add new callback in events list 376 (this.userEventsList[name] || (this.userEventsList[name] = [])).push(callback); 377 } 378 }, { 379 key: 'off', 380 value: function off(name, callback) { 381 var _this = this; 382 383 if (!this.userEventsList || !this.userEventsList[name]) { 384 return; 385 } 386 387 if (!callback) { 388 delete this.userEventsList[name]; 389 } else { 390 this.userEventsList[name].forEach(function (val, key) { 391 if (val === callback) { 392 _this.userEventsList[name][key] = false; 393 } 394 }); 395 } 396 } 397 }, { 398 key: 'fire', 399 value: function fire(name) { 400 var _this2 = this; 401 402 var args = [].slice.call(arguments, 1); 403 if (this.userEventsList && typeof this.userEventsList[name] !== 'undefined') { 404 this.userEventsList[name].forEach(function (val) { 405 // call with all arguments 406 if (val) { 407 val.apply(_this2, args); 408 } 409 }); 410 } 411 } 412 }, { 413 key: 'play', 414 value: function play(start) { 415 var self = this; 416 if (!self.player) { 417 return; 418 } 419 420 if (self.type === 'youtube' && self.player.playVideo) { 421 if (typeof start !== 'undefined') { 422 self.player.seekTo(start || 0); 423 } 424 if (YT.PlayerState.PLAYING !== self.player.getPlayerState()) { 425 self.player.playVideo(); 426 } 427 } 428 429 if (self.type === 'vimeo') { 430 if (typeof start !== 'undefined') { 431 self.player.setCurrentTime(start); 432 } 433 self.player.getPaused().then(function (paused) { 434 if (paused) { 435 self.player.play(); 436 } 437 }); 438 } 439 440 if (self.type === 'local') { 441 if (typeof start !== 'undefined') { 442 self.player.currentTime = start; 443 } 444 if (self.player.paused) { 445 self.player.play(); 446 } 447 } 448 } 449 }, { 450 key: 'pause', 451 value: function pause() { 452 var self = this; 453 if (!self.player) { 454 return; 455 } 456 457 if (self.type === 'youtube' && self.player.pauseVideo) { 458 if (YT.PlayerState.PLAYING === self.player.getPlayerState()) { 459 self.player.pauseVideo(); 460 } 461 } 462 463 if (self.type === 'vimeo') { 464 self.player.getPaused().then(function (paused) { 465 if (!paused) { 466 self.player.pause(); 467 } 468 }); 469 } 470 471 if (self.type === 'local') { 472 if (!self.player.paused) { 473 self.player.pause(); 474 } 475 } 476 } 477 }, { 478 key: 'mute', 479 value: function mute() { 480 var self = this; 481 if (!self.player) { 482 return; 483 } 484 485 if (self.type === 'youtube' && self.player.mute) { 486 self.player.mute(); 487 } 488 489 if (self.type === 'vimeo' && self.player.setVolume) { 490 self.player.setVolume(0); 491 } 492 493 if (self.type === 'local') { 494 self.$video.muted = true; 495 } 496 } 497 }, {
498 key: 'unmute', 499 value: function unmute() { 500 var self = this; 501 if (!self.player) { 502 return; 503 } 504 505 if (self.type === 'youtube' && self.player.mute) { 506 self.player.unMute(); 507 } 508 509 if (self.type === 'vimeo' && self.player.setVolume) { 510 self.player.setVolume(self.options.volume); 511 } 512 513 if (self.type === 'local') { 514 self.$video.muted = false; 515 } 516 } 517 }, { 518 key: 'setVolume', 519 value: function setVolume() { 520 var volume = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; 521 522 var self = this; 523 if (!self.player || !volume) { 524 return; 525 } 526 527 if (self.type === 'youtube' && self.player.setVolume) { 528 self.player.setVolume(volume); 529 } 530 531 if (self.type === 'vimeo' && self.player.setVolume) { 532 self.player.setVolume(volume); 533 } 534 535 if (self.type === 'local') { 536 self.$video.volume = volume / 100; 537 } 538 } 539 }, { 540 key: 'getVolume', 541 value: function getVolume(callback) { 542 var self = this; 543 if (!self.player) { 544 callback(false); 545 return; 546 } 547 548 if (self.type === 'youtube' && self.player.getVolume) { 549 callback(self.player.getVolume()); 550 } 551 552 if (self.type === 'vimeo' && self.player.getVolume) { 553 self.player.getVolume().then(function (volume) { 554 callback(volume); 555 }); 556 } 557 558 if (self.type === 'local') { 559 callback(self.$video.volume * 100); 560 } 561 } 562 }, { 563 key: 'getMuted', 564 value: function getMuted(callback) { 565 var self = this; 566 if (!self.player) { 567 callback(null); 568 return; 569 } 570 571 if (self.type === 'youtube' && self.player.isMuted) { 572 callback(self.player.isMuted()); 573 } 574 575 if (self.type === 'vimeo' && self.player.getVolume) { 576 self.player.getVolume().then(function (volume) { 577 callback(!!volume); 578 }); 579 } 580 581 if (self.type === 'local') { 582 callback(self.$video.muted); 583 } 584 } 585 }, { 586 key: 'getImageURL', 587 value: function getImageURL(callback) { 588 var self = this; 589 590 if (self.videoImage) { 591 callback(self.videoImage); 592 return; 593 } 594 595 if (self.type === 'youtube') { 596 var availableSizes = ['maxresdefault', 'sddefault', 'hqdefault', '0']; 597 var step = 0; 598 599 var tempImg = new Image(); 600 tempImg.onload = function () { 601 // if no thumbnail, youtube add their own image with width = 120px 602 if ((this.naturalWidth || this.width) !== 120 || step === availableSizes.length - 1) { 603 // ok 604 self.videoImage = 'https://img.youtube.com/vi/' + self.videoID + '/' + availableSizes[step] + '.jpg'; 605 callback(self.videoImage); 606 } else { 607 // try another size 608 step++; 609 this.src = 'https://img.youtube.com/vi/' + self.videoID + '/' + availableSizes[step] + '.jpg'; 610 } 611 }; 612 tempImg.src = 'https://img.youtube.com/vi/' + self.videoID + '/' + availableSizes[step] + '.jpg'; 613 } 614 615 if (self.type === 'vimeo') { 616 var request = new XMLHttpRequest(); 617 request.open('GET', 'https://vimeo.com/api/v2/video/' + self.videoID + '.json', true); 618 request.onreadystatechange = function () { 619 if (this.readyState === 4) { 620 if (this.status >= 200 && this.status < 400) { 621 // Success! 622 var response = JSON.parse(this.responseText); 623 self.videoImage = response[0].thumbnail_large; 624 callback(self.videoImage); 625 } else { 626 // Error :( 627 } 628 } 629 }; 630 request.send(); 631 request = null; 632 } 633 } 634 635 // fallback to the old version. 636 637 }, {
638 key: 'getIframe', 639 value: function getIframe(callback) { 640 this.getVideo(callback); 641 } 642 }, { 643 key: 'getVideo', 644 value: function getVideo(callback) { 645 var self = this; 646 647 // return generated video block 648 if (self.$video) { 649 callback(self.$video); 650 return; 651 } 652 653 // generate new video block 654 self.onAPIready(function () { 655 var hiddenDiv = void 0; 656 if (!self.$video) { 657 hiddenDiv = document.createElement('div'); 658 hiddenDiv.style.display = 'none'; 659 } 660 661 // Youtube 662 if (self.type === 'youtube') { 663 self.playerOptions = {}; 664 self.playerOptions.videoId = self.videoID; 665 self.playerOptions.playerVars = { 666 autohide: 1, 667 rel: 0, 668 autoplay: 0, 669 // autoplay enable on mobile devices 670 playsinline: 1 671 }; 672 673 // hide controls 674 if (!self.options.showContols) { 675 self.playerOptions.playerVars.iv_load_policy = 3; 676 self.playerOptions.playerVars.modestbranding = 1; 677 self.playerOptions.playerVars.controls = 0; 678 self.playerOptions.playerVars.showinfo = 0; 679 self.playerOptions.playerVars.disablekb = 1; 680 } 681 682 // events 683 var ytStarted = void 0; 684 var ytProgressInterval = void 0; 685 self.playerOptions.events = { 686 onReady: function onReady(e) { 687 // mute 688 if (self.options.mute) { 689 e.target.mute(); 690 } else if (self.options.volume) { 691 e.target.setVolume(self.options.volume); 692 } 693 694 // autoplay 695 if (self.options.autoplay) { 696 self.play(self.options.startTime); 697 } 698 self.fire('ready', e); 699 700 // volumechange 701 setInterval(function () { 702 self.getVolume(function (volume) { 703 if (self.options.volume !== volume) { 704 self.options.volume = volume; 705 self.fire('volumechange', e); 706 } 707 }); 708 }, 150); 709 }, 710 onStateChange: function onStateChange(e) { 711 // loop 712 if (self.options.loop && e.data === YT.PlayerState.ENDED) { 713 self.play(self.options.startTime); 714 } 715 if (!ytStarted && e.data === YT.PlayerState.PLAYING) { 716 ytStarted = 1; 717 self.fire('started', e); 718 } 719 if (e.data === YT.PlayerState.PLAYING) { 720 self.fire('play', e); 721 } 722 if (e.data === YT.PlayerState.PAUSED) { 723 self.fire('pause', e); 724 } 725 if (e.data === YT.PlayerState.ENDED) { 726 self.fire('ended', e); 727 } 728 729 // progress check 730 if (e.data === YT.PlayerState.PLAYING) { 731 ytProgressInterval = setInterval(function () { 732 self.fire('timeupdate', e); 733 734 // check for end of video and play again or stop 735 if (self.options.endTime && self.player.getCurrentTime() >= self.options.endTime) { 736 if (self.options.loop) { 737 self.play(self.options.startTime); 738 } else { 739 self.pause(); 740 } 741 } 742 }, 150); 743 } else { 744 clearInterval(ytProgressInterval); 745 } 746 } 747 }; 748 749 var firstInit = !self.$video; 750 if (firstInit) { 751 var div = document.createElement('div'); 752 div.setAttribute('id', self.playerID); 753 hiddenDiv.appendChild(div); 754 document.body.appendChild(hiddenDiv); 755 } 756 self.player = self.player || new window.YT.Player(self.playerID, self.playerOptions); 757 if (firstInit) { 758 self.$video = document.getElementById(self.playerID); 759 760 // get video width and height 761 self.videoWidth = parseInt(self.$video.getAttribute('width'), 10) || 1280; 762 self.videoHeight = parseInt(self.$video.getAttribute('height'), 10) || 720; 763 } 764 } 765 766 // Vimeo 767 if (self.type === 'vimeo') { 768 self.playerOptions = ''; 769 770 self.playerOptions += 'player_id=' + self.playerID; 771 self.playerOptions += '&autopause=0'; 772 self.playerOptions += '&transparent=0'; 773 774 // hide controls 775 if (!self.options.showContols) { 776 self.playerOptions += '&badge=0&byline=0&portrait=0&title=0'; 777 } 778 779 // autoplay 780 self.playerOptions += '&autoplay=' + (self.options.autoplay ? '1' : '0'); 781 782 // loop 783 self.playerOptions += '&loop=' + (self.options.loop ? 1 : 0); 784 785 if (!self.$video) { 786 self.$video = document.createElement('iframe'); 787 self.$video.setAttribute('id', self.playerID); 788 self.$video.setAttribute('src', 'https://player.vimeo.com/video/' + self.videoID + '?' + self.playerOptions); 789 self.$video.setAttribute('frameborder', '0'); 790 hiddenDiv.appendChild(self.$video); 791 document.body.appendChild(hiddenDiv); 792 } 793 794 self.player = self.player || new Vimeo.Player(self.$video); 795 796 // get video width and height 797 self.player.getVideoWidth().then(function (width) { 798 self.videoWidth = width || 1280; 799 }); 800 self.player.getVideoHeight().then(function (height) { 801 self.videoHeight = height || 720; 802 }); 803 804 // set current time for autoplay 805 if (self.options.startTime && self.options.autoplay) { 806 self.player.setCurrentTime(self.options.startTime); 807 } 808 809 // mute 810 if (self.options.mute) { 811 self.player.setVolume(0); 812 } else if (self.options.volume) { 813 self.player.setVolume(self.options.volume); 814 } 815 816 var vmStarted = void 0; 817 self.player.on('timeupdate', function (e) { 818 if (!vmStarted) { 819 self.fire('started', e); 820 vmStarted = 1; 821 } 822 823 self.fire('timeupdate', e); 824 825 // check for end of video and play again or stop 826 if (self.options.endTime) { 827 if (self.options.endTime && e.seconds >= self.options.endTime) { 828 if (self.options.loop) { 829 self.play(self.options.startTime); 830 } else { 831 self.pause(); 832 } 833 } 834 } 835 }); 836 self.player.on('play', function (e) { 837 self.fire('play', e); 838 839 // check for the start time and start with it 840 if (self.options.startTime && e.seconds === 0) { 841 self.play(self.options.startTime); 842 } 843 }); 844 self.player.on('pause', function (e) { 845 self.fire('pause', e); 846 }); 847 self.player.on('ended', function (e) { 848 self.fire('ended', e); 849 }); 850 self.player.on('loaded', function (e) { 851 self.fire('ready', e); 852 }); 853 self.player.on('volumechange', function (e) { 854 self.fire('volumechange', e); 855 }); 856 } 857 858 // Local 859 function addSourceToLocal(element, src, type) { 860 var source = document.createElement('source'); 861 source.src = src; 862 source.type = type; 863 element.appendChild(source); 864 } 865 if (self.type === 'local') { 866 if (!self.$video) { 867 self.$video = document.createElement('video'); 868 869 // mute 870 if (self.options.mute) { 871 self.$video.muted = true; 872 } else if (self.$video.volume) { 873 self.$video.volume = self.options.volume / 100; 874 } 875 876 // loop 877 if (self.options.loop) { 878 self.$video.loop = true; 879 } 880 881 // autoplay enable on mobile devices 882 self.$video.setAttribute('playsinline', ''); 883 self.$video.setAttribute('webkit-playsinline', ''); 884 885 self.$video.setAttribute('id', self.playerID); 886 hiddenDiv.appendChild(self.$video); 887 document.body.appendChild(hiddenDiv); 888
889 Object.keys(self.videoID).forEach(function (key) { 890 addSourceToLocal(self.$video, self.videoID[key], 'video/' + key); 891 }); 892 } 893 894 self.player = self.player || self.$video; 895 896 var locStarted = void 0; 897 self.player.addEventListener('playing', function (e) { 898 if (!locStarted) { 899 self.fire('started', e); 900 } 901 locStarted = 1; 902 }); 903 self.player.addEventListener('timeupdate', function (e) { 904 self.fire('timeupdate', e); 905 906 // check for end of video and play again or stop 907 if (self.options.endTime) { 908 if (self.options.endTime && this.currentTime >= self.options.endTime) { 909 if (self.options.loop) { 910 self.play(self.options.startTime); 911 } else { 912 self.pause(); 913 } 914 } 915 } 916 }); 917 self.player.addEventListener('play', function (e) { 918 self.fire('play', e); 919 }); 920 self.player.addEventListener('pause', function (e) { 921 self.fire('pause', e); 922 }); 923 self.player.addEventListener('ended', function (e) { 924 self.fire('ended', e); 925 }); 926 self.player.addEventListener('loadedmetadata', function () { 927 // get video width and height 928 self.videoWidth = this.videoWidth || 1280; 929 self.videoHeight = this.videoHeight || 720; 930 931 self.fire('ready'); 932 933 // autoplay 934 if (self.options.autoplay) { 935 self.play(self.options.startTime); 936 } 937 }); 938 self.player.addEventListener('volumechange', function (e) { 939 self.getVolume(function (volume) { 940 self.options.volume = volume; 941 }); 942 self.fire('volumechange', e); 943 }); 944 } 945 946 callback(self.$video); 947 }); 948 } 949 }, { 950 key: 'init', 951 value: function init() { 952 var self = this; 953 954 self.playerID = 'VideoWorker-' + self.ID; 955 } 956 }, { 957 key: 'loadAPI', 958 value: function loadAPI() { 959 var self = this; 960 961 if (YoutubeAPIadded && VimeoAPIadded) { 962 return; 963 } 964 965 var src = ''; 966 967 // load Youtube API 968 if (self.type === 'youtube' && !YoutubeAPIadded) { 969 YoutubeAPIadded = 1; 970 src = 'https://www.youtube.com/iframe_api'; 971 } 972 973 // load Vimeo API 974 if (self.type === 'vimeo' && !VimeoAPIadded) { 975 VimeoAPIadded = 1; 976 src = 'https://player.vimeo.com/api/player.js'; 977 } 978 979 if (!src) { 980 return; 981 } 982 983 // add script in head section 984 var tag = document.createElement('script'); 985 var head = document.getElementsByTagName('head')[0]; 986 tag.src = src; 987 988 head.appendChild(tag); 989 990 head = null; 991 tag = null; 992 } 993 }, { 994 key: 'onAPIready', 995 value: function onAPIready(callback) { 996 var self = this; 997 998 // Youtube
999 if (self.type === 'youtube') { 1000 // Listen for global YT player callback 1001 if ((typeof YT === 'undefined' || YT.loaded === 0) && !loadingYoutubePlayer) { 1002 // Prevents Ready event from being called twice 1003 loadingYoutubePlayer = 1; 1004 1005 // Creates deferred so, other players know when to wait. 1006 window.onYouTubeIframeAPIReady = function () { 1007 window.onYouTubeIframeAPIReady = null; 1008 loadingYoutubeDefer.resolve('done'); 1009 callback(); 1010 }; 1011 } else if ((typeof YT === 'undefined' ? 'undefined' : _typeof(YT)) === 'object' && YT.loaded === 1) { 1012 callback(); 1013 } else { 1014 loadingYoutubeDefer.done(function () { 1015 callback(); 1016 }); 1017 } 1018 } 1019 1020 // Vimeo 1021 if (self.type === 'vimeo') { 1022 if (typeof Vimeo === 'undefined' && !loadingVimeoPlayer) { 1023 loadingVimeoPlayer = 1; 1024 var vimeoInterval = setInterval(function () { 1025 if (typeof Vimeo !== 'undefined') { 1026 clearInterval(vimeoInterval); 1027 loadingVimeoDefer.resolve('done'); 1028 callback(); 1029 } 1030 }, 20); 1031 } else if (typeof Vimeo !== 'undefined') { 1032 callback(); 1033 } else { 1034 loadingVimeoDefer.done(function () { 1035 callback(); 1036 }); 1037 } 1038 } 1039 1040 // Local 1041 if (self.type === 'local') { 1042 callback(); 1043 } 1044 } 1045 }]); 1046 1047 return VideoWorker; 1048}(); 1049 1050exports.default = VideoWorker; 1051 1052/***/ }), 1053/* 10 */ 1054/***/ (function(module, exports, __webpack_require__) { 1055 1056"use strict"; 1057 1058 1059Object.defineProperty(exports, "__esModule", { 1060 value: true 1061}); 1062exports.default = jarallaxVideo; 1063 1064var _videoWorker = __webpack_require__(3); 1065 1066var _videoWorker2 = _interopRequireDefault(_videoWorker); 1067 1068var _global = __webpack_require__(0); 1069 1070var _global2 = _interopRequireDefault(_global); 1071 1072function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 1073 1074function jarallaxVideo() { 1075 var jarallax = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _global2.default.jarallax; 1076 1077 if (typeof jarallax === 'undefined') { 1078 return; 1079 } 1080 1081 var Jarallax = jarallax.constructor; 1082 1083 // append video after init Jarallax 1084 var defInit = Jarallax.prototype.init; 1085 Jarallax.prototype.init = function () { 1086 var self = this; 1087 1088 defInit.apply(self); 1089 1090 if (self.video && !self.options.disableVideo()) { 1091 self.video.getVideo(function (video) { 1092 var $parent = video.parentNode; 1093 self.css(video, { 1094 position: self.image.position, 1095 top: '0px', 1096 left: '0px', 1097 right: '0px', 1098 bottom: '0px', 1099 width: '100%', 1100 height: '100%', 1101 maxWidth: 'none', 1102 maxHeight: 'none', 1103 margin: 0, 1104 zIndex: -1 1105 }); 1106 self.$video = video; 1107 self.image.$container.appendChild(video); 1108 1109 // remove parent video element (created by VideoWorker) 1110 $parent.parentNode.removeChild($parent); 1111 }); 1112 } 1113 }; 1114 1115 // cover video 1116 var defCoverImage = Jarallax.prototype.coverImage; 1117 Jarallax.prototype.coverImage = function () { 1118 var self = this; 1119 var imageData = defCoverImage.apply(self); 1120 var node = self.image.$item ? self.image.$item.nodeName : false; 1121 1122 if (imageData && self.video && node && (node === 'IFRAME' || node === 'VIDEO')) { 1123 var h = imageData.image.height; 1124 var w = h * self.image.width / self.image.height; 1125 var ml = (imageData.container.width - w) / 2; 1126 var mt = imageData.image.marginTop; 1127 1128 if (imageData.container.width > w) { 1129 w = imageData.container.width; 1130 h = w * self.image.height / self.image.width; 1131 ml = 0; 1132 mt += (imageData.image.height - h) / 2; 1133 } 1134 1135 // add video height over than need to hide controls 1136 if (node === 'IFRAME') { 1137 h += 400; 1138 mt -= 200; 1139 } 1140 1141 self.css(self.$video, { 1142 width: w + 'px', 1143 marginLeft: ml + 'px', 1144 height: h + 'px', 1145 marginTop: mt + 'px' 1146 }); 1147 } 1148 1149 return imageData; 1150 }; 1151 1152 // init video 1153 var defInitImg = Jarallax.prototype.initImg; 1154 Jarallax.prototype.initImg = function () { 1155 var self = this; 1156 var defaultResult = defInitImg.apply(self); 1157 1158 if (!self.options.videoSrc) { 1159 self.options.videoSrc = self.$item.getAttribute('data-jarallax-video') || null; 1160 } 1161 1162 if (self.options.videoSrc) { 1163 self.defaultInitImgResult = defaultResult; 1164 return true; 1165 } 1166 1167 return defaultResult; 1168 }; 1169 1170 var defCanInitParallax = Jarallax.prototype.canInitParallax; 1171 Jarallax.prototype.canInitParallax = function () { 1172 var self = this; 1173 var defaultResult = defCanInitParallax.apply(self); 1174 1175 if (!self.options.videoSrc) { 1176 return defaultResult; 1177 } 1178 1179 var video = new _videoWorker2.default(self.options.videoSrc, { 1180 autoplay: true, 1181 loop: true, 1182 showContols: false, 1183 startTime: self.options.videoStartTime || 0, 1184 endTime: self.options.videoEndTime || 0, 1185 mute: self.options.videoVolume ? 0 : 1, 1186 volume: self.options.videoVolume || 0 1187 }); 1188 1189 if (video.isValid()) { 1190 // if parallax will not be inited, we can add thumbnail on background. 1191 if (!defaultResult) { 1192 if (!self.defaultInitImgResult) { 1193 video.getImageURL(function (url) { 1194 // save default user styles 1195 var curStyle = self.$item.getAttribute('style'); 1196 if (curStyle) { 1197 self.$item.setAttribute('data-jarallax-original-styles', curStyle); 1198 } 1199 1200 // set new background 1201 self.css(self.$item, { 1202 'background-image': 'url("' + url + '")', 1203 'background-position': 'center', 1204 'background-size': 'cover' 1205 }); 1206 }); 1207 } 1208 1209 // init video 1210 } else { 1211 video.on('ready', function () { 1212 if (self.options.videoPlayOnlyVisible) { 1213 var oldOnScroll = self.onScroll; 1214 self.onScroll = function () { 1215 oldOnScroll.apply(self); 1216 if (self.isVisible()) { 1217 video.play(); 1218 } else { 1219 video.pause(); 1220 } 1221 }; 1222 } else { 1223 video.play(); 1224 } 1225 }); 1226 1227 video.on('started', function () { 1228 self.image.$default_item = self.image.$item; 1229 self.image.$item = self.$video; 1230 1231 // set video width and height 1232 self.image.width = self.video.videoWidth || 1280; 1233 self.image.height = self.video.videoHeight || 720; 1234 self.options.imgWidth = self.image.width; 1235 self.options.imgHeight = self.image.height; 1236 self.coverImage(); 1237 self.clipContainer(); 1238 self.onScroll(); 1239 1240 // hide image 1241 if (self.image.$default_item) { 1242 self.image.$default_item.style.display = 'none'; 1243 } 1244 }); 1245 1246 self.video = video; 1247 1248 // set image if not exists 1249 if (!self.defaultInitImgResult) { 1250 if (video.type !== 'local') { 1251 video.getImageURL(function (url) { 1252 self.image.src = url; 1253 self.init(); 1254 }); 1255 1256 return false;
1257 } 1258 1259 // set empty image on local video if not defined 1260 self.image.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'; 1261 return true; 1262 } 1263 } 1264 } 1265 1266 return defaultResult; 1267 }; 1268 1269 // Destroy video parallax 1270 var defDestroy = Jarallax.prototype.destroy; 1271 Jarallax.prototype.destroy = function () { 1272 var self = this; 1273 1274 if (self.image.$default_item) { 1275 self.image.$item = self.image.$default_item; 1276 delete self.image.$default_item; 1277 } 1278 1279 defDestroy.apply(self); 1280 }; 1281} 1282 1283/***/ }) 1284/******/ ]);
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.