Val Town Code Search

patientGreenSkink README.md1 match

@pomdtr•Updated 6 months ago

3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5![Screenshot 2024-11-22 at 15.43.43@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d075a4ee-93ec-4cdd-4823-7c8aee593f00/public)
6
7Versions 0-17 of this val were done with Hono and server-rendering.

patientGreenSkink main.tsx5 matches

@pomdtr•Updated 6 months ago

440          {profile && (
441            <div className="flex items-center space-x-4">
442              <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
443              <span>{profile.username}</span>
444              <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
583                            alt="Blob content"
584                            className="max-w-full h-auto"
585                            onError={() => console.error("Error loading image")}
586                          />
587                        </div>
635                  <li>Create public shareable links for blobs</li>
636                  <li>View and manage public folder</li>
637                  <li>Preview images directly in the interface</li>
638                </ul>
639              </div>
693  const { ValTown } = await import("npm:@valtown/sdk");
694  const vt = new ValTown();
695  const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
696  // const authorEmail = me.email;
697
761
762  c.set("email", email);
763  c.set("profile", { profileImageUrl, username });
764  await next();
765};

slides main.tsx3 matches

@curtcox•Updated 6 months ago

1const imageCyclerPage = (text: string) =>
2  `<!DOCTYPE html>
3<html>
4<head>
5    <title>Image Cycler</title>
6    <style>
7        body {
111
112    // Return the fetched content with the original content type
113    return new Response(imageCyclerPage(text), {
114      headers: {
115        "Content-Type": "text/html",

glifInventory main.tsx10 matches

@jamiedubs•Updated 6 months ago

6const KEY = "glifInventory";
7const INVENTORY_TABLE = `${KEY}_inventory_${SCHEMA_VERSION}`;
8const DEFAULT_IMAGE_URL = "https://res.cloudinary.com/dzkwltgyd/image/upload/v1733165766/image-input-block-production/apjbm5nfc6yoevwnisxh.jpg";
9
10// Inventory Database Initialization
16      item_name TEXT NOT NULL,
17      item_type TEXT NOT NULL,
18      image_url TEXT NOT NULL,
19      description TEXT,
20      quantity INTEGER NOT NULL DEFAULT 1,
51    .min(1, "Item name is required")
52    .max(100, "Item name must be 100 characters or less"),
53  image: z.string()
54    .url("Valid image URL is required")
55    .max(500, "Image URL must be 500 characters or less")
56    .optional(),
57  type: z.string()
111    id: row.id,
112    name: row.item_name,
113    image: row.image_url,
114    type: row.item_type,
115    description: row.description,
129  await sqlite.execute(
130    `INSERT INTO ${INVENTORY_TABLE} (
131      id, address, item_name, item_type, image_url, 
132      description, quantity, weight, rarity, durability
133    ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
140      item.name,
141      item.type,
142      item.image || DEFAULT_IMAGE_URL,
143      item.description || null,
144      item.quantity || 1,
393  "item": {
394    "name": "Magic Sword",
395    "image": "https://example.com/sword.png",
396    "type": "tool",
397    "description": "A powerful magical sword",
400  }
401}'</code></pre>
402        <p>Note: The "image" field is optional. If not provided, a default image will be used.</p>
403
404        <h3 class="route">POST /remove</h3>

blob_admin README.md1 match

@cameronpak•Updated 6 months ago

3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5![Screenshot 2024-11-22 at 15.43.43@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d075a4ee-93ec-4cdd-4823-7c8aee593f00/public)
6
7Versions 0-17 of this val were done with Hono and server-rendering.

blob_admin main.tsx5 matches

@cameronpak•Updated 6 months ago

440          {profile && (
441            <div className="flex items-center space-x-4">
442              <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
443              <span>{profile.username}</span>
444              <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
583                            alt="Blob content"
584                            className="max-w-full h-auto"
585                            onError={() => console.error("Error loading image")}
586                          />
587                        </div>
635                  <li>Create public shareable links for blobs</li>
636                  <li>View and manage public folder</li>
637                  <li>Preview images directly in the interface</li>
638                </ul>
639              </div>
693  const { ValTown } = await import("npm:@valtown/sdk");
694  const vt = new ValTown();
695  const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
696  // const authorEmail = me.email;
697
761
762  c.set("email", email);
763  c.set("profile", { profileImageUrl, username });
764  await next();
765};

blob_admin README.md1 match

@eowczarek•Updated 6 months ago

3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5![Screenshot 2024-11-22 at 15.43.43@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d075a4ee-93ec-4cdd-4823-7c8aee593f00/public)
6
7Versions 0-17 of this val were done with Hono and server-rendering.

blob_admin main.tsx5 matches

@eowczarek•Updated 6 months ago

440          {profile && (
441            <div className="flex items-center space-x-4">
442              <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
443              <span>{profile.username}</span>
444              <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
583                            alt="Blob content"
584                            className="max-w-full h-auto"
585                            onError={() => console.error("Error loading image")}
586                          />
587                        </div>
635                  <li>Create public shareable links for blobs</li>
636                  <li>View and manage public folder</li>
637                  <li>Preview images directly in the interface</li>
638                </ul>
639              </div>
693  const { ValTown } = await import("npm:@valtown/sdk");
694  const vt = new ValTown();
695  const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
696  // const authorEmail = me.email;
697
761
762  c.set("email", email);
763  c.set("profile", { profileImageUrl, username });
764  await next();
765};

image2pdf main.tsx9 matches

@kvrt•Updated 6 months ago

19
20    const formData = new FormData();
21    formData.append('image', file);
22
23    try {
44      textAlign: 'center' 
45    }}>
46      <h1>🖼️ Image to PDF Converter</h1>
47      <input 
48        type="file" 
49        accept="image/jpeg,image/png,image/gif" 
50        onChange={handleFileChange} 
51      />
104  if (request.method === 'POST') {
105    const formData = await request.formData();
106    const imageFile = formData.get('image') as File;
107
108    if (!imageFile) {
109      return new Response('No image uploaded', { status: 400 });
110    }
111
112    const arrayBuffer = await imageFile.arrayBuffer();
113    const pdfDoc = await PDFDocument.create();
114    const page = pdfDoc.addPage();
122    );
123
124    page.drawImage(img, {
125      x: (pageWidth - img.width * imgScale) / 2,
126      y: (pageHeight - img.height * imgScale) / 2,
142    <html>
143      <head>
144        <title>Image to PDF Converter</title>
145        <script src="https://esm.town/v/std/catch"></script>
146      </head>

popularAquamarineDormouse main.tsx29 matches

@adnan•Updated 6 months ago

1import { createCanvas, loadImage } from "https://deno.land/x/canvas/mod.ts";
2import { BLOB_PREFIX, PlateDetails, POST_PREFIX } from "https://esm.town/v/adnan/findPlates";
3import { blueskyPostWithImage } from "https://esm.town/v/dupontgu/heavenlyOrangeMarmoset";
4import { Counter } from "https://esm.town/v/dupontgu/persistentCounter";
5import { blob } from "https://esm.town/v/std/blob";
6
7interface Image {
8  url: string;
9  // text locations within image, Vec3: [x, y, rotation]
10  slammer_txt_loc: number[];
11  slammed_txt_loc: number[];
14}
15
16// async function overlayTextOnImage(imageDef: Image): Promise<Uint8Array> {
17//   console.log(imageDef);
18//   const image = await loadImage(imageDef);
19
20//   // Define the desired aspect ratio (16:9)
22
23//   // Calculate the new dimensions for the canvas
24//   let newWidth = image.width();
25//   let newHeight = image.height();
26
27//   if (newWidth / newHeight > targetAspectRatio) {
28//     // Image is wider than 16:9, adjust width
29//     newWidth = newHeight * targetAspectRatio;
30//   } else {
31//     // Image is taller than 16:9, adjust height
32//     newHeight = newWidth / targetAspectRatio;
33//   }
37
38//   // Calculate the cropping offset
39//   const offsetX = (image.width() - newWidth) / 2;
40//   const offsetY = (image.height() - newHeight) / 2;
41
42//   // Draw the image with cropping
43//   ctx.drawImage(
44//     image,
45//     offsetX,
46//     offsetY,
53//   );
54
55//   return canvas.toBuffer("image/png");
56// }
57
58async function overlayTextOnImage(imageDef: Image): Promise<Uint8Array> {
59  const image = await loadImage(imageDef);
60
61  // Original image dimensions
62  const originalWidth = 541;
63  const originalHeight = 132;
74  ctx.fillRect(0, 0, canvasSize, canvasSize);
75
76  // Center the original image on the canvas
77  const xOffset = (canvasSize - originalWidth) / 2;
78  const yOffset = (canvasSize - originalHeight) / 2;
79  ctx.drawImage(image, xOffset, yOffset, originalWidth, originalHeight);
80
81  return canvas.toBuffer("image/png");
82}
83
92  const postCounter = new Counter("PLATE_post_counter");
93  const count = await postCounter.get();
94  const image = plateDetails.imageUrl;
95
96  const adjustedHeadline = plateDetails.title;
101  console.log(plateDetails);
102  console.log(statusText);
103  const altText = `\n A number plate with the digits ${plateDetails.title}.\n\n image source: ${plateDetails.imageUrl}`;
104  await blob.delete(inputs[0].key);
105  await blob.setJSON(POST_PREFIX + plateDetails.url);
106  await postCounter.increment();
107
108  const modifiedImageBuffer = await overlayTextOnImage(image);
109
110  await blueskyPostWithImage(statusText, modifiedImageBuffer, altText);
111  return new Response(modifiedImageBuffer, {
112    headers: {
113      "Content-Type": "image/png",
114    },
115  });

« Previous

1...818 819 820 821 822 823 824...927

Projects

View all 105 vals

placeholdji2 file matches

@jjg•Updated 1 week ago

Placeholder image service with emojis 🖼️

Users

View all 2 users

"Focal Lens with Atig Wazir" "Welcome to my photography journey! I'm Atiq Wazir, a passionate photographer capturing life's beauty one frame at a time. Explore my gallery for stunning images, behind-the-scenes stories, and tips & tricks to enhance your own

Documentation

View all 7 documentation results

Val Town Code Search Return to Val Town

patientGreenSkink README.md1 match

patientGreenSkink main.tsx5 matches

slides main.tsx3 matches

glifInventory main.tsx10 matches

blob_admin README.md1 match

blob_admin main.tsx5 matches

blob_admin README.md1 match

blob_admin main.tsx5 matches

image2pdf main.tsx9 matches

popularAquamarineDormouse main.tsx29 matches

Projects

image_generator1 file match

placeholdji2 file matches

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code SearchReturn to Val Town

patientGreenSkinkREADME.md1 match

patientGreenSkinkmain.tsx5 matches

slidesmain.tsx3 matches

glifInventorymain.tsx10 matches

blob_adminREADME.md1 match

blob_adminmain.tsx5 matches

blob_adminREADME.md1 match

blob_adminmain.tsx5 matches

image2pdfmain.tsx9 matches

popularAquamarineDormousemain.tsx29 matches

Projects

image_generator1 file match

placeholdji2 file matches

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code Search Return to Val Town

patientGreenSkink README.md1 match

patientGreenSkink main.tsx5 matches

slides main.tsx3 matches

glifInventory main.tsx10 matches

blob_admin README.md1 match

blob_admin main.tsx5 matches

blob_admin README.md1 match

blob_admin main.tsx5 matches

image2pdf main.tsx9 matches

popularAquamarineDormouse main.tsx29 matches