Welcome to RuneVal

\n );\n}\n\nfunction App() {\n const [playerName, setPlayerName] = useState(\"\");\n const [skill, setSkill] = useState(\"woodcutting\");\n const [xp, setXp] = useState(0);\n const [level, setLevel] = useState(1);\n const [leaderboard, setLeaderboard] = useState([]);\n\n useEffect(() => {\n fetchLeaderboard();\n }, []);\n\n const fetchLeaderboard = async () => {\n const response = await fetch(\"?action=leaderboard\");\n const data = await response.json();\n setLeaderboard(data);\n };\n\n const handleAction = async () => {\n const audio = new Audio(\"https://esm.sh/runescape-audio-library@1.0.4/sounds/chop.mp3\");\n audio.play();\n\n const newXp = xp + 10;\n setXp(newXp);\n\n const newLevel = Math.floor(Math.sqrt(newXp / 10)) + 1;\n if (newLevel > level) {\n setLevel(newLevel);\n alert(`Congratulations! You've reached level ${newLevel} in ${skill}!`);\n }\n\n await fetch(\"?action=update\", {\n method: \"POST\",\n body: JSON.stringify({ name: playerName, xp: newXp, level: newLevel }),\n });\n\n fetchLeaderboard();\n };\n\n if (!playerName) {\n return ;\n }\n\n return (\n

RuneVal

Welcome, {playerName}!

Skill: {skill}

Level: {level}

XP: {xp}

\n {ACTIONS.CHOP} Click here to chop!\n

Adventurers' Log

\n {entry.name}: Level {entry.level} (XP: {entry.xp})\n

\n View Source\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const SCHEMA_VERSION = 2;\n const KEY = \"runescapeWoodCutting\";\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_players_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL UNIQUE,\n xp INTEGER NOT NULL,\n level INTEGER NOT NULL\n )\n `);\n\n const url = new URL(request.url);\n const action = url.searchParams.get(\"action\");\n\n if (action === \"update\") {\n const { name, xp, level } = await request.json();\n await sqlite.execute(`\n INSERT OR REPLACE INTO ${KEY}_players_${SCHEMA_VERSION} (name, xp, level)\n VALUES (?, ?, ?)\n `, [name, xp, level]);\n return new Response(\"Updated\");\n }\n\n if (action === \"leaderboard\") {\n const result = await sqlite.execute(`\n SELECT name, xp, level FROM ${KEY}_players_${SCHEMA_VERSION}\n ORDER BY xp DESC LIMIT 10\n `);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n return new Response(`\n \n \n RuneVal\n \n \n \n \n

\n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" },\n });\n}\n\nconst css = `\n@font-face {\n font-family: 'RuneScape UF';\n src: url('https://cdn.jsdelivr.net/gh/RuneStar/fonts@1.0/src/main/resources/runescape_uf.ttf') format('truetype');\n}\n\nbody {\n font-family: 'RuneScape UF', 'VT323', monospace;\n background-color: #000000;\n color: #ffff00;\n text-align: center;\n margin: 0;\n padding: 20px;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMjHxIGmVAAACkElEQVRoQ+2ZS27CMBCGnUUlWPQAiC1CgkNwlJ6nJ+AYvUJXqGJRVV2VBXKBJqEJSZ3/D4wxrWOcGNvpIo70KyR+Zt54XqOkLMunIAgeb0HL6rru+/65qqrXsixfiqJ4z/P8I03TaZIkH1EUTcMwnIRh+AbwPcMYxuIZnuU3+C3mwFyYs6zlZub7i2gF+Q7ycxAEn3mej7Xib8EcmAtzYm7MsZrVEsz7E6wgLkC+ZVn2pRVWAXNjDayFNbXijwKyb1VVTbTCLoC1sKZW/D7I+BPkh1bQRbA21tAYHgRkzEBea4Vu5O5x8+gee4YxjMUzPMtvzDmwNjpAY7kXiJiBvNEK3Ert/gu0Y9cwhrF4hmd3icLaWCNjuhMkYAbyVStwjdrpFLTjOTCGsXiGZ/kNfmMTAY2JINEKclsrdAPtZA7a8T0whrF4hmd5lt/YREBjupFEK8h3WqEbaAfX0I5vwRjG4hme5Tfm3EBjIki0gtzRCt1E7XwK2vEcGMNYPMOz/Ma+CDQmgkQryG2t0A20gzlox7dgDGPxDM/yG3NuoDERJFpBbmuFbqJ2PgXteA6MYSye4Vl+Y18EGhNBohXktlboBtrBHLTjWzCGsXiGZ/mNOTfQmAgSrSC3tUI3UTufgnY8B8YwFs/wLL+xLwKNiSDRCnJbK3QD7WAO2vEtGMNYPMOz/MacG2hMBIlWkNtaoZuonU9BO54DYxiLZ3iW39gXgcZEkGgFua0VuoF2MAft+BaMYSye4Vl+Y84NNCaCRCvIHa3QTdTOp6AdzwGNiSBR/6Oipdh3Iy1F9mFPS9GNZFqKbuzXUnSD8ZYiG+21FNnwsqXIxs8txf1/vHSUkvIXCx10Xy+tWPsAAAAASUVORK5CYII=');\n background-repeat: repeat;\n}\n\n.game, .login-screen {\n max-width: 600px;\n margin: 0 auto;\n background-color: rgba(65, 50, 12, 0.9);\n border: 4px solid #8b7865;\n border-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMjHxIGmVAAAAPklEQVQoU2P4//8/AzqGCqAoQhFAVgRTgGEIVgU4FaErgCnAqQhdAYYCdEXoFGMoQNaILo6hAFkjujgAoQYXNAQKW0AAAAAASUVORK5CYII=') 2;\n padding: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);\n}\n\n.rs-logo {\n font-family: 'RuneScape UF', 'VT323', monospace;\n font-size: 48px;\n color: #ffd700;\n text-shadow: 2px 2px #8b4513, 4px 4px #000000;\n margin-bottom: 20px;\n}\n\nh2 {\n color: #ffd700;\n text-shadow: 1px 1px #8b4513, 2px 2px #000000;\n}\n\n.player-info, .skill-info {\n font-size: 18px;\n margin-bottom: 20px;\n background-color: rgba(0, 0, 0, 0.6);\n border: 2px solid #8b7865;\n padding: 10px;\n}\n\n.action-area {\n background-color: #7a6a55;\n border: 2px solid #ffd700;\n padding: 20px;\n font-size: 24px;\n cursor: pointer;\n user-select: none;\n margin-bottom: 20px;\n box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);\n}\n\n.action-area:hover {\n background-color: #8b7865;\n}\n\n.leaderboard {\n background-color: rgba(0, 0, 0, 0.6);\n border: 2px solid #8b7865;\n padding: 10px;\n}\n\n.leaderboard ul {\n list-style-type: none;\n padding: 0;\n}\n\n.leaderboard li {\n margin-bottom: 5px;\n font-size: 16px;\n}\n\n.view-source {\n color: #00ffff;\n text-decoration: none;\n font-size: 14px;\n margin-top: 20px;\n display: inline-block;\n}\n\n.view-source:hover {\n text-decoration: underline;\n}\n\ninput, button {\n font-family: 'RuneScape UF', 'VT323', monospace;\n font-size: 18px;\n padding: 5px 10px;\n margin: 5px;\n background-color: #3e3529;\n color: #ffd700;\n border: 2px solid #8b7865;\n}\n\nbutton {\n background-color: #7a6a55;\n color: #ffd700;\n border: 2px solid #ffd700;\n cursor: pointer;\n box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);\n}\n\nbutton:hover {\n background-color: #8b7865;\n}\n`;","deleted","label",[101],"permalink","https://www.val.town/x/charmaine/runescapeWoodCutting/code/main.tsx","extension","routes/embed","actionData","errors"]