From 9e4801e33d7dfe12a3f1e31143e66e91d644306d Mon Sep 17 00:00:00 2001
From: Beni Keller <nospam@example.com>
Date: Sat, 5 Dec 2020 11:06:59 +0100
Subject: [PATCH] Use transform to fit slide into browser window

---
 weenote.js | 42 +++++++++++++++++++++++++-----------------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/weenote.js b/weenote.js
index f93853f..01c30c3 100644
--- a/weenote.js
+++ b/weenote.js
@@ -5,26 +5,34 @@ onload = function() {
 
   function fit(el) {
     var style = el.style
-    var i = 1000
-    var top
-    var left
-
-    style.display  = "inline"
-    style.fontSize = i + "px"
+    var font = 200
+    var margin = 15;
+    var width, height;
+    var scalex, scaley, scale;
+    
+    style.fontSize = font + "px"
     style.position = "absolute"
-
-    while (1) {
-      left = innerWidth - el.offsetWidth
-      top  = innerHeight - el.offsetHeight
-
-      if (top > 0 && left > 0) break
-
-      style.fontSize = (i -= i * 0.05) + "px"
+    style.display = "block"
+    width = innerWidth - 2*margin;
+    height = innerHeight - 2*margin;
+    style.margin = margin + "px";
+
+    scalex = width/el.offsetWidth
+    scaley = height/el.offsetHeight
+   
+    if (scalex > scaley) {
+      scale = scaley;
+      // Center the content horizontally
+      style.left = (innerWidth - el.offsetWidth*scale)/2 + "px";
+    } else {
+      scale = scalex;
+      // Center the contetent vertically
+      style.top = (innerHeight - el.offsetHeight*scale)/2 + "px";
     }
 
-    style.display = "block"
-    style.top     = top / 2 + "px"
-    style.left    = left / 2 + "px"
+    style["transform-origin"] = "0 0"
+    style.transform = `scale(${scale})`
+
   }
 
   for (var el, count = 0; el = body.firstChild;) {