update docs

This commit is contained in:
Harvey Zack committed 2023-05-06 09:52:01 +08:00
1 parent 2749d50209
commit 550aa0e7f2
95 files changed
+1734 -1828

No files matched your search

@@ -42,11 +42,4 @@ export default function aspectRatioMix(art) {
art.emit('aspectRatio', ratio);
},
});
def(art, 'aspectRatioReset', {
value() {
const { aspectRatio } = art;
art.aspectRatio = aspectRatio;
},
});
}
+7 -22
View File
@@ -1,32 +1,17 @@
import { setStyle, hasClass, addClass, removeClass, def } from '../utils';
import { setStyle, def } from '../utils';
export default function autoHeightMix(art) {
const {
option,
template: { $container, $video },
} = art;
const heightCache = $container.style.height;
def(art, 'autoHeight', {
get() {
return hasClass($container, 'art-auto-height');
},
set(value) {
if (value) {
const { clientWidth } = $container;
const { videoHeight, videoWidth } = $video;
const height = videoHeight * (clientWidth / videoWidth);
setStyle($container, 'height', height + 'px');
addClass($container, 'art-auto-height');
art.autoSize = option.autoSize;
art.emit('autoHeight', height);
} else {
setStyle($container, 'height', heightCache);
removeClass($container, 'art-auto-height');
art.autoSize = option.autoSize;
art.emit('autoHeight');
}
value() {
const { clientWidth } = $container;
const { videoHeight, videoWidth } = $video;
const height = videoHeight * (clientWidth / videoWidth);
setStyle($container, 'height', height + 'px');
art.emit('autoHeight', height);
},
});
}
+17 -28
View File
@@ -1,38 +1,27 @@
import { setStyle, addClass, removeClass, hasClass, def } from '../utils';
import { setStyle, def } from '../utils';
export default function resizeMix(art) {
const { $container, $player, $video } = art.template;
def(art, 'autoSize', {
get() {
return hasClass($container, 'art-auto-size');
},
set(value) {
if (value) {
const { videoWidth, videoHeight } = $video;
const { width, height } = $container.getBoundingClientRect();
const videoRatio = videoWidth / videoHeight;
const containerRatio = width / height;
addClass($container, 'art-auto-size');
if (containerRatio > videoRatio) {
const percentage = ((height * videoRatio) / width) * 100;
setStyle($player, 'width', `${percentage}%`);
setStyle($player, 'height', '100%');
} else {
const percentage = (width / videoRatio / height) * 100;
setStyle($player, 'width', '100%');
setStyle($player, 'height', `${percentage}%`);
}
art.emit('autoSize', {
width: art.width,
height: art.height,
});
value() {
const { videoWidth, videoHeight } = $video;
const { width, height } = $container.getBoundingClientRect();
const videoRatio = videoWidth / videoHeight;
const containerRatio = width / height;
if (containerRatio > videoRatio) {
const percentage = ((height * videoRatio) / width) * 100;
setStyle($player, 'width', `${percentage}%`);
setStyle($player, 'height', '100%');
} else {
removeClass($container, 'art-auto-size');
setStyle($player, 'width', null);
setStyle($player, 'height', null);
art.emit('autoSize');
const percentage = (width / videoRatio / height) * 100;
setStyle($player, 'width', '100%');
setStyle($player, 'height', `${percentage}%`);
}
art.emit('autoSize', {
width: art.width,
height: art.height,
});
},
});
}
+1 -1
View File
@@ -83,7 +83,7 @@ export default function eventInit(art) {
// });
art.on('video:loadedmetadata', () => {
art.autoSize = option.autoSize;
art.emit('resize');
if (isMobile) {
art.loading.show = false;
art.controls.show = true;
@@ -20,15 +20,11 @@ export default function fullscreenMix(art) {
async set(value) {
if (value) {
art.state = 'fullscreen';
art.aspectRatioReset();
art.autoSize = false;
await screenfull.request($player);
addClass($player, 'art-fullscreen');
art.emit('resize');
notice.show = '';
} else {
art.aspectRatioReset();
art.autoSize = art.option.autoSize;
await screenfull.exit();
removeClass($player, 'art-fullscreen');
art.emit('resize');
@@ -2,7 +2,6 @@ import { addClass, removeClass, hasClass, def, append } from '../utils';
export default function fullscreenWebMix(art) {
const {
option,
notice,
constructor,
template: { $container, $player },
@@ -21,8 +20,6 @@ export default function fullscreenWebMix(art) {
}
art.state = 'fullscreenWeb';
addClass($player, 'art-fullscreen-web');
art.aspectRatioReset();
art.autoSize = false;
art.emit('resize');
art.emit('fullscreenWeb', true);
notice.show = '';
@@ -35,8 +32,6 @@ export default function fullscreenWebMix(art) {
cssText = '';
}
removeClass($player, 'art-fullscreen-web');
art.aspectRatioReset();
art.autoSize = option.autoSize;
art.emit('resize');
art.emit('fullscreenWeb', false);
notice.show = '';