x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-25 08:01:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

add Artplayer.LOG_VERSION

Browse Source
This commit is contained in:
Harvey Zack committed 2023-08-22 20:51:39 +08:00
1 parent 3179d1241e
commit 894a9db1d7
34 files changed
+182 -136
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer-vitepress/docs/advanced/global.md
+15
View File
@@ -505,4 +505,19 @@ var art = new Artplayer({
url: '/assets/sample/video.mp4',
fullscreenWeb: true,
});
```
## LOG_VERSION
设置是否打印播放器版本，默认为 `true`
<div className="run-code">▶ Run Code</div>
```js
Artplayer.LOG_VERSION = false;
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
});
```
packages/artplayer-vitepress/docs/en/advanced/global.md
+15
View File
@@ -505,4 +505,19 @@ var art = new Artplayer({
url: '/assets/sample/video.mp4',
fullscreenWeb: true,
});
```
## LOG_VERSION
设置是否打印播放器版本，默认为 `true`
<div className="run-code">▶ Run Code</div>
```js
Artplayer.LOG_VERSION = false;
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
});
```
packages/artplayer/src/control/thumbnails.js
+3 -3
View File
@@ -18,12 +18,12 @@ export default function thumbnails(options) {
function showThumbnails(event) {
const { width: posWidth } = getPosFromEvent(art, event);
const { url, number, column, width, height } = option.thumbnails;
const width2 = width || image.naturalWidth / column;
const height2 = height || width2 / ($video.videoWidth / $video.videoHeight);
const width2 = width ?? image.naturalWidth / column;
const height2 = height ?? width2 / ($video.videoWidth / $video.videoHeight);
const perWidth = $progress.clientWidth / number;
const perIndex = Math.floor(posWidth / perWidth);
const yIndex = Math.ceil(perIndex / column) - 1;
const xIndex = perIndex % column || column - 1;
const xIndex = perIndex % column ?? column - 1;
setStyle($control, 'backgroundImage', `url(${url})`);
setStyle($control, 'height', `${height2}px`);
setStyle($control, 'width', `${width2}px`);
packages/artplayer/src/control/volume.js
+1 -1
View File
@@ -22,7 +22,7 @@ export default function volume(option) {
}
function update() {
if (art.muted || art.volume === 0) {
if (art.muted ?? art.volume === 0) {
setStyle($volume, 'display', 'none');
setStyle($close, 'display', 'flex');
setStyle($indicator, 'top', '100%');
packages/artplayer/src/events/gestureInit.js
+2 -2
View File
@@ -21,7 +21,7 @@ function GetSlideDirection(startX, startY, endX, endY) {
result = 1;
} else if (angle >= -135 && angle < -45) {
result = 2;
} else if ((angle >= 135 && angle <= 180) || (angle >= -180 && angle < -135)) {
} else if ((angle >= 135 && angle <= 180) ?? (angle >= -180 && angle < -135)) {
result = 3;
}
@@ -58,7 +58,7 @@ export default function gestureInit(art, events) {
const direction = GetSlideDirection(startX, startY, pageX, pageY);
const isHorizontal = [3, 4].includes(direction);
const isVertical = [1, 2].includes(direction);
const isLegal = (isHorizontal && !art.isRotate) || (isVertical && art.isRotate);
const isLegal = (isHorizontal && !art.isRotate) ?? (isVertical && art.isRotate);
if (isLegal) {
const ratioX = clamp((pageX - startX) / art.width, -1, 1);
const ratioY = clamp((pageY - startY) / art.height, -1, 1);
packages/artplayer/src/i18n/index.js
+2 -2
View File
@@ -30,11 +30,11 @@ export default class I18n {
init() {
const lang = this.art.option.lang.toLowerCase();
this.language = this.languages[lang] || {};
this.language = this.languages[lang] ?? {};
}
get(key) {
return this.language[key] || key;
return this.language[key] ?? key;
}
update(value) {
packages/artplayer/src/index.js
+11 -6
View File
@@ -241,6 +241,7 @@ Artplayer.PLAYBACK_RATE = [0.5, 0.75, 1, 1.25, 1.5, 2];
Artplayer.ASPECT_RATIO = ['default', '4:3', '16:9'];
Artplayer.FLIP = ['normal', 'horizontal', 'vertical'];
Artplayer.FULLSCREEN_WEB_IN_BODY = false;
Artplayer.LOG_VERSION = true;
if (typeof document !== 'undefined') {
if (!document.getElementById('artplayer-style')) {
@@ -255,9 +256,13 @@ if (typeof window !== 'undefined') {
window['Artplayer'] = Artplayer;
}
console.log(
`%c ArtPlayer %c ${Artplayer.version} %c https://artplayer.org`,
'color: #fff; background: #5f5f5f',
'color: #fff; background: #4bc729',
'',
);
setTimeout(() => {
if (Artplayer.LOG_VERSION) {
console.log(
`%c ArtPlayer %c ${Artplayer.version} %c https://artplayer.org`,
'color: #fff; background: #5f5f5f',
'color: #fff; background: #4bc729',
'',
);
}
});
packages/artplayer/src/info.js
+1 -1
View File
@@ -23,7 +23,7 @@ export default class Info extends Component {
});
let timer = null;
const $types = queryAll('[data-video]', $infoPanel) || [];
const $types = queryAll('[data-video]', $infoPanel) ?? [];
this.art.on('destroy', () => clearTimeout(timer));
function loop() {
packages/artplayer/src/player/aspectRatioMix.js
+1 -1
View File
@@ -9,7 +9,7 @@ export default function aspectRatioMix(art) {
def(art, 'aspectRatio', {
get() {
return $player.dataset.aspectRatio || 'default';
return $player.dataset.aspectRatio ?? 'default';
},
set(ratio) {
if (!ratio) ratio = 'default';
packages/artplayer/src/player/currentTimeMix.js
+1 -1
View File
@@ -4,7 +4,7 @@ export default function currentTimeMix(art) {
const { $video } = art.template;
def(art, 'currentTime', {
get: () => $video.currentTime || 0,
get: () => $video.currentTime ?? 0,
set: (time) => {
time = parseFloat(time);
if (Number.isNaN(time)) return;
packages/artplayer/src/player/durationMix.js
+1 -1
View File
@@ -5,7 +5,7 @@ export default function durationMix(art) {
get: () => {
const { duration } = art.template.$video;
if (duration === Infinity) return 0;
return duration || 0;
return duration ?? 0;
},
});
}
packages/artplayer/src/player/flipMix.js
+1 -1
View File
@@ -9,7 +9,7 @@ export default function flipMix(art) {
def(art, 'flip', {
get() {
return $player.dataset.flip || 'normal';
return $player.dataset.flip ?? 'normal';
},
set(flip) {
if (!flip) flip = 'normal';
packages/artplayer/src/player/fullscreenMix.js
+1 -1
View File
@@ -53,7 +53,7 @@ export default function fullscreenMix(art) {
art.once('video:loadedmetadata', () => {
if (screenfull.isEnabled) {
nativeScreenfull(art);
} else if (document.fullscreenEnabled || $video.webkitSupportsFullscreen) {
} else if (document.fullscreenEnabled ?? $video.webkitSupportsFullscreen) {
webkitScreenfull(art);
} else {
def(art, 'fullscreen', {
packages/artplayer/src/player/loopMix.js
+1 -1
View File
@@ -22,7 +22,7 @@ export default function loopMix(art) {
art.on('video:timeupdate', () => {
if (interval.length) {
if (art.currentTime < interval[0] || art.currentTime > interval[1]) {
if (art.currentTime < interval[0] ?? art.currentTime > interval[1]) {
art.seek = interval[0];
}
}
packages/artplayer/src/player/qualityMix.js
+1 -1
View File
@@ -4,7 +4,7 @@ export default function qualityMix(art) {
def(art, 'quality', {
set(quality) {
const { controls, notice, i18n } = art;
const qualityDefault = quality.find((item) => item.default) || quality[0];
const qualityDefault = quality.find((item) => item.default) ?? quality[0];
controls.update({
name: 'quality',
position: 'right',
packages/artplayer/src/player/stateMix.js
+1 -1
View File
@@ -3,7 +3,7 @@ import { def } from '../utils';
export default function stateMix(art) {
const states = ['mini', 'pip', 'fullscreen', 'fullscreenWeb'];
def(art, 'state', {
get: () => states.find((name) => art[name]) || 'standard',
get: () => states.find((name) => art[name]) ?? 'standard',
set(name) {
for (let index = 0; index < states.length; index++) {
const prop = states[index];
packages/artplayer/src/player/urlMix.js
+1 -1
View File
@@ -13,7 +13,7 @@ export default function urlMix(art) {
async set(newUrl) {
if (newUrl) {
const oldUrl = art.url;
const typeName = option.type || getExt(newUrl);
const typeName = option.type ?? getExt(newUrl);
const typeCallback = option.customType[typeName];
if (typeName && typeCallback) {
packages/artplayer/src/player/volumeMix.js
+1 -1
View File
@@ -9,7 +9,7 @@ export default function volumeMix(art) {
} = art;
def(art, 'volume', {
get: () => $video.volume || 0,
get: () => $video.volume ?? 0,
set: (percentage) => {
$video.volume = clamp(percentage, 0, 1);
notice.show = `${i18n.get('Volume')}: ${parseInt($video.volume * 100, 10)}`;
packages/artplayer/src/plugins/autoOrientation.js
+2 -2
View File
@@ -11,7 +11,7 @@ export default function autoOrientation(art) {
const { videoWidth, videoHeight } = $video;
const { clientWidth: viewWidth, clientHeight: viewHeight } = document.documentElement;
if (
(videoWidth > videoHeight && viewWidth < viewHeight) ||
(videoWidth > videoHeight && viewWidth < viewHeight) ??
(videoWidth < videoHeight && viewWidth > viewHeight)
) {
// There is a conflict with the fullscreen event, and it is changed to asynchronous execution
@@ -40,7 +40,7 @@ export default function autoOrientation(art) {
const { videoWidth, videoHeight } = $video;
const { clientWidth: viewWidth, clientHeight: viewHeight } = document.documentElement;
if (
(videoWidth > videoHeight && viewWidth < viewHeight) ||
(videoWidth > videoHeight && viewWidth < viewHeight) ??
(videoWidth < videoHeight && viewWidth > viewHeight)
) {
const oppositeOrientation = lastOrientation.startsWith('portrait') ? 'landscape' : 'portrait';
packages/artplayer/src/plugins/autoPlayback.js
+6 -6
View File
@@ -25,19 +25,19 @@ export default function autoPlayback(art) {
art.on('video:timeupdate', () => {
if (art.playing) {
const times = storage.get('times') || {};
const times = storage.get('times') ?? {};
const keys = Object.keys(times);
if (keys.length > constructor.AUTO_PLAYBACK_MAX) {
delete times[keys[0]];
}
times[art.option.id || art.option.url] = art.currentTime;
times[art.option.id ?? art.option.url] = art.currentTime;
storage.set('times', times);
}
});
art.on('ready', () => {
const times = storage.get('times') || {};
const currentTime = times[art.option.id || art.option.url];
const times = storage.get('times') ?? {};
const currentTime = times[art.option.id ?? art.option.url];
if (currentTime && currentTime >= constructor.AUTO_PLAYBACK_MIN) {
append($close, icons.close);
setStyle($autoPlayback, 'display', 'flex');
@@ -67,13 +67,13 @@ export default function autoPlayback(art) {
return {
name: 'auto-playback',
get times() {
return storage.get('times') || {};
return storage.get('times') ?? {};
},
clear() {
return storage.del('times');
},
delete(id) {
const times = storage.get('times') || {};
const times = storage.get('times') ?? {};
delete times[id];
storage.set('times', times);
return times;
packages/artplayer/src/plugins/index.js
+1 -1
View File
@@ -40,7 +40,7 @@ export default class Plugins {
add(plugin) {
this.id += 1;
const result = plugin.call(this.art, this.art);
const pluginName = (result && result.name) || plugin.name || `plugin${this.id}`;
const pluginName = (result && result.name) ?? plugin.name ?? `plugin${this.id}`;
errorHandle(!has(this, pluginName), `Cannot add a plugin that already has the same name: ${pluginName}`);
def(this, pluginName, {
value: result,
packages/artplayer/src/scheme/index.js
+1 -1
View File
@@ -9,7 +9,7 @@ const f = 'function';
function validElement(value, type, paths) {
return errorHandle(
type === s || type === n || value instanceof Element,
type === s ?? type === n ?? value instanceof Element,
`${paths.join('.')} require '${s}' or 'Element' type`,
);
}
packages/artplayer/src/setting/index.js
+13 -13
View File
@@ -60,7 +60,7 @@ export default class Setting extends Component {
const item = option[index];
item.$parentItem = parentItem;
item.$parentList = parentList;
Setting.makeRecursion(item.selector || [], item, option);
Setting.makeRecursion(item.selector ?? [], item, option);
}
return option;
}
@@ -111,7 +111,7 @@ export default class Setting extends Component {
if (item.name === name) {
return item;
} else {
const result = this.find(name, item.selector || []);
const result = this.find(name, item.selector ?? []);
if (result) return result;
}
}
@@ -120,7 +120,7 @@ export default class Setting extends Component {
remove(name) {
const item = this.find(name);
errorHandle(item, `Can't find [${name}] from the [setting]`);
const parent = item.$parentItem?.selector || this.option;
const parent = item.$parentItem?.selector ?? this.option;
parent.splice(parent.indexOf(item), 1);
this.option = Setting.makeRecursion(this.option);
this.destroy();
@@ -190,13 +190,13 @@ export default class Setting extends Component {
switch (type) {
case 'switch':
case 'range':
append($icon, isStringOrNumber(item.icon) || item.icon instanceof Element ? item.icon : icons.config);
append($icon, isStringOrNumber(item.icon) ?? item.icon instanceof Element ? item.icon : icons.config);
break;
case 'selector':
if (item.selector && item.selector.length) {
append(
$icon,
isStringOrNumber(item.icon) || item.icon instanceof Element ? item.icon : icons.config,
isStringOrNumber(item.icon) ?? item.icon instanceof Element ? item.icon : icons.config,
);
} else {
append($icon, icons.check);
@@ -223,7 +223,7 @@ export default class Setting extends Component {
const $html = createElement('div');
addClass($html, 'art-setting-item-left-text');
append($html, item.html || '');
append($html, item.html ?? '');
append($left, $html);
item.$html = $html;
@@ -241,7 +241,7 @@ export default class Setting extends Component {
const $tooltip = createElement('div');
addClass($tooltip, 'art-setting-item-right-tooltip');
append($tooltip, item.tooltip || '');
append($tooltip, item.tooltip ?? '');
append($right, $tooltip);
item.$tooltip = $tooltip;
@@ -290,10 +290,10 @@ export default class Setting extends Component {
const $state = createElement('div');
addClass($state, 'art-setting-item-right-icon');
const $range = append($state, '<input type="range">');
$range.value = item.range[0] || 0;
$range.min = item.range[1] || 0;
$range.max = item.range[2] || 10;
$range.step = item.range[3] || 1;
$range.value = item.range[0] ?? 0;
$range.min = item.range[1] ?? 0;
$range.max = item.range[2] ?? 10;
$range.step = item.range[3] ?? 1;
addClass($range, 'art-setting-range');
append($right, $state);
item.$range = $range;
@@ -398,7 +398,7 @@ export default class Setting extends Component {
} = this.art;
if (controls.setting && !isMobile) {
const settingWidth = width || constructor.SETTING_WIDTH;
const settingWidth = width ?? constructor.SETTING_WIDTH;
const { left: controlLeft, width: controlWidth } = controls.setting.getBoundingClientRect();
const { left: playerLeft, width: playerWidth } = $player.getBoundingClientRect();
const settingLeft = controlLeft - playerLeft + controlWidth / 2 - settingWidth / 2;
@@ -424,7 +424,7 @@ export default class Setting extends Component {
} else {
const $panel = createElement('div');
addClass($panel, 'art-setting-panel');
$panel.dataset.width = width || constructor.SETTING_WIDTH;
$panel.dataset.width = width ?? constructor.SETTING_WIDTH;
$panel.dataset.height = option.length * constructor.SETTING_ITEM_HEIGHT;
if (option[0] && option[0].$parentItem) {
packages/artplayer/src/storage.js
+1 -1
View File
@@ -6,7 +6,7 @@ export default class Storage {
get(key) {
try {
const storage = JSON.parse(window.localStorage.getItem(this.name)) || {};
const storage = JSON.parse(window.localStorage.getItem(this.name)) ?? {};
return key ? storage[key] : storage;
} catch (error) {
return key ? this.settings[key] : this.settings;
packages/artplayer/src/subtitle.js
+2 -1
View File
@@ -117,7 +117,7 @@ export default class Subtitle extends Component {
const decoder = new TextDecoder(subtitleOption.encoding);
const text = decoder.decode(buffer);
this.art.emit('subtitleLoad', subtitleOption.url);
switch (subtitleOption.type || getExt(subtitleOption.url)) {
switch (subtitleOption.type ?? getExt(subtitleOption.url)) {
case 'srt': {
const vtt = srtToVtt(text);
const vttNew = subtitleOption.onVttLoad(vtt);
@@ -145,6 +145,7 @@ export default class Subtitle extends Component {
return subUrl;
})
.catch((err) => {
$subtitle.innerHTML = '';
notice.show = err;
throw err;
});
packages/artplayer/src/utils/compatibility.js
+2 -2
View File
@@ -4,5 +4,5 @@ export const isWechat = /MicroMessenger/i.test(userAgent);
export const isIE = /MSIE|Trident/i.test(userAgent);
export const isAndroid = /android/i.test(userAgent);
export const isIOS = /iPad|iPhone|iPod/i.test(userAgent) && !window.MSStream;
export const isIOS13 = isIOS || (userAgent.includes('Macintosh') && navigator.maxTouchPoints >= 1);
export const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent) || isIOS13;
export const isIOS13 = isIOS ?? (userAgent.includes('Macintosh') && navigator.maxTouchPoints >= 1);
export const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent) ?? isIOS13;
packages/artplayer/src/utils/component.js
+6 -6
View File
@@ -46,10 +46,10 @@ export default class Component {
add(getOption) {
const option = typeof getOption === 'function' ? getOption(this.art) : getOption;
option.html = option.html || '';
option.html = option.html ?? '';
validator(option, ComponentOption);
if (!this.$parent || !this.name || option.disable) return;
const name = option.name || `${this.name}${this.id}`;
if (!this.$parent ?? !this.name ?? option.disable) return;
const name = option.name ?? `${this.name}${this.id}`;
const item = this.cache.get(name);
errorHandle(!item, `Can't add an existing [${name}] to the [${this.name}]`);
@@ -59,7 +59,7 @@ export default class Component {
addClass($ref, `art-${this.name}-${name}`);
const childs = Array.from(this.$parent.children);
$ref.dataset.index = option.index || this.id;
$ref.dataset.index = option.index ?? this.id;
const nextChild = childs.find((item) => Number(item.dataset.index) >= Number($ref.dataset.index));
if (nextChild) {
nextChild.insertAdjacentElement('beforebegin', $ref);
@@ -135,12 +135,12 @@ export default class Component {
hover($ref, setLeft);
const destroyEvent = proxy($list, 'click', async (event) => {
const path = event.composedPath() || [];
const path = event.composedPath() ?? [];
const $item = path.find((item) => hasClass(item, 'art-selector-item'));
if (!$item) return;
inverseClass($item, 'art-current');
const index = Number($item.dataset.index);
const find = option.selector[index] || {};
const find = option.selector[index] ?? {};
$value.innerText = $item.innerText;
if (option.onSelect) {
const result = await option.onSelect.call(this.art, find, $item, event);
packages/artplayer/src/utils/dom.js
+3 -3
View File
@@ -26,7 +26,7 @@ export function append(parent, child) {
} else {
parent.insertAdjacentHTML('beforeend', String(child));
}
return parent.lastElementChild || parent.lastChild;
return parent.lastElementChild ?? parent.lastChild;
}
export function remove(child) {
@@ -68,8 +68,8 @@ export function tooltip(target, msg, pos = 'top') {
export function isInViewport(el, offset = 0) {
const rect = el.getBoundingClientRect();
const windowHeight = window.innerHeight || document.documentElement.clientHeight;
const windowWidth = window.innerWidth || document.documentElement.clientWidth;
const windowHeight = window.innerHeight ?? document.documentElement.clientHeight;
const windowWidth = window.innerWidth ?? document.documentElement.clientWidth;
const vertInView = rect.top - offset <= windowHeight && rect.top + rect.height + offset >= 0;
const horInView = rect.left - offset <= windowWidth + offset && rect.left + rect.width + offset >= 0;
return vertInView && horInView;
packages/artplayer/src/utils/emitter.js
+4 -4
View File
@@ -1,7 +1,7 @@
export default class Emitter {
on(name, fn, ctx) {
const e = this.e || (this.e = {});
(e[name] || (e[name] = [])).push({ fn, ctx });
const e = this.e ?? (this.e = {});
(e[name] ?? (e[name] = [])).push({ fn, ctx });
return this;
}
@@ -16,7 +16,7 @@ export default class Emitter {
}
emit(name, ...data) {
const evtArr = ((this.e || (this.e = {}))[name] || []).slice();
const evtArr = ((this.e ?? (this.e = {}))[name] ?? []).slice();
for (let i = 0; i < evtArr.length; i += 1) {
evtArr[i].fn.apply(evtArr[i].ctx, data);
}
@@ -24,7 +24,7 @@ export default class Emitter {
}
off(name, callback) {
const e = this.e || (this.e = {});
const e = this.e ?? (this.e = {});
const evts = e[name];
const liveEvents = [];
if (evts && callback) {
packages/artplayer/src/utils/error.js
+1 -1
View File
@@ -2,7 +2,7 @@ export class ArtPlayerError extends Error {
constructor(message, context) {
super(message);
if (typeof Error.captureStackTrace === 'function') {
Error.captureStackTrace(this, context || this.constructor);
Error.captureStackTrace(this, context ?? this.constructor);
}
this.name = 'ArtPlayerError';
}
packages/artplayer/src/utils/format.js
+2 -1
View File
@@ -11,6 +11,7 @@ export function isStringOrNumber(val) {
}
export function secondToTime(second) {
if (!second) return '00:00';
const add0 = (num) => (num < 10 ? `0${num}` : String(num));
const hour = Math.floor(second / 3600);
const min = Math.floor((second - hour * 3600) / 60);
@@ -28,6 +29,6 @@ export function escape(str) {
'>': '&gt;',
"'": '&#39;',
'"': '&quot;',
}[tag] || tag),
}[tag] ?? tag),
);
}