fix view port rendering to include
All checks were successful
Dynamic Branch Deploy / build-and-deploy (push) Successful in 7m3s
All checks were successful
Dynamic Branch Deploy / build-and-deploy (push) Successful in 7m3s
This commit is contained in:
@@ -856,6 +856,41 @@ function restartGame() {
|
||||
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
|
||||
window.showMenu = showMenu;
|
||||
window.hideMenu = hideMenu;
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
<body>
|
||||
|
||||
<button id="mute-btn" onclick="toggleAudio()">🔊</button>
|
||||
<button id="fullscreen-btn" onclick="toggleFullscreen()" title="Vollbild">⛶</button>
|
||||
|
||||
<div id="rotate-overlay">
|
||||
<div class="icon">📱↻</div>
|
||||
|
||||
@@ -43,6 +43,8 @@ input[type=range]{width:100%;max-width:300px}
|
||||
@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: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}
|
||||
.icon{font-size:60px;margin-bottom:20px}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user