feat: 依然没有解决移动端视频播放问题。明天再解决吧

This commit is contained in:
539943419 committed 2024-09-30 00:03:19 +08:00
1 parent 65c17a8ce3
commit 4722a2d157
3 files changed
+20 -10

No files matched your search

+3 -1
View File
@@ -22,6 +22,8 @@ const { baseUrl } = config
const showModal = ref<boolean>(false) const showModal = ref<boolean>(false)
const viewRef = ref<HTMLDivElement>()
const modalData = shallowRef<{ const modalData = shallowRef<{
component: any component: any
props: any props: any
@@ -121,7 +123,7 @@ provide('rootDirectory', rootDirectory)
</script> </script>
<template> <template>
<div class="view"> <div class="view" ref="viewRef">
<miao-message-provider ref="messageProviderRef"> <miao-message-provider ref="messageProviderRef">
<div class="view-controller"> <div class="view-controller">
<n-scrollbar x-scrollable> <n-scrollbar x-scrollable>
@@ -67,7 +67,10 @@ const { setVideo } = (() => {
}, },
progress: { progress: {
isDragingSeek: true isDragingSeek: true
} },
// mobile: {
// disableGesture: true
// }
}) })
} }
return { return {
@@ -8,8 +8,8 @@ export default class LockPlugin extends BasePlugin {
} }
private locked: boolean; private locked: boolean;
private lockDiv: HTMLDivElement | null = null; private lockDiv: HTMLDivElement = document.createElement("div");
private overlayDiv: HTMLDivElement | null = null; private overlayDiv: HTMLDivElement = document.createElement("div");
private lockOpenSVG: string = ` private lockOpenSVG: string = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
@@ -29,22 +29,26 @@ export default class LockPlugin extends BasePlugin {
} }
afterCreate() { afterCreate() {
this.createLockDiv(); this.initLockDiv();
this.createOverlayDiv(); this.initOverlayDiv();
this.bindEvents(); this.bindEvents();
} }
private createLockDiv() { private initLockDiv() {
this.lockDiv = document.createElement("div");
this.lockDiv.innerHTML = this.lockClosedSVG; this.lockDiv.innerHTML = this.lockClosedSVG;
this.lockDiv.className = "lock-div"; this.lockDiv.className = "lock-div";
this.player.root !== null && this.player.root.appendChild(this.lockDiv); this.player.root !== null && this.player.root.appendChild(this.lockDiv);
} }
private createOverlayDiv() { private initOverlayDiv() {
this.overlayDiv = document.createElement("div");
this.overlayDiv.className = "overlay-div"; this.overlayDiv.className = "overlay-div";
this.player.root !== null && this.player.root.appendChild(this.overlayDiv); this.player.root !== null && this.player.root.appendChild(this.overlayDiv);
this.overlayDiv.addEventListener('mousedown', (e) => {
e.preventDefault();
});
this.overlayDiv.addEventListener('mousemove', (e) => {
e.preventDefault();
});
} }
private bindEvents() { private bindEvents() {
@@ -69,6 +73,7 @@ export default class LockPlugin extends BasePlugin {
private toggleLock() { private toggleLock() {
const mobile = this.getPlugin('mobile') as MobilePlugin | undefined const mobile = this.getPlugin('mobile') as MobilePlugin | undefined
// mobile?.disableGesture()
if (this.lockDiv && this.overlayDiv) { if (this.lockDiv && this.overlayDiv) {
this.locked = !this.locked; this.locked = !this.locked;
this.lockDiv.innerHTML = this.locked ? this.lockOpenSVG : this.lockClosedSVG; this.lockDiv.innerHTML = this.locked ? this.lockOpenSVG : this.lockClosedSVG;