---
title: Flare 網頁版
emoji: ⚔️
colorFrom: yellow
colorTo: red
sdk: static
pinned: false
license: cc-by-sa-3.0
short_description: Flare Empyrean Campaign 手機掛機網頁版
---

# Flare 網頁版（手機掛機 RPG）

以 [Flare: Empyrean Campaign](https://github.com/flareteam/flare-game) 的原始資料（地圖、圖塊、怪物、技能、動畫）
改寫成純 HTML / JS（Canvas）的網頁版，操作簡化為可用手機點擊完成。

## 操作

| 功能 | 手機 | 電腦 |
|---|---|---|
| 移動 | 拖曳左下角透明方向搖桿 | 方向鍵 / WASD |
| 點地圖自動尋路 | 點地面 | 點地面 |
| 鎖定怪物 / 追擊 | 點怪物 | 自動鎖定（L 切換） |
| 普攻 | 右下「攻擊」 | 空白鍵 |
| 技能（點擊施放） | 右下弧形技能鈕 | 1 ~ 4 |
| 藥水 | HP / MP 鈕 | Q / E |
| 背包 / 裝備 | 左側「背包」鈕 | I 或 B |
| 商店 | 點商人（會自動走過去） | 點商人 |
| 掛機 | 右上「掛機 ON/OFF」 | F |
| 小地圖 | 點小地圖可尋路 | — |

掛機會自動鎖定最近（可走路徑最短）的怪物、尋路追擊、施放技能、在 HP / MP 過低時喝藥、撿拾掉落物。
地圖之間以原版的傳送點相連（goblin_camp ↔ stonewood ↔ salted_field …）。進度自動存在瀏覽器 localStorage。

## 與原版的差異（簡化）

- 地圖、圖塊、碰撞、怪物外觀與動畫方向沿用原版資料（等距投影、Flare 的 `calcDirection`）。
- 數值與原版引擎相同（已用獨立腳本逐項驗證）：
  - 怪物：等級、HP、XP、命中、閃避、吸收、近戰／遠程／魔法傷害、技能（含倍率、機率、冷卻、飛彈）與生成規則
    （群組等級範圍、稀有度權重 common 6 / uncommon 3 / rare 1、群組機率、wander_radius）取自原版檔案；遠程怪會射擊。
  - 經驗：擊殺獎勵 = 怪物 `xp` 欄位 ×（100 + 經驗加成）%；升級表為原版（Lv2=256、Lv3=768… 上限 Lv20）。
  - 英雄：HP / MP / 傷害 / 命中 / 閃避 / 暴擊 / 回復依 `engine/stats.txt` 公式；每級 5 能力點，自行加在體能、精神、攻擊、防禦（上限 75），
    掛機時自動分配（主屬性 : 防禦 = 3 : 2）。
  - 戰鬥判定依引擎 `takeHit`：命中 / 閃避、未命中仍有 25–50% 傷害、超額命中 125–150%、吸收 0–90%、暴擊 200%、元素抗性。
  - 掉落：依 `LootManager::checkLoot` 的規則（單次抽選、稀有度取代、尋寶加成、`loot_count`、固定掉落、等級限制、每級數量加成）。
  - 物品與裝備條件：物品定義（類型、品質、傷害、吸收、加成、價格、等級、需求、旗標）逐欄與原版一致；穿戴需求為「等級＋每項主屬性」，
    需求不足的裝備無法穿上，穿著中若條件不再滿足會自動退回背包；技能依裝備旗標限制（Shield Bash 需盾牌、Shoot 需遠程武器、Channel 需法術武器）；
    兩組裝備可切換（職業初始：第 1 組為武器與防具、第 2 組僅布衣）。
  - 技能：完整的原版技能系統（Warrior / Ranger / Magician 三個技能樹，共 36 個技能、每個最多 5 級、被動技能、召喚），
    每級 2 技能點，學習條件（等級、主屬性、前置技能）與原版相同；技能由「危害物」引擎執行（近戰範圍、飛彈、連發、
    連鎖技能、效果：流血／中毒／暈眩／緩速／擊退／護盾／加速／吸血／元素弱化…），60 幀邏輯、動畫有效影格才出傷害、
    受擊硬直（poise）。怪物的攻擊與技能走同一套引擎，包含遠程、召喚、死亡／半血觸發。
  - Mastite（Boss 專屬隨機裝備）依原版規則生成：物品等級、品質、傷害／吸收／需求／價格與加成皆隨機且依等級縮放；
    藥水價格依玩家等級縮放。
  - 與原版不同之處：沒有任務、劇情對話與任務經驗；怪物死後會重生（原版不會）；怪物逃跑／追擊機率等部分 AI 細節與
    地圖物件（寶箱、機關、傳送 NPC）未實作；沒有音效與音樂；Sacrifice 被動（需任務狀態）無法取得。

## 檔案結構（純 HTML + JS）

- `index.html`：整個遊戲（CSS、JS、全域資料內嵌在這一個檔案，不需要 Python 或建置步驟）。
- `data/maps/`：每張地圖一個 JSON（含該圖怪物資料），進入時才讀取。
- `assets/`：圖片（地圖圖塊、怪物與角色動畫圖集、技能與物品圖示）。

## 開發交接

給接手的人／模型：請先讀 `HANDOFF.md`（架構、建置與部署流程、設計決策、驗證腳本、已知缺口、開發紀錄）；驗證腳本在 `tests/`。

## 授權

素材與資料取自 Flare: Empyrean Campaign（CC-BY-SA 3.0，原作者 Clint Bellanger 與貢獻者）；
程式碼部分為本網頁版改寫。