简化工具函数

This commit is contained in:
zhw2590582 committed 2019-11-22 20:50:14 +08:00
1 parent be4d1d0437
commit 1270167a3e
26 files changed
+182 -152

No files matched your search

@@ -1,4 +1,4 @@
import { setStyle, errorHandle } from '../utils';
import { setStyle, errorHandle, def } from '../utils';
export default function aspectRatioMix(art, player) {
const {
@@ -7,7 +7,7 @@ export default function aspectRatioMix(art, player) {
notice,
} = art;
Object.defineProperty(player, 'aspectRatio', {
def(player, 'aspectRatio', {
get() {
return $player.dataset.aspectRatio || '';
},
@@ -53,10 +53,10 @@ export default function aspectRatioMix(art, player) {
},
});
Object.defineProperty(player, 'aspectRatioReset', {
def(player, 'aspectRatioReset', {
set(value) {
if (value && player.aspectRatio) {
const { aspectRatio } = player
const { aspectRatio } = player;
player.aspectRatio = aspectRatio;
art.emit('aspectRatioReset');
}
@@ -1,4 +1,4 @@
import { getExt, sleep, errorHandle } from '../utils';
import { getExt, sleep, errorHandle, def } from '../utils';
export default function attachUrlMix(art, player) {
const {
@@ -6,7 +6,7 @@ export default function attachUrlMix(art, player) {
template: { $video },
} = art;
Object.defineProperty(player, 'url', {
def(player, 'url', {
get() {
return $video.src;
},
@@ -15,7 +15,7 @@ export default function attachUrlMix(art, player) {
},
});
Object.defineProperty(player, 'attachUrl', {
def(player, 'attachUrl', {
value: url =>
sleep().then(() => {
function attachUrl(videoUrl) {
+2 -2
View File
@@ -1,11 +1,11 @@
import { setStyle, addClass, removeClass, hasClass } from '../utils';
import { setStyle, addClass, removeClass, hasClass, def } from '../utils';
export default function resizeMix(art, player) {
const {
template: { $container, $player, $video },
} = art;
Object.defineProperty(player, 'autoSize', {
def(player, 'autoSize', {
get() {
return hasClass($container, 'art-auto-size');
},
@@ -1,7 +1,7 @@
import { clamp } from '../utils';
import { clamp, def } from '../utils';
export default function currentTimeMix(art, player) {
Object.defineProperty(player, 'currentTime', {
def(player, 'currentTime', {
get: () => art.template.$video.currentTime || 0,
set: currentTime => {
art.template.$video.currentTime = clamp(currentTime, 0, player.duration);
+3 -1
View File
@@ -1,5 +1,7 @@
import { def } from '../utils';
export default function durationMix(art, player) {
Object.defineProperty(player, 'duration', {
def(player, 'duration', {
get: () => art.template.$video.duration || 0,
});
}
+2 -2
View File
@@ -1,7 +1,7 @@
import { errorHandle } from '../utils';
import { errorHandle, def } from '../utils';
export default function flipMix(art, player) {
Object.defineProperty(player, 'flip', {
def(player, 'flip', {
get() {
return art.template.$player.dataset.flip;
},
@@ -1,5 +1,5 @@
import screenfull from 'screenfull';
import { addClass, removeClass } from '../utils';
import { addClass, removeClass, def } from '../utils';
export default function fullscreenMix(art, player) {
const {
@@ -26,7 +26,7 @@ export default function fullscreenMix(art, player) {
});
}
Object.defineProperty(player, 'fullscreen', {
def(player, 'fullscreen', {
get() {
return screenfull.isFullscreen;
},
@@ -60,7 +60,7 @@ export default function fullscreenMix(art, player) {
},
});
Object.defineProperty(player, 'fullscreenToggle', {
def(player, 'fullscreenToggle', {
set(value) {
if (value) {
player.fullscreen = !player.fullscreen;
@@ -68,7 +68,7 @@ export default function fullscreenMix(art, player) {
},
});
Object.defineProperty(player, 'fullscreenIsEnabled', {
def(player, 'fullscreenIsEnabled', {
get() {
return screenfull.isEnabled;
},
@@ -1,11 +1,11 @@
import { addClass, removeClass, hasClass } from '../utils';
import { addClass, removeClass, hasClass, def } from '../utils';
export default function fullscreenWebMix(art, player) {
const {
template: { $player },
} = art;
Object.defineProperty(player, 'fullscreenWeb', {
def(player, 'fullscreenWeb', {
get() {
return hasClass($player, 'art-web-fullscreen');
},
@@ -28,7 +28,7 @@ export default function fullscreenWebMix(art, player) {
},
});
Object.defineProperty(player, 'fullscreenWebToggle', {
def(player, 'fullscreenWebToggle', {
set(value) {
if (value) {
player.fullscreenWeb = !player.fullscreenWeb;
+4 -2
View File
@@ -1,10 +1,12 @@
import { def } from '../utils';
export default function seekMix(art, player) {
const { $video } = art.template;
Object.defineProperty(player, 'loaded', {
def(player, 'loaded', {
get: () => ($video.buffered.length ? $video.buffered.end($video.buffered.length - 1) / $video.duration : 0),
});
Object.defineProperty(player, 'loadedTime', {
def(player, 'loadedTime', {
get: () => ($video.buffered.length ? $video.buffered.end($video.buffered.length - 1) : 0),
});
}
+3 -1
View File
@@ -1,3 +1,5 @@
import { def } from '../utils';
export default function pauseMin(art, player) {
const {
template: { $video },
@@ -5,7 +7,7 @@ export default function pauseMin(art, player) {
notice,
} = art;
Object.defineProperty(player, 'pause', {
def(player, 'pause', {
get() {
return $video.paused;
},
+5 -5
View File
@@ -1,4 +1,4 @@
import { append, setStyle, addClass, removeClass, hasClass } from '../utils';
import { append, setStyle, addClass, removeClass, hasClass, def } from '../utils';
function nativePip(art, player) {
const {
@@ -9,7 +9,7 @@ function nativePip(art, player) {
$video.disablePictureInPicture = false;
Object.defineProperty(player, 'pip', {
def(player, 'pip', {
get() {
return document.pictureInPictureElement;
},
@@ -48,7 +48,7 @@ function webkitPip(art, player) {
$video.webkitSetPresentationMode('inline');
Object.defineProperty(player, 'pip', {
def(player, 'pip', {
get() {
return $video.webkitPresentationMode === 'picture-in-picture';
},
@@ -140,7 +140,7 @@ function customPip(art, player) {
},
};
Object.defineProperty(player, 'pip', property);
def(player, 'pip', property);
}
export default function pipMix(art, player) {
@@ -153,7 +153,7 @@ export default function pipMix(art, player) {
customPip(art, player);
}
Object.defineProperty(player, 'pipToggle', {
def(player, 'pipToggle', {
set(value) {
if (value) {
player.pip = !player.pip;
+3 -1
View File
@@ -1,3 +1,5 @@
import { def } from '../utils';
export default function playMix(art, player) {
const {
template: { $video },
@@ -6,7 +8,7 @@ export default function playMix(art, player) {
option: { mutex },
} = art;
Object.defineProperty(player, 'play', {
def(player, 'play', {
set(value) {
if (value) {
const promise = $video.play();
@@ -1,4 +1,4 @@
import { errorHandle } from '../utils';
import { errorHandle, def } from '../utils';
export default function playbackRateMix(art, player) {
const {
@@ -7,7 +7,7 @@ export default function playbackRateMix(art, player) {
notice,
} = art;
Object.defineProperty(player, 'playbackRate', {
def(player, 'playbackRate', {
get() {
return $player.dataset.playbackRate;
},
@@ -32,7 +32,7 @@ export default function playbackRateMix(art, player) {
},
});
Object.defineProperty(player, 'playbackRateReset', {
def(player, 'playbackRateReset', {
set(value) {
if (value) {
const { playbackRate } = $player.dataset;
+3 -1
View File
@@ -1,5 +1,7 @@
import { def } from '../utils';
export default function seekMix(art, player) {
Object.defineProperty(player, 'played', {
def(player, 'played', {
get: () => art.template.$video.currentTime / art.template.$video.duration,
});
}
+3 -1
View File
@@ -1,6 +1,8 @@
import { def } from '../utils';
export default function playingMix(art, player) {
const { $video } = art.template;
Object.defineProperty(player, 'playing', {
def(player, 'playing', {
get: () => !!($video.currentTime > 0 && !$video.paused && !$video.ended && $video.readyState > 2),
});
}
+6 -4
View File
@@ -1,25 +1,27 @@
import { def } from '../utils';
export default function rectMix(art, player) {
Object.defineProperty(player, 'rect', {
def(player, 'rect', {
get: () => {
return art.template.$player.getBoundingClientRect();
},
});
['bottom', 'height', 'left', 'right', 'top', 'width'].forEach(key => {
Object.defineProperty(player, key, {
def(player, key, {
get: () => {
return player.rect[key];
},
});
});
Object.defineProperty(player, 'x', {
def(player, 'x', {
get: () => {
return player.left + window.pageXOffset;
},
});
Object.defineProperty(player, 'y', {
def(player, 'y', {
get: () => {
return player.top + window.pageYOffset;
},
@@ -1,4 +1,4 @@
import { secondToTime, downloadFile } from '../utils';
import { secondToTime, downloadFile, def } from '../utils';
export default function screenshotMix(art, player) {
const {
@@ -7,7 +7,7 @@ export default function screenshotMix(art, player) {
template: { $video },
} = art;
Object.defineProperty(player, 'getScreenshotDataURL', {
def(player, 'getScreenshotDataURL', {
value: () => {
try {
const canvas = document.createElement('canvas');
@@ -22,7 +22,7 @@ export default function screenshotMix(art, player) {
},
});
Object.defineProperty(player, 'getScreenshotBlobUrl', {
def(player, 'getScreenshotBlobUrl', {
value: () =>
new Promise((resolve, reject) => {
try {
@@ -40,7 +40,7 @@ export default function screenshotMix(art, player) {
}),
});
Object.defineProperty(player, 'screenshot', {
def(player, 'screenshot', {
value: () => {
const dataUri = player.getScreenshotDataURL();
if (dataUri) {
+2 -2
View File
@@ -1,9 +1,9 @@
import { secondToTime } from '../utils';
import { secondToTime, def } from '../utils';
export default function seekMix(art, player) {
const { notice } = art;
Object.defineProperty(player, 'seek', {
def(player, 'seek', {
set(time) {
player.currentTime = time;
notice.show(`${secondToTime(time)} / ${secondToTime(player.duration)}`);
+4 -2
View File
@@ -1,7 +1,9 @@
import { def } from '../utils';
export default function switchMix(art, player) {
const { i18n, notice, option } = art;
Object.defineProperty(player, 'switchQuality', {
def(player, 'switchQuality', {
value: (url, name) => {
if (url !== player.url) {
URL.revokeObjectURL(player.url);
@@ -26,7 +28,7 @@ export default function switchMix(art, player) {
},
});
Object.defineProperty(player, 'switchUrl', {
def(player, 'switchUrl', {
value: (url, name) => {
if (url !== player.url) {
URL.revokeObjectURL(player.url);
+3 -1
View File
@@ -1,5 +1,7 @@
import { def } from '../utils';
export default function toggleMix(art, player) {
Object.defineProperty(player, 'toggle', {
def(player, 'toggle', {
set(value) {
if (value) {
if (player.playing) {
+3 -3
View File
@@ -1,4 +1,4 @@
import { clamp } from '../utils';
import { clamp, def } from '../utils';
export default function volumeMix(art, player) {
const {
@@ -8,7 +8,7 @@ export default function volumeMix(art, player) {
storage,
} = art;
Object.defineProperty(player, 'volume', {
def(player, 'volume', {
get: () => $video.volume || 0,
set: percentage => {
$video.volume = clamp(percentage, 0, 1);
@@ -20,7 +20,7 @@ export default function volumeMix(art, player) {
},
});
Object.defineProperty(player, 'muted', {
def(player, 'muted', {
get: () => $video.muted,
set: muted => {
$video.muted = muted;
+2 -2
View File
@@ -1,4 +1,4 @@
import { errorHandle, hasOwnProperty } from '../utils';
import { errorHandle, has } from '../utils';
import subtitleOffset from './subtitleOffset';
import localVideo from './localVideo';
import localSubtitle from './localSubtitle';
@@ -54,7 +54,7 @@ export default class Plugins {
pluginName = `plugin${this.id}`;
}
errorHandle(
!hasOwnProperty(this, pluginName),
!has(this, pluginName),
`Cannot add a plugin that already has the same name: ${pluginName}`,
);
Object.defineProperty(this, pluginName, {
+3 -3
View File
@@ -1,5 +1,5 @@
import { hasClass, addClass, removeClass, append, setStyle, setStyles, tooltip } from './dom';
import { hasOwnProperty, defineProperty } from './property';
import { has, def } from './property';
import { errorHandle } from './error';
export default class Component {
@@ -35,7 +35,7 @@ export default class Component {
if (!this.$parent || option.disable) return {};
this.id += 1;
const name = option.name || `${this.name}${this.id}`;
errorHandle(!hasOwnProperty(this, name), `Cannot add a component that already has the same name: ${name}`);
errorHandle(!has(this, name), `Cannot add a component that already has the same name: ${name}`);
const $ref = document.createElement('div');
$ref.classList.value = `art-${this.name} art-${this.name}-${name}`;
@@ -75,7 +75,7 @@ export default class Component {
callback($ref, this, this.art);
}
defineProperty(this, name, {
def(this, name, {
value: {
get $ref() {
return $ref;
+5 -8
View File
@@ -1,19 +1,16 @@
import { errorHandle } from './error';
const has = Object.prototype.hasOwnProperty;
export function hasOwnProperty(obj, name) {
return has.call(obj, name);
}
export const def = Object.defineProperty;
const def = Object.defineProperty;
export function defineProperty(obj, key, prop) {
return def(obj, key, prop);
const { hasOwnProperty } = Object.prototype;
export function has(obj, name) {
return hasOwnProperty.call(obj, name);
}
export function proxyPropertys(target, ...sources) {
return sources.reduce((result, source) => {
Object.getOwnPropertyNames(source).forEach(key => {
errorHandle(!hasOwnProperty(result, key), `Target attribute name is duplicated: ${key}`);
errorHandle(!has(result, key), `Target attribute name is duplicated: ${key}`);
def(result, key, Object.getOwnPropertyDescriptor(source, key));
});
return result;