Muted and autoplay fixes, small bug fixes

This commit is contained in:
Sam Potts 2018-03-30 23:09:17 +11:00
parent 7be9d5d4d3
commit d593005b32
18 changed files with 2111 additions and 953 deletions

15
.vscode/launch.json vendored Normal file
View File

@ -0,0 +1,15 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost/dev/plyr/demo",
"webRoot": "${workspaceFolder}"
}
]
}

225
demo/dist/demo.js vendored
View File

@ -85,6 +85,15 @@ function serializer(replacer, cycleReplacer) {
});
var stringify_2 = stringify_1.getSerialize;
var stringify = Object.freeze({
default: stringify_1,
__moduleExports: stringify_1,
getSerialize: stringify_2
});
var stringify$1 = ( stringify && stringify_1 ) || stringify;
var _window =
typeof window !== 'undefined'
? window
@ -592,7 +601,7 @@ function serializeException(ex, depth, maxSize) {
var serialized = serializeObject(ex, depth);
if (jsonSize(stringify_1(serialized)) > maxSize) {
if (jsonSize(stringify$1(serialized)) > maxSize) {
return serializeException(ex, depth - 1);
}
@ -630,7 +639,7 @@ function sanitize(input, sanitizeKeys) {
var safeInput;
try {
safeInput = JSON.parse(stringify_1(input));
safeInput = JSON.parse(stringify$1(input));
} catch (o_O) {
return input;
}
@ -693,6 +702,78 @@ var utils = {
serializeKeysForMessage: serializeKeysForMessage,
sanitize: sanitize
};
var utils_1 = utils.isObject;
var utils_2 = utils.isError;
var utils_3 = utils.isErrorEvent;
var utils_4 = utils.isUndefined;
var utils_5 = utils.isFunction;
var utils_6 = utils.isPlainObject;
var utils_7 = utils.isString;
var utils_8 = utils.isArray;
var utils_9 = utils.isEmptyObject;
var utils_10 = utils.supportsErrorEvent;
var utils_11 = utils.supportsFetch;
var utils_12 = utils.supportsReferrerPolicy;
var utils_13 = utils.supportsPromiseRejectionEvent;
var utils_14 = utils.wrappedCallback;
var utils_15 = utils.each;
var utils_16 = utils.objectMerge;
var utils_17 = utils.truncate;
var utils_18 = utils.objectFrozen;
var utils_19 = utils.hasKey;
var utils_20 = utils.joinRegExp;
var utils_21 = utils.urlencode;
var utils_22 = utils.uuid4;
var utils_23 = utils.htmlTreeAsString;
var utils_24 = utils.htmlElementAsString;
var utils_25 = utils.isSameException;
var utils_26 = utils.isSameStacktrace;
var utils_27 = utils.parseUrl;
var utils_28 = utils.fill;
var utils_29 = utils.safeJoin;
var utils_30 = utils.serializeException;
var utils_31 = utils.serializeKeysForMessage;
var utils_32 = utils.sanitize;
var utils$1 = Object.freeze({
default: utils,
__moduleExports: utils,
isObject: utils_1,
isError: utils_2,
isErrorEvent: utils_3,
isUndefined: utils_4,
isFunction: utils_5,
isPlainObject: utils_6,
isString: utils_7,
isArray: utils_8,
isEmptyObject: utils_9,
supportsErrorEvent: utils_10,
supportsFetch: utils_11,
supportsReferrerPolicy: utils_12,
supportsPromiseRejectionEvent: utils_13,
wrappedCallback: utils_14,
each: utils_15,
objectMerge: utils_16,
truncate: utils_17,
objectFrozen: utils_18,
hasKey: utils_19,
joinRegExp: utils_20,
urlencode: utils_21,
uuid4: utils_22,
htmlTreeAsString: utils_23,
htmlElementAsString: utils_24,
isSameException: utils_25,
isSameStacktrace: utils_26,
parseUrl: utils_27,
fill: utils_28,
safeJoin: utils_29,
serializeException: utils_30,
serializeKeysForMessage: utils_31,
sanitize: utils_32
});
var utils$2 = ( utils$1 && utils ) || utils$1;
/*
TraceKit - Cross brower stack traces
@ -842,9 +923,9 @@ TraceKit.report = (function reportModuleWrapper() {
function traceKitWindowOnError(msg, url, lineNo, colNo, ex) {
var stack = null;
// If 'ex' is ErrorEvent, get real Error from inside
var exception = utils.isErrorEvent(ex) ? ex.error : ex;
var exception = utils$2.isErrorEvent(ex) ? ex.error : ex;
// If 'msg' is ErrorEvent, get real message from inside
var message = utils.isErrorEvent(msg) ? msg.message : msg;
var message = utils$2.isErrorEvent(msg) ? msg.message : msg;
if (lastExceptionStack) {
TraceKit.computeStackTrace.augmentStackTraceWithInitialElement(
@ -854,7 +935,7 @@ TraceKit.report = (function reportModuleWrapper() {
message
);
processLastException();
} else if (exception && utils.isError(exception)) {
} else if (exception && utils$2.isError(exception)) {
// non-string `exception` arg; attempt to extract stack trace
// New chrome and blink send along a real error object
@ -1321,6 +1402,12 @@ TraceKit.computeStackTrace = (function computeStackTraceWrapper() {
var tracekit = TraceKit;
var tracekit$1 = Object.freeze({
default: tracekit,
__moduleExports: tracekit
});
/*
* JavaScript MD5
* https://github.com/blueimp/JavaScript-MD5
@ -1588,6 +1675,12 @@ function md5(string, key, raw) {
var md5_1 = md5;
var md5$1 = Object.freeze({
default: md5_1,
__moduleExports: md5_1
});
function RavenConfigError(message) {
this.name = 'RavenConfigError';
this.message = message;
@ -1597,6 +1690,12 @@ RavenConfigError.prototype.constructor = RavenConfigError;
var configError = RavenConfigError;
var configError$1 = Object.freeze({
default: configError,
__moduleExports: configError
});
var wrapMethod = function(console, level, callback) {
var originalConsoleLevel = console[level];
var originalConsole = console;
@ -1610,14 +1709,14 @@ var wrapMethod = function(console, level, callback) {
console[level] = function() {
var args = [].slice.call(arguments);
var msg = utils.safeJoin(args, ' ');
var msg = utils$2.safeJoin(args, ' ');
var data = {level: sentryLevel, logger: 'console', extra: {arguments: args}};
if (level === 'assert') {
if (args[0] === false) {
// Default browsers message
msg =
'Assertion failed: ' + (utils.safeJoin(args.slice(1), ' ') || 'console.assert');
'Assertion failed: ' + (utils$2.safeJoin(args.slice(1), ' ') || 'console.assert');
data.extra.arguments = args.slice(1);
callback && callback(msg, data);
}
@ -1637,6 +1736,22 @@ var wrapMethod = function(console, level, callback) {
var console$1 = {
wrapMethod: wrapMethod
};
var console_1 = console$1.wrapMethod;
var console$2 = Object.freeze({
default: console$1,
__moduleExports: console$1,
wrapMethod: console_1
});
var TraceKit$1 = ( tracekit$1 && tracekit ) || tracekit$1;
var md5$2 = ( md5$1 && md5_1 ) || md5$1;
var RavenConfigError$1 = ( configError$1 && configError ) || configError$1;
var require$$0 = ( console$2 && console$1 ) || console$2;
/*global XDomainRequest:false */
@ -1646,35 +1761,35 @@ var console$1 = {
var isError$1 = utils.isError;
var isObject$1 = utils.isObject;
var isPlainObject$1 = utils.isPlainObject;
var isErrorEvent$1 = utils.isErrorEvent;
var isUndefined$1 = utils.isUndefined;
var isFunction$1 = utils.isFunction;
var isString$1 = utils.isString;
var isArray$1 = utils.isArray;
var isEmptyObject$1 = utils.isEmptyObject;
var each$1 = utils.each;
var objectMerge$1 = utils.objectMerge;
var truncate$1 = utils.truncate;
var objectFrozen$1 = utils.objectFrozen;
var hasKey$1 = utils.hasKey;
var joinRegExp$1 = utils.joinRegExp;
var urlencode$1 = utils.urlencode;
var uuid4$1 = utils.uuid4;
var htmlTreeAsString$1 = utils.htmlTreeAsString;
var isSameException$1 = utils.isSameException;
var isSameStacktrace$1 = utils.isSameStacktrace;
var parseUrl$1 = utils.parseUrl;
var fill$1 = utils.fill;
var supportsFetch$1 = utils.supportsFetch;
var supportsReferrerPolicy$1 = utils.supportsReferrerPolicy;
var serializeKeysForMessage$1 = utils.serializeKeysForMessage;
var serializeException$1 = utils.serializeException;
var sanitize$1 = utils.sanitize;
var isError$1 = utils$2.isError;
var isObject$1 = utils$2.isObject;
var isPlainObject$1 = utils$2.isPlainObject;
var isErrorEvent$1 = utils$2.isErrorEvent;
var isUndefined$1 = utils$2.isUndefined;
var isFunction$1 = utils$2.isFunction;
var isString$1 = utils$2.isString;
var isArray$1 = utils$2.isArray;
var isEmptyObject$1 = utils$2.isEmptyObject;
var each$1 = utils$2.each;
var objectMerge$1 = utils$2.objectMerge;
var truncate$1 = utils$2.truncate;
var objectFrozen$1 = utils$2.objectFrozen;
var hasKey$1 = utils$2.hasKey;
var joinRegExp$1 = utils$2.joinRegExp;
var urlencode$1 = utils$2.urlencode;
var uuid4$1 = utils$2.uuid4;
var htmlTreeAsString$1 = utils$2.htmlTreeAsString;
var isSameException$1 = utils$2.isSameException;
var isSameStacktrace$1 = utils$2.isSameStacktrace;
var parseUrl$1 = utils$2.parseUrl;
var fill$1 = utils$2.fill;
var supportsFetch$1 = utils$2.supportsFetch;
var supportsReferrerPolicy$1 = utils$2.supportsReferrerPolicy;
var serializeKeysForMessage$1 = utils$2.serializeKeysForMessage;
var serializeException$1 = utils$2.serializeException;
var sanitize$1 = utils$2.sanitize;
var wrapConsoleMethod = console$1.wrapMethod;
var wrapConsoleMethod = require$$0.wrapMethod;
var dsnKeys = 'source protocol user pass host port path'.split(' '),
dsnPattern = /^(?:(\w+):)?\/\/(?:(\w+)(:\w+)?@)?([\w\.-]+)(?::(\d+))?(\/.*)/;
@ -1781,7 +1896,7 @@ Raven.prototype = {
debug: false,
TraceKit: tracekit, // alias to TraceKit
TraceKit: TraceKit$1, // alias to TraceKit
/*
* Configure Raven with a DSN and extra options
@ -1862,7 +1977,7 @@ Raven.prototype = {
}
globalOptions.instrument = instrument;
tracekit.collectWindowErrors = !!globalOptions.collectWindowErrors;
TraceKit$1.collectWindowErrors = !!globalOptions.collectWindowErrors;
// return for chaining
return self;
@ -1879,7 +1994,7 @@ Raven.prototype = {
install: function() {
var self = this;
if (self.isSetup() && !self._isRavenInstalled) {
tracekit.report.subscribe(function() {
TraceKit$1.report.subscribe(function() {
self._handleOnErrorStackInfo.apply(self, arguments);
});
@ -2043,7 +2158,7 @@ Raven.prototype = {
* @return {Raven}
*/
uninstall: function() {
tracekit.report.uninstall();
TraceKit$1.report.uninstall();
this._detachPromiseRejectionHandler();
this._unpatchFunctionToString();
@ -2138,7 +2253,7 @@ Raven.prototype = {
// raises an exception different from the one we asked to
// report on.
try {
var stack = tracekit.computeStackTrace(ex);
var stack = TraceKit$1.computeStackTrace(ex);
this._handleStackInfo(stack, options);
} catch (ex1) {
if (ex !== ex1) {
@ -2154,7 +2269,7 @@ Raven.prototype = {
var options = objectMerge$1(currentOptions, {
message:
'Non-Error exception captured with keys: ' + serializeKeysForMessage$1(exKeys),
fingerprint: [md5_1(exKeys)],
fingerprint: [md5$2(exKeys)],
extra: currentOptions.extra || {}
});
options.extra.__serialized__ = serializeException$1(ex);
@ -2203,7 +2318,7 @@ Raven.prototype = {
// null exception name so `Error` isn't prefixed to msg
ex.name = null;
var stack = tracekit.computeStackTrace(ex);
var stack = TraceKit$1.computeStackTrace(ex);
// stack[0] is `throw new Error(msg)` call itself, we are interested in the frame that was just before that, stack[1]
var initialCall = isArray$1(stack.stack) && stack.stack[1];
@ -2350,7 +2465,7 @@ Raven.prototype = {
*/
getContext: function() {
// lol javascript
return JSON.parse(stringify_1(this._globalContext));
return JSON.parse(stringify$1(this._globalContext));
},
/*
@ -2486,12 +2601,12 @@ Raven.prototype = {
var lastEventId = options.eventId || this.lastEventId();
if (!lastEventId) {
throw new configError('Missing eventId');
throw new RavenConfigError$1('Missing eventId');
}
var dsn = options.dsn || this._dsn;
if (!dsn) {
throw new configError('Missing DSN');
throw new RavenConfigError$1('Missing DSN');
}
var encode = encodeURIComponent;
@ -3133,11 +3248,11 @@ Raven.prototype = {
try {
while (i--) dsn[dsnKeys[i]] = m[i] || '';
} catch (e) {
throw new configError('Invalid DSN: ' + str);
throw new RavenConfigError$1('Invalid DSN: ' + str);
}
if (dsn.pass && !this._globalOptions.allowSecretKey) {
throw new configError(
throw new RavenConfigError$1(
'Do not specify your secret key in the DSN. See: http://bit.ly/raven-secret-key'
);
}
@ -3658,7 +3773,7 @@ Raven.prototype = {
}
if (supportsFetch$1()) {
evaluatedFetchParameters.body = stringify_1(opts.data);
evaluatedFetchParameters.body = stringify$1(opts.data);
var defaultFetchOptions = objectMerge$1({}, this._fetchDefaults);
var fetchOptions = objectMerge$1(defaultFetchOptions, evaluatedFetchParameters);
@ -3733,7 +3848,7 @@ Raven.prototype = {
});
}
request.send(stringify_1(opts.data));
request.send(stringify$1(opts.data));
},
_evaluateHash: function(hash) {
@ -3775,6 +3890,14 @@ Raven.prototype.setReleaseContext = Raven.prototype.setRelease;
var raven = Raven;
var raven$1 = Object.freeze({
default: raven,
__moduleExports: raven
});
var RavenConstructor = ( raven$1 && raven ) || raven$1;
/**
* Enforces a single instance of the Raven client, and the
* main entry point for Raven. If you are a consumer of the
@ -3790,7 +3913,7 @@ var _window$3 =
: typeof commonjsGlobal !== 'undefined' ? commonjsGlobal : typeof self !== 'undefined' ? self : {};
var _Raven = _window$3.Raven;
var Raven$1 = new raven();
var Raven$1 = new RavenConstructor();
/*
* Allow multiple versions of Raven to be installed.
@ -3841,7 +3964,7 @@ var singleton = Raven$1;
*
* It should "just work".
*/
var Client = raven;
var Client = RavenConstructor;
singleton.Client = Client;
// ==========================================================================

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -169,7 +169,8 @@
</aside>
<!-- Polyfills -->
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6,Array.prototype.includes,CustomEvent" crossorigin="anonymous"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6,Array.prototype.includes,CustomEvent,Object.entries"
crossorigin="anonymous"></script>
<!-- Plyr core script -->
<script src="../dist/plyr.js" crossorigin="anonymous"></script>

127
dist/plyr.js vendored
View File

@ -77,7 +77,7 @@ var defaults = {
// Sprite (for icons)
loadSprite: true,
iconPrefix: 'plyr',
iconUrl: 'https://cdn.plyr.io/3.0.9/plyr.svg',
iconUrl: 'https://cdn.plyr.io/3.0.10/plyr.svg',
// Blank video (used to prevent errors on source change)
blankVideo: 'https://cdn.plyr.io/static/blank.mp4',
@ -2430,6 +2430,9 @@ var ui = {
// Reset quality options
this.options.quality = [];
// Reset volume display
ui.updateVolume.call(this);
// Reset time display
ui.timeUpdate.call(this);
@ -4200,17 +4203,17 @@ var Listeners = function () {
return ui.updateProgress.call(_this3.player, event);
});
// Handle native mute
// Handle volume changes
utils.on(this.player.media, 'volumechange', function (event) {
return ui.updateVolume.call(_this3.player, event);
});
// Handle native play/pause
// Handle play/pause
utils.on(this.player.media, 'playing play pause ended emptied', function (event) {
return ui.checkPlaying.call(_this3.player, event);
});
// Loading
// Loading state
utils.on(this.player.media, 'waiting canplay seeked playing', function (event) {
return ui.checkLoading.call(_this3.player, event);
});
@ -4218,6 +4221,20 @@ var Listeners = function () {
// Check if media failed to load
// utils.on(this.player.media, 'play', event => ui.checkFailed.call(this.player, event));
// If autoplay, then load advertisement if required
// TODO: Show some sort of loading state while the ad manager loads else there's a delay before ad shows
utils.on(this.player.media, 'playing', function () {
// If ads are enabled, wait for them first
if (_this3.player.ads.enabled && !_this3.player.ads.initialized) {
// Wait for manager response
_this3.player.ads.managerPromise.then(function () {
return _this3.player.ads.play();
}).catch(function () {
return _this3.player.play();
});
}
});
// Click video
if (this.player.supported.ui && this.player.config.clickToPlay && !this.player.isAudio) {
// Re-fetch the wrapper
@ -4813,11 +4830,12 @@ var Ads = function () {
this.cuePoints = this.manager.getCuePoints();
// Add advertisement cue's within the time line if available
if (!utils.is.empty(this.cuePoints)) {
this.cuePoints.forEach(function (cuePoint) {
if (cuePoint !== 0 && cuePoint !== -1 && cuePoint < _this6.player.duration) {
var seekElement = _this6.player.elements.progress;
if (seekElement) {
if (utils.is.element(seekElement)) {
var cuePercentage = 100 / _this6.player.duration * cuePoint;
var cue = utils.createElement('span', {
class: _this6.player.config.classNames.cues
@ -4828,6 +4846,7 @@ var Ads = function () {
}
}
});
}
// Get skippable state
// TODO: Skip button
@ -5011,6 +5030,10 @@ var Ads = function () {
this.player.on('seeked', function () {
var seekedTime = _this8.player.currentTime;
if (utils.is.empty(_this8.cuePoints)) {
return;
}
_this8.cuePoints.forEach(function (cuePoint, index) {
if (time < cuePoint && cuePoint < seekedTime) {
_this8.manager.discardAdBreak();
@ -5022,7 +5045,9 @@ var Ads = function () {
// Listen to the resizing of the window. And resize ad accordingly
// TODO: eventually implement ResizeObserver
window.addEventListener('resize', function () {
if (_this8.manager) {
_this8.manager.resize(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL);
}
});
}
@ -6360,7 +6385,17 @@ var Plyr = function () {
}
// Cache original element state for .destroy()
this.elements.original = this.media.cloneNode(true);
// TODO: Investigate a better solution as I suspect this causes reported double load issues?
setTimeout(function () {
var clone = _this.media.cloneNode(true);
// Prevent the clone autoplaying
if (clone.getAttribute('autoplay')) {
clone.pause();
}
_this.elements.original = clone;
}, 0);
// Set media type based on tag or data attribute
// Supported: video, audio, vimeo, youtube
@ -6510,6 +6545,11 @@ var Plyr = function () {
// Setup ads if provided
this.ads = new Ads(this);
// Always autoplay if required
if (this.config.autoplay) {
this.play();
}
}
// ---------------------------------------
@ -6529,20 +6569,14 @@ var Plyr = function () {
* Play the media, or play the advertisement (if they are not blocked)
*/
value: function play() {
var _this2 = this;
if (!utils.is.function(this.media.play)) {
return null;
}
// If ads are enabled, wait for them first
if (this.ads.enabled && !this.ads.initialized) {
return this.ads.managerPromise.then(function () {
return _this2.ads.play();
}).catch(function () {
return _this2.media.play();
});
}
/* if (this.ads.enabled && !this.ads.initialized) {
return this.ads.managerPromise.then(() => this.ads.play()).catch(() => this.media.play());
} */
// Return the promise (for HTML5)
return this.media.play();
@ -6594,7 +6628,7 @@ var Plyr = function () {
value: function stop() {
if (this.isHTML5) {
this.media.load();
} else {
} else if (utils.is.function(this.media.stop)) {
this.media.stop();
}
}
@ -6729,7 +6763,7 @@ var Plyr = function () {
}, {
key: 'toggleControls',
value: function toggleControls(toggle) {
var _this3 = this;
var _this2 = this;
// We need controls of course...
if (!utils.is.element(this.elements.controls)) {
@ -6803,25 +6837,30 @@ var Plyr = function () {
// then set the timer to hide the controls
if (!show || this.playing) {
this.timers.controls = setTimeout(function () {
// We need controls of course...
if (!utils.is.element(_this2.elements.controls)) {
return;
}
// If the mouse is over the controls (and not entering fullscreen), bail
if ((_this3.elements.controls.pressed || _this3.elements.controls.hover) && !isEnterFullscreen) {
if ((_this2.elements.controls.pressed || _this2.elements.controls.hover) && !isEnterFullscreen) {
return;
}
// Restore transition behaviour
if (!utils.hasClass(_this3.elements.container, _this3.config.classNames.hideControls)) {
utils.toggleClass(_this3.elements.controls, _this3.config.classNames.noTransition, false);
if (!utils.hasClass(_this2.elements.container, _this2.config.classNames.hideControls)) {
utils.toggleClass(_this2.elements.controls, _this2.config.classNames.noTransition, false);
}
// Check if controls toggled
var toggled = utils.toggleClass(_this3.elements.container, _this3.config.classNames.hideControls, true);
var toggled = utils.toggleClass(_this2.elements.container, _this2.config.classNames.hideControls, true);
// Trigger event and close menu
if (toggled) {
utils.dispatchEvent.call(_this3, _this3.media, 'controlshidden');
utils.dispatchEvent.call(_this2, _this2.media, 'controlshidden');
if (_this3.config.controls.includes('settings') && !utils.is.empty(_this3.config.settings)) {
controls.toggleMenu.call(_this3, false);
if (_this2.config.controls.includes('settings') && !utils.is.empty(_this2.config.settings)) {
controls.toggleMenu.call(_this2, false);
}
}
}, delay);
@ -6863,7 +6902,7 @@ var Plyr = function () {
}, {
key: 'destroy',
value: function destroy(callback) {
var _this4 = this;
var _this3 = this;
var soft = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@ -6876,22 +6915,22 @@ var Plyr = function () {
document.body.style.overflow = '';
// GC for embed
_this4.embed = null;
_this3.embed = null;
// If it's a soft destroy, make minimal changes
if (soft) {
if (Object.keys(_this4.elements).length) {
if (Object.keys(_this3.elements).length) {
// Remove elements
utils.removeElement(_this4.elements.buttons.play);
utils.removeElement(_this4.elements.captions);
utils.removeElement(_this4.elements.controls);
utils.removeElement(_this4.elements.wrapper);
utils.removeElement(_this3.elements.buttons.play);
utils.removeElement(_this3.elements.captions);
utils.removeElement(_this3.elements.controls);
utils.removeElement(_this3.elements.wrapper);
// Clear for GC
_this4.elements.buttons.play = null;
_this4.elements.captions = null;
_this4.elements.controls = null;
_this4.elements.wrapper = null;
_this3.elements.buttons.play = null;
_this3.elements.captions = null;
_this3.elements.controls = null;
_this3.elements.wrapper = null;
}
// Callback
@ -6900,26 +6939,26 @@ var Plyr = function () {
}
} else {
// Unbind listeners
_this4.listeners.clear();
_this3.listeners.clear();
// Replace the container with the original element provided
utils.replaceElement(_this4.elements.original, _this4.elements.container);
utils.replaceElement(_this3.elements.original, _this3.elements.container);
// Event
utils.dispatchEvent.call(_this4, _this4.elements.original, 'destroyed', true);
utils.dispatchEvent.call(_this3, _this3.elements.original, 'destroyed', true);
// Callback
if (utils.is.function(callback)) {
callback.call(_this4.elements.original);
callback.call(_this3.elements.original);
}
// Reset state
_this4.ready = false;
_this3.ready = false;
// Clear for garbage collection
setTimeout(function () {
_this4.elements = null;
_this4.media = null;
_this3.elements = null;
_this3.media = null;
}, 200);
}
};
@ -7171,8 +7210,8 @@ var Plyr = function () {
// Set the player volume
this.media.volume = volume;
// If muted, and we're increasing volume, reset muted state
if (this.muted && volume > 0) {
// If muted, and we're increasing volume manually, reset muted state
if (!utils.is.empty(value) && this.muted && volume > 0) {
this.muted = false;
}
}

2
dist/plyr.js.map vendored

File diff suppressed because one or more lines are too long

2
dist/plyr.min.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

2543
dist/plyr.polyfilled.js vendored

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -278,18 +278,28 @@ class Listeners {
// Check for buffer progress
utils.on(this.player.media, 'progress playing', event => ui.updateProgress.call(this.player, event));
// Handle native mute
// Handle volume changes
utils.on(this.player.media, 'volumechange', event => ui.updateVolume.call(this.player, event));
// Handle native play/pause
// Handle play/pause
utils.on(this.player.media, 'playing play pause ended emptied', event => ui.checkPlaying.call(this.player, event));
// Loading
// Loading state
utils.on(this.player.media, 'waiting canplay seeked playing', event => ui.checkLoading.call(this.player, event));
// Check if media failed to load
// utils.on(this.player.media, 'play', event => ui.checkFailed.call(this.player, event));
// If autoplay, then load advertisement if required
// TODO: Show some sort of loading state while the ad manager loads else there's a delay before ad shows
utils.on(this.player.media, 'playing', () => {
// If ads are enabled, wait for them first
if (this.player.ads.enabled && !this.player.ads.initialized) {
// Wait for manager response
this.player.ads.managerPromise.then(() => this.player.ads.play()).catch(() => this.player.play());
}
});
// Click video
if (this.player.supported.ui && this.player.config.clickToPlay && !this.player.isAudio) {
// Re-fetch the wrapper

View File

@ -206,11 +206,12 @@ class Ads {
this.cuePoints = this.manager.getCuePoints();
// Add advertisement cue's within the time line if available
if (!utils.is.empty(this.cuePoints)) {
this.cuePoints.forEach(cuePoint => {
if (cuePoint !== 0 && cuePoint !== -1 && cuePoint < this.player.duration) {
const seekElement = this.player.elements.progress;
if (seekElement) {
if (utils.is.element(seekElement)) {
const cuePercentage = 100 / this.player.duration * cuePoint;
const cue = utils.createElement('span', {
class: this.player.config.classNames.cues,
@ -221,6 +222,7 @@ class Ads {
}
}
});
}
// Get skippable state
// TODO: Skip button
@ -385,6 +387,10 @@ class Ads {
this.player.on('seeked', () => {
const seekedTime = this.player.currentTime;
if (utils.is.empty(this.cuePoints)) {
return;
}
this.cuePoints.forEach((cuePoint, index) => {
if (time < cuePoint && cuePoint < seekedTime) {
this.manager.discardAdBreak();
@ -396,7 +402,9 @@ class Ads {
// Listen to the resizing of the window. And resize ad accordingly
// TODO: eventually implement ResizeObserver
window.addEventListener('resize', () => {
if (this.manager) {
this.manager.resize(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL);
}
});
}

View File

@ -133,7 +133,17 @@ class Plyr {
}
// Cache original element state for .destroy()
this.elements.original = this.media.cloneNode(true);
// TODO: Investigate a better solution as I suspect this causes reported double load issues?
setTimeout(() => {
const clone = this.media.cloneNode(true);
// Prevent the clone autoplaying
if (clone.getAttribute('autoplay')) {
clone.pause();
}
this.elements.original = clone;
}, 0);
// Set media type based on tag or data attribute
// Supported: video, audio, vimeo, youtube
@ -286,6 +296,11 @@ class Plyr {
// Setup ads if provided
this.ads = new Ads(this);
// Autoplay if required
if (this.config.autoplay) {
this.play();
}
}
// ---------------------------------------
@ -323,9 +338,9 @@ class Plyr {
}
// If ads are enabled, wait for them first
if (this.ads.enabled && !this.ads.initialized) {
/* if (this.ads.enabled && !this.ads.initialized) {
return this.ads.managerPromise.then(() => this.ads.play()).catch(() => this.media.play());
}
} */
// Return the promise (for HTML5)
return this.media.play();
@ -384,7 +399,7 @@ class Plyr {
stop() {
if (this.isHTML5) {
this.media.load();
} else {
} else if (utils.is.function(this.media.stop)) {
this.media.stop();
}
}
@ -524,8 +539,8 @@ class Plyr {
// Set the player volume
this.media.volume = volume;
// If muted, and we're increasing volume, reset muted state
if (this.muted && volume > 0) {
// If muted, and we're increasing volume manually, reset muted state
if (!utils.is.empty(value) && this.muted && volume > 0) {
this.muted = false;
}
}
@ -1019,6 +1034,11 @@ class Plyr {
// then set the timer to hide the controls
if (!show || this.playing) {
this.timers.controls = setTimeout(() => {
// We need controls of course...
if (!utils.is.element(this.elements.controls)) {
return;
}
// If the mouse is over the controls (and not entering fullscreen), bail
if ((this.elements.controls.pressed || this.elements.controls.hover) && !isEnterFullscreen) {
return;

View File

@ -74,6 +74,9 @@ const ui = {
// Reset quality options
this.options.quality = [];
// Reset volume display
ui.updateVolume.call(this);
// Reset time display
ui.timeUpdate.call(this);