this repo has no description

Commented out themes, replaced Event types with ICalEvent, added Youtube location

+47 -28
+40 -28
components/WeeklySchedule.tsx
··· 1 1 import satori from "https://esm.sh/satori@0.12.1"; 2 2 import format from "https://deno.land/x/date_fns@v2.22.1/format/index.js"; 3 - import { Event } from "../utils/calendarUtils.ts"; 4 3 import { toZonedTime } from "npm:date-fns-tz"; 5 4 6 5 // Define theme interface for styling options ··· 13 12 default: string; 14 13 twitch: string; 15 14 discord: string; 15 + youtube: string; 16 16 }; 17 17 eventTextColor: string; 18 18 noEventColor: string; ··· 20 20 iconPaths: { 21 21 discord: string; 22 22 twitch: string; 23 + youtube: string; 23 24 }; 24 25 } 25 26 ··· 33 34 default: "#e6d195", 34 35 twitch: "#eebd37", 35 36 discord: "#f3af52", 37 + youtube: "#ff8e46", 36 38 }, 37 39 eventTextColor: "#ffffff", 38 40 noEventColor: "#ffffff", ··· 40 42 iconPaths: { 41 43 discord: "./static/discord-icon.svg", 42 44 twitch: "./static/twitch-icon.svg", 45 + youtube: "./static/youtube-icon.svg", 43 46 }, 44 47 }; 45 48 46 49 // Theme collection - can be expanded as needed 47 - const themes: Record<string, Theme> = { 48 - "light": defaultTheme, 49 - "dark": { 50 - fontFamily: "Lazydog", 51 - headerColor: "#ffffff", 52 - dateRangeColor: "#cccccc", 53 - dayColor: "#ffffff", 54 - eventBgColors: { 55 - default: "#333333", 56 - twitch: "#333333", 57 - discord: "#333333", 58 - }, 59 - eventTextColor: "#ffffff", 60 - noEventColor: "#777777", 61 - backgroundImagePath: "./static/background.png", 62 - iconPaths: { 63 - discord: "./static/discord-icon.svg", 64 - twitch: "./static/twitch-icon.svg", 65 - }, 66 - }, 67 - // Add more themes as needed 68 - }; 50 + // const themes: Record<string, Theme> = { 51 + // "light": defaultTheme, 52 + // "dark": { 53 + // fontFamily: "Lazydog", 54 + // headerColor: "#ffffff", 55 + // dateRangeColor: "#cccccc", 56 + // dayColor: "#ffffff", 57 + // eventBgColors: { 58 + // default: "#333333", 59 + // twitch: "#333333", 60 + // discord: "#333333", 61 + // }, 62 + // eventTextColor: "#ffffff", 63 + // noEventColor: "#777777", 64 + // backgroundImagePath: "./static/background.png", 65 + // iconPaths: { 66 + // discord: "./static/discord-icon.svg", 67 + // twitch: "./static/twitch-icon.svg", 68 + // }, 69 + // }, 70 + // // Add more themes as needed 71 + // }; 69 72 70 73 export default function WeeklySchedule( 71 - events: Event[], 74 + events: ICalEvent[], 72 75 startDate: Date, 73 76 endDate: Date, 74 77 backgroundImageBase64?: string, ··· 91 94 const dateRangeText = `${startDateFormatted} - ${endDateFormatted}`; 92 95 93 96 // Helper function to get event background color based on location 94 - const getEventBgColor = (event: Event | undefined) => { 97 + const getEventBgColor = (event: ICalEvent | undefined) => { 95 98 if (!event || !event.location) return theme.eventBgColors.default; 96 99 97 100 const location = event.location.toLowerCase(); 98 101 if (location === "twitch") return theme.eventBgColors.twitch; 99 102 if (location === "discord") return theme.eventBgColors.discord; 103 + if (location === "youtube") return theme.eventBgColors.youtube; 100 104 101 105 return theme.eventBgColors.default; 102 106 }; 103 107 104 108 // Helper function to get icon based on location 105 - const getEventIcon = (event: Event | undefined) => { 109 + const getEventIcon = (event: ICalEvent | undefined) => { 106 110 if (!event || !event.location || !iconBase64Map) return null; 107 111 108 112 const location = event.location.toLowerCase(); ··· 111 115 } 112 116 if (location === "discord" && iconBase64Map.discord) { 113 117 return iconBase64Map.discord; 118 + } 119 + if (location === "youtube" && iconBase64Map.youtube) { 120 + return iconBase64Map.youtube; 114 121 } 115 122 116 123 return null; ··· 328 335 } 329 336 330 337 export async function generateScheduleSVG( 331 - events: Event[], 338 + events: ICalEvent[], 332 339 startDate: Date, 333 340 endDate: Date, 334 341 themeName: string = "light", 335 342 ) { 336 343 // Get the theme 337 - const theme = themes[themeName] || defaultTheme; 344 + //const theme = themes[themeName] || defaultTheme; 345 + const theme = defaultTheme; 338 346 339 347 // Load font 340 348 const fontPath = "./static/fonts/Lazydog.ttf"; ··· 362 370 // Load Twitch icon 363 371 const twitchIconData = await Deno.readFile(theme.iconPaths.twitch); 364 372 iconBase64Map.twitch = encodeBase64(twitchIconData); 373 + 374 + // Load YouTube icon 375 + const youtubeIconData = await Deno.readFile(theme.iconPaths.youtube); 376 + iconBase64Map.youtube = encodeBase64(youtubeIconData); 365 377 } catch (error) { 366 378 console.error( 367 379 `Error loading icon images: ${(error as Error).message}`,
+7
static/youtube-icon.svg
··· 1 + <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 2 + <!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools --> 3 + <svg fill="#ffffff" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-4.9 -4.9 58.80 58.80" xml:space="preserve" stroke="#ffffff" stroke-width="3.332"> 4 + <g id="SVGRepo_bgCarrier" stroke-width="0"/> 5 + <g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/> 6 + <g id="SVGRepo_iconCarrier"> <g> <g> <path d="M39.256,6.5H9.744C4.371,6.5,0,10.885,0,16.274v16.451c0,5.39,4.371,9.774,9.744,9.774h29.512 c5.373,0,9.744-4.385,9.744-9.774V16.274C49,10.885,44.629,6.5,39.256,6.5z M47,32.726c0,4.287-3.474,7.774-7.744,7.774H9.744 C5.474,40.5,2,37.012,2,32.726V16.274C2,11.988,5.474,8.5,9.744,8.5h29.512c4.27,0,7.744,3.488,7.744,7.774V32.726z"/> <path d="M33.36,24.138l-13.855-8.115c-0.308-0.18-0.691-0.183-1.002-0.005S18,16.527,18,16.886v16.229 c0,0.358,0.192,0.69,0.502,0.868c0.154,0.088,0.326,0.132,0.498,0.132c0.175,0,0.349-0.046,0.505-0.137l13.855-8.113 c0.306-0.179,0.495-0.508,0.495-0.863S33.667,24.317,33.36,24.138z M20,31.37V18.63l10.876,6.371L20,31.37z"/> </g> </g> </g> 7 + </svg>