UPD: More generic keyevent handling

This commit is contained in:
Robert Kossessa
2024-03-09 01:20:32 +01:00
parent 48117b58a7
commit 84e4ff05b7

View File

@@ -7,8 +7,8 @@
> >
{{ isCapturing ? 'Capturing Keyboard Input' : 'Capture Keyboard Input' }} {{ isCapturing ? 'Capturing Keyboard Input' : 'Capture Keyboard Input' }}
</Button> </Button>
<div class="mt-6 text-center font-mono text-sm text-muted-foreground"> <div v-if="lastEvent" class="mt-6 text-center font-mono text-sm text-muted-foreground">
Key: {{ lastEvent?.key }} | Code: {{ lastEvent?.keyCode }} Key: {{ lastEvent?.key }} | Code: {{ lastEvent?.keyCode }} | Type: {{ lastEvent?.type }}
</div> </div>
</div> </div>
</template> </template>
@@ -17,10 +17,7 @@ import { Button } from '@renderer/components/ui/button'
import { ref, Ref } from 'vue' import { ref, Ref } from 'vue'
const isCapturing = ref(false) const isCapturing = ref(false)
const keydownListener = (e: KeyboardEvent) => { const listener = (e: KeyboardEvent) => {
lastEvent.value = e
}
const keyupListener = (e: KeyboardEvent) => {
lastEvent.value = e lastEvent.value = e
} }
@@ -28,11 +25,11 @@ const toggleCapture = () => {
isCapturing.value = !isCapturing.value isCapturing.value = !isCapturing.value
// TODO: Do this in the main process // TODO: Do this in the main process
if (isCapturing.value) { if (isCapturing.value) {
window.addEventListener('keydown', keydownListener) window.addEventListener('keydown', listener)
window.addEventListener('keyup', keyupListener) window.addEventListener('keyup', listener)
} else { } else {
window.removeEventListener('keydown', keydownListener) window.removeEventListener('keydown', listener)
window.removeEventListener('keyup', keyupListener) window.removeEventListener('keyup', listener)
} }
} }
const lastEvent: Ref<KeyboardEvent | null> = ref(null) const lastEvent: Ref<KeyboardEvent | null> = ref(null)