/** @jsxImportSource npm:hono@3/jsx */ import { Hono } from "npm:hono"; import dayjs from "npm:dayjs@1.11.10"; const app = new Hono(); app.get("/", (c) => c.html(

Val Town Contribution Graph

)); app.get("/graph", async (c) => { const username = c.req.query("username"); if (!username) { return c.html(

Error: Username is required

); } try { let graph = await generateGraph(username); return c.html(

Back to Home

{graph}

); } catch (error) { console.error(`Error generating graph for ${username}:`, error); return c.html(

Error: {error.message}

); } }); async function generateGraph(username) { console.log(`Fetching contributions for ${username}`); try { const contributionData = await fetchContributions(username); const totalContributions = Object.values(contributionData).reduce((sum, count) => sum + count, 0); console.log(`Total contributions: ${totalContributions}`); console.log("Contribution data:", contributionData); return ( <>

Contribution Graph for {username}

{generateContributionGraph(contributionData)}

Total Contributions: {totalContributions}

); } catch (error) { console.error(`Error processing data for ${username}:`, error); throw new Error(`Failed to process data: ${error.message}`); } } async function fetchContributions(username) { const contributionMap = {}; const valsUrl = `https://api.val.town/v1/alias/${username}/vals`; const valsResponse = await fetch(valsUrl); if (!valsResponse.ok) { throw new Error(`HTTP error! status: ${valsResponse.status}`); } const valsData = await valsResponse.json(); console.log("API Response:", JSON.stringify(valsData, null, 2)); let valsToProcess = []; if (Array.isArray(valsData.data)) { valsToProcess = valsData.data; } else if (valsData.id) { // If a single val object is returned valsToProcess = [valsData]; } else { console.log("Unexpected API response structure:", valsData); return contributionMap; } for (const val of valsToProcess) { if (val && val.createdAt) { const creationDate = dayjs(val.createdAt).format('YYYY-MM-DD'); contributionMap[creationDate] = (contributionMap[creationDate] || 0) + 1; await fetchValVersions(val.id, contributionMap, creationDate); } } return contributionMap; } async function fetchValVersions(valId, contributionMap, creationDate) { const versionsUrl = `https://api.val.town/v1/vals/${valId}/versions`; try { const versionsResponse = await fetch(versionsUrl); if (!versionsResponse.ok) { throw new Error(`HTTP ${versionsResponse.status}`); } const versionsData = await versionsResponse.json(); console.log(`Versions data for val ${valId}:`, JSON.stringify(versionsData, null, 2)); if (versionsData.data && Array.isArray(versionsData.data)) { versionsData.data.forEach((version, index) => { if (version && version.createdAt) { const versionDate = dayjs(version.createdAt).format('YYYY-MM-DD'); // Only count as a contribution if it's not the initial version on the same day as creation if (!(index === 0 && versionDate === creationDate)) { contributionMap[versionDate] = (contributionMap[versionDate] || 0) + 1; } } }); } else { console.log(`Unexpected versions API response structure for val ${valId}:`, versionsData); } } catch (error) { console.error(`Failed to fetch versions for val ${valId}:`, error.message); } } function generateContributionGraph(contributionData) { const dates = Object.keys(contributionData).sort(); if (dates.length === 0) { return

No contributions found.

; } const startDate = dayjs(dates[0]); const endDate = dayjs(); const weeks = []; let currentWeek = []; for (let day = startDate; day.isBefore(endDate) || day.isSame(endDate, 'day'); day = day.add(1, 'day')) { const date = day.format('YYYY-MM-DD'); const count = contributionData[date] || 0; currentWeek.push({ date, count, level: getContributionLevel(count) }); if (currentWeek.length === 7 || day.isSame(endDate, 'day')) { weeks.push(currentWeek); currentWeek = []; } } return (

{generateMonthLabels(weeks)} {weeks.map((week, i) => ( {week.map(day => ( ))} ))}

); } function generateMonthLabels(weeks) { const months = []; weeks.forEach(week => { const monthName = dayjs(week[0].date).format('MMM'); if (!months.includes(monthName)) { months.push(monthName); } }); return ( {months.map(month => ( {month} ))} ); } function getContributionLevel(count) { if (count === 0) return 0; if (count < 3) return 1; if (count < 6) return 2; if (count < 9) return 3; return 4; } function getContributionColor(level) { const colors = ['#ebedf0', '#9be9a8', '#40c463', '#30a14e', '#216e39']; return colors[level]; } export default app.fetch;

valWall