import React, { useState, useCallback } from "react"; import { RotateCcw } from "lucide-react"; const LANG = (typeof navigator !== "undefined" ? navigator.language : "ko").slice(0, 2); const T = { ko: { title: "가위바위보", you: "나", ai: "AI", pick: "선택하세요!", win: "이겼다! 🎉", lose: "졌다... 😭", draw: "비겼다! 🤝", wins: "승", losses: "패", draws: "무", rate: "승률", reset: "전적 초기화", total: "총" }, en: { title: "Rock Paper Scissors", you: "You", ai: "AI", pick: "Pick one!", win: "You win! 🎉", lose: "You lose... 😭", draw: "Draw! 🤝", wins: "W", losses: "L", draws: "D", rate: "Win%", reset: "Reset", total: "Total" }, ja: { title: "じゃんけん", you: "あなた", ai: "AI", pick: "選んでください!", win: "勝ち! 🎉", lose: "負け... 😭", draw: "あいこ! 🤝", wins: "勝", losses: "負", draws: "引", rate: "勝率", reset: "リセット", total: "合計" }, zh: { title: "石头剪刀布", you: "你", ai: "AI", pick: "请选择!", win: "你赢了! 🎉", lose: "你输了... 😭", draw: "平局! 🤝", wins: "胜", losses: "负", draws: "平", rate: "胜率", reset: "重置", total: "共" }, }; const t = T[LANG] || T.en; var CHOICES = [ { name: "scissors", emoji: "✌️" }, { name: "rock", emoji: "✊" }, { name: "paper", emoji: "🖐️" }, ]; function getResult(p, a) { if (p === a) return "draw"; if ((p === 0 && a === 2) || (p === 1 && a === 0) || (p === 2 && a === 1)) return "win"; return "lose"; } export default function App() { var [stats, setStats] = useSharedStorage("rps_stats_v2", { w: 0, l: 0, d: 0 }); var [playerChoice, setPlayerChoice] = useState(null); var [aiChoice, setAiChoice] = useState(null); var [result, setResult] = useState(null); var [anim, setAnim] = useState(false); var play = useCallback(function(choice) { if (anim) return; setAnim(true); setPlayerChoice(choice); setResult(null); var cnt = 0; var iv = setInterval(function() { setAiChoice(Math.floor(Math.random() * 3)); cnt++; if (cnt > 10) { clearInterval(iv); var ai = Math.floor(Math.random() * 3); setAiChoice(ai); var r = getResult(choice, ai); setResult(r); setStats(function(prev) { return { w: (prev.w || 0) + (r === "win" ? 1 : 0), l: (prev.l || 0) + (r === "lose" ? 1 : 0), d: (prev.d || 0) + (r === "draw" ? 1 : 0), }; }); setAnim(false); } }, 70); }, [anim, setStats]); var total = (stats.w || 0) + (stats.l || 0) + (stats.d || 0); var winRate = total > 0 ? Math.round(((stats.w || 0) / total) * 100) : 0; var resultText = result === "win" ? t.win : result === "lose" ? t.lose : result === "draw" ? t.draw : t.pick; var resultColor = result === "win" ? "text-emerald-300" : result === "lose" ? "text-rose-300" : result === "draw" ? "text-amber-300" : "text-white/60"; return (

{playerChoice !== null ? CHOICES[playerChoice].emoji : "❓"}

{t.you}

{aiChoice !== null ? CHOICES[aiChoice].emoji : "🤖"}

{t.ai}

{resultText}

{CHOICES.map(function(c, i) { return ( ); })}

{total}

{t.total}

{stats.w || 0}

{t.wins}

{stats.l || 0}

{t.losses}

{winRate}%

{t.rate}

); }

Rock Paper Scissors

Rock Paper Scissors

reviews