iridium/neko
2
2
Fork 0
mirror of https://github.com/m1k1o/neko.git synced 2024-07-24 14:40:50 +12:00
Code Issues Packages Projects Releases Wiki Activity

add pixel ratio change listener.

Browse Source
This commit is contained in:
Miroslav Šedivý 2023-04-19 12:15:07 +02:00
parent a79a5cfd39
commit f9417db520
2 changed files with 49 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/component/cursors.vue
View File

@ -69,11 +69,35 @@
const { width, height } = this._overlay.getBoundingClientRect()
this.canvasResize({ width, height })
// react to pixel ratio changes
this.onPixelRatioChange()
// store last drawing points
this._last_points = {}
}
beforeDestroy() {}
beforeDestroy() {
// stop pixel ratio change listener
if (this.unsubscribePixelRatioChange) {
this.unsubscribePixelRatioChange()
}
}
private unsubscribePixelRatioChange?: () => void
private onPixelRatioChange() {
if (this.unsubscribePixelRatioChange) {
this.unsubscribePixelRatioChange()
}
const media = matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`)
media.addEventListener('change', this.onPixelRatioChange)
this.unsubscribePixelRatioChange = () => {
media.removeEventListener('change', this.onPixelRatioChange)
}
this.canvasScale = window.devicePixelRatio
this.onCanvasSizeChange(this.canvasSize)
}
@Watch('canvasSize')
onCanvasSizeChange({ width, height }: Dimension) {

24
src/component/overlay.vue
View File

@ -138,6 +138,9 @@
const { width, height } = this._overlay.getBoundingClientRect()
this.canvasResize({ width, height })
// react to pixel ratio changes
this.onPixelRatioChange()
let ctrlKey = 0
let noKeyUp = {} as Record<number, boolean>
@ -209,6 +212,11 @@
// stop inactive cursor interval if exists
this.clearInactiveCursorInterval()
// stop pixel ratio change listener
if (this.unsubscribePixelRatioChange) {
this.unsubscribePixelRatioChange()
}
}
getMousePos(clientX: number, clientY: number) {
@ -499,6 +507,22 @@
private canvasRequestedFrame = false
private canvasRenderTimeout: number | null = null
private unsubscribePixelRatioChange?: () => void
private onPixelRatioChange() {
if (this.unsubscribePixelRatioChange) {
this.unsubscribePixelRatioChange()
}
const media = matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`)
media.addEventListener('change', this.onPixelRatioChange)
this.unsubscribePixelRatioChange = () => {
media.removeEventListener('change', this.onPixelRatioChange)
}
this.canvasScale = window.devicePixelRatio
this.onCanvasSizeChange(this.canvasSize)
}
@Watch('canvasSize')
onCanvasSizeChange({ width, height }: Dimension) {
this.canvasResize({ width, height })