🏆 幸運抽獎工具

一個單一 HTML 檔案的公平抽獎工具，適用於公司內部各類抽獎活動。

✨ 功能特色

• 單檔運行：只需一個 HTML 檔案，無需安裝任何軟體
• 公平抽獎：使用密碼學安全的隨機演算法 (Fisher-Yates + crypto.getRandomValues)
• 炫酷動畫：抽獎時的名字滾動效果，可在設定中開關
• 高度客製化：編輯模式下可自訂標題、LOGO、顏色等
• 歷史紀錄：自動保存最近 9 筆抽獎紀錄，可點擊還原
• 響應式設計：支援桌面、平板、手機各種裝置
• 資料持久化：所有設定、名單、結果會自動保存在瀏覽器中

---

🚀 如何使用

1. 開啟檔案

直接用瀏覽器（Chrome、Edge、Firefox）開啟 lucky-draw.html 即可。

2. 編輯模式（設定活動資訊）

點擊右上角的 ⚙️ 按鈕進入編輯模式，可設定：

設定項目	說明
活動標題	顯示在頁面上方的活動名稱
LOGO 圖片	上傳活動 LOGO（會轉為 Base64 儲存）
顯示抽獎動畫	開關抽獎時的滾動動畫效果
背景顏色	頁面背景色
中獎者顏色	中獎者名字的高亮顏色
強調色	按鈕等強調元素的顏色
區塊標題	左右兩側區塊的標題文字
抽獎按鈕文字	抽獎按鈕上的文字

設定完成後再次點擊 ✅ 按鈕即可套用設定。

3. 輸入參加者名單

在左側「參加者名單」區域輸入參加者，每行一位：

王小明
李大華
陳美玲
林志偉
張雅婷

4. 設定抽出人數

在「抽出人數」欄位輸入要抽出的中獎人數。

5. 開始抽獎

點擊「開始抽獎！」按鈕，會顯示：

1. 名字滾動動畫 - 增加緊張感
2. 逐一揭曉得獎者 - 依序顯示每位中獎者
3. 最終結果 - 右側顯示完整排序結果，前 N 名以金色標示中獎

6. 複製結果

點擊右側的複製按鈕：

• 「📋 中獎者」：複製中獎名單
• 「📋 未中獎」：複製未中獎名單

7. 還原歷史紀錄

點擊下方「歷史紀錄」中的任一筆紀錄，可還原當時的參加者名單與抽獎結果。

---

🔐 技術說明（資安審查用）

演算法公平性

本工具使用 Fisher-Yates (Knuth) 洗牌演算法，這是學術界公認最公平的洗牌演算法：

• 每個參加者出現在任何位置的機率均為 1/n
• 時間複雜度 O(n)，空間複雜度 O(1)
• 無任何統計偏差

隨機數來源

使用瀏覽器的 crypto.getRandomValues() API，這是密碼學安全的隨機數生成器 (CSPRNG)：

• 符合 NIST SP 800-90A 標準
• 無法被預測或逆向推導
• 比 Math.random() 更安全

資安特性

項目	說明
無外部請求	程式不會發送任何網路請求
無第三方套件	不依賴任何 npm 套件
資料儲存	僅使用 localStorage，資料存在本機
無後門	程式碼完全透明，可逐行審查

---

💾 資料儲存

所有資料儲存在瀏覽器的 localStorage 中：

• 儲存鍵名：lucky-draw-data-v1
• 儲存內容：設定、參加者名單、抽獎結果、歷史紀錄、字體大小
• 注意事項：
  • 檔案搬動位置會導致資料遺失
  • 清除瀏覽器資料會清除抽獎紀錄
  • LOGO 圖片建議不超過 1MB

---

❓ 常見問題

Q: 可以同時在多台電腦使用嗎？

A: 可以，但資料不會同步。每台電腦的 localStorage 是獨立的。

Q: 資料可以匯出備份嗎？

A: 目前版本沒有匯出功能，但歷史紀錄會自動保存。

Q: 如何重置所有設定？

A: 清除瀏覽器的網站資料，或在開發者工具中刪除 lucky-draw-data-v1 這個 localStorage 項目。

Q: 為什麼 LOGO 上傳失敗？

A: 可能是圖片太大，建議使用小於 1MB 的圖片。

---

📄 版本資訊

• 版本: 1.1.0
• 最後更新: 2026-01-18
• 作者: 內部工具開發