Val Town Code Search

adportal index.ts84 matches

@devto•Updated 2 weeks ago

6import { generateUniqueId } from "./utils.ts";
7import { 
8  storeImage, 
9  getImage, 
10  getImageMetadata, 
11  listSubmissionImages,
12  deleteImage,
13  ImageMetadata,
14  testBlobStorage
15} from "./image-storage.ts";
16import { blob } from "https://esm.town/v/std/blob";
17
103    
104    // Remove id from the fields to update
105    const { id: _, images: __, ...fieldsToUpdate } = body;
106    
107    // Update the submission in the database
119});
120
121// Upload an image
122app.post("/upload-image", async (c) => {
123  try {
124    console.log("[SERVER] Received image upload request");
125    
126    // Parse the multipart form data
162    console.log(`[SERVER] File read as Uint8Array, length: ${uint8Array.length} bytes`);
163    
164    // Store the image
165    console.log(`[SERVER] Calling storeImage function`);
166    const metadata = await storeImage(
167      uint8Array,
168      file.name,
171    );
172    
173    console.log(`[SERVER] Image stored successfully with ID: ${metadata.id}`);
174    
175    // Immediately try to list images to verify
176    console.log(`[SERVER] Verifying image listing immediately after upload`);
177    const images = await listSubmissionImages(submissionId);
178    console.log(`[SERVER] Verification found ${images.length} images`);
179    
180    return c.json({ 
181      success: true, 
182      message: "Image uploaded successfully",
183      data: metadata,
184      debug: {
185        imagesFound: images.length,
186        imageIds: images.map(img => img.id)
187      }
188    });
189  } catch (error) {
190    console.error("[SERVER] Error uploading image:", error);
191    return c.json({ 
192      success: false, 
193      message: "An error occurred uploading your image",
194      error: error.toString()
195    }, 500);
197});
198
199// Get an image by ID
200app.get("/image", async (c) => {
201  try {
202    const imageId = c.req.query("id");
203    console.log(`[SERVER] Image request received for ID: ${imageId}`);
204    
205    if (!imageId) {
206      console.log("[SERVER] Missing image ID in request");
207      return c.json({ success: false, message: "Image ID is required" }, 400);
208    }
209    
210    // Get image metadata
211    const metadata = await getImageMetadata(imageId);
212    if (!metadata) {
213      console.log(`[SERVER] Metadata not found for image: ${imageId}`);
214      return c.json({ success: false, message: "Image not found" }, 404);
215    }
216    
217    console.log(`[SERVER] Metadata retrieved for image: ${imageId}`);
218    console.log(`[SERVER] Image details: name=${metadata.originalName}, type=${metadata.contentType}, size=${metadata.size} bytes`);
219    
220    // Get the image data
221    const imageData = await getImage(imageId);
222    if (!imageData) {
223      console.log(`[SERVER] Image data not found for ID: ${imageId}`);
224      return c.json({ success: false, message: "Image data not found" }, 404);
225    }
226    
227    console.log(`[SERVER] Image data retrieved successfully, size: ${imageData.length} bytes`);
228    
229    // Return the image with proper content type
230    console.log(`[SERVER] Serving image with content type: ${metadata.contentType}`);
231    return new Response(imageData, {
232      headers: {
233        "Content-Type": metadata.contentType,
236    });
237  } catch (error) {
238    console.error("[SERVER] Error getting image:", error);
239    return c.json({ success: false, message: "An error occurred getting the image" }, 500);
240  }
241});
242
243// List images for a submission
244app.get("/list-images", async (c) => {
245  try {
246    const submissionId = c.req.query("submissionId");
247    console.log(`[SERVER] List images request for submission: ${submissionId}`);
248    
249    if (!submissionId) {
250      console.log("[SERVER] Missing submission ID in list images request");
251      return c.json({ success: false, message: "Submission ID is required" }, 400);
252    }
253    
254    // Get all images for this submission
255    const images = await listSubmissionImages(submissionId);
256    console.log(`[SERVER] Found ${images.length} images for submission: ${submissionId}`);
257    
258    // Log details of each image
259    images.forEach((img, index) => {
260      console.log(`[SERVER] Image ${index + 1}: id=${img.id}, name=${img.originalName}, type=${img.contentType}, size=${img.size} bytes`);
261    });
262    
263    return c.json({ 
264      success: true, 
265      data: images
266    });
267  } catch (error) {
268    console.error("[SERVER] Error listing images:", error);
269    return c.json({ 
270      success: false, 
271      message: "An error occurred listing images" 
272    }, 500);
273  }
274});
275
276// Delete an image
277app.delete("/image", async (c) => {
278  try {
279    const body = await c.req.json();
280    const { imageId, submissionId } = body;
281    console.log(`[SERVER] Delete image request: imageId=${imageId}, submissionId=${submissionId}`);
282    
283    if (!imageId || !submissionId) {
284      console.log("[SERVER] Missing required parameters for image deletion");
285      return c.json({ 
286        success: false, 
287        message: "Image ID and Submission ID are required" 
288      }, 400);
289    }
290    
291    // Get image metadata to verify it belongs to this submission
292    const metadata = await getImageMetadata(imageId);
293    if (!metadata) {
294      console.log(`[SERVER] Metadata not found for image: ${imageId}`);
295      return c.json({ 
296        success: false, 
297        message: "Image not found" 
298      }, 404);
299    }
300    
301    if (metadata.submissionId !== submissionId) {
302      console.log(`[SERVER] Image ${imageId} does not belong to submission ${submissionId}`);
303      console.log(`[SERVER] Image belongs to submission: ${metadata.submissionId}`);
304      return c.json({ 
305        success: false, 
306        message: "Image does not belong to this submission" 
307      }, 403);
308    }
309    
310    console.log(`[SERVER] Verified image ${imageId} belongs to submission ${submissionId}`);
311    
312    // Delete the image
313    const success = await deleteImage(imageId);
314    
315    if (!success) {
316      console.log(`[SERVER] Failed to delete image: ${imageId}`);
317      return c.json({ success: false, message: "Failed to delete image" }, 500);
318    }
319    
320    console.log(`[SERVER] Successfully deleted image: ${imageId}`);
321    
322    return c.json({ 
323      success: true, 
324      message: "Image deleted successfully"
325    });
326  } catch (error) {
327    console.error("[SERVER] Error deleting image:", error);
328    return c.json({ 
329      success: false, 
330      message: "An error occurred deleting the image" 
331    }, 500);
332  }

adportal image-storage.ts75 matches

@devto•Updated 2 weeks ago

1import { blob } from "https://esm.town/v/std/blob";
2
3// Prefix for image keys in blob storage
4const IMAGE_PREFIX = "laura_mepson_image_";
5
6// Interface for image metadata
7export interface ImageMetadata {
8  id: string;
9  originalName: string;
14}
15
16// Generate a unique ID for an image
17export function generateImageId(submissionId: string): string {
18  const timestamp = Date.now().toString(36);
19  const randomPart = Math.random().toString(36).substring(2, 8);
20  return `${IMAGE_PREFIX}${submissionId}_${timestamp}${randomPart}`;
21}
22
23// Store an image in blob storage
24export async function storeImage(
25  imageData: Uint8Array, // Raw image data
26  fileName: string,
27  contentType: string,
28  submissionId: string
29): Promise<ImageMetadata> {
30  try {
31    console.log(`[BLOB STORAGE] Storing image: ${fileName} (${contentType}) for submission: ${submissionId}`);
32    console.log(`[BLOB STORAGE] Image size: ${imageData.length} bytes`);
33    
34    // Generate a unique ID for the image
35    const imageId = generateImageId(submissionId);
36    console.log(`[BLOB STORAGE] Generated image ID: ${imageId}`);
37    
38    // Store the image data directly
39    await blob.set(imageId, imageData, { contentType });
40    console.log(`[BLOB STORAGE] Image data stored successfully with ID: ${imageId}`);
41    
42    // Verify the image was stored
43    const storedData = await blob.get(imageId);
44    if (storedData) {
45      console.log(`[BLOB STORAGE] Verified image data is stored (${storedData.length} bytes)`);
46    } else {
47      console.log(`[BLOB STORAGE] WARNING: Could not verify image data storage`);
48    }
49    
50    // Create metadata
51    const metadata: ImageMetadata = {
52      id: imageId,
53      originalName: fileName,
54      contentType,
55      size: imageData.length,
56      uploadedAt: new Date().toISOString(),
57      submissionId
60    console.log(`[BLOB STORAGE] Storing metadata: ${JSON.stringify(metadata)}`);
61    
62    // Store metadata alongside the image
63    await blob.setJSON(`${imageId}_metadata`, metadata);
64    console.log(`[BLOB STORAGE] Image metadata stored successfully`);
65    
66    // Verify metadata was stored
67    const storedMetadata = await blob.getJSON(`${imageId}_metadata`);
68    if (storedMetadata) {
69      console.log(`[BLOB STORAGE] Verified metadata is stored: ${JSON.stringify(storedMetadata)}`);
79    return metadata;
80  } catch (error) {
81    console.error("[BLOB STORAGE] Error storing image:", error);
82    throw error;
83  }
84}
85
86// Get an image from blob storage
87export async function getImage(imageId: string): Promise<Uint8Array | null> {
88  try {
89    console.log(`[BLOB STORAGE] Retrieving image with ID: ${imageId}`);
90    const imageData = await blob.get(imageId);
91    
92    if (imageData) {
93      console.log(`[BLOB STORAGE] Image retrieved successfully, size: ${imageData.length} bytes`);
94    } else {
95      console.log(`[BLOB STORAGE] Image not found with ID: ${imageId}`);
96    }
97    
98    return imageData;
99  } catch (error) {
100    console.error(`[BLOB STORAGE] Error getting image ${imageId}:`, error);
101    return null;
102  }
103}
104
105// Get image metadata
106export async function getImageMetadata(imageId: string): Promise<ImageMetadata | null> {
107  try {
108    console.log(`[BLOB STORAGE] Retrieving metadata for image: ${imageId}`);
109    const metadata = await blob.getJSON(`${imageId}_metadata`);
110    
111    if (metadata) {
112      console.log(`[BLOB STORAGE] Metadata retrieved successfully for image: ${imageId}`);
113    } else {
114      console.log(`[BLOB STORAGE] Metadata not found for image: ${imageId}`);
115    }
116    
117    return metadata as ImageMetadata;
118  } catch (error) {
119    console.error(`[BLOB STORAGE] Error getting image metadata for ${imageId}:`, error);
120    return null;
121  }
122}
123
124// List all images for a submission
125export async function listSubmissionImages(submissionId: string): Promise<ImageMetadata[]> {
126  try {
127    console.log(`[BLOB STORAGE] Listing images for submission: ${submissionId}`);
128    console.log(`[BLOB STORAGE] Using prefix: ${IMAGE_PREFIX}${submissionId}_`);
129    
130    // First, list all keys to see what's in the blob storage
133    allKeys.forEach(key => console.log(`[BLOB STORAGE] - ${key}`));
134    
135    // List all blobs with the image prefix for this submission
136    const keys = await blob.list(`${IMAGE_PREFIX}${submissionId}_`);
137    console.log(`[BLOB STORAGE] Found ${keys.length} keys for submission: ${submissionId}`);
138    keys.forEach(key => console.log(`[BLOB STORAGE] - ${key}`));
139    
140    // Filter out metadata keys and get only image keys
141    const imageKeys = keys.filter(key => !key.endsWith('_metadata'));
142    console.log(`[BLOB STORAGE] Found ${imageKeys.length} image keys after filtering`);
143    imageKeys.forEach(key => console.log(`[BLOB STORAGE] - Image key: ${key}`));
144    
145    // Get metadata for each image
146    const metadataPromises = imageKeys.map(key => getImageMetadata(key));
147    const metadataResults = await Promise.all(metadataPromises);
148    
149    // Filter out any null results
150    const validMetadata = metadataResults.filter(metadata => metadata !== null) as ImageMetadata[];
151    console.log(`[BLOB STORAGE] Retrieved ${validMetadata.length} valid metadata objects`);
152    validMetadata.forEach(meta => console.log(`[BLOB STORAGE] - Metadata: ${meta.id}, ${meta.originalName}`));
154    return validMetadata;
155  } catch (error) {
156    console.error(`[BLOB STORAGE] Error listing submission images for ${submissionId}:`, error);
157    return [];
158  }
159}
160
161// Delete an image and its metadata
162export async function deleteImage(imageId: string): Promise<boolean> {
163  try {
164    console.log(`[BLOB STORAGE] Deleting image with ID: ${imageId}`);
165    
166    await blob.delete(imageId);
167    console.log(`[BLOB STORAGE] Image deleted: ${imageId}`);
168    
169    await blob.delete(`${imageId}_metadata`);
170    console.log(`[BLOB STORAGE] Image metadata deleted: ${imageId}_metadata`);
171    
172    return true;
173  } catch (error) {
174    console.error(`[BLOB STORAGE] Error deleting image ${imageId}:`, error);
175    return false;
176  }
218    await blob.delete(testKey);
219    
220    // 6. List image keys for this submission
221    console.log(`[BLOB STORAGE TEST] Listing image keys for submission: ${submissionId}`);
222    const imageKeys = await blob.list(`${IMAGE_PREFIX}${submissionId}_`);
223    console.log(`[BLOB STORAGE TEST] Found ${imageKeys.length} image keys`);
224    
225    return {
229        totalKeys: allKeys.length,
230        prefixedKeys: prefixedKeys.length,
231        imageKeys: imageKeys,
232        testKeyWorked: true
233      }

blob_admin README.md1 match

@devto•Updated 2 weeks 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
7To use this, fork it to your account.

blob_admin main.tsx2 matches

@devto•Updated 2 weeks ago

60  const { ValTown } = await import("npm:@valtown/sdk");
61  const vt = new ValTown();
62  const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
63  // const authorEmail = me.email;
64
128
129  c.set("email", email);
130  c.set("profile", { profileImageUrl, username });
131  await next();
132};

blob_admin app.tsx3 matches

@devto•Updated 2 weeks ago

437          {profile && (
438            <div className="flex items-center space-x-4">
439              <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
440              <span>{profile.username}</span>
441              <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
580                            alt="Blob content"
581                            className="max-w-full h-auto"
582                            onError={() => console.error("Error loading image")}
583                          />
584                        </div>
630                  <li>Create public shareable links for blobs</li>
631                  <li>View and manage public folder</li>
632                  <li>Preview images directly in the interface</li>
633                </ul>
634              </div>

adportal README.md9 matches

@devto•Updated 2 weeks ago

10- Email functionality to send users a unique link
11- Continuation page for adding more information
12- Image upload and storage functionality
13
14## Project Structure
20- `landing.html` - Main landing page
21- `continue.html` - Page for adding additional information
22- `image-storage.ts` - Image storage and retrieval functionality
23
24## Database Schema
445. User can click the link to add more information
456. Additional information is saved to the database
467. User can upload and manage images related to their submission
47
48## URL Structure
51- Continuation page: `https://[username].web.val.run?action=continue&id=[unique_id]`
52
53## Image Storage
54
55Images are stored using Val Town's blob storage:
56- Images are stored with a unique ID
57- Metadata is stored alongside each image
58- Users can upload, view, and delete images
59- Images are associated with a specific submission
60
61## Development Notes

blob_admin README.md1 match

@asdfg•Updated 2 weeks 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
7To use this, fork it to your account.

blob_admin main.tsx2 matches

@asdfg•Updated 2 weeks ago

60  const { ValTown } = await import("npm:@valtown/sdk");
61  const vt = new ValTown();
62  const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
63  // const authorEmail = me.email;
64
128
129  c.set("email", email);
130  c.set("profile", { profileImageUrl, username });
131  await next();
132};

blob_admin app.tsx3 matches

@asdfg•Updated 2 weeks ago

437          {profile && (
438            <div className="flex items-center space-x-4">
439              <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
440              <span>{profile.username}</span>
441              <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
580                            alt="Blob content"
581                            className="max-w-full h-auto"
582                            onError={() => console.error("Error loading image")}
583                          />
584                        </div>
630                  <li>Create public shareable links for blobs</li>
631                  <li>View and manage public folder</li>
632                  <li>Preview images directly in the interface</li>
633                </ul>
634              </div>

GitHub-PR-Automation README.md2 matches

@twschiller•Updated 2 weeks ago

11
12See all 3 in action👇
13![Assignee_Label.gif](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d46f0781-8f79-4e93-cb1b-c1ac72cc4000/public)
14
15### 1. PR Auto-Assign
50
51See this in action👇
52![GitHubSlack.gif](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/fc444d1e-4954-4e2d-b508-920bdac55d00/public)
53
54

« Previous

1...143 144 145 146 147 148 149...768

Projects

View all 102 vals

ImageExplorer10 file matches

@carmi•Updated 3 days ago

Imagetourl2 file matches

@dcm31•Updated 6 days ago

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

adportal index.ts84 matches

adportal image-storage.ts75 matches

blob_admin README.md1 match

blob_admin main.tsx2 matches

blob_admin app.tsx3 matches

adportal README.md9 matches

blob_admin README.md1 match

blob_admin main.tsx2 matches

blob_admin app.tsx3 matches

GitHub-PR-Automation README.md2 matches

Projects

ImageExplorer10 file matches

Imagetourl2 file matches

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code SearchReturn to Val Town

adportalindex.ts84 matches

adportalimage-storage.ts75 matches

blob_adminREADME.md1 match

blob_adminmain.tsx2 matches

blob_adminapp.tsx3 matches

adportalREADME.md9 matches

blob_adminREADME.md1 match

blob_adminmain.tsx2 matches

blob_adminapp.tsx3 matches

GitHub-PR-AutomationREADME.md2 matches

Projects

ImageExplorer10 file matches

Imagetourl2 file matches

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code Search Return to Val Town

adportal index.ts84 matches

adportal image-storage.ts75 matches

blob_admin README.md1 match

blob_admin main.tsx2 matches

blob_admin app.tsx3 matches

adportal README.md9 matches

blob_admin README.md1 match

blob_admin main.tsx2 matches

blob_admin app.tsx3 matches

GitHub-PR-Automation README.md2 matches