ZB-Server/EscapeFromTeacher
Private
Public Access
1
0
Fork 0
Code Activity

fix view port rendering to include
All checks were successful
Dynamic Branch Deploy / build-and-deploy (push) Successful in 7m3s

Browse Source
This commit is contained in:
Sebastian Unterschütz
2026-03-24 09:25:55 +01:00
parent bf2609e2a9
commit fc7cef4989
3 changed files with 38 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
cmd/client/web/game.js
View File

@@ -856,6 +856,41 @@ function restartGame() {
console.log('✅ Game restarted - ready to play again'); console.log('✅ Game restarted - ready to play again');
} }
// ===== FULLSCREEN =====
function toggleFullscreen() {
if (!document.fullscreenElement) {
document.documentElement.requestFullscreen().catch(() => {});
} else {
document.exitFullscreen().catch(() => {});
}
}
function updateFullscreenBtn() {
const btn = document.getElementById('fullscreen-btn');
if (!btn) return;
btn.textContent = document.fullscreenElement ? '✕' : '⛶';
btn.title = document.fullscreenElement ? 'Vollbild beenden' : 'Vollbild';
}
document.addEventListener('fullscreenchange', updateFullscreenBtn);
// Auto-Fullscreen beim ersten Nutzer-Klick
let autoFullscreenDone = false;
document.addEventListener('click', function requestAutoFullscreen() {
if (!autoFullscreenDone && !document.fullscreenElement) {
autoFullscreenDone = true;
document.documentElement.requestFullscreen().catch(() => {});
}
}, { once: false, capture: true });
document.addEventListener('touchstart', function requestAutoFullscreenTouch() {
if (!autoFullscreenDone && !document.fullscreenElement) {
autoFullscreenDone = true;
document.documentElement.requestFullscreen().catch(() => {});
}
}, { once: false, capture: true });
// Export functions for WASM to call // Export functions for WASM to call
window.showMenu = showMenu; window.showMenu = showMenu;
window.hideMenu = hideMenu; window.hideMenu = hideMenu;

1
cmd/client/web/index.html
View File

@@ -9,6 +9,7 @@
<body> <body>
<button id="mute-btn" onclick="toggleAudio()">🔊</button> <button id="mute-btn" onclick="toggleAudio()">🔊</button>
<button id="fullscreen-btn" onclick="toggleFullscreen()" title="Vollbild">⛶</button>
<div id="rotate-overlay"> <div id="rotate-overlay">
<div class="icon">📱↻</div> <div class="icon">📱↻</div>

2
cmd/client/web/style.css
View File

@@ -43,6 +43,8 @@ input[type=range]{width:100%;max-width:300px}
@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}} @keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
#mute-btn{position:fixed;top:10px;left:10px;z-index:10000;background:rgba(0,0,0,.5);border:2px solid #555;color:#fff;font-size:20px;width:40px;height:40px;border-radius:50%;cursor:pointer;padding:0;margin:0;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(0,0,0,.5)} #mute-btn{position:fixed;top:10px;left:10px;z-index:10000;background:rgba(0,0,0,.5);border:2px solid #555;color:#fff;font-size:20px;width:40px;height:40px;border-radius:50%;cursor:pointer;padding:0;margin:0;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(0,0,0,.5)}
#mute-btn:hover{background:rgba(255,255,255,.2);border-color:#fff} #mute-btn:hover{background:rgba(255,255,255,.2);border-color:#fff}
#fullscreen-btn{position:fixed;top:10px;right:10px;z-index:10000;background:rgba(0,0,0,.5);border:2px solid #555;color:#fff;font-size:18px;width:40px;height:40px;border-radius:50%;cursor:pointer;padding:0;margin:0;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(0,0,0,.5)}
#fullscreen-btn:hover{background:rgba(255,255,255,.2);border-color:#fff}
#rotate-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#222;z-index:99999;color:#fff;flex-direction:column;align-items:center;justify-content:center;text-align:center} #rotate-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#222;z-index:99999;color:#fff;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.icon{font-size:60px;margin-bottom:20px} .icon{font-size:60px;margin-bottom:20px}