From 3e9061a6980221164d0f6bcf5d3f597805fbb061 Mon Sep 17 00:00:00 2001
From: kj_sh604
Date: Sun, 1 Mar 2026 19:42:23 -0500
Subject: fix: offset images
---
src/index.php | 35 +++++++++++++++++++++++++++--------
1 file changed, 27 insertions(+), 8 deletions(-)
diff --git a/src/index.php b/src/index.php
index 5360366..40bd103 100644
--- a/src/index.php
+++ b/src/index.php
@@ -7,7 +7,7 @@
sent-web
-
+
@@ -105,8 +105,8 @@ questions?
bg: '#ffffff',
fontFamily: '',
lineSpacing: 1.25,
- usableWidth: 0.80,
- usableHeight: 0.80,
+ usableWidth: 0.85,
+ usableHeight: 0.85,
},
init() {
@@ -245,10 +245,15 @@ questions?
});
// stop presentation whenever fullscreen is exited (covers browser-
- // intercepted Escape that never reaches the keydown handler)
+ // intercepted Escape that never reaches the keydown handler).
+ // Re-render on enter so the slide is drawn with the settled fullscreen
+ // viewport dimensions (requestFullscreen is async, so the initial
+ // renderSlide() call may use pre-fullscreen vw/vh values).
document.addEventListener('fullscreenchange', () => {
if (!document.fullscreenElement && this.presenting) {
this.stopPresentation();
+ } else if (document.fullscreenElement && this.presenting) {
+ this.renderSlide();
}
});
},
@@ -361,6 +366,10 @@ questions?
content.innerHTML = '';
if (slide.img) {
+ // center image slides — override the text-layout defaults
+ pres.style.justifyContent = 'center';
+ pres.style.alignItems = 'center';
+ pres.style.paddingLeft = '0';
const img = document.createElement('img');
if (slide.img.startsWith('http://') || slide.img.startsWith('https://')) {
img.src = slide.img;
@@ -368,13 +377,23 @@ questions?
img.src = 'uploads/' + slide.img;
}
img.alt = slide.img;
- img.style.maxWidth = (this.settings.usableWidth * 100) + 'vw';
- img.style.maxHeight = (this.settings.usableHeight * 100) + 'vh';
- img.style.width = (this.settings.usableWidth * 100) + 'vw';
- img.style.height = (this.settings.usableHeight * 100) + 'vh';
+ // changed to reflect the fullscreen viewport.
+ const pw = pres.offsetWidth || window.innerWidth;
+ const ph = pres.offsetHeight || window.innerHeight;
+ const maxW = Math.floor(pw * this.settings.usableWidth);
+ const maxH = Math.floor(ph * this.settings.usableHeight);
+ img.style.width = maxW + 'px';
+ img.style.height = maxH + 'px';
+ img.style.maxWidth = maxW + 'px';
+ img.style.maxHeight = maxH + 'px';
img.style.objectFit = 'contain';
+ img.style.display = 'block';
content.appendChild(img);
} else {
+ // restore text-layout defaults
+ pres.style.justifyContent = 'flex-start';
+ pres.style.alignItems = 'center';
+ pres.style.paddingLeft = '7.5%';
const fontSize = this.calcFontSize(slide.lines);
content.style.fontSize = fontSize + 'px';
content.style.lineHeight = String(this.settings.lineSpacing);
--
cgit v1.2.3