Sonic 2 Móvil

25 argghh

Abrir en el editor Publica tu código

Recomendado

13 January 2025

Un código de mo832860

10 September 2024

Piedra, papel, tijera V.2

12 May 2026

Bob el ladrón 2

HTML

<!doctype html>
<html lang="en-us">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <title>cool ixl work</title>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap');
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html, body { height: 100%; width: 100%; overflow: hidden; background: #000; font-family: 'Inter', sans-serif; text-align: center; }
        #canvasWrapper { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background: black; z-index: 1; overflow: hidden; display: flex; align-items: center; justify-content: center; }
        canvas { display: block; position: absolute; image-rendering: pixelated; image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor; outline: none; }
        #output { display: none; }
        #loading-screen { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #333; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 1000; transition: opacity 0.4s ease; }
        #loading-screen.fade-out { opacity: 0; pointer-events: none; }
        #loading-screen.hidden { display: none; }
        .loading-mb { color: #eee; font-size: 15px; font-weight: 700; }
        .control-panel { position: fixed; top: 15px; right: 15px; z-index: 1001; }
        .game-btn { background: rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.2); border-radius: 6px; color: white; padding: 8px 12px; font-size: 12px; cursor: pointer; display: flex; align-items: center; gap: 8px; backdrop-filter: blur(4px); transition: all 0.2s; min-width: 130px; font-family: 'Inter', sans-serif; }
    </style>
</head>
<body>
    <div id="canvasWrapper">
        <canvas id="canvas" tabindex="0" width="848" height="480" onclick="window.focus();" oncontextmenu="event.preventDefault();"></canvas>
    </div>

<div class="control-panel">
        <button id="fullscreen-button" class="game-btn">
            <svg width="14" height="14" viewBox="0 0 24 24" fill="white"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg>
            Fullscreen
        </button>
    </div>

$('fullscreen-button').onclick = () => {
            if (!document.fullscreenElement) document.documentElement.requestFullscreen();
            else document.exitFullscreen();
        };

(function() {
            const BASE_W = 848, BASE_H = 480;
            function applyFit(el) {
                if (!el) return;
                const vw = window.innerWidth, vh = window.innerHeight;
                const isFS = !!document.fullscreenElement;
                const scale = isFS ? Math.max(vw/BASE_W, vh/BASE_H) : Math.min(vw/BASE_W, vh/BASE_H);
                const dw = Math.round(BASE_W * scale), dh = Math.round(BASE_H * scale);
                el.style.width = dw + 'px'; el.style.height = dh + 'px';
                el.style.left = Math.round((vw - dw)/2) + 'px'; el.style.top = Math.round((vh - dh)/2) + 'px';
            }
            window.addEventListener('resize', () => document.querySelectorAll('canvas').forEach(applyFit));
            document.addEventListener('fullscreenchange', () => document.querySelectorAll('canvas').forEach(applyFit));
            setInterval(() => document.querySelectorAll('canvas').forEach(applyFit), 1000);
        })();

var DB_NAME = 'sonic2-saves', STORE_NAME = 'files';
        var _saveDB = null;
        var _savePath = null; 
        var _saveTimer = null;

function scheduleSave() {
            clearTimeout(_saveTimer);
            _saveTimer = setTimeout(persistSave, 800);
        }

document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'hidden') persistSave(); });
        window.addEventListener('beforeunload', persistSave);

CSS