1// Thank you for the feedback! You're right, we need to handle cases where playlist images might be missing.
2// Let's update the code to handle this gracefully and provide a default image when necessary.
3
4import { Hono } from "npm:hono@3";
95 playlistEl.className = 'bg-gray-800 rounded-lg p-4 mb-4 flex items-center cursor-pointer hover:bg-gray-700 transition-colors duration-300';
96 playlistEl.onclick = () => fetchTracks(playlist.id, playlist.name);
97 const imageUrl = playlist.images && playlist.images.length > 0 ? playlist.images[0].url : 'https://via.placeholder.com/60';
98 playlistEl.innerHTML = \`
99 <img src="\${imageUrl}" alt="\${playlist.name}" class="w-16 h-16 rounded-md mr-4 object-cover">
100 <div>
101 <h3 class="font-semibold text-lg text-green-400">\${playlist.name}</h3>
125 const artistNames = track.track.artists.map(artist => artist.name).join(', ');
126 const duration = new Date(track.track.duration_ms).toISOString().substr(14, 5);
127 const imageUrl = track.track.album.images && track.track.album.images.length > 0 ? track.track.album.images[0].url : 'https://via.placeholder.com/50';
128 trackEl.innerHTML = \`
129 <div class="text-gray-500 mr-4 w-8 text-center">\${index + 1}</div>
130 <img src="\${imageUrl}" alt="\${track.track.name}" class="w-12 h-12 rounded-md mr-4 object-cover">
131 <div class="flex-grow">
132 <h3 class="font-semibold text-green-400">\${track.track.name}</h3>
7 savePDFIsVisible,
8 isOceanTheme,
9 ogImageUrl,
10 customTitle
11}) {
17 const name = resumeDetails?.basics?.name || 'Resume';
18 const title = customTitle || `${name}'s Resume`;
19 const ogImage = ogImageUrl ? `<meta property="og:image" content="${ogImageUrl}">` : '';
20
21 return `
28 <meta property="og:title" content="${title}">
29 <meta property="og:type" content="website">
30 ${ogImage}
31 <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text y='50%' font-size='24' text-anchor='middle' x='50%' dy='.3em'>📄</text></svg>">
32 <style>
33 ${theme.styles}
90 margin: [8, 8, 8, 8], // top, right, bottom, left in mm
91 filename: 'resume.pdf',
92 image: { type: 'jpeg', quality: 0.98 },
93 html2canvas: {
94 scale: 3,
14Navigate to the **API Keys** -> **Generate a new API key**.
15
16
17
3View and interact with your Val Town SQLite data. It's based off Steve's excellent [SQLite Admin](https://www.val.town/v/stevekrouse/sqlite_admin?v=46) val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by [LibSQL Studio](https://github.com/invisal/libsql-studio) by [invisal](https://github.com/invisal). This is now more an SPA, with tables, queries and results showing up on the same page.
4
5
6
7## Install
3View and interact with your Val Town SQLite data. It's based off Steve's excellent [SQLite Admin](https://www.val.town/v/stevekrouse/sqlite_admin?v=46) val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by [LibSQL Studio](https://github.com/invisal/libsql-studio) by [invisal](https://github.com/invisal). This is now more an SPA, with tables, queries and results showing up on the same page.
4
5
6
7## Install
3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5
6
7Use this button to install the val:
5/**
6 * Provides functions for interacting with your account's blob storage.
7 * Blobs can store any data type (text, JSON, images, etc.) and allow
8 * retrieval across different vals using the same key.
9 * ([Docs ↗](https://docs.val.town/std/blob))
3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5
6
7Use this button to install the val:
3import satori from "npm:satori"
4
5export async function ogImage(body) {
6 const svg = await satori(
7 body,
14 if (code === "emoji") {
15 const unicode = segment.codePointAt(0).toString(16).toUpperCase()
16 return `data:image/svg+xml;base64,` + btoa(await loadEmoji(unicode))
17 }
18 return ""