\n 🌱 GitHub README Embed\n

\n Show off your coding plant and stats in your GitHub README!\n

\n\n \n

Live Preview

\n $\"WakaTime$ \n

\n\n \n

How to Use

\n \n

1. Basic Usage (Demo Data)

\n Add this to your GitHub README.md to show your plant:\n

\n ![WakaTime Plant](${baseUrl}/embed/your-username)\n

3. Customization Options

Theme

Choose between light and dark themes:

\n ?theme=light or ?theme=dark\n

\n \n

Plant Type

Choose your plant type:

?plant=classic-tree - 🌳 Traditional tree growth

?plant=flower-garden - 🌸 Beautiful flowering plants

?plant=cactus-desert - 🌵 Hardy desert plants

?plant=mushroom-forest - 🍄 Mysterious fungi

\n\n

4. Complete Example

\n ![WakaTime Plant](${baseUrl}/embed/your-username?theme=dark&plant=flower-garden)\n

\n\n \n

Plant Types

\n $\"Classic$ \n

🌳 Classic Tree

Traditional tree growth from seed to mighty oak

\n \n

\n $\"Flower$ \n

🌸 Flower Garden

Beautiful flowering plants with vibrant colors

\n \n

\n $\"Desert$ \n

🌵 Desert Cactus

Hardy desert plants that thrive in tough conditions

\n \n

\n $\"Mushroom$ \n

🍄 Mushroom Forest

Mysterious fungi that grow in magical patterns

\n\n \n

Theme Examples

\n $\"Light$ \n

☀️ Light Theme

Perfect for light-themed READMEs

\n \n

\n $\"Dark$ \n

🌙 Dark Theme

Great for dark-themed READMEs

\n\n \n

API Information

Endpoint

\n GET ${baseUrl}/embed/{username}\n

\n \n

Parameters

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

Parameter	Type	Description	Default
username	string	Display name for the embed	required
theme	string	light \| dark	light
plant	string	classic-tree \| flower-garden \| cactus-desert \| mushroom-forest	classic-tree

\n \n

Response

Returns an SVG image (400x200px) showing:

Current plant stage and growth progress
Weekly coding hours
Coding consistency percentage
Number of programming languages used
Top programming languages

\n\n \n

\n ← Back to Plant Growth Game\n

\n\n`;\n\n return c.html(html);\n});\n\napp.get(\"/garden\", async (c: any) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\napp.get(\"/\", async (c: any) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\napp.get(\"/api/widget\", (c: any) => {\n try {\n const { username } = c.req.query();\n\n // Widget data interface\n interface WidgetData {\n plantType: string;\n currentStage: number;\n totalHours: number;\n todayHours: number;\n totalHoursFormatted: string;\n todayHoursFormatted: string;\n consistency: number;\n languageDiversity: number;\n progressToNext: number;\n stageName: string;\n nextStageName?: string;\n isFullyGrown: boolean;\n plantEmoji: string;\n progressText: string;\n }\n\n // Helper function to format hours\n function formatHours(hours: number): string {\n return hours < 10 ? hours.toFixed(1) + \"h\" : Math.round(hours) + \"h\";\n }\n\n // Helper function to get plant emoji based on type and stage\n function getPlantEmoji(plantTypeId: string, stage: number): string {\n const emojiMap: { [key: string]: string[] } = {\n \"classic-tree\": [\"🌱\", \"🌿\", \"🌾\", \"🌳\", \"🌲\", \"🎄\", \"🌳\", \"🌴\"],\n \"flower\": [\"🌱\", \"🌿\", \"🌾\", \"🌺\", \"🌸\", \"🌼\", \"🌻\", \"💐\"],\n \"cactus\": [\"🌱\", \"🌿\", \"🌵\", \"🌵\", \"🌵\", \"🌵\", \"🌵\", \"🌵\"],\n \"mushroom\": [\"🌱\", \"🌿\", \"🍄\", \"🍄\", \"🍄\", \"🍄\", \"🍄\", \"🍄\"],\n };\n\n const emojis = emojiMap[plantTypeId] || emojiMap[\"classic-tree\"];\n return emojis[Math.min(stage, emojis.length - 1)];\n }\n\n // Generate widget data\n function getWidgetData(username?: string): WidgetData {\n // If no username provided, return demo data\n if (!username) {\n const demoTotalHours = 42.5;\n const demoTodayHours = 2.3;\n\n return {\n plantType: \"classic-tree\",\n currentStage: 3,\n totalHours: demoTotalHours,\n todayHours: demoTodayHours,\n totalHoursFormatted: formatHours(demoTotalHours),\n todayHoursFormatted: formatHours(demoTodayHours),\n consistency: 85,\n languageDiversity: 7,\n progressToNext: 65,\n stageName: \"Young Tree\",\n nextStageName: \"Mature Tree\",\n isFullyGrown: false,\n plantEmoji: getPlantEmoji(\"classic-tree\", 3),\n progressText: \"🌱 Growing to Mature Tree\",\n };\n }\n\n // For real users, return sample data (in production, this would fetch from database)\n const plantTypeId = \"classic-tree\";\n const currentStage = Math.min(4, 7);\n const realTotalHours = 156.7;\n const realTodayHours = 4.2;\n const isFullyGrown = currentStage >= 7;\n\n const stageNames = [\n \"Seed\",\n \"Sprout\",\n \"Seedling\",\n \"Young Tree\",\n \"Mature Tree\",\n \"Flowering Tree\",\n \"Fruit Tree\",\n \"Ancient Oak\",\n ];\n\n const stageName = stageNames[currentStage] || \"Unknown\";\n const nextStageName = currentStage < 7 ? stageNames[currentStage + 1] : undefined;\n\n return {\n plantType: plantTypeId,\n currentStage,\n totalHours: realTotalHours,\n todayHours: realTodayHours,\n totalHoursFormatted: formatHours(realTotalHours),\n todayHoursFormatted: formatHours(realTodayHours),\n consistency: 92,\n languageDiversity: 12,\n progressToNext: 78,\n stageName,\n nextStageName,\n isFullyGrown,\n plantEmoji: getPlantEmoji(plantTypeId, currentStage),\n progressText: isFullyGrown ? \"🌳 Fully grown!\" : `🌱 Growing to ${nextStageName}`,\n };\n }\n\n const widgetData = getWidgetData(username);\n return c.json(widgetData);\n } catch (error) {\n console.error(\"Widget API error:\", error);\n return c.json({\n error: \"Failed to fetch widget data\",\n plantType: \"classic-tree\",\n currentStage: 0,\n totalHours: 0,\n todayHours: 0,\n totalHoursFormatted: \"0h\",\n todayHoursFormatted: \"0h\",\n consistency: 0,\n languageDiversity: 0,\n progressToNext: 0,\n stageName: \"Seed\",\n isFullyGrown: false,\n plantEmoji: \"🌱\",\n progressText: \"🌱 Start coding to grow your plant!\",\n }, 500);\n }\n});\n\nexport default app.fetch;","deleted","label",[169,150],"backend","permalink","https://www.val.town/x/loading/plant/code/backend/index.ts","extension","actionData","errors"]