VideoControls/VideoControls.js at main · libiao7/VideoControls · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
let pointerDownVX, pointerDownVY, pointerdownWidth = 0


addEventListener('pointerdown', function (e) {
    pointerdownWidth = e.width
    if (document.fullscreenElement?.tagName == 'VIDEO' || document.fullscreenElement?.className.includes('art-video-player') && e.isPrimary) {
        e.target.pause()
        e.stopImmediatePropagation()
        e.preventDefault()
        pointerDownVX = e.screenX
        pointerDownVY = e.screenY
    }
}, { capture: true/*, passive: false*/ })
addEventListener('touchstart', function (e) {
    if (document.fullscreenElement?.tagName == 'VIDEO' || document.fullscreenElement?.className.includes('art-video-player')) {
        e.stopImmediatePropagation()
        e.preventDefault()
    }
}, { capture: true/*, passive: false*/ })
addEventListener('touchend', function (e) {
    if (document.fullscreenElement?.tagName == 'VIDEO' || document.fullscreenElement?.className.includes('art-video-player')) {
        e.stopImmediatePropagation()
        e.preventDefault()
    }
}, { capture: true/*, passive: false*/ })
addEventListener('pointerup', function (e) {
    if (document.fullscreenElement?.tagName == 'VIDEO' || document.fullscreenElement?.className.includes('art-video-player')) {
        e.stopImmediatePropagation()
        e.preventDefault()
        if (e.target.tagName == 'VIDEO' && e.isPrimary) {
            let xMv = Math.abs(e.screenX - pointerDownVX)
            let yMv = Math.abs(e.screenY - pointerDownVY)
            if (xMv > 20 && xMv > yMv) {
                e.target.currentTime += xMv * xMv / 625 * Math.sign(e.screenX - pointerDownVX)
                e.target.play()
            }
            else if (yMv > 20 && yMv > xMv) {
                if (e.screenY > pointerDownVY) {
                    e.target.controls = true
                    e.target.pause()
                    e.target.playbackRate = 1
                }
                else if (e.screenY < pointerDownVY) {
                    e.target.controls = false
                    e.target.playbackRate = 2
                    e.target.play()
                }
            }
            else {
                e.target.controls = false
                e.target.play()
            }
        }
    }
    else if (!document.fullscreenElement && e.isPrimary && pointerdownWidth > 36) {
        for (let video of document.querySelectorAll('video')) {
            let videoRect = video.getBoundingClientRect();
            if (e.clientX >= videoRect.left && e.clientX <= videoRect.right && e.clientY >= videoRect.top && e.clientY <= videoRect.bottom) {
                e.stopImmediatePropagation()
                e.preventDefault()
                let vel = video
                while (vel) {
                    vel.style.setProperty('pointer-events', 'auto', 'important')
                    vel = vel.parentElement
                }
                if (location.port === '5244') {
                    document.querySelector('.art-control-fullscreen').click()
                }
                else
                    video.requestFullscreen()
                video.muted = false
                video.controls = true
                video.play()
                break
            }
        }
    }
}, { capture: true/*, passive: false*/ })
/*addEventListener('click', function (e) {
    if (document.fullscreenElement) {
        e.stopImmediatePropagation()
        e.preventDefault()
    }
}, { capture: true })
addEventListener('dblclick', function (e) {
    e.stopImmediatePropagation()
    e.preventDefault()
}, { capture: true })*/
addEventListener('contextmenu', function (e) {
    if (document.fullscreenElement?.tagName == 'VIDEO' || document.fullscreenElement?.className.includes('art-video-player')) {
        e.stopImmediatePropagation()
        e.preventDefault()
    }
}, { capture: true })
addEventListener("visibilitychange", () => {
    if (document.visibilityState == 'hidden' || document.hidden)
        for (let video of document.querySelectorAll('video'))
            video.pause()
})
if (window !== top)
    document.addEventListener('DOMContentLoaded', function () {
        new MutationObserver((mutationRecords, o) => {
            for (let r of mutationRecords) {
                for (let a of r.addedNodes) {
                    if (a.nodeType === 1) {
                        if (a.tagName === 'VIDEO') {
                            if (a.src?.indexOf('http') === 0)
                                location.href = a.src.replace('http://', 'https://')
                        } else for (let v of a.querySelectorAll('video')) {
                            if (v.src?.indexOf('http') === 0)
                                location.href = v.src.replace('http://', 'https://')
                        }
                    }
                }
            }
        }).observe(document.body, { childList: true, subtree: true })
    })