Initial commit

2026-04-30 02:14:25 +00:00
commit 7090e6f01d
243 changed files with 115122 additions and 0 deletions
@@ -0,0 +1,356 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+    <title>Lights Out</title>
+    <style>
+        * { margin: 0; padding: 0; box-sizing: border-box; }
+        html, body { width: 100%; height: 100%; overflow: hidden; background: #1a1a2e; touch-action: none; font-family: Arial, sans-serif; }
+        canvas { display: block; }
+    </style>
+</head>
+<body>
+<canvas id="game"></canvas>
+<script>
+const AudioContext = window.AudioContext || window.webkitAudioContext;
+let audioCtx = null;
+let musicEnabled = true;
+let sfxEnabled = true;
+let musicPlaying = false;
+
+function initAudio() {
+    if (!audioCtx) audioCtx = new AudioContext();
+    if (audioCtx.state === 'suspended') audioCtx.resume();
+}
+
+// Relaxing puzzle melody
+const melody = [
+    {n: 392, d: 0.5}, {n: 440, d: 0.5}, {n: 494, d: 0.5}, {n: 523, d: 1.0},
+    {n: 494, d: 0.5}, {n: 440, d: 0.5}, {n: 392, d: 1.0},
+    {n: 330, d: 0.5}, {n: 349, d: 0.5}, {n: 392, d: 0.5}, {n: 440, d: 1.0},
+    {n: 392, d: 0.5}, {n: 349, d: 0.5}, {n: 330, d: 1.0}, {n: 0, d: 0.5}
+];
+
+const bass = [
+    {n: 98, d: 1.0}, {n: 110, d: 1.0}, {n: 131, d: 1.0}, {n: 110, d: 1.0},
+    {n: 82, d: 1.0}, {n: 87, d: 1.0}, {n: 98, d: 1.0}, {n: 110, d: 1.0}
+];
+
+let melodyIdx = 0, bassIdx = 0, nextMelody = 0, nextBass = 0;
+
+function playTone(freq, dur, type = 'triangle', vol = 0.06) {
+    if (!audioCtx || !musicEnabled || freq === 0) return;
+    const osc = audioCtx.createOscillator();
+    const gain = audioCtx.createGain();
+    osc.type = type;
+    osc.frequency.value = freq;
+    gain.gain.setValueAtTime(vol, audioCtx.currentTime);
+    gain.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + dur * 0.9);
+    osc.connect(gain);
+    gain.connect(audioCtx.destination);
+    osc.start();
+    osc.stop(audioCtx.currentTime + dur);
+}
+
+function playSfx(type) {
+    if (!audioCtx || !sfxEnabled) return;
+    const osc = audioCtx.createOscillator();
+    const gain = audioCtx.createGain();
+    if (type === 'toggle') {
+        osc.frequency.value = 440;
+        gain.gain.setValueAtTime(0.12, audioCtx.currentTime);
+        gain.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 0.1);
+    } else if (type === 'win') {
+        osc.frequency.setValueAtTime(523, audioCtx.currentTime);
+        osc.frequency.setValueAtTime(659, audioCtx.currentTime + 0.15);
+        osc.frequency.setValueAtTime(784, audioCtx.currentTime + 0.3);
+        osc.frequency.setValueAtTime(1047, audioCtx.currentTime + 0.45);
+        gain.gain.setValueAtTime(0.2, audioCtx.currentTime);
+        gain.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 0.6);
+    }
+    osc.type = 'square';
+    osc.connect(gain);
+    gain.connect(audioCtx.destination);
+    osc.start();
+    osc.stop(audioCtx.currentTime + 0.7);
+}
+
+function updateMusic() {
+    if (!audioCtx || !musicEnabled || !musicPlaying) return;
+    const now = audioCtx.currentTime;
+    if (now >= nextMelody) {
+        const note = melody[melodyIdx];
+        playTone(note.n, note.d, 'triangle', 0.05);
+        nextMelody = now + note.d;
+        melodyIdx = (melodyIdx + 1) % melody.length;
+    }
+    if (now >= nextBass) {
+        const note = bass[bassIdx];
+        playTone(note.n, note.d, 'triangle', 0.08);
+        nextBass = now + note.d;
+        bassIdx = (bassIdx + 1) % bass.length;
+    }
+}
+
+function startMusic() {
+    if (!musicPlaying && musicEnabled) {
+        initAudio();
+        musicPlaying = true;
+        nextMelody = audioCtx.currentTime;
+        nextBass = audioCtx.currentTime;
+    }
+}
+
+const canvas = document.getElementById('game');
+const ctx = canvas.getContext('2d');
+let W, H, safeTop, safeBottom;
+
+function resize() {
+    W = window.innerWidth;
+    H = window.innerHeight;
+    canvas.width = W;
+    canvas.height = H;
+    safeTop = H * 0.1;
+    safeBottom = H * 0.9;
+}
+resize();
+window.addEventListener('resize', resize);
+
+const SIZE = 5;
+let grid = [];
+let moves = 0;
+let level = 1;
+let gameOver = false;
+let gameRunning = false;
+
+function createGrid() {
+    grid = [];
+    for (let r = 0; r < SIZE; r++) {
+        grid.push(new Array(SIZE).fill(false));
+    }
+}
+
+function shuffleGrid(numMoves) {
+    // Make a solvable puzzle by performing random toggles
+    for (let i = 0; i < numMoves; i++) {
+        const r = Math.floor(Math.random() * SIZE);
+        const c = Math.floor(Math.random() * SIZE);
+        toggle(r, c, false); // Don't count these as moves
+    }
+}
+
+function toggle(row, col, countMove = true) {
+    const directions = [[0, 0], [-1, 0], [1, 0], [0, -1], [0, 1]];
+    for (const [dr, dc] of directions) {
+        const nr = row + dr;
+        const nc = col + dc;
+        if (nr >= 0 && nr < SIZE && nc >= 0 && nc < SIZE) {
+            grid[nr][nc] = !grid[nr][nc];
+        }
+    }
+    if (countMove) {
+        moves++;
+        playSfx('toggle');
+    }
+}
+
+function isWin() {
+    return grid.every(row => row.every(cell => !cell));
+}
+
+function init() {
+    createGrid();
+    moves = 0;
+    gameOver = false;
+    gameRunning = true;
+    // Easy start - fewer toggles needed
+    shuffleGrid(3 + level);
+    startMusic();
+}
+
+function nextLevel() {
+    level++;
+    createGrid();
+    shuffleGrid(3 + level);
+    moves = 0;
+    gameOver = false;
+}
+
+canvas.addEventListener('click', e => {
+    initAudio();
+    handleClick(e.clientX, e.clientY);
+});
+
+canvas.addEventListener('touchstart', e => {
+    e.preventDefault();
+    initAudio();
+    handleClick(e.touches[0].clientX, e.touches[0].clientY);
+});
+
+function handleClick(x, y) {
+    if (gameOver) {
+        if (level < 10) {
+            nextLevel();
+        } else {
+            level = 1;
+            init();
+        }
+        return;
+    }
+
+    // Calculate grid position
+    const availH = safeBottom - safeTop - 80;
+    const availW = W - 40;
+    const cellSize = Math.min(availW / SIZE, availH / SIZE);
+    const gridSize = cellSize * SIZE;
+    const gridX = (W - gridSize) / 2;
+    const gridY = safeTop + 60 + (availH - gridSize) / 2;
+
+    const col = Math.floor((x - gridX) / cellSize);
+    const row = Math.floor((y - gridY) / cellSize);
+
+    if (row >= 0 && row < SIZE && col >= 0 && col < SIZE) {
+        toggle(row, col);
+
+        if (isWin()) {
+            gameOver = true;
+            playSfx('win');
+        }
+    }
+}
+
+document.addEventListener('keydown', e => {
+    initAudio();
+    if ((e.key === ' ' || e.key === 'Enter') && gameOver) {
+        if (level < 10) nextLevel();
+        else { level = 1; init(); }
+    }
+    if (e.key === 'r' || e.key === 'R') init();
+});
+
+function update() {
+    updateMusic();
+}
+
+function draw() {
+    // Background
+    ctx.fillStyle = '#1a1a2e';
+    ctx.fillRect(0, 0, W, H);
+
+    // Safe zones
+    ctx.fillStyle = '#16213e';
+    ctx.fillRect(0, 0, W, safeTop);
+    ctx.fillRect(0, safeBottom, W, H - safeBottom);
+
+    // Header
+    ctx.fillStyle = '#fff';
+    ctx.font = 'bold 24px Arial';
+    ctx.textAlign = 'center';
+    ctx.fillText('LIGHTS OUT', W / 2, 40);
+
+    ctx.font = '18px Arial';
+    ctx.textAlign = 'left';
+    ctx.fillText(`Level: ${level}`, 20, 35);
+    ctx.textAlign = 'right';
+    ctx.fillText(`Moves: ${moves}`, W - 20, 35);
+
+    // Calculate grid
+    const availH = safeBottom - safeTop - 80;
+    const availW = W - 40;
+    const cellSize = Math.min(availW / SIZE, availH / SIZE);
+    const gridSize = cellSize * SIZE;
+    const gridX = (W - gridSize) / 2;
+    const gridY = safeTop + 60 + (availH - gridSize) / 2;
+
+    // Instructions
+    ctx.fillStyle = '#888';
+    ctx.font = '16px Arial';
+    ctx.textAlign = 'center';
+    ctx.fillText('Turn off all the lights!', W / 2, gridY - 15);
+
+    // Draw grid
+    for (let r = 0; r < SIZE; r++) {
+        for (let c = 0; c < SIZE; c++) {
+            const x = gridX + c * cellSize;
+            const y = gridY + r * cellSize;
+            const padding = 4;
+
+            // Cell background
+            ctx.fillStyle = '#0f0f23';
+            ctx.beginPath();
+            ctx.roundRect(x + padding, y + padding, cellSize - padding * 2, cellSize - padding * 2, 8);
+            ctx.fill();
+
+            // Light
+            if (grid[r][c]) {
+                // Light ON - yellow glow
+                ctx.fillStyle = '#ffd700';
+                ctx.shadowColor = '#ffd700';
+                ctx.shadowBlur = 20;
+                ctx.beginPath();
+                ctx.roundRect(x + padding + 4, y + padding + 4, cellSize - padding * 2 - 8, cellSize - padding * 2 - 8, 6);
+                ctx.fill();
+                ctx.shadowBlur = 0;
+            } else {
+                // Light OFF - dark
+                ctx.fillStyle = '#2a2a4a';
+                ctx.beginPath();
+                ctx.roundRect(x + padding + 4, y + padding + 4, cellSize - padding * 2 - 8, cellSize - padding * 2 - 8, 6);
+                ctx.fill();
+            }
+        }
+    }
+
+    // Count lights on
+    const lightsOn = grid.flat().filter(c => c).length;
+    ctx.fillStyle = '#888';
+    ctx.font = '16px Arial';
+    ctx.textAlign = 'center';
+    ctx.fillText(`Lights remaining: ${lightsOn}`, W / 2, gridY + gridSize + 30);
+
+    // Controls hint
+    ctx.fillStyle = '#666';
+    ctx.font = '14px Arial';
+    ctx.fillText('Tap a light to toggle it and its neighbors', W / 2, safeBottom + 25);
+
+    // Win screen
+    if (gameOver) {
+        ctx.fillStyle = 'rgba(0,0,0,0.85)';
+        ctx.fillRect(0, 0, W, H);
+        ctx.fillStyle = '#ffd700';
+        ctx.font = 'bold 36px Arial';
+        ctx.textAlign = 'center';
+        ctx.fillText('LEVEL COMPLETE!', W / 2, H / 2 - 50);
+        ctx.fillStyle = '#fff';
+        ctx.font = '24px Arial';
+        ctx.fillText(`Solved in ${moves} moves`, W / 2, H / 2);
+
+        ctx.fillStyle = '#ffd700';
+        ctx.beginPath();
+        ctx.roundRect(W / 2 - 100, H / 2 + 30, 200, 50, 10);
+        ctx.fill();
+        ctx.fillStyle = '#000';
+        ctx.font = 'bold 18px Arial';
+        ctx.fillText(level < 10 ? 'NEXT LEVEL' : 'PLAY AGAIN', W / 2, H / 2 + 62);
+    }
+}
+
+function gameLoop() {
+    update();
+    draw();
+    requestAnimationFrame(gameLoop);
+}
+
+window.gameScore = 0;
+Object.defineProperty(window, 'gameScore', { get: () => level * 100 - moves });
+window.pauseGame = () => { gameRunning = false; musicPlaying = false; };
+window.resumeGame = () => { if (!gameOver) { gameRunning = true; startMusic(); } };
+window.setMusicEnabled = (v) => { musicEnabled = v; if (!v) musicPlaying = false; };
+window.setSfxEnabled = (v) => { sfxEnabled = v; };
+
+init();
+gameLoop();
+</script>
+</body>
+</html>