Val Town Code SearchReturn to Val Town

117
118        case 4:
119          const url = `https://cdn-images-1.medium.com/max/${metadata.originalWidth * 2}/${metadata.id}`;
120
121          return `![${formatted}](${url})`;

10
11  const result: any = await fal.run("fal-ai/fast-lightning-sdxl", { input: { prompt } });
12  return Response.json({ url: result.images[0].url });
13}

1import { generateImage } from "https://esm.town/v/isidentical/falImageGen?v=11";
2import { blob } from "https://esm.town/v/std/blob?v=12";
3
4const genKey = (key: string): string => {
5  return "genImageCache-v1-" + key;
6};
7
10  let url = await blob.getJSON(genKey(key));
11  if (!url) {
12    let resp = await generateImage(`generate the image you would expect if the url path was: "${key}"`);
13    url = resp.url;
14    await blob.setJSON(genKey(key), url);
15  }
16  return new Response((await fetch(url)).body, { headers: { "content-type": "image/jpg" } });
17}

1/**
2 * Generates an image with Stable Diffusion XL through fal.ai
3 *
4 * @param {string} prompt - The input prompt to send to SDXL model.
5 * @returns {Promise<string>} A promise that resolves to the URL of the image.
6 */
7export async function generateImage(
8  input: string,
9): Promise<{ url: string }> {
10  let resp = await fetch("https://isidentical-falimagehandler.web.val.run/", {
11    method: "POST",
12    body: JSON.stringify({ prompt: input }),

1# Image generated from a path name powered by fal.ai
2
3https://maxm-imggenurl.web.val.run/firefly.jpg

27      title?: string;
28      author?: string;
29      coverImage?: string;
30    };
31    currentlyWatching?: {
32      title?: string;
33      platform?: string;
34      posterImage?: string;
35    };
36    profile_img?: string;
72            <div className="flex flex-col gap-4">
73              <div>
74                <label htmlFor="profile_img" className="text-sm font-medium text-neutral-800">Profile Image</label>
75                <input
76                  id="profile_img"
77                  type="file"
78                  name="profile_img"
79                  accept="image/*"
80                  className="py-2"
81                />
201              </div>
202              <div>
203                <label htmlFor="currentlyReadingCoverImage" className="text-sm font-medium text-neutral-800">Currently Reading Cover Image URL</label>
204                <input
205                  id="currentlyReadingCoverImage"
206                  type="text"
207                  name="currentlyReadingCoverImage"
208                  value={user.currentlyReading?.coverImage}
209                  className="w-full mt-1 px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
210                  placeholder="Currently Reading Cover Image URL"
211                />
212              </div>
234              </div>
235              <div>
236                <label htmlFor="currentlyWatchingPosterImage" className="text-sm font-medium text-neutral-800">Currently Watching Poster Image URL</label>
237                <input
238                  id="currentlyWatchingPosterImage"
239                  type="text"
240                  name="currentlyWatchingPosterImage"
241                  value={user.currentlyWatching?.posterImage}
242                  className="w-full mt-1 px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
243                  placeholder="Currently Watching Poster Image URL"
244                />
245              </div>

6  const userResult = await sqlite.execute({
7    sql: `SELECT id, name, bio, username, email, location, currently_listening, currently_reading_title, 
8                 currently_reading_author, currently_reading_cover_image, currently_watching_title, 
9                 currently_watching_platform, currently_watching_poster_image, profile_theme, updated_at, profile_img 
10          FROM users WHERE username = ?`,
11    args: [username],
16  }
17
18  const [id, name, bio, usernameRetrieved, email, location, currentlyListening, currentlyReadingTitle, currentlyReadingAuthor, currentlyReadingCoverImage, currentlyWatchingTitle, currentlyWatchingPlatform, currentlyWatchingPosterImage, profile_theme, updated_at, profile_img] = userResult.rows[0];
19
20  const linksResult = await sqlite.execute({
25  const links = linksResult.rows.map(([id, label, url]) => ({ id, label, url }));
26
27  return { id, name, bio, username: usernameRetrieved, email, location, currentlyListening, currentlyReading: { title: currentlyReadingTitle || '', author: currentlyReadingAuthor || '', coverImage: currentlyReadingCoverImage || '' }, currentlyWatching: { title: currentlyWatchingTitle || '', platform: currentlyWatchingPlatform || '', posterImage: currentlyWatchingPosterImage || '' }, links, profile_theme, updated_at, profile_img };
28}
29
39  await sqlite.execute({
40    sql: `UPDATE users SET name = ?, bio = ?, location = ?, currently_listening = ?, currently_reading_title = ?, 
41                   currently_reading_author = ?, currently_reading_cover_image = ?, currently_watching_title = ?, 
42                   currently_watching_platform = ?, currently_watching_poster_image = ?, profile_theme = ?, 
43                   updated_at = CURRENT_TIMESTAMP WHERE id = ? profile_img = ?`,
44    args: [name, bio, location || null, currentlyListening || null, currentlyReading?.title || null, currentlyReading?.author || null, currentlyReading?.coverImage || null, currentlyWatching?.title || null, currentlyWatching?.platform || null, currentlyWatching?.posterImage || null, profile_theme || null, profile_img || userId],
45  });
46}
121
122
123export const uploadProfileImage = async (file, username) => {
124  const blobKey = `profile_img/${username}`;
125  const reader = new FileReader();
140
141
142export async function getProfileImageUrl(username) {
143  const key = `profile_img/${username}`;
144  const imageUrl = await blob.get(key);
145  return imageUrl;
146}
147

1/** @jsxImportSource https://esm.sh/hono@latest/jsx **/
2import { getUserByUsername, updateUser, uploadProfileImage } from "https://esm.town/v/iamseeley/Queries";
3import EditProfilePage from "https://esm.town/v/iamseeley/EditProfilePage";
4import RootLayout from "https://esm.town/v/iamseeley/RootLayout";
41      title: body.currentlyReadingTitle,
42      author: body.currentlyReadingAuthor,
43      coverImage: body.currentlyReadingCoverImage,
44    };
45    const currentlyWatching = {
46      title: body.currentlyWatchingTitle,
47      platform: body.currentlyWatchingPlatform,
48      posterImage: body.currentlyWatchingPosterImage,
49    };
50    const profile_theme = body.profile_theme;
56    const existingUser = await getUserByUsername(username);
57
58    // Handle profile image upload
59    const profileImgFile = body.profile_img;
60    let profileImgUrl = existingUser.profile_img; // Default to existing image URL
61
62    if (profileImgFile && profileImgFile.size) {
63      profileImgUrl = await uploadProfileImage(profileImgFile, username);
64    }
65

3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5![b7321ca2cd80899250589b9aa08bc3cae9c7cea276282561194e7fc537259b46.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/311a81bb-18d8-4583-b7e3-64bac326f700/public)
6
7Use this button to install the val:

1Fancy animated SVGs in readmes, along with centering and image sizing.
2```
3<div align="center"><img width=200 src="https://gpanders.com/img/DEC_VT100_terminal.jpg"></div>