refactor(scrollbar): use evtd to handle events

This commit is contained in:
07akioni 2020-11-27 01:54:14 +08:00
parent 50ec676e2d
commit 9673ad94cd
3 changed files with 18 additions and 13 deletions

View File

@ -1,4 +1,5 @@
import { KEY_CODE } from '../dom/key-code'
import { on } from 'evtd'
class KeyboardDelegate {
constructor () {
@ -6,7 +7,7 @@ class KeyboardDelegate {
this.ctrlPressed = false
this.commandPressed = false
this.handlerInfoList = []
window.addEventListener('keydown', e => {
on('keydown', window, e => {
switch (e.keyCode) {
case KEY_CODE.SHIFT:
this.shiftPressed = true
@ -32,7 +33,7 @@ class KeyboardDelegate {
}
})
})
window.addEventListener('keyup', e => {
on('keyup', window, e => {
switch (e.keyCode) {
case KEY_CODE.SHIFT:
this.shiftPressed = false

View File

@ -189,8 +189,8 @@ export default {
keyboardDelegate.registerHandler(KEY_CODE.LEFT, 'keydown', this.handleKeyDownLeft, {
preventDefault: true
})
keyboardDelegate.registerHandler(KEY_CODE.ENTER, 'keyup', this.handleKeyUpEnter)
keyboardDelegate.registerHandler(KEY_CODE.ESC, 'keydown', this.handleKeyDownEsc)
keyboardDelegate.registerHandler(KEY_CODE.ENTER, 'keyup', this.handleKeyUpEnter)
},
unregisterKeyboardOperations () {
if (!this.keyboardHandlerRegistered) return

View File

@ -100,6 +100,10 @@
import {
ref
} from 'vue'
import {
on,
off
} from 'evtd'
import {
VResizeObserver
} from 'vueuc'
@ -255,8 +259,8 @@ export default {
beforeUnmount () {
window.clearTimeout(this.xBarVanishTimerId)
window.clearTimeout(this.yBarVanishTimerId)
window.removeEventListener('mousemove', this.handleYScrollMouseMove, true)
window.removeEventListener('mouseup', this.handleYScrollMouseUp, true)
off('mousemove', window, this.handleYScrollMouseMove, true)
off('mouseup', window, this.handleYScrollMouseUp, true)
},
mounted () {
// if container exist, it always can't be resolved when scrollbar is mounted
@ -431,8 +435,8 @@ export default {
e.preventDefault()
e.stopPropagation()
this.xBarPressed = true
window.addEventListener('mousemove', this.handleXScrollMouseMove)
window.addEventListener('mouseup', this.handleXScrollMouseUp)
on('mousemove', window, this.handleXScrollMouseMove, true)
on('mouseup', window, this.handleXScrollMouseUp, true)
this.memoXLeft = this.containerScrollLeft
this.memoMouseX = e.clientX
},
@ -451,8 +455,8 @@ export default {
handleXScrollMouseUp (e) {
e.preventDefault()
e.stopPropagation()
window.removeEventListener('mousemove', this.handleXScrollMouseMove)
window.removeEventListener('mouseup', this.handleXScrollMouseUp)
off('mousemove', window, this.handleXScrollMouseMove, true)
off('mouseup', window, this.handleXScrollMouseUp, true)
this.xBarPressed = false
this.sync()
if (!this.mergedContainerRef().contains(e.target)) {
@ -463,8 +467,8 @@ export default {
e.preventDefault()
e.stopPropagation()
this.yBarPressed = true
window.addEventListener('mousemove', this.handleYScrollMouseMove, true)
window.addEventListener('mouseup', this.handleYScrollMouseUp, true)
on('mousemove', window, this.handleYScrollMouseMove, true)
on('mouseup', window, this.handleYScrollMouseUp, true)
this.memoYTop = this.containerScrollTop
this.memoMouseY = e.clientY
},
@ -487,8 +491,8 @@ export default {
onScrollEnd
} = this
if (onScrollEnd) onScrollEnd()
window.removeEventListener('mousemove', this.handleYScrollMouseMove, true)
window.removeEventListener('mouseup', this.handleYScrollMouseUp, true)
off('mousemove', window, this.handleYScrollMouseMove, true)
off('mouseup', window, this.handleYScrollMouseUp, true)
this.yBarPressed = false
this.sync()
if (!this.mergedContainerRef().contains(e.target)) {