Loading...

\n );\n }\n\n const characterData = viewMode === \"personal\" ? personalCharacters : characters;\n const rankingTitle = viewMode === \"personal\" ? \"My Rankings\" : \"Global Rankings\";\n const sortedCharacterData = _.orderBy(characterData, [\"elo\"], [\"desc\"]);\n\n // --- JSX Return (Identical, includes non-truncated name) ---\n return (\n

\n {/* Header & View Mode Buttons */}\n

RotRank

\n switchViewMode(\"voting\")}\n className={`py-2 px-4 rounded transition duration-150 ease-in-out ${\n viewMode === \"voting\"\n ? \"bg-indigo-600 text-white font-bold\"\n : \"bg-gray-700 text-gray-300 hover:bg-gray-600\"\n }`}\n >\n Vote\n {\" \"}\n switchViewMode(\"global\")}\n className={`py-2 px-4 rounded transition duration-150 ease-in-out ${\n viewMode === \"global\"\n ? \"bg-indigo-600 text-white font-bold\"\n : \"bg-gray-700 text-gray-300 hover:bg-gray-600\"\n }`}\n >\n Global\n {\" \"}\n switchViewMode(\"personal\")}\n className={`py-2 px-4 rounded transition duration-150 ease-in-out ${\n viewMode === \"personal\"\n ? \"bg-indigo-600 text-white font-bold\"\n : \"bg-gray-700 text-gray-300 hover:bg-gray-600\"\n }`}\n >\n My Ranks\n \n

\n\n {/* Voting View */}\n {viewMode === \"voting\" && (\n

\n {matchup\n ? (\n <>\n

\n {matchup.map(character => (\n \n !isSaving && handleVote(character.id, matchup.find(c => c.id !== character.id)!.id)}\n >\n {/* Image Container */}\n

\n {imageError[character.id]\n ? (getFallbackImage(character.id))\n : (\n handleImageError(character.id)}\n loading=\"lazy\"\n referrerPolicy=\"no-referrer\"\n />\n )}\n

\n {/* Name - No truncate */}\n

{character.name}

\n ))}\n

\n {/* Skip Button Area */}\n

\n generateMatchup(characters)}\n className=\"bg-pink-600 hover:bg-pink-700 text-white font-bold py-2 px-4 rounded transition duration-150 ease-in-out disabled:opacity-50\"\n disabled={isSaving}\n >\n {isSaving ? \"...\" : \"Skip\"}\n \n

\n \n )\n : (\n

\n {characters.length < 2 ? \"Need >= 2 chars.\" : \"Generating...\"}\n

\n )}\n

\n )}\n\n {/* Rankings View (Identical) */}\n {viewMode !== \"voting\" && (\n

{rankingTitle}

\n \n \n \n \n \n \n \n \n \n {sortedCharacterData.length > 0\n ? (\n sortedCharacterData.map((character, index) => (\n \n {\" \"}\n {\" \"}\n \n \n ))\n )\n : (\n \n \n \n )}\n \n

Rank	Character	Votes
{index + 1}	\n \n \n {imageError[character.id]\n ? getFallbackImage(character.id)\n : (\n handleImageError(character.id)}\n loading=\"lazy\"\n referrerPolicy=\"no-referrer\"\n />\n )}\n \n \n {character.name} \n \n \n	{character.wins}
No ranking data.

\n )}\n\n {/* Footer (Identical) */}\n \n

\n \n );\n}\n// --- End App Component ---\n\n// --- Client-side Rendering (Identical) ---\nfunction client() {\n const r = document.getElementById(\"root\");\n if (r) createRoot(r).render(); else console.error(\"Root element '#root' not found.\");\n}\nif (typeof document !== \"undefined\" && document.getElementById(\"root\")) { client(); }\n// --- End Client-side Rendering ---\n\n// --- Server-side Handling (Identical) ---\nexport default async function server(req: Request): Promise {\n const url = new URL(req.url);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const { CHARACTERS: defaultCharactersDefinition } = await import(\"./characters.ts\");\n const getBlobJson = async (key: string, defaultValue: any): Promise => {\n try {\n const d = await blob.getJSON(key);\n if (key.includes(\"characters\") && !Array.isArray(d)) {\n console.warn(`Invalid blob ${key}`);\n return defaultValue;\n }\n return d ?? defaultValue;\n } catch (e: any) {\n if (e.message?.includes(\"not found\")) console.log(`Blob ${key} not found.`); else console.error(\n `Err blob ${key}:`,\n e,\n );\n return defaultValue;\n }\n };\n if (url.pathname === \"/api/characters\" && req.method === \"GET\") {\n const dc = [...defaultCharactersDefinition.map(c => ({ ...c }))];\n const d = await getBlobJson(\"rotrank_characters\", dc);\n return new Response(JSON.stringify(d), {\n headers: { \"Content-Type\": \"application/json\", \"Cache-Control\": \"no-store\" },\n });\n }\n if (url.pathname === \"/api/personal-characters\" && req.method === \"GET\") {\n const uid = url.searchParams.get(\"userId\");\n if (!uid)\n return new Response(JSON.stringify({ error: \"User ID required\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n const dc = [...defaultCharactersDefinition.map(c => ({ ...c }))];\n const d = await getBlobJson(`rotrank_personal_${uid}`, dc);\n return new Response(JSON.stringify(d), {\n headers: { \"Content-Type\": \"application/json\", \"Cache-Control\": \"no-store\" },\n });\n }\n if (url.pathname === \"/api/update-rankings\" && req.method === \"POST\") {\n try {\n const d = await req.json();\n if (!Array.isArray(d)) throw new Error(\"Invalid data.\");\n await blob.setJSON(\"rotrank_characters\", d);\n return new Response(JSON.stringify({ success: true }), { headers: { \"Content-Type\": \"application/json\" } });\n } catch (e) {\n console.error(\"Err update global:\", e);\n return new Response(JSON.stringify({ success: false, error: String(e) }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n if (url.pathname === \"/api/update-personal-rankings\" && req.method === \"POST\") {\n try {\n const d = await req.json();\n const { userId: uid, characters: cs } = d;\n if (!uid || typeof uid !== \"string\") throw new Error(\"User ID invalid.\");\n if (!Array.isArray(cs)) throw new Error(\"Chars data invalid.\");\n await blob.setJSON(`rotrank_personal_${uid}`, cs);\n return new Response(JSON.stringify({ success: true }), { headers: { \"Content-Type\": \"application/json\" } });\n } catch (e) {\n console.error(\"Err update personal:\", e);\n return new Response(JSON.stringify({ success: false, error: String(e) }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n try {\n const scriptSrc = typeof import.meta !== \"undefined\" && import.meta.url ? `\"${import.meta.url}\"` : \"\\\"./app.js\\\"\";\n const html =\n `RotRank

Loading...

`;\n return new Response(html, { headers: { \"Content-Type\": \"text/html\" } });\n } catch (e) {\n console.error(\"Err generating HTML:\", e);\n return new Response(\"Internal Server Error\", { status: 500 });\n }\n}\n// --- End Server-side Handling ---","deleted","label",[99],"permalink","https://www.val.town/x/dcm31/rotrank/code/main.tsx","extension","actionData","errors"]