mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-24 14:41:20 -08:00
update
This commit is contained in:
1 parent
dabfb2b8c8
commit
fedbf3b6f7
10 files changed
+1
-480
No files matched your search
Vendored
-5
@@ -222,11 +222,6 @@ type Option = {
|
|||||||
*/
|
*/
|
||||||
flip?: boolean;
|
flip?: boolean;
|
||||||
|
|
||||||
/**
|
|
||||||
* Whether show video rotate button
|
|
||||||
*/
|
|
||||||
rotate?: boolean;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Whether show video playback rate button
|
* Whether show video playback rate button
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -721,7 +721,6 @@
|
|||||||
autoMini: b,
|
autoMini: b,
|
||||||
loop: b,
|
loop: b,
|
||||||
flip: b,
|
flip: b,
|
||||||
rotate: b,
|
|
||||||
playbackRate: b,
|
playbackRate: b,
|
||||||
aspectRatio: b,
|
aspectRatio: b,
|
||||||
screenshot: b,
|
screenshot: b,
|
||||||
@@ -2087,85 +2086,6 @@
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function rotateMix(art) {
|
|
||||||
var _art$template = art.template,
|
|
||||||
$video = _art$template.$video,
|
|
||||||
$player = _art$template.$player,
|
|
||||||
i18n = art.i18n,
|
|
||||||
notice = art.notice;
|
|
||||||
def(art, 'rotate', {
|
|
||||||
get: function get() {
|
|
||||||
return Number($player.dataset.rotate) || 0;
|
|
||||||
},
|
|
||||||
set: function set(deg) {
|
|
||||||
if (!deg) deg = 0;
|
|
||||||
var degList = [-270, -180, -90, 0, 90, 180, 270];
|
|
||||||
errorHandle(degList.includes(deg), "'rotate' only accept ".concat(degList.toString(), " as parameters"));
|
|
||||||
|
|
||||||
if (deg === 0) {
|
|
||||||
delete $player.dataset.rotate;
|
|
||||||
setStyle($video, 'transform', null);
|
|
||||||
} else {
|
|
||||||
art.flip = false;
|
|
||||||
art.autoSize = true;
|
|
||||||
$player.dataset.rotate = deg;
|
|
||||||
|
|
||||||
var getScaleValue = function getScaleValue() {
|
|
||||||
var videoWidth = $video.videoWidth,
|
|
||||||
videoHeight = $video.videoHeight;
|
|
||||||
return videoWidth > videoHeight ? videoHeight / videoWidth : videoWidth / videoHeight;
|
|
||||||
};
|
|
||||||
|
|
||||||
var degValue = 0;
|
|
||||||
var scaleValue = 1;
|
|
||||||
|
|
||||||
switch (deg) {
|
|
||||||
case -270:
|
|
||||||
degValue = 90;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
|
|
||||||
case -180:
|
|
||||||
degValue = 180;
|
|
||||||
break;
|
|
||||||
|
|
||||||
case -90:
|
|
||||||
degValue = 270;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
|
|
||||||
case 90:
|
|
||||||
degValue = 90;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
|
|
||||||
case 180:
|
|
||||||
degValue = 180;
|
|
||||||
break;
|
|
||||||
|
|
||||||
case 270:
|
|
||||||
degValue = 270;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
setStyle($video, 'transform', "rotate(".concat(degValue, "deg) scale(").concat(scaleValue, ")"));
|
|
||||||
}
|
|
||||||
|
|
||||||
notice.show = "".concat(i18n.get('Rotate'), ": ").concat(deg, "\xB0");
|
|
||||||
art.emit('rotate', deg);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
def(art, 'rotateReset', {
|
|
||||||
set: function set(value) {
|
|
||||||
if (value && art.rotate) {
|
|
||||||
var rotate = art.rotate;
|
|
||||||
art.rotate = rotate;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function posterMix(art) {
|
function posterMix(art) {
|
||||||
var option = art.option,
|
var option = art.option,
|
||||||
$poster = art.template.$poster;
|
$poster = art.template.$poster;
|
||||||
@@ -2499,7 +2419,6 @@
|
|||||||
flipMix(art);
|
flipMix(art);
|
||||||
miniMix(art);
|
miniMix(art);
|
||||||
loopMix(art);
|
loopMix(art);
|
||||||
rotateMix(art);
|
|
||||||
posterMix(art);
|
posterMix(art);
|
||||||
autoHeightMix(art);
|
autoHeightMix(art);
|
||||||
themeMix(art);
|
themeMix(art);
|
||||||
@@ -4650,141 +4569,6 @@
|
|||||||
return Storage;
|
return Storage;
|
||||||
}();
|
}();
|
||||||
|
|
||||||
function localVideo(art) {
|
|
||||||
var proxy = art.events.proxy,
|
|
||||||
_art$template = art.template,
|
|
||||||
$video = _art$template.$video,
|
|
||||||
$player = _art$template.$player,
|
|
||||||
option = art.option,
|
|
||||||
setting = art.setting,
|
|
||||||
i18n = art.i18n;
|
|
||||||
|
|
||||||
function loadVideo(file) {
|
|
||||||
if (file) {
|
|
||||||
var canPlayType = $video.canPlayType(file.type);
|
|
||||||
|
|
||||||
if (canPlayType === 'maybe' || canPlayType === 'probably') {
|
|
||||||
var url = URL.createObjectURL(file);
|
|
||||||
option.title = file.name;
|
|
||||||
art.switchUrl(url, file.name);
|
|
||||||
art.emit('localVideo', file);
|
|
||||||
} else {
|
|
||||||
errorHandle(false, 'Playback of this file format is not supported');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
proxy($player, 'dragover', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
});
|
|
||||||
proxy($player, 'drop', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
var file = event.dataTransfer.files[0];
|
|
||||||
loadVideo(file);
|
|
||||||
});
|
|
||||||
|
|
||||||
function attach(target) {
|
|
||||||
var $input = append(target, '<input type="file">');
|
|
||||||
setStyle(target, 'position', 'relative');
|
|
||||||
setStyles($input, {
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
left: '0',
|
|
||||||
top: '0',
|
|
||||||
opacity: '0'
|
|
||||||
});
|
|
||||||
proxy($input, 'change', function () {
|
|
||||||
var file = $input.files[0];
|
|
||||||
loadVideo(file);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
art.once('ready', function () {
|
|
||||||
setting.add({
|
|
||||||
title: 'Local Video',
|
|
||||||
name: 'localVideo',
|
|
||||||
index: 30,
|
|
||||||
html: "\n <div class=\"art-setting-header\">\n ".concat(i18n.get('Local Video'), "\n </div>\n <div class=\"art-setting-upload\">\n <div class=\"art-upload-btn\">").concat(i18n.get('Open'), "</div>\n <div class=\"art-upload-value\"></div>\n </div>\n "),
|
|
||||||
mounted: function mounted($setting) {
|
|
||||||
var $btn = query('.art-upload-btn', $setting);
|
|
||||||
var $value = query('.art-upload-value', $setting);
|
|
||||||
art.on('localVideo', function (file) {
|
|
||||||
$value.textContent = file.name;
|
|
||||||
$value.title = file.name;
|
|
||||||
});
|
|
||||||
attach($btn);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
return {
|
|
||||||
name: 'localVideo',
|
|
||||||
attach: attach
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function localSubtitle(art) {
|
|
||||||
var proxy = art.events.proxy,
|
|
||||||
subtitle = art.subtitle,
|
|
||||||
setting = art.setting,
|
|
||||||
i18n = art.i18n;
|
|
||||||
|
|
||||||
function loadSubtitle(file) {
|
|
||||||
if (file) {
|
|
||||||
var type = getExt(file.name);
|
|
||||||
|
|
||||||
if (['ass', 'vtt', 'srt'].includes(type)) {
|
|
||||||
subtitle.switch(URL.createObjectURL(file), {
|
|
||||||
name: file.name,
|
|
||||||
ext: type
|
|
||||||
});
|
|
||||||
art.emit('localSubtitle', file);
|
|
||||||
} else {
|
|
||||||
errorHandle(false, 'Only supports subtitle files in .ass, .vtt and .srt format');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function attach(target) {
|
|
||||||
var $input = append(target, '<input type="file">');
|
|
||||||
setStyle(target, 'position', 'relative');
|
|
||||||
setStyles($input, {
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
left: '0',
|
|
||||||
top: '0',
|
|
||||||
opacity: '0'
|
|
||||||
});
|
|
||||||
proxy($input, 'change', function () {
|
|
||||||
var file = $input.files[0];
|
|
||||||
loadSubtitle(file);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
art.once('ready', function () {
|
|
||||||
setting.add({
|
|
||||||
title: 'Local Subtitle',
|
|
||||||
name: 'localSubtitle',
|
|
||||||
index: 40,
|
|
||||||
html: "\n <div class=\"art-setting-header\">\n ".concat(i18n.get('Local Subtitle'), "\n </div>\n <div class=\"art-setting-upload\">\n <div class=\"art-upload-btn\">").concat(i18n.get('Open'), "</div>\n <div class=\"art-upload-value\"></div>\n </div>\n "),
|
|
||||||
mounted: function mounted($setting) {
|
|
||||||
var $btn = query('.art-upload-btn', $setting);
|
|
||||||
var $value = query('.art-upload-value', $setting);
|
|
||||||
art.on('localSubtitle', function (file) {
|
|
||||||
$value.textContent = file.name;
|
|
||||||
$value.title = file.name;
|
|
||||||
});
|
|
||||||
attach($btn);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
return {
|
|
||||||
name: 'localSubtitle',
|
|
||||||
attach: attach
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function miniProgressBar(art) {
|
function miniProgressBar(art) {
|
||||||
var layers = art.layers;
|
var layers = art.layers;
|
||||||
layers.add({
|
layers.add({
|
||||||
@@ -4827,14 +4611,6 @@
|
|||||||
this.add(miniProgressBar);
|
this.add(miniProgressBar);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (option.localVideo) {
|
|
||||||
this.add(localVideo);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (option.localSubtitle) {
|
|
||||||
this.add(localSubtitle);
|
|
||||||
}
|
|
||||||
|
|
||||||
for (var index = 0; index < option.plugins.length; index++) {
|
for (var index = 0; index < option.plugins.length; index++) {
|
||||||
this.add(option.plugins[index]);
|
this.add(option.plugins[index]);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@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/rotateMix.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.16.3@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/contrLine truncated
|
{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.16.3@@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.16.3@@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.16.3@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.16.3@@babel/runtime/helpers/esm/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/control/time.js","../../packages/artplayer/src/control/vLine truncated
|
||||||
@@ -22,7 +22,6 @@ import rectMix from './rectMix';
|
|||||||
import flipMix from './flipMix';
|
import flipMix from './flipMix';
|
||||||
import miniMix from './miniMix';
|
import miniMix from './miniMix';
|
||||||
import loopMix from './loopMix';
|
import loopMix from './loopMix';
|
||||||
import rotateMix from './rotateMix';
|
|
||||||
import posterMix from './posterMix';
|
import posterMix from './posterMix';
|
||||||
import autoHeightMix from './autoHeightMix';
|
import autoHeightMix from './autoHeightMix';
|
||||||
import themeMix from './themeMix';
|
import themeMix from './themeMix';
|
||||||
@@ -58,7 +57,6 @@ export default class Player {
|
|||||||
flipMix(art);
|
flipMix(art);
|
||||||
miniMix(art);
|
miniMix(art);
|
||||||
loopMix(art);
|
loopMix(art);
|
||||||
rotateMix(art);
|
|
||||||
posterMix(art);
|
posterMix(art);
|
||||||
autoHeightMix(art);
|
autoHeightMix(art);
|
||||||
themeMix(art);
|
themeMix(art);
|
||||||
|
|||||||
@@ -1,76 +0,0 @@
|
|||||||
import { setStyle, errorHandle, def } from '../utils';
|
|
||||||
|
|
||||||
export default function rotateMix(art) {
|
|
||||||
const {
|
|
||||||
template: { $video, $player },
|
|
||||||
i18n,
|
|
||||||
notice,
|
|
||||||
} = art;
|
|
||||||
|
|
||||||
def(art, 'rotate', {
|
|
||||||
get: () => Number($player.dataset.rotate) || 0,
|
|
||||||
set: (deg) => {
|
|
||||||
if (!deg) deg = 0;
|
|
||||||
|
|
||||||
const degList = [-270, -180, -90, 0, 90, 180, 270];
|
|
||||||
errorHandle(degList.includes(deg), `'rotate' only accept ${degList.toString()} as parameters`);
|
|
||||||
|
|
||||||
if (deg === 0) {
|
|
||||||
delete $player.dataset.rotate;
|
|
||||||
setStyle($video, 'transform', null);
|
|
||||||
} else {
|
|
||||||
art.flip = false;
|
|
||||||
art.autoSize = true;
|
|
||||||
$player.dataset.rotate = deg;
|
|
||||||
|
|
||||||
const getScaleValue = () => {
|
|
||||||
const { videoWidth, videoHeight } = $video;
|
|
||||||
return videoWidth > videoHeight ? videoHeight / videoWidth : videoWidth / videoHeight;
|
|
||||||
};
|
|
||||||
|
|
||||||
let degValue = 0;
|
|
||||||
let scaleValue = 1;
|
|
||||||
switch (deg) {
|
|
||||||
case -270:
|
|
||||||
degValue = 90;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
case -180:
|
|
||||||
degValue = 180;
|
|
||||||
break;
|
|
||||||
case -90:
|
|
||||||
degValue = 270;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
case 90:
|
|
||||||
degValue = 90;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
case 180:
|
|
||||||
degValue = 180;
|
|
||||||
break;
|
|
||||||
case 270:
|
|
||||||
degValue = 270;
|
|
||||||
scaleValue = getScaleValue();
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
setStyle($video, 'transform', `rotate(${degValue}deg) scale(${scaleValue})`);
|
|
||||||
}
|
|
||||||
|
|
||||||
notice.show = `${i18n.get('Rotate')}: ${deg}°`;
|
|
||||||
art.emit('rotate', deg);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
def(art, 'rotateReset', {
|
|
||||||
set(value) {
|
|
||||||
if (value && art.rotate) {
|
|
||||||
const { rotate } = art;
|
|
||||||
art.rotate = rotate;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
@@ -1,6 +1,4 @@
|
|||||||
import { errorHandle, has, def } from '../utils';
|
import { errorHandle, has, def } from '../utils';
|
||||||
import localVideo from './localVideo';
|
|
||||||
import localSubtitle from './localSubtitle';
|
|
||||||
import miniProgressBar from './miniProgressBar';
|
import miniProgressBar from './miniProgressBar';
|
||||||
|
|
||||||
export default class Plugins {
|
export default class Plugins {
|
||||||
@@ -14,14 +12,6 @@ export default class Plugins {
|
|||||||
this.add(miniProgressBar);
|
this.add(miniProgressBar);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (option.localVideo) {
|
|
||||||
this.add(localVideo);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (option.localSubtitle) {
|
|
||||||
this.add(localSubtitle);
|
|
||||||
}
|
|
||||||
|
|
||||||
for (let index = 0; index < option.plugins.length; index++) {
|
for (let index = 0; index < option.plugins.length; index++) {
|
||||||
this.add(option.plugins[index]);
|
this.add(option.plugins[index]);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,73 +0,0 @@
|
|||||||
import { query, append, setStyle, setStyles, errorHandle, getExt } from '../utils';
|
|
||||||
|
|
||||||
export default function localSubtitle(art) {
|
|
||||||
const {
|
|
||||||
events: { proxy },
|
|
||||||
subtitle,
|
|
||||||
setting,
|
|
||||||
i18n,
|
|
||||||
} = art;
|
|
||||||
|
|
||||||
function loadSubtitle(file) {
|
|
||||||
if (file) {
|
|
||||||
const type = getExt(file.name);
|
|
||||||
if (['ass', 'vtt', 'srt'].includes(type)) {
|
|
||||||
subtitle.switch(URL.createObjectURL(file), {
|
|
||||||
name: file.name,
|
|
||||||
ext: type,
|
|
||||||
});
|
|
||||||
art.emit('localSubtitle', file);
|
|
||||||
} else {
|
|
||||||
errorHandle(false, 'Only supports subtitle files in .ass, .vtt and .srt format');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function attach(target) {
|
|
||||||
const $input = append(target, '<input type="file">');
|
|
||||||
setStyle(target, 'position', 'relative');
|
|
||||||
setStyles($input, {
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
left: '0',
|
|
||||||
top: '0',
|
|
||||||
opacity: '0',
|
|
||||||
});
|
|
||||||
proxy($input, 'change', () => {
|
|
||||||
const file = $input.files[0];
|
|
||||||
loadSubtitle(file);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
art.once('ready', () => {
|
|
||||||
setting.add({
|
|
||||||
title: 'Local Subtitle',
|
|
||||||
name: 'localSubtitle',
|
|
||||||
index: 40,
|
|
||||||
html: `
|
|
||||||
<div class="art-setting-header">
|
|
||||||
${i18n.get('Local Subtitle')}
|
|
||||||
</div>
|
|
||||||
<div class="art-setting-upload">
|
|
||||||
<div class="art-upload-btn">${i18n.get('Open')}</div>
|
|
||||||
<div class="art-upload-value"></div>
|
|
||||||
</div>
|
|
||||||
`,
|
|
||||||
mounted: ($setting) => {
|
|
||||||
const $btn = query('.art-upload-btn', $setting);
|
|
||||||
const $value = query('.art-upload-value', $setting);
|
|
||||||
art.on('localSubtitle', (file) => {
|
|
||||||
$value.textContent = file.name;
|
|
||||||
$value.title = file.name;
|
|
||||||
});
|
|
||||||
attach($btn);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
name: 'localSubtitle',
|
|
||||||
attach,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
@@ -1,83 +0,0 @@
|
|||||||
import { append, query, setStyle, setStyles, errorHandle } from '../utils';
|
|
||||||
|
|
||||||
export default function localVideo(art) {
|
|
||||||
const {
|
|
||||||
events: { proxy },
|
|
||||||
template: { $video, $player },
|
|
||||||
option,
|
|
||||||
setting,
|
|
||||||
i18n,
|
|
||||||
} = art;
|
|
||||||
|
|
||||||
function loadVideo(file) {
|
|
||||||
if (file) {
|
|
||||||
const canPlayType = $video.canPlayType(file.type);
|
|
||||||
if (canPlayType === 'maybe' || canPlayType === 'probably') {
|
|
||||||
const url = URL.createObjectURL(file);
|
|
||||||
option.title = file.name;
|
|
||||||
art.switchUrl(url, file.name);
|
|
||||||
art.emit('localVideo', file);
|
|
||||||
} else {
|
|
||||||
errorHandle(false, 'Playback of this file format is not supported');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
proxy($player, 'dragover', (event) => {
|
|
||||||
event.preventDefault();
|
|
||||||
});
|
|
||||||
|
|
||||||
proxy($player, 'drop', (event) => {
|
|
||||||
event.preventDefault();
|
|
||||||
const file = event.dataTransfer.files[0];
|
|
||||||
loadVideo(file);
|
|
||||||
});
|
|
||||||
|
|
||||||
function attach(target) {
|
|
||||||
const $input = append(target, '<input type="file">');
|
|
||||||
setStyle(target, 'position', 'relative');
|
|
||||||
setStyles($input, {
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
left: '0',
|
|
||||||
top: '0',
|
|
||||||
opacity: '0',
|
|
||||||
});
|
|
||||||
proxy($input, 'change', () => {
|
|
||||||
const file = $input.files[0];
|
|
||||||
loadVideo(file);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
art.once('ready', () => {
|
|
||||||
setting.add({
|
|
||||||
title: 'Local Video',
|
|
||||||
name: 'localVideo',
|
|
||||||
index: 30,
|
|
||||||
html: `
|
|
||||||
<div class="art-setting-header">
|
|
||||||
${i18n.get('Local Video')}
|
|
||||||
</div>
|
|
||||||
<div class="art-setting-upload">
|
|
||||||
<div class="art-upload-btn">${i18n.get('Open')}</div>
|
|
||||||
<div class="art-upload-value"></div>
|
|
||||||
</div>
|
|
||||||
`,
|
|
||||||
mounted: ($setting) => {
|
|
||||||
const $btn = query('.art-upload-btn', $setting);
|
|
||||||
const $value = query('.art-upload-value', $setting);
|
|
||||||
art.on('localVideo', (file) => {
|
|
||||||
$value.textContent = file.name;
|
|
||||||
$value.title = file.name;
|
|
||||||
});
|
|
||||||
attach($btn);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
name: 'localVideo',
|
|
||||||
attach,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
@@ -41,7 +41,6 @@ export default {
|
|||||||
autoMini: b,
|
autoMini: b,
|
||||||
loop: b,
|
loop: b,
|
||||||
flip: b,
|
flip: b,
|
||||||
rotate: b,
|
|
||||||
playbackRate: b,
|
playbackRate: b,
|
||||||
aspectRatio: b,
|
aspectRatio: b,
|
||||||
screenshot: b,
|
screenshot: b,
|
||||||
|
|||||||
-5
@@ -222,11 +222,6 @@ type Option = {
|
|||||||
*/
|
*/
|
||||||
flip?: boolean;
|
flip?: boolean;
|
||||||
|
|
||||||
/**
|
|
||||||
* Whether show video rotate button
|
|
||||||
*/
|
|
||||||
rotate?: boolean;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Whether show video playback rate button
|
* Whether show video playback rate button
|
||||||
*/
|
*/
|
||||||
|
|||||||
Reference in new issue
Block a user