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

remove player object

Browse Source
This commit is contained in:
zhw2590582 committed 2022-01-07 17:38:10 +08:00
1 parent 59a8ccce81
commit 59400eb3bf
58 files changed
+295 -313
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/control/fullscreen.js
+1 -2
View File
@@ -9,13 +9,12 @@ export default function fullscreen(option) {
events: { proxy },
icons,
i18n,
player,
} = art;
append($control, icons.fullscreen);
proxy($control, 'click', () => {
player.fullscreen = !player.fullscreen;
art.fullscreen = !art.fullscreen;
});
art.on('fullscreen', (value) => {
packages/artplayer/src/control/fullscreenWeb.js
+1 -2
View File
@@ -9,13 +9,12 @@ export default function fullscreenWeb(option) {
events: { proxy },
icons,
i18n,
player,
} = art;
append($control, icons.fullscreenWeb);
proxy($control, 'click', () => {
player.fullscreenWeb = !player.fullscreenWeb;
art.fullscreenWeb = !art.fullscreenWeb;
});
art.on('fullscreenWeb', (value) => {
packages/artplayer/src/control/index.js
+1 -1
View File
@@ -36,7 +36,7 @@ export default class Control extends Component {
});
art.on('video:timeupdate', () => {
if (player.playing && this.show && Date.now() - this.mouseMoveTime >= 3000) {
if (art.playing && this.show && Date.now() - this.mouseMoveTime >= 3000) {
this.show = false;
addClass($player, 'art-hide-cursor');
removeClass($player, 'art-hover');
packages/artplayer/src/control/loop.js
+2 -4
View File
@@ -4,16 +4,14 @@ export default function loop(option) {
return (art) => ({
...option,
mounted: ($control) => {
const { player } = art;
const $left = append($control, `<span class="art-loop-point"></span>`);
const $right = append($control, `<span class="art-loop-point"></span>`);
art.on('loop', (value) => {
if (value) {
setStyle($control, 'display', 'block');
setStyle($left, 'left', `calc(${(value[0] / player.duration) * 100}% - ${$left.clientWidth}px)`);
setStyle($right, 'left', `${(value[1] / player.duration) * 100}%`);
setStyle($left, 'left', `calc(${(value[0] / art.duration) * 100}% - ${$left.clientWidth}px)`);
setStyle($right, 'left', `${(value[1] / art.duration) * 100}%`);
} else {
setStyle($control, 'display', 'none');
}
packages/artplayer/src/control/pip.js
+1 -2
View File
@@ -9,13 +9,12 @@ export default function pip(option) {
events: { proxy },
icons,
i18n,
player,
} = art;
append($control, icons.pip);
proxy($control, 'click', () => {
player.pip = !player.pip;
art.pip = !art.pip;
});
art.on('pip', (value) => {
packages/artplayer/src/control/playAndPause.js
+5 -6
View File
@@ -1,14 +1,13 @@
import { append, tooltip, setStyle } from '../utils';
export default function playAndPause(option) {
return art => ({
return (art) => ({
...option,
mounted: $control => {
mounted: ($control) => {
const {
events: { proxy },
icons,
i18n,
player,
} = art;
const $play = append($control, icons.play);
@@ -17,11 +16,11 @@ export default function playAndPause(option) {
tooltip($pause, i18n.get('Pause'));
proxy($play, 'click', () => {
player.play();
art.play();
});
proxy($pause, 'click', () => {
player.pause();
art.pause();
});
function showPlay() {
@@ -34,7 +33,7 @@ export default function playAndPause(option) {
setStyle($pause, 'display', 'flex');
}
if (player.playing) {
if (art.playing) {
showPause();
} else {
showPlay();
packages/artplayer/src/control/progress.js
+7 -9
View File
@@ -2,13 +2,12 @@ import { query, clamp, append, setStyle, setStyles, secondToTime, includeFromEve
export function getPosFromEvent(art, event) {
const {
player,
template: { $progress },
} = art;
const { left } = $progress.getBoundingClientRect();
const width = clamp(event.pageX - left, 0, $progress.clientWidth);
const second = (width / $progress.clientWidth) * player.duration;
const second = (width / $progress.clientWidth) * art.duration;
const time = secondToTime(second);
const percentage = clamp(width / $progress.clientWidth, 0, 1);
return { second, time, width, percentage };
@@ -19,7 +18,6 @@ export default function progress(option) {
const {
option: { highlight, theme },
events: { proxy },
player,
icons,
} = art;
return {
@@ -98,21 +96,21 @@ export default function progress(option) {
}
highlight.forEach((item) => {
const left = (clamp(item.time, 0, player.duration) / player.duration) * 100;
const left = (clamp(item.time, 0, art.duration) / art.duration) * 100;
append(
$highlight,
`<span data-text="${item.text}" data-time="${item.time}" style="left: ${left}%"></span>`,
);
});
setBar('loaded', player.loaded);
setBar('loaded', art.loaded);
art.on('video:progress', () => {
setBar('loaded', player.loaded);
setBar('loaded', art.loaded);
});
art.on('video:timeupdate', () => {
setBar('played', player.played);
setBar('played', art.played);
});
art.on('video:ended', () => {
@@ -136,7 +134,7 @@ export default function progress(option) {
if (event.target !== $indicator) {
const { second, percentage } = getPosFromEvent(art, event);
setBar('played', percentage);
player.seek = second;
art.seek = second;
}
});
@@ -148,7 +146,7 @@ export default function progress(option) {
if (isDroging) {
const { second, percentage } = getPosFromEvent(art, event);
setBar('played', percentage);
player.seek = second;
art.seek = second;
}
});
packages/artplayer/src/control/quality.js
+1 -1
View File
@@ -7,7 +7,7 @@ export default function quality(option) {
html: qualityDefault ? qualityDefault.html : '',
selector: qualityOption,
onSelect(item) {
art.player.switchQuality(item.url, item.html);
art.switchQuality(item.url, item.html);
},
};
};
packages/artplayer/src/control/screenshot.js
+3 -4
View File
@@ -1,19 +1,18 @@
import { append } from '../utils';
export default function screenshot(option) {
return art => ({
return (art) => ({
...option,
tooltip: art.i18n.get('Screenshot'),
mounted: $control => {
mounted: ($control) => {
const {
events: { proxy },
icons,
player,
} = art;
append($control, icons.screenshot);
proxy($control, 'click', () => {
player.screenshot();
art.screenshot();
});
},
});
packages/artplayer/src/control/time.js
+1 -1
View File
@@ -5,7 +5,7 @@ export default function time(option) {
...option,
mounted: $control => {
function getTime() {
const newTime = `${secondToTime(art.player.currentTime)} / ${secondToTime(art.player.duration)}`;
const newTime = `${secondToTime(art.currentTime)} / ${secondToTime(art.duration)}`;
if (newTime !== $control.innerText) {
$control.innerText = newTime;
}
packages/artplayer/src/control/volume.js
+9 -10
View File
@@ -7,7 +7,6 @@ export default function volume(option) {
const {
events: { proxy },
icons,
player,
i18n,
} = art;
@@ -34,7 +33,7 @@ export default function volume(option) {
}
function setVolumeHandle(percentage = 0.7) {
if (player.muted || percentage === 0) {
if (art.muted || percentage === 0) {
setStyle($volume, 'display', 'none');
setStyle($volumeClose, 'display', 'flex');
setStyle($volumeHandle, 'left', '0');
@@ -46,22 +45,22 @@ export default function volume(option) {
}
}
setVolumeHandle(player.volume);
setVolumeHandle(art.volume);
art.on('video:volumechange', () => {
setVolumeHandle(player.volume);
setVolumeHandle(art.volume);
});
proxy($volume, 'click', () => {
player.muted = true;
art.muted = true;
});
proxy($volumeClose, 'click', () => {
player.muted = false;
art.muted = false;
});
proxy($volumePanel, 'click', (event) => {
player.muted = false;
player.volume = volumeChangeFromEvent(event);
art.muted = false;
art.volume = volumeChangeFromEvent(event);
});
proxy($volumeHandle, 'mousedown', () => {
@@ -70,8 +69,8 @@ export default function volume(option) {
proxy($control, 'mousemove', (event) => {
if (isDroging) {
player.muted = false;
player.volume = volumeChangeFromEvent(event);
art.muted = false;
art.volume = volumeChangeFromEvent(event);
}
});