 elements containing JSON\n  document.querySelectorAll(\"pre\").forEach((pre) => {\n    try {\n      // Parse the JSON content\n      const jsonData = JSON.parse(pre.textContent);\n\n      // Enhanced JSON stringifier that adds minimal HTML formatting\n      function enhanceJSON(obj, indent = 0) {\n        const spacing = \"  \".repeat(indent);\n\n        if (obj === null) return \"null\";\n        if (typeof obj === \"boolean\") return obj;\n        if (typeof obj === \"number\") {\n          // Check if it's likely a timestamp (10 or 13 digits)\n          if (\n            Number.isInteger(obj) &&\n            (obj.toString().length === 10 || obj.toString().length === 13)\n          ) {\n            const date = new Date(\n              obj.toString().length === 10 ? obj * 1000 : obj,\n            );\n            if (date.getTime() > 0 && date.getFullYear() > 1990) {\n              return `${obj} (${date.toLocaleString()})`;\n            }\n          }\n          return obj;\n        }\n        if (typeof obj === \"string\") {\n          // Check if it's a URL\n          if (/^https?:\\/\\//.test(obj)) {\n            return `\"${obj}\"`;\n          }\n          return `\"${obj}\"`;\n        }\n\n        if (Array.isArray(obj)) {\n          if (obj.length === 0) return \"[]\";\n          const items = obj.map((item) =>\n            `${spacing}  ${enhanceJSON(item, indent + 1)}`\n          );\n          return `[\\n${items.join(\",\\n\")}\\n${spacing}]`;\n        }\n\n        if (typeof obj === \"object\") {\n          const keys = Object.keys(obj);\n          if (keys.length === 0) return \"{}\";\n          const items = keys.map((key) =>\n            `${spacing}  \"${key}\": ${enhanceJSON(obj[key], indent + 1)}`\n          );\n          return `{\\n${items.join(\",\\n\")}\\n${spacing}}`;\n        }\n\n        return obj;\n      }\n\n      // Replace the content with enhanced HTML\n      pre.innerHTML = enhanceJSON(jsonData);\n    } catch (e) {\n      // If it's not valid JSON, leave it as-is\n      console.log(\"Not valid JSON, skipping enhancement\");\n    }\n  });\n});",[],[99],{"_103":182,"_95":183,"_156":115,"_158":-5,"_159":141,"_160":184,"_161":117,"_105":185,"_100":186,"_164":187,"_166":188,"_168":22,"_169":189,"_170":190,"_98":191},"5c3d8d3a-89cd-11f0-bf97-0224a6c84d84","main.tsx",102,["D",1757017555718],101,"http","import { deleteCookie, getCookies, setCookie } from \"jsr:@std/http/cookie\";\nimport ValTown from \"jsr:@valtown/sdk\";\nimport * as client from \"npm:openid-client\";\nimport { getSession, initializeDatabase, storeSession } from \"./db.ts\";\n\nawait initializeDatabase();\nconst config: client.Configuration = await client.discovery(\n  new URL(`https://www.val.town/oauth`),\n  \"val_town_townie\",\n  { client_secret: Deno.env.get(\"OAUTH_TOWNIE_CLIENT_SECRET\") },\n  undefined,\n  {},\n);\n\nexport default async function (req: Request): Promise {\n  const url = new URL(req.url);\n  if (url.pathname === \"/favicon.ico\") {\n    return new Response(null, { status: 404 });\n  }\n  if (url.pathname === \"/logout\") {\n    const headers = new Headers({\n      \"location\": \"/\",\n    });\n    deleteCookie(headers, \"_session\");\n    return new Response(null, { status: 302, headers });\n  }\n\n  if (url.pathname === \"/login\") {\n    const codeVerifier: string = client.randomPKCECodeVerifier();\n    const codeChallenge: string = await client.calculatePKCECodeChallenge(\n      codeVerifier,\n    );\n    const parameters: Record = {\n      redirect_uri: \"https://maxm-townie.val.run/\",\n      // offline_access gets you refresh token and openid gets you permission to\n      // view user info\n      scope:\n        \"val_r val_rw user_r user_rw blob_r blob_rw email_r email_rw sqlite_r sqlite_rw offline_access openid email\",\n      code_challenge: codeChallenge,\n      code_challenge_method: \"S256\",\n      prompt: \"login consent\",\n      state: client.randomState(),\n    };\n\n    const redirectTo: URL = client.buildAuthorizationUrl(config, parameters);\n    const headers = new Headers({ \"location\": redirectTo.toString() });\n    deleteCookie(headers, \"_session\");\n    setCookie(headers, { name: \"codeVerifier\", value: codeVerifier });\n    setCookie(headers, { name: \"state\", value: parameters.state });\n    return new Response(\n      \"Redirecting to \" + redirectTo.toString(),\n      { headers, status: 302 },\n    );\n  }\n\n  const cookies = getCookies(req.headers);\n  if (cookies._session) {\n    const session = await getSession(cookies._session, config);\n    const vt = new ValTown({ bearerToken: session.access_token });\n    const profile = await vt.me.profile.retrieve();\n    return new Response(\n      `\n      \n      Hello ${profile.username}!
\n      
\n      ${JSON.stringify(profile, null, 2)}
\n      
\n      ${JSON.stringify(session, null, 2)}
\n      
\n      Logout
`,\n      {\n        headers: { \"content-type\": \"text/html\" },\n      },\n    );\n  }\n\n  if (url.searchParams.has(\"code\")) {\n    console.log(cookies, url);\n    const tokens: client.TokenEndpointResponse = await client\n      .authorizationCodeGrant(config, new URL(url), {\n        pkceCodeVerifier: cookies.codeVerifier,\n        expectedState: cookies.state,\n      });\n    const headers = new Headers({ \"location\": \"/\" });\n    console.log(tokens);\n    const sessionId = crypto.randomUUID();\n    const session = await storeSession(sessionId, tokens);\n    console.log(session);\n    setCookie(headers, { name: \"_session\", value: sessionId });\n    return new Response(JSON.stringify(tokens), { headers, status: 302 });\n  }\n  return new Response(\n    `Login With Val Town!
`,\n    {\n      headers: { \"Content-Type\": \"text/html\" },\n    },\n  );\n}","maxm-townie",[],[183],"files",[153,173,181],"counts",{"_196":32,"_197":121,"_198":163,"_199":163},"pulls","branches","forks","envVars","contents",[],"file",{"_103":174,"_95":99,"_156":175,"_158":-5,"_159":141,"_160":176,"_161":117,"_105":204,"_100":32,"_164":165,"_166":178,"_168":22,"_169":-5,"_98":205},["D",1757015622434],[99],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_93":94,"_95":96,"_97":43,"_100":-7,"_98":99,"_101":214,"_151":219,"_192":229,"_202":230,"_200":232,"_233":-5,"_234":22,"_235":-5,"_236":-5,"_237":-5,"_238":239},{"_103":104,"_95":96,"_105":215,"_107":-5,"_108":22,"_109":110,"_111":-5,"_112":-5,"_14":113,"_114":115,"_116":117,"_118":119,"_120":121,"_16":122,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_23":216,"_135":217,"_138":218,"_150":22},["D",1745325417561],{"_93":94,"_133":134},{"_93":94,"_137":134},{"_100":140,"_95":43,"_103":141,"_142":104,"_143":-5,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":96,"_149":94},[220,223,226],{"_103":154,"_95":155,"_156":157,"_158":-5,"_159":141,"_160":140,"_161":117,"_105":162,"_100":163,"_164":165,"_166":167,"_168":22,"_169":-5,"_170":221,"_98":222},[],[155],{"_103":174,"_95":99,"_156":175,"_158":-5,"_159":141,"_160":176,"_161":117,"_105":177,"_100":32,"_164":165,"_166":178,"_168":22,"_169":-5,"_170":224,"_98":225},[],[99],{"_103":182,"_95":183,"_156":115,"_158":-5,"_159":141,"_160":184,"_161":117,"_105":185,"_100":186,"_164":187,"_166":188,"_168":22,"_169":189,"_170":227,"_98":228},[],[183],[220,223,226],{"_103":174,"_95":99,"_156":175,"_158":-5,"_159":141,"_160":176,"_161":117,"_105":204,"_100":32,"_164":165,"_166":178,"_168":22,"_169":-5,"_98":231},[99],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]
maxm

oauthExample
