Competitor Tweet Tracker

\n \n

Daily Tweet Mentions

\n \n

Total Tweet Mentions

\n\n \n\n",[],[215,207],"views","8fb5b488-4087-11f0-97d4-76b3cceeab13","charts.js","8fb5b53c-4087-11f0-97d4-76b3cceeab13",19,["D",1748961142424],"// Function to generate random colors for chart\nfunction generateColors(count) {\n const colors = [\n '#4299E1', '#48BB78', '#F6AD55', '#F56565', '#9F7AEA',\n '#ED64A6', '#38B2AC', '#ECC94B', '#667EEA', '#FC8181'\n ];\n \n // If we need more colors than in our predefined list, generate random ones\n if (count > colors.length) {\n for (let i = colors.length; i < count; i++) {\n const r = Math.floor(Math.random() * 255);\n const g = Math.floor(Math.random() * 255);\n const b = Math.floor(Math.random() * 255);\n colors.push(`rgb(${r}, ${g}, ${b})`);\n }\n }\n \n return colors.slice(0, count);\n}\n\n// Fetch data and render charts\nasync function renderCharts() {\n try {\n const response = await fetch('/api/data');\n const data = await response.json();\n console.log({ data });\n \n renderDailyChart(data.dailyCounts);\n renderTotalChart(data.totalCounts);\n } catch (error) {\n console.error('Error fetching data:', error);\n document.body.innerHTML += '

Error loading data. Please try again later.

';\n }\n}\n\n// Render daily tweet chart\nfunction renderDailyChart(dailyData) {\n if (!dailyData || dailyData.length === 0) {\n document.getElementById('dailyChart').parentNode.innerHTML = '

No data available yet.

';\n return;\n }\n \n // Process data for chart\n const days = [...new Set(dailyData.map(item => item.day))].sort();\n const competitors = [...new Set(dailyData.map(item => item.competitor))];\n const colors = generateColors(competitors.length);\n \n // Create datasets\n const datasets = competitors.map((competitor, index) => {\n const competitorData = days.map(day => {\n const match = dailyData.find(item => item.day === day && item.competitor === competitor);\n return match ? match.count : 0;\n });\n \n return {\n label: competitor,\n data: competitorData,\n backgroundColor: colors[index],\n borderColor: colors[index],\n borderWidth: 2,\n tension: 0.1,\n fill: false\n };\n });\n \n // Create chart\n new Chart(document.getElementById('dailyChart'), {\n type: 'line',\n data: {\n labels: days,\n datasets: datasets\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n beginAtZero: true,\n title: {\n display: true,\n text: 'Tweet Count'\n }\n },\n x: {\n title: {\n display: true,\n text: 'Date'\n }\n }\n },\n plugins: {\n legend: {\n position: 'top',\n },\n tooltip: {\n mode: 'index',\n intersect: false\n }\n }\n }\n });\n}\n\n// Render total tweet chart\nfunction renderTotalChart(totalData) {\n if (!totalData || totalData.length === 0) {\n document.getElementById('totalChart').parentNode.innerHTML = '

No data available yet.

';\n return;\n }\n \n // Sort by count descending\n totalData.sort((a, b) => b.count - a.count);\n \n const competitors = totalData.map(item => item.competitor);\n const counts = totalData.map(item => item.count);\n const colors = generateColors(competitors.length);\n \n // Create chart\n new Chart(document.getElementById('totalChart'), {\n type: 'bar',\n data: {\n labels: competitors,\n datasets: [{\n label: 'Total Tweets',\n data: counts,\n backgroundColor: colors,\n borderColor: colors,\n borderWidth: 1\n }]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n beginAtZero: true,\n title: {\n display: true,\n text: 'Tweet Count'\n }\n },\n x: {\n title: {\n display: true,\n text: 'Competitor'\n }\n }\n },\n plugins: {\n legend: {\n display: false\n }\n }\n }\n });\n}\n\n// Initialize charts when page loads\ndocument.addEventListener('DOMContentLoaded', renderCharts);",[],[215,217],"d627d3f6-4087-11f0-8470-76b3cceeab13","d627d568-4087-11f0-8470-76b3cceeab13",["D",1748961260610],"# Views Directory\n\nThis directory contains the frontend HTML and JavaScript files for the Competitor Tweet Tracker.\n\n## Files\n\n- **`index.html`**: Main HTML template with chart containers and styling\n- **`charts.js`**: JavaScript for fetching data and rendering Chart.js visualizations\n\n## Features\n\n- Responsive design using TailwindCSS\n- Interactive charts using Chart.js\n- Automatic color generation for multiple competitors\n- Error handling for data loading failures\n- Real-time data fetching from the API\n\n## Chart Types\n\n1. **Daily Chart**: Line chart showing tweet mentions over time for each competitor\n2. **Total Chart**: Bar chart showing total tweet counts per competitor\n\nThe charts automatically handle empty data states and dynamically adjust to the number of competitors being tracked.",[],[215,198],"81be5d76-4087-11f0-a981-76b3cceeab13",["D",1748961118991],"directory",[167,168,169],[215],"94f557c8-4087-11f0-a555-76b3cceeab13","competitors.ts","94f5589a-4087-11f0-a555-76b3cceeab13","21020d56-b425-451f-b850-6aab22a73c88",20,["D",1748961151227],"/**\n * Parse competitors from environment variable\n * Expected format: comma-separated list of hostnames\n * Example: \"val.town,poe.com,shapes.inc\"\n */\nexport function getCompetitors(): string[] {\n const competitorsEnv = Deno.env.get(\"COMPETITORS\");\n \n if (!competitorsEnv) {\n // Default to val.town if no competitors are specified\n return [\"val.town\"];\n }\n \n return competitorsEnv\n .split(\",\")\n .map(competitor => competitor.trim())\n .filter(competitor => competitor.length > 0);\n}\n\n/**\n * Validate that competitors list is not empty\n */\nexport function validateCompetitors(): void {\n const competitors = getCompetitors();\n if (competitors.length === 0) {\n throw new Error(\"No competitors specified. Please set the COMPETITORS environment variable.\");\n }\n}",[],[244,236],"utils","94f561fa-4087-11f0-a555-76b3cceeab13",["D",1748961151227],[165],[244],["D",1747685840126],{"_11":12,"_125":65},{"_11":12,"_64":65,"_30":63,"_123":124},{"_38":111,"_13":16,"_32":35,"_112":76,"_113":114,"_115":116,"_117":81,"_118":119,"_120":41,"_121":14,"_122":12},"ctx",{"_49":-5,"_286":287,"_288":289,"_290":24,"_291":24,"_292":24,"_293":-5,"_294":-7,"_295":-7,"_296":26,"_297":24,"_298":24,"_299":-5,"_300":24,"_301":24},"ENV",{"_257":258,"_259":260,"_261":262,"_263":16,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","f1316bb1ce3ad41ce227a17bcad7725ad044419f","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","API_URL","https://api.val.town","preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier"]

History · db.ts