limbo_pass/index.html at main · shnewto/limbo_pass · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>limbo pass</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html, body {
            width: 100%;
            height: 100%;
            overflow: hidden;
            background-color: #0a0e17;
        }

        canvas {
            display: block;
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <div id="mobile-message" style="display: none; width: 100%; height: 100%; align-items: center; justify-content: center; color: #e0e0e0; font-family: monospace; text-align: center; padding: 20px; box-sizing: border-box;">
        <div>
            <h1 style="font-size: 32px; margin-bottom: 20px;">limbo pass</h1>
            <p style="font-size: 18px; line-height: 1.6;">there's no road to limbo pass on mobile or touch screens</p>
        </div>
    </div>
    <script src="sound.js"></script>
    <script type="module">
        // Check if device is mobile or touch screen
        const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
        const isTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 0;

        if (isMobile || isTouch) {
            const message = document.getElementById('mobile-message');
            message.style.display = 'flex';
        } else {
            import('./target/wasm32-unknown-unknown/release/limbo_pass.js').then(module => {
                module.default().catch((error) => {
                    console.error('Failed to initialize WASM:', error);
                    document.body.innerHTML = '<div style="color: white; padding: 20px; font-family: monospace;">Error loading game: ' + error + '</div>';
                });
            }).catch((error) => {
                console.error('Failed to load WASM module:', error);
                document.body.innerHTML = '<div style="color: white; padding: 20px; font-family: monospace;">Error loading game: ' + error + '</div>';
            });
        }
    </script>
</body>
</html>