1超级玛丽-fork

作者@ted· Fork 自 1超级玛丽by @hardydai-cell

A complex Super Mario adventure game featuring multiple power-ups, different enemy types, moving platforms, projectile attacks, time limits, pipes, particles effects, and enhanced pixel art graphics.

预览
源代码版本 2
export default {
  async fetch(request, env) {
    const url = new URL(request.url);

    // API routes for high scores
    if (url.pathname.startsWith('/api/')) {
      if (url.pathname === '/api/scores' && request.method === 'GET') {
        try {
          const scores = await env.DB.prepare(`
            SELECT name, score, created_at 
            FROM high_scores 
            ORDER BY score DESC 
            LIMIT 10
          `).all();
          
          return new Response(JSON.stringify({ data: scores.results || [] }), {
            headers: { 'Content-Type': 'application/json' }
          });
        } catch (error) {
          return new Response(JSON.stringify({ error: 'Failed to fetch scores' }), {
            status: 500,
            headers: { 'Content-Type': 'application/json' }
          });
        }
      }

      if (url.pathname === '/api/scores' && request.method === 'POST') {
        try {
          const { name, score } = await request.json();
          
          await env.DB.prepare(`
            INSERT INTO high_scores (id, name, score, created_at)
            VALUES (?1, ?2, ?3, datetime('now'))
          `).bind(crypto.randomUUID(), name, score).run();

          return new Response(JSON.stringify({ ok: true }), {
            headers: { 'Content-Type': 'application/json' }
          });
        } catch (error) {
          return new Response(JSON.stringify({ error: 'Failed to save score' }), {
            status: 500,
            headers: { 'Content-Type': 'application/json' }
          });
        }
      }

      return new Response(JSON.stringify({ error: 'Not found' }), {
        status: 404,
        headers: { 'Content-Type': 'application/json' }
      });
    }

    // Serve HTML
    return new Response(getHTML(), {
      headers: { 'Content-Type': 'text/html' }
    });
  }
};

function getHTML() {
  return `<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>超级玛丽冒险 | Super Mario Adventure</title>
  <script src="https://cdn.tailwindcss.com"></script>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
  <style>
    body { font-family: 'Inter', sans-serif; }
    canvas { 
      image-rendering: pixelated; 
      border: 3px solid rgba(255,255,255,0.1);
      border-radius: 12px;
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);
    }
    .pixel-font {
      font-family: 'Courier New', monospace;
      font-weight: bold;
    }
    .power-up-glow {
      animation: powerGlow 2s ease-in-out infinite alternate;
    }
    @keyframes powerGlow {
      0% { box-shadow: 0 0 5px #FFD700; }
      100% { box-shadow: 0 0 20px #FFD700, 0 0 30px #FFD700; }
    }
  </style>
</head>
<body class="bg-gradient-to-br from-violet-900 via-purple-900 to-blue-900 min-h-screen text-white">
  <div class="container mx-auto px-4 py-8">
    <!-- Header -->
    <div class="text-center mb-8">
      <h1 class="text-4xl md:text-6xl font-bold bg-gradient-to-r from-yellow-400 to-red-500 bg-clip-text text-transparent mb-4">
        🍄 超级玛丽冒险 🍄
      </h1>
      <p class="text-lg text-purple-200">多元素复杂平台冒险游戏</p>
    </div>

    <!-- Game Container -->
    <div class="max-w-5xl mx-auto">
      <!-- Game Info -->
      <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
        <div class="bg-white/10 backdrop-blur rounded-xl p-4 text-center">
          <div class="pixel-font text-yellow-400">
            <span class="text-sm">分数</span>
            <div id="score" class="text-2xl font-bold">0</div>
          </div>
        </div>
        <div class="bg-white/10 backdrop-blur rounded-xl p-4 text-center">
          <div class="pixel-font text-green-400">
            <span class="text-sm">生命</span>
            <div id="lives" class="text-xl">❤️❤️❤️❤️❤️</div>
          </div>
        </div>
        <div class="bg-white/10 backdrop-blur rounded-xl p-4 text-center">
          <div class="pixel-font text-blue-400">
            <span class="text-sm">等级</span>
            <div id="level" class="text-2xl font-bold">1</div>
          </div>
        </div>
        <div class="bg-white/10 backdrop-blur rounded-xl p-4 text-center">
          <div class="pixel-font text-purple-400">
            <span class="text-sm">时间</span>
            <div id="timer" class="text-2xl font-bold">300</div>
          </div>
        </div>
      </div>

      <!-- Power-ups Status -->
      <div class="flex justify-center mb-4">
        <div class="bg-white/10 backdrop-blur rounded-xl p-4 flex space-x-4">
          <div id="powerStatus" class="flex space-x-2 text-sm">
            <span class="text-gray-400">状态: 普通</span>
          </div>
        </div>
      </div>

      <!-- Game Canvas -->
      <div class="flex justify-center mb-6">
        <canvas id="gameCanvas" width="900" height="500" class="max-w-full h-auto"></canvas>
      </div>

      <!-- Controls -->
      <
...

评论 (0)

还没有评论,来写第一条吧!