From 092f91c79eb3178477daf605a78c7357bf5f7548 Mon Sep 17 00:00:00 2001
From: Philip Wagner <philip@think-jeckel.de>
Date: Mon, 21 Oct 2024 13:02:09 +0200
Subject: [PATCH] pattern: fix

---
 site/templates/home.php | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/site/templates/home.php b/site/templates/home.php
index 0728db7..9c62195 100644
--- a/site/templates/home.php
+++ b/site/templates/home.php
@@ -17,15 +17,20 @@ const MOBILE_BIG = 19.5
 let small = NORMAL_SMALL
 let big = NORMAL_BIG
 
+let dpr = window.devicePixelRatio || 1
+let IS_DESKTOP = true
+
 function setupCanvas(canvas) {
-	const dpr = window.devicePixelRatio || 1
+	dpr = window.devicePixelRatio || 1
 	const rect = canvas.getBoundingClientRect()
 	canvas.width = rect.width * dpr
 	canvas.height = rect.height * dpr
 	const ctx = canvas.getContext('2d')
 	ctx.scale(dpr, dpr)
 
-	if ((canvas.width / dpr) > 750) {
+	IS_DESKTOP = (canvas.width / dpr) > 750
+
+	if (IS_DESKTOP) {
 		small = NORMAL_SMALL
 		big = NORMAL_BIG
 	} else {
@@ -102,18 +107,15 @@ function bg(colorIndex, canvas, ctx, randomColors) {
 }
   
 function font(colorIndex, canvas, ctx) {
-	if (canvas.width > 750) {
+	if (IS_DESKTOP) {
 		ctx.font = '195px Kobata'
-
-		kerningNormal = { R: -12, E: -27, C: -13, A: -13, P: -13, I: -13, T: -13, U: -13, L: -13, N: -13, G: -13 }
-		kerningWide = { Q: 178.7, U: 178.7, E: 178.7 }
 	} else {
 		ctx.font = '74px Kobata'
-
-		kerningNormal = { R: -6, E: -13, C: -6, A: -6, P: -6, I: -6, T: -6, U: -6, L: -6, N: -6, G: -6 }
-		kerningWide = { Q: 38, U: 38, E: 38 }
 	}
 
+	let kerningNormal = { R: -12, E: -27, C: -13, A: -13, P: -13, I: -13, T: -13, U: -13, L: -13, N: -13, G: -13 }
+	let kerningWide = { Q: 178.7, U: 178.7, E: 178.7 }
+
 	const patterns = [
 		[0],
 		[0, 1]
@@ -131,7 +133,7 @@ function font(colorIndex, canvas, ctx) {
 
 			if (kerning[char]) {
 				let k = kerning[char]
-				if (canvas.width < 750) k = k * 0.51724138
+				if (!IS_DESKTOP) k = k * (0.34482759 * (1 / dpr))
 				x += k
 			}