try screen.orientation.lock

This commit is contained in:
Harvey Zack committed 2022-04-27 20:57:05 +08:00
1 parent e4f815e24f
commit cf5099f259
3 files changed
+115 -102

No files matched your search

+91 -101
View File
@@ -1435,31 +1435,16 @@
}); });
} }
var screenfull$1 = {exports: {}}; /* eslint-disable promise/prefer-await-to-then */
/*! const methodMap = [
* screenfull
* v5.2.0 - 2021-11-03
* (c) Sindre Sorhus; MIT License
*/
(function (module) {
(function () {
var document = typeof window !== 'undefined' && typeof window.document !== 'undefined' ? window.document : {};
var isCommonjs = module.exports;
var fn = (function () {
var val;
var fnMap = [
[ [
'requestFullscreen', 'requestFullscreen',
'exitFullscreen', 'exitFullscreen',
'fullscreenElement', 'fullscreenElement',
'fullscreenEnabled', 'fullscreenEnabled',
'fullscreenchange', 'fullscreenchange',
'fullscreenerror' 'fullscreenerror',
], ],
// New WebKit // New WebKit
[ [
@@ -1468,7 +1453,7 @@
'webkitFullscreenElement', 'webkitFullscreenElement',
'webkitFullscreenEnabled', 'webkitFullscreenEnabled',
'webkitfullscreenchange', 'webkitfullscreenchange',
'webkitfullscreenerror' 'webkitfullscreenerror',
], ],
// Old WebKit // Old WebKit
@@ -1478,7 +1463,7 @@
'webkitCurrentFullScreenElement', 'webkitCurrentFullScreenElement',
'webkitCancelFullScreen', 'webkitCancelFullScreen',
'webkitfullscreenchange', 'webkitfullscreenchange',
'webkitfullscreenerror' 'webkitfullscreenerror',
], ],
[ [
@@ -1487,7 +1472,7 @@
'mozFullScreenElement', 'mozFullScreenElement',
'mozFullScreenEnabled', 'mozFullScreenEnabled',
'mozfullscreenchange', 'mozfullscreenchange',
'mozfullscreenerror' 'mozfullscreenerror',
], ],
[ [
'msRequestFullscreen', 'msRequestFullscreen',
@@ -1495,150 +1480,131 @@
'msFullscreenElement', 'msFullscreenElement',
'msFullscreenEnabled', 'msFullscreenEnabled',
'MSFullscreenChange', 'MSFullscreenChange',
'MSFullscreenError' 'MSFullscreenError',
] ],
]; ];
var i = 0; const nativeAPI = (() => {
var l = fnMap.length; const unprefixedMethods = methodMap[0];
var ret = {}; const returnValue = {};
for (; i < l; i++) { for (const methodList of methodMap) {
val = fnMap[i]; const exitFullscreenMethod = methodList?.[1];
if (val && val[1] in document) { if (exitFullscreenMethod in document) {
for (i = 0; i < val.length; i++) { for (const [index, method] of methodList.entries()) {
ret[fnMap[0][i]] = val[i]; returnValue[unprefixedMethods[index]] = method;
} }
return ret;
return returnValue;
} }
} }
return false; return false;
})(); })();
var eventNameMap = { const eventNameMap = {
change: fn.fullscreenchange, change: nativeAPI.fullscreenchange,
error: fn.fullscreenerror error: nativeAPI.fullscreenerror,
}; };
var screenfull = { // eslint-disable-next-line import/no-mutable-exports
request: function (element, options) { let screenfull = {
return new Promise(function (resolve, reject) { // eslint-disable-next-line default-param-last
var onFullScreenEntered = function () { request(element = document.documentElement, options) {
this.off('change', onFullScreenEntered); return new Promise((resolve, reject) => {
const onFullScreenEntered = () => {
screenfull.off('change', onFullScreenEntered);
resolve(); resolve();
}.bind(this); };
this.on('change', onFullScreenEntered); screenfull.on('change', onFullScreenEntered);
element = element || document.documentElement; const returnPromise = element[nativeAPI.requestFullscreen](options);
var returnPromise = element[fn.requestFullscreen](options);
if (returnPromise instanceof Promise) { if (returnPromise instanceof Promise) {
returnPromise.then(onFullScreenEntered).catch(reject); returnPromise.then(onFullScreenEntered).catch(reject);
} }
}.bind(this)); });
}, },
exit: function () { exit() {
return new Promise(function (resolve, reject) { return new Promise((resolve, reject) => {
if (!this.isFullscreen) { if (!screenfull.isFullscreen) {
resolve(); resolve();
return; return;
} }
var onFullScreenExit = function () { const onFullScreenExit = () => {
this.off('change', onFullScreenExit); screenfull.off('change', onFullScreenExit);
resolve(); resolve();
}.bind(this); };
this.on('change', onFullScreenExit); screenfull.on('change', onFullScreenExit);
var returnPromise = document[fn.exitFullscreen](); const returnPromise = document[nativeAPI.exitFullscreen]();
if (returnPromise instanceof Promise) { if (returnPromise instanceof Promise) {
returnPromise.then(onFullScreenExit).catch(reject); returnPromise.then(onFullScreenExit).catch(reject);
} }
}.bind(this)); });
}, },
toggle: function (element, options) { toggle(element, options) {
return this.isFullscreen ? this.exit() : this.request(element, options); return screenfull.isFullscreen ? screenfull.exit() : screenfull.request(element, options);
}, },
onchange: function (callback) { onchange(callback) {
this.on('change', callback); screenfull.on('change', callback);
}, },
onerror: function (callback) { onerror(callback) {
this.on('error', callback); screenfull.on('error', callback);
}, },
on: function (event, callback) { on(event, callback) {
var eventName = eventNameMap[event]; const eventName = eventNameMap[event];
if (eventName) { if (eventName) {
document.addEventListener(eventName, callback, false); document.addEventListener(eventName, callback, false);
} }
}, },
off: function (event, callback) { off(event, callback) {
var eventName = eventNameMap[event]; const eventName = eventNameMap[event];
if (eventName) { if (eventName) {
document.removeEventListener(eventName, callback, false); document.removeEventListener(eventName, callback, false);
} }
}, },
raw: fn raw: nativeAPI,
}; };
if (!fn) {
if (isCommonjs) {
module.exports = {isEnabled: false};
} else {
window.screenfull = {isEnabled: false};
}
return;
}
Object.defineProperties(screenfull, { Object.defineProperties(screenfull, {
isFullscreen: { isFullscreen: {
get: function () { get: () => Boolean(document[nativeAPI.fullscreenElement]),
return Boolean(document[fn.fullscreenElement]);
}
}, },
element: { element: {
enumerable: true, enumerable: true,
get: function () { get: () => document[nativeAPI.fullscreenElement] ?? undefined,
return document[fn.fullscreenElement];
}
}, },
isEnabled: { isEnabled: {
enumerable: true, enumerable: true,
get: function () { // Coerce to boolean in case of old WebKit.
// Coerce to boolean in case of old WebKit get: () => Boolean(document[nativeAPI.fullscreenEnabled]),
return Boolean(document[fn.fullscreenEnabled]); },
}
}
}); });
if (isCommonjs) { if (!nativeAPI) {
module.exports = screenfull; screenfull = {isEnabled: false};
} else {
window.screenfull = screenfull;
} }
})();
}(screenfull$1));
var screenfull = screenfull$1.exports; var screenfull$1 = screenfull;
var nativeScreenfull = function nativeScreenfull(art) { var nativeScreenfull = function nativeScreenfull(art) {
var notice = art.notice, var notice = art.notice,
$player = art.template.$player; $player = art.template.$player;
screenfull.on('change', function () { screenfull$1.on('change', function () {
return art.emit('fullscreen', screenfull.isFullscreen); return art.emit('fullscreen', screenfull$1.isFullscreen);
}); });
def(art, 'fullscreen', { def(art, 'fullscreen', {
get: function get() { get: function get() {
return screenfull.isFullscreen; return screenfull$1.isFullscreen;
}, },
set: function set(value) { set: function set(value) {
if (value) { if (value) {
screenfull.request($player).then(function () { screenfull$1.request($player).then(function () {
addClass($player, 'art-fullscreen'); addClass($player, 'art-fullscreen');
art.aspectRatioReset = true; art.aspectRatioReset = true;
art.autoSize = false; art.autoSize = false;
@@ -1647,7 +1613,7 @@
notice.show = ''; notice.show = '';
}); });
} else { } else {
screenfull.exit().then(function () { screenfull$1.exit().then(function () {
removeClass($player, 'art-fullscreen'); removeClass($player, 'art-fullscreen');
art.aspectRatioReset = true; art.aspectRatioReset = true;
art.autoSize = art.option.autoSize; art.autoSize = art.option.autoSize;
@@ -1686,7 +1652,7 @@
notice = art.notice, notice = art.notice,
$video = art.template.$video; $video = art.template.$video;
art.once('video:loadedmetadata', function () { art.once('video:loadedmetadata', function () {
if (screenfull.isEnabled) { if (screenfull$1.isEnabled) {
nativeScreenfull(art); nativeScreenfull(art);
} else if (document.fullscreenEnabled || $video.webkitSupportsFullscreen) { } else if (document.fullscreenEnabled || $video.webkitSupportsFullscreen) {
webkitScreenfull(art); webkitScreenfull(art);
@@ -5763,6 +5729,30 @@
} }
} }
}); });
art.on('fullscreen', function (state) {
var lastOrientation = screen.orientation.type;
if (state) {
var videoWidth = $video.videoWidth,
videoHeight = $video.videoHeight;
var _document$documentEle2 = document.documentElement,
viewWidth = _document$documentEle2.clientWidth,
viewHeight = _document$documentEle2.clientHeight;
if (videoWidth > videoHeight && viewWidth < viewHeight || videoWidth < videoHeight && viewWidth > viewHeight) {
var oppositeOrientation = lastOrientation.startsWith('portrait') ? 'landscape' : 'portrait';
screen.orientation.lock(oppositeOrientation).then(function () {
addClass($player, 'art-auto-orientation-fullscreen');
});
}
} else {
if (hasClass($player, 'art-auto-orientation-fullscreen')) {
screen.orientation.lock(lastOrientation).then(function () {
removeClass($player, 'art-auto-orientation-fullscreen');
});
}
}
});
return { return {
name: 'autoOrientation', name: 'autoOrientation',
@@ -6160,7 +6150,7 @@
}, { }, {
key: "build", key: "build",
get: function get() { get: function get() {
return '1651055373326'; return '1651062536627';
} }
}, { }, {
key: "config", key: "config",
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrMix.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMix.js","../../packages/artplayer/src/player/posterMix.js","../../packages/artplayer/src/player/autoHeightMix.js","../../packages/artplayer/src/player/themeMix.js","../../packages/artplayer/src/player/titleMix.js","../../packages/artplayer/src/player/exclusiveMix.js","../../packages/artplayer/src/player/subtitleOffsetMix.js","../../packages/artplayer/src/player/optionInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/get.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/asyncToGenerator.js","../../node_modules/_regenerator-runtime@0.13.9@regenerator-runtime/runtime.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/regenerator/index.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/Line truncated {"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrMix.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/_screenfull@6.0.1@screenfull/index.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMix.js","../../packages/artplayer/src/player/posterMix.js","../../packages/artplayer/src/player/autoHeightMix.js","../../packages/artplayer/src/player/themeMix.js","../../packages/artplayer/src/player/titleMix.js","../../packages/artplayer/src/player/exclusiveMix.js","../../packages/artplayer/src/player/subtitleOffsetMix.js","../../packages/artplayer/src/player/optionInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/get.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/helpers/esm/asyncToGenerator.js","../../node_modules/_regenerator-runtime@0.13.9@regenerator-runtime/runtime.js","../../node_modules/_@babel_runtime@7.17.9@@babel/runtime/regenerator/index.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/Line truncated
@@ -38,6 +38,29 @@ export default function autoOrientation(art) {
} }
}); });
art.on('fullscreen', (state) => {
const lastOrientation = screen.orientation.type;
if (state) {
const { videoWidth, videoHeight } = $video;
const { clientWidth: viewWidth, clientHeight: viewHeight } = document.documentElement;
if (
(videoWidth > videoHeight && viewWidth < viewHeight) ||
(videoWidth < videoHeight && viewWidth > viewHeight)
) {
const oppositeOrientation = lastOrientation.startsWith('portrait') ? 'landscape' : 'portrait';
screen.orientation.lock(oppositeOrientation).then(() => {
addClass($player, 'art-auto-orientation-fullscreen');
});
}
} else {
if (hasClass($player, 'art-auto-orientation-fullscreen')) {
screen.orientation.lock(lastOrientation).then(() => {
removeClass($player, 'art-auto-orientation-fullscreen');
});
}
}
});
return { return {
name: 'autoOrientation', name: 'autoOrientation',
get state() { get state() {