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

build all packages

Browse Source
This commit is contained in:
Harvey Zack committed 2019-06-12 15:24:34 +08:00
1 parent 6c2d5f62f6
commit cadfa4efe5
28 files changed
+412 -382
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/contextmenu/aspectRatio.js
+1 -1
View File
@@ -16,7 +16,7 @@ export default function aspectRatio(menuOption) {
const { ratio } = target.dataset;
if (ratio) {
player.aspectRatio = ratio;
art.contextmenu.hide();
art.contextmenu.show = false;
}
},
mounted: $menu => {
packages/artplayer/src/contextmenu/close.js
+1 -1
View File
@@ -3,7 +3,7 @@ export default function close(menuOption) {
...menuOption,
html: art.i18n.get('Close'),
click: () => {
art.contextmenu.hide();
art.contextmenu.show = false;
},
});
}
packages/artplayer/src/contextmenu/index.js
+15 -12
View File
@@ -15,7 +15,7 @@ export default class Contextmenu {
});
this.art.on('blur', () => {
this.hide();
this.show = false;
});
}
@@ -62,13 +62,13 @@ export default class Contextmenu {
proxy($player, 'contextmenu', event => {
event.preventDefault();
this.show();
this.show = true;
this.setPos(event);
});
proxy($player, 'click', event => {
if (!event.composedPath().includes($contextmenu)) {
this.hide();
this.show = false;
}
});
}
@@ -100,17 +100,20 @@ export default class Contextmenu {
setStyle($contextmenu, 'top', `${menuTop}px`);
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.add('artplayer-contextmenu-show');
this.art.emit('contextmenu:show');
if (value) {
this.state = true;
$player.classList.add('artplayer-contextmenu-show');
this.art.emit('contextmenu:show');
} else {
this.state = false;
$player.classList.remove('artplayer-contextmenu-show');
this.art.emit('contextmenu:hide');
}
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-contextmenu-show');
this.art.emit('contextmenu:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/contextmenu/info.js
+2 -2
View File
@@ -3,8 +3,8 @@ export default function info(menuOption) {
...menuOption,
html: art.i18n.get('Video info'),
click: () => {
art.info.show();
art.contextmenu.hide();
art.info.show = true;
art.contextmenu.show = false;
},
});
}
packages/artplayer/src/contextmenu/playbackRate.js
+1 -1
View File
@@ -19,7 +19,7 @@ export default function playbackRate(menuOption) {
const { rate } = target.dataset;
if (rate) {
player.playbackRate = Number(rate);
art.contextmenu.hide();
art.contextmenu.show = false;
}
},
mounted: $menu => {
packages/artplayer/src/controls/index.js
+12 -9
View File
@@ -161,17 +161,20 @@ export default class Controls {
return component(this.art, this, parent, option, callback, 'control');
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.add('artplayer-controls-show');
this.art.emit('controls:show');
if (value) {
this.state = true;
$player.classList.add('artplayer-controls-show');
this.art.emit('controls:show');
} else {
this.state = false;
$player.classList.remove('artplayer-controls-show');
this.art.emit('controls:hide');
}
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-controls-show');
this.art.emit('controls:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/events/doubleClickInit.js
-8
View File
@@ -1,8 +0,0 @@
export default function doubleClickInit(art, events) {
const {
template: { $video },
} = art;
events.proxy($video, 'dblclick', () => {
art.emit('dblclick');
});
}
packages/artplayer/src/events/mousemoveInit.js
+2 -2
View File
@@ -9,7 +9,7 @@ export default function mousemoveInitInit(art, events) {
const autoHide = debounce(() => {
$player.classList.add('artplayer-hide-cursor');
$player.classList.remove('artplayer-hover');
art.controls.hide();
art.controls.show = false;
}, 5000);
art.on('hoverleave', () => {
@@ -21,7 +21,7 @@ export default function mousemoveInitInit(art, events) {
events.proxy($player, 'mousemove', event => {
autoHide.clearTimeout();
$player.classList.remove('artplayer-hide-cursor');
art.controls.show();
art.controls.show = true;
if (!art.player.pip && player.playing && event.target === $video) {
autoHide();
}
packages/artplayer/src/hotkey.js
+26 -27
View File
@@ -2,35 +2,34 @@ export default class Hotkey {
constructor(art) {
this.art = art;
this.keys = {};
this.add(27, () => {
if (art.player.fullscreenWeb) {
art.player.fullscreenWeb = false;
}
});
this.add(32, () => {
art.player.toggle = true;
});
this.add(37, () => {
art.player.seek = art.player.currentTime - 10;
});
this.add(38, () => {
art.player.volume += 0.05;
});
this.add(39, () => {
art.player.seek = art.player.currentTime + 10;
});
this.add(40, () => {
art.player.volume -= 0.05;
});
if (this.art.option.hotkey) {
this.art.once('video:canplay', () => {
this.add(27, () => {
if (art.player.fullscreenWeb) {
art.player.fullscreenWeb = false;
}
});
this.add(32, () => {
art.player.toggle = true;
});
this.add(37, () => {
art.player.seek = art.player.currentTime - 10;
});
this.add(38, () => {
art.player.volume += 0.05;
});
this.add(39, () => {
art.player.seek = art.player.currentTime + 10;
});
this.add(40, () => {
art.player.volume -= 0.05;
});
this.init();
});
}
packages/artplayer/src/info.js
+18 -15
View File
@@ -12,7 +12,7 @@ export default class Info {
events: { proxy },
} = this.art;
proxy($infoClose, 'click', () => {
this.hide();
this.show = false;
});
this.art.on('destroy', () => {
if (this.timer) {
@@ -92,23 +92,26 @@ export default class Info {
}, 1000);
}
show() {
set show(value) {
const { $player, $infoPanel } = this.art.template;
this.state = true;
$player.classList.add('artplayer-info-show');
if (!$infoPanel.innerHTML) {
append($infoPanel, this.creatInfo());
if (value) {
this.state = true;
$player.classList.add('artplayer-info-show');
if (!$infoPanel.innerHTML) {
append($infoPanel, this.creatInfo());
}
clearTimeout(this.timer);
this.loop();
this.art.emit('info:show');
} else {
this.state = false;
$player.classList.remove('artplayer-info-show');
clearTimeout(this.timer);
this.art.emit('info:hide');
}
clearTimeout(this.timer);
this.loop();
this.art.emit('info:show');
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-info-show');
clearTimeout(this.timer);
this.art.emit('info:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/layers.js
+12 -9
View File
@@ -18,17 +18,20 @@ export default class Layers {
return component(this.art, this, $layers, item, callback, 'layer');
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.remove('artplayer-layers-hide');
this.art.emit('layers:show');
if (value) {
this.state = true;
$player.classList.remove('artplayer-layers-hide');
this.art.emit('layers:show');
} else {
this.state = false;
$player.classList.add('artplayer-layers-hide');
this.art.emit('layers:hide');
}
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.add('artplayer-layers-hide');
this.art.emit('layers:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/loading.js
+12 -9
View File
@@ -7,17 +7,20 @@ export default class Loading {
append($loading, art.icons.loading);
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.add('artplayer-loading-show');
this.art.emit('loading:show');
if (value) {
this.state = true;
$player.classList.add('artplayer-loading-show');
this.art.emit('loading:show');
} else {
this.state = false;
$player.classList.remove('artplayer-loading-show');
this.art.emit('loading:hide');
}
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-loading-show');
this.art.emit('loading:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/mask.js
+12 -9
View File
@@ -8,17 +8,20 @@ export default class Mask {
append($playBig, art.icons.state);
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.add('artplayer-mask-show');
this.art.emit('mask:show');
if (value) {
this.state = true;
$player.classList.add('artplayer-mask-show');
this.art.emit('mask:show');
} else {
this.state = false;
$player.classList.remove('artplayer-mask-show');
this.art.emit('mask:hide');
}
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-mask-show');
this.art.emit('mask:hide');
toggle() {
this.show = !this.state;
}
}
packages/artplayer/src/player/attachUrlMix.js
+2 -2
View File
@@ -13,7 +13,7 @@ export default function attachUrlMix(art, player) {
const typeName = type || getExt(videoUrl);
const typeCallback = customType[typeName];
if (typeName && typeCallback) {
art.loading.show();
art.loading.show = true;
art.emit('beforeCustomType', typeName);
typeCallback.call(art, $video, videoUrl, art);
art.emit('afterCustomType', typeName);
@@ -32,7 +32,7 @@ export default function attachUrlMix(art, player) {
'If url is a function, it needs to return a promise.',
);
return result.then(videoUrl => {
art.loading.show();
art.loading.show = true;
return attachUrl(videoUrl);
});
}
packages/artplayer/src/player/eventInit.js
+16 -16
View File
@@ -29,9 +29,9 @@ export default function eventInit(art, player) {
art.on('video:canplay', () => {
reconnectTime = 0;
art.controls.show();
art.mask.show();
art.loading.hide();
art.controls.show = true;
art.mask.show = true;
art.loading.show = false;
});
// art.on('video:canplaythrough', () => {
@@ -47,8 +47,8 @@ export default function eventInit(art, player) {
// });
art.on('video:ended', () => {
art.controls.show();
art.mask.show();
art.controls.show = true;
art.mask.show = true;
if (option.loop) {
player.seek = 0;
player.play = true;
@@ -63,8 +63,8 @@ export default function eventInit(art, player) {
notice.show(`${i18n.get('Reconnect')}: ${reconnectTime}`);
});
} else {
art.loading.hide();
art.controls.hide();
art.loading.show = false;
art.controls.show = false;
$player.classList.add('artplayer-error');
sleep(1000).then(() => {
notice.show(i18n.get('Video load failed'), false);
@@ -84,20 +84,20 @@ export default function eventInit(art, player) {
});
art.on('video:loadstart', () => {
art.loading.show();
art.loading.show = true;
});
art.on('video:pause', () => {
art.controls.show();
art.mask.show();
art.controls.show = true;
art.mask.show = true;
});
art.on('video:play', () => {
art.mask.hide();
art.mask.show = false;
});
art.on('video:playing', () => {
art.mask.hide();
art.mask.show = false;
});
// art.on('video:progress', () => {
@@ -109,11 +109,11 @@ export default function eventInit(art, player) {
// });
art.on('video:seeked', () => {
art.loading.hide();
art.loading.show = false;
});
art.on('video:seeking', () => {
art.loading.show();
art.loading.show = true;
});
// art.on('video:stalled', () => {
@@ -125,7 +125,7 @@ export default function eventInit(art, player) {
// });
art.on('video:timeupdate', () => {
art.mask.hide();
art.mask.show = false;
});
// art.on('video:volumechange', () => {
@@ -133,6 +133,6 @@ export default function eventInit(art, player) {
// });
art.on('video:waiting', () => {
art.loading.show();
art.loading.show = true;
});
}
packages/artplayer/src/setting/index.js
+13 -18
View File
@@ -14,7 +14,7 @@ export default class Setting {
});
this.art.on('blur', () => {
this.hide();
this.show = false;
});
}
}
@@ -28,7 +28,7 @@ export default class Setting {
proxy($setting, 'click', e => {
if (e.target === $setting) {
this.hide();
this.show = false;
}
});
@@ -60,25 +60,20 @@ export default class Setting {
return component(this.art, this, $settingBody, item, callback, 'setting');
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.add('artplayer-setting-show');
this.art.emit('setting:show');
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.remove('artplayer-setting-show');
this.art.emit('setting:hide');
if (value) {
this.state = true;
$player.classList.add('artplayer-setting-show');
this.art.emit('setting:show');
} else {
this.state = false;
$player.classList.remove('artplayer-setting-show');
this.art.emit('setting:hide');
}
}
toggle() {
if (this.state) {
this.hide();
} else {
this.show();
}
this.show = !this.state;
}
}
packages/artplayer/src/subtitle.js
+12 -17
View File
@@ -30,7 +30,7 @@ export default class Subtitle {
this.load(url).then(url => {
this.art.template.$track.src = url;
this.art.emit('subtitle:load', url);
if ($video.textTracks && $video.textTracks[0]) {
const [track] = $video.textTracks;
proxy(track, 'cuechange', () => {
@@ -73,25 +73,20 @@ export default class Subtitle {
});
}
show() {
set show(value) {
const { $player } = this.art.template;
this.state = true;
$player.classList.remove('artplayer-subtitle-hide');
this.art.emit('subtitle:show');
}
hide() {
const { $player } = this.art.template;
this.state = false;
$player.classList.add('artplayer-subtitle-hide');
this.art.emit('subtitle:hide');
if (value) {
this.state = true;
$player.classList.remove('artplayer-subtitle-hide');
this.art.emit('subtitle:show');
} else {
this.state = false;
$player.classList.add('artplayer-subtitle-hide');
this.art.emit('subtitle:hide');
}
}
toggle() {
if (this.state) {
this.hide();
} else {
this.show();
}
this.show = !this.state;
}
}
packages/artplayer/src/utils/component.js
+28 -16
View File
@@ -4,7 +4,10 @@ export default function component(art, parent, target, getOption, callback, titl
const option = typeof getOption === 'function' ? getOption(art) : getOption;
if (!option.disable) {
const name = option.name || `${title}${parent.id}`;
errorHandle(!hasOwnProperty(parent, name), `Cannot create a component that already has the same name: ${title} -> ${name}`);
errorHandle(
!hasOwnProperty(parent, name),
`Cannot create a component that already has the same name: ${title} -> ${name}`,
);
const $element = document.createElement('div');
$element.classList.value = `art-${title} art-${title}-${name}`;
@@ -41,22 +44,31 @@ export default function component(art, parent, target, getOption, callback, titl
callback($element, parent, art);
}
parent[name] = {
id: parent.id,
$ref: $element,
hide() {
setStyle($element, 'display', 'none');
art.emit(`${title}:hide`, $element);
Object.defineProperty(parent, name, {
value: {
get id() {
return parent.id;
},
get $ref() {
return $element;
},
set show(value) {
if (value) {
setStyle($element, 'display', 'block');
art.emit(`${title}:show`, $element);
} else {
setStyle($element, 'display', 'none');
art.emit(`${title}:hide`, $element);
}
},
set remove(value) {
if (value) {
remove($element);
art.emit(`${title}:remove`, $element);
}
},
},
show(type = 'block') {
setStyle($element, 'display', type);
art.emit(`${title}:show`, $element);
},
remove() {
remove($element);
art.emit(`${title}:remove`, $element);
},
};
});
art.emit(`${title}:add`, option);
return parent[name];
packages/artplayer/src/whitelist.js
+4 -9
View File
@@ -8,21 +8,16 @@ export default class Whitelist {
!this.isMobile ||
whitelist.some(item => {
const type = kindOf(item);
let result = false;
switch (type) {
case 'string':
result = this.userAgent.indexOf(item) > -1;
break;
return this.userAgent.indexOf(item) > -1;
case 'function':
result = item(this.userAgent);
break;
return item(this.userAgent);
case 'regexp':
result = item.test(this.userAgent);
break;
return item.test(this.userAgent);
default:
break;
return false;
}
return result;
});
}
}