drifty/WebMonkeyBall
1
0
Fork 0
mirror of https://github.com/sndrec/WebMonkeyBall.git synced 2026-02-03 10:13:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14 from coloradosazulyanaranjados/feature/allow-fullscree-on-ios

Browse Source 
feat: add iOS standalone PWA support for fullscreen
This commit is contained in:
Twilight
2026-01-28 04:09:35 -05:00
committed by GitHub
parent 4743f2deef 2d29662c2e
commit 0da5eea45e
3 changed files with 22 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
index.html
View File

@@ -2,8 +2,15 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>SMB1 Web Gameplay</title>
<!-- iOS: run without Safari UI when launched from Home Screen -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="theme-color" content="#000000" media="(prefers-color-scheme: dark)">
<meta name="theme-color" content="#000000" media="(prefers-color-scheme: light)">
<link rel="stylesheet" href="./style.css" />
<script type="importmap">
{

8
src/main.ts
View File

@@ -300,8 +300,12 @@ function maybeStartSmb2LikeStageFade() {
}
function resizeCanvasToDisplaySize(canvasElem: HTMLCanvasElement) {
const width = Math.floor(canvasElem.clientWidth * window.devicePixelRatio);
const height = Math.floor(canvasElem.clientHeight * window.devicePixelRatio);
const dpr = window.devicePixelRatio || 1;
const viewport = window.visualViewport;
const cssWidth = viewport?.width || canvasElem.clientWidth || window.innerWidth;
const cssHeight = viewport?.height || canvasElem.clientHeight || window.innerHeight;
const width = Math.floor(cssWidth * dpr);
const height = Math.floor(cssHeight * dpr);
if (canvasElem.width !== width || canvasElem.height !== height) {
canvasElem.width = width;
canvasElem.height = height;

10
style.css
View File

@@ -1,5 +1,6 @@
/* I changed the color-scheme because of the notch on ios ) : */
:root {
color-scheme: light;
color-scheme: dark;
--bg: #0b0b10;
--fg: #f3f3f3;
--muted: #b7b7c2;
@@ -11,7 +12,12 @@
box-sizing: border-box;
}
html,
/* iOS standalone: black background prevents white flash on load and sets notch/safe-area color */
html {
height: 100%;
background-color: #000;
}
body {
margin: 0;
padding: 0;