fixed fontsize, DPI

ipc/types.ts

@@ -84,6 +84,7 @@ type IpcTrackArea =
     closeThreshold: number
     from: { x: number, y: number }
     area: { x: number, y: number, width: number, height: number }
+    dpr: number
   }>
 
 type IpcHostConfig =

main/src/windowing/OverlayWindow.ts

@@ -38,8 +38,7 @@ export class OverlayWindow {
       webPreferences: {
         allowRunningInsecureContent: false,
         webviewTag: true,
-        spellcheck: false,
-        // TODO defaultFontSize: config.get('fontSize'),
+        spellcheck: false
       }
     })
 

main/src/windowing/WidgetAreaTracker.ts

@@ -15,9 +15,15 @@ export class WidgetAreaTracker {
   ) {
     this.server.onEventAnyClient('OVERLAY->MAIN::track-area', (opts) => {
       this.holdKey = opts.holdKey
-      this.closeThreshold = opts.closeThreshold
-      this.from = opts.from
-      this.area = opts.area
+      if (process.platform === 'win32') {
+        this.closeThreshold = opts.closeThreshold * opts.dpr
+        this.from = screen.dipToScreenPoint(opts.from)
+        this.area = screen.dipToScreenRect(null, opts.area)
+      } else {
+        this.closeThreshold = opts.closeThreshold
+        this.from = opts.from
+        this.area = opts.area
+      }
 
       this.removeListeners()
       uIOhook.addListener('mousemove', this.handleMouseMove)

renderer/src/web/Config.ts

@@ -18,9 +18,8 @@ export function AppConfig (type?: string) {
 }
 
 export function updateConfig (updates: Config) {
-  if (_config.value) {
-    _config.value = deepReactive(JSON.parse(JSON.stringify(updates)))
-  }
+  _config.value = deepReactive(JSON.parse(JSON.stringify(updates)))
+  document.documentElement.style.fontSize = `${_config.value!.fontSize}px`
 }
 
 export function saveConfig (opts?: { isTemporary: boolean }) {
@@ -51,12 +50,12 @@ export function pushHostConfig () {
 export async function initConfig () {
   Host.onEvent('MAIN->CLIENT::config-changed', (e) => {
     _lastSavedConfig = JSON.parse(e.contents) // should be a deep copy
-    _config.value = deepReactive(JSON.parse(e.contents))
+    updateConfig(JSON.parse(e.contents))
   })
 
   const contents = await Host.getConfig()
   if (!contents) {
-    _config.value = deepReactive(defaultConfig())
+    updateConfig(defaultConfig())
     return
   }
 
@@ -64,7 +63,7 @@ export async function initConfig () {
   try {
     config = JSON.parse(contents)
   } catch {
-    _config.value = deepReactive(defaultConfig())
+    updateConfig(defaultConfig())
     saveConfig({ isTemporary: true })
     return
 
@@ -77,7 +76,7 @@ export async function initConfig () {
     // )
   }
 
-  _config.value = deepReactive(upgradeConfig(config))
+  updateConfig(upgradeConfig(config))
 }
 
 export function poeWebApi () {

renderer/src/web/overlay/WidgetDebug.vue

@@ -189,7 +189,7 @@ export default defineComponent({
     function priceCheck (text: string) { /* eslint-disable no-console */
       MainProcess.selfDispatch({
         name: 'MAIN->CLIENT::item-text',
-        payload: { clipboard: text, position: { x: Infinity, y: Infinity }, focusOverlay: false, target: 'price-check' }
+        payload: { clipboard: text, position: { x: 9999, y: 9999 }, focusOverlay: false, target: 'price-check' }
       })
       console.time('parsing item')
       const parsed = parseClipboard(text)

renderer/src/web/price-check/PriceCheckWindow.vue

@@ -122,7 +122,8 @@ export default defineComponent({
       if (e.target !== 'price-check') return
 
       if (Host.isElectron && !e.focusOverlay) {
-        const width = Math.floor(window.devicePixelRatio * AppConfig().fontSize * 28.75)
+        // everything in CSS pixels
+        const width = 28.75 * AppConfig().fontSize
         const screenX = ((e.position.x - window.screenX) > window.innerWidth / 2)
           ? (window.screenX + window.innerWidth) - wm.poePanelWidth.value - width
           : window.screenX + wm.poePanelWidth.value
@@ -137,7 +138,8 @@ export default defineComponent({
               y: window.screenY,
               width,
               height: window.innerHeight
-            }
+            },
+            dpr: window.devicePixelRatio
           }
         })
       }

renderer/src/web/settings/general.vue

@@ -16,7 +16,7 @@
       </div>
     </div>
     <div class="mb-2">
-      <div class="flex-1 mb-1">{{ t('Font size') }} <span class="bg-gray-200 text-gray-900 rounded px-1">{{ t('Restart required') }}</span></div>
+      <div class="flex-1 mb-1">{{ t('Font size') }}</div>
       <div class="mb-4 flex">
         <input v-model.number="fontSize" class="rounded bg-gray-900 px-1 block w-16 mb-1 font-poe text-center" />
         <span class="ml-1">px</span>

renderer/src/web/settings/utils.ts

@@ -1,6 +1,6 @@
 import { computed } from 'vue'
 import type { PropType } from 'vue'
-import type { Config } from '@ipc/types'
+import type { Config } from '@/web/Config'
 import type { Widget } from '@/web/overlay/interfaces'
 
 export function configProp<T = undefined> () {