Val Town Code SearchReturn to Val Town

70  const menuRef = useRef(null);
71  const isPublic = blob.key.startsWith("__public/");
72  const publicUrl = isPublic ? `${window.location.origin}/api/public/${encodeURIComponent(blob.key.slice(9))}` : null;
73
74  useEffect(() => {
234    setLoading(true);
235    try {
236      const response = await fetch(`/api/blobs?prefix=${encodeKey(searchPrefix)}&limit=${limit}`);
237      const data = await response.json();
238      setBlobs(data);
261      setBlobContentLoading(true);
262      try {
263        const response = await fetch(`/api/blob?key=${encodeKey(clickedBlob.key)}`);
264        const content = await response.text();
265        setSelectedBlob({ ...clickedBlob, key: decodeKey(clickedBlob.key) });
275  const handleSave = async () => {
276    try {
277      await fetch(`/api/blob?key=${encodeKey(selectedBlob.key)}`, {
278        method: "PUT",
279        body: editContent,
287  const handleDelete = async (key) => {
288    try {
289      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
290      setBlobs(blobs.filter(b => b.key !== key));
291      if (selectedBlob && selectedBlob.key === key) {
304        const key = `${searchPrefix}${file.name}`;
305        formData.append("key", encodeKey(key));
306        await fetch("/api/blob", { method: "POST", body: formData });
307        const newBlob = { key, size: file.size, lastModified: new Date().toISOString() };
308        setBlobs([newBlob, ...blobs]);
326      try {
327        const fullKey = `${searchPrefix}${key}`;
328        await fetch(`/api/blob?key=${encodeKey(fullKey)}`, {
329          method: "PUT",
330          body: "",
341  const handleDownload = async (key) => {
342    try {
343      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
344      const blob = await response.blob();
345      const url = window.URL.createObjectURL(blob);
360    if (newKey && newKey !== oldKey) {
361      try {
362        const response = await fetch(`/api/blob?key=${encodeKey(oldKey)}`);
363        const content = await response.blob();
364        await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
365          method: "PUT",
366          body: content,
367        });
368        await fetch(`/api/blob?key=${encodeKey(oldKey)}`, { method: "DELETE" });
369        setBlobs(blobs.map(b => b.key === oldKey ? { ...b, key: newKey } : b));
370        if (selectedBlob && selectedBlob.key === oldKey) {
380    const newKey = `__public/${key}`;
381    try {
382      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
383      const content = await response.blob();
384      await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
385        method: "PUT",
386        body: content,
387      });
388      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
389      setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
390      if (selectedBlob && selectedBlob.key === key) {
399    const newKey = key.slice(9); // Remove "__public/" prefix
400    try {
401      const response = await fetch(`/api/blob?key=${encodeKey(key)}`);
402      const content = await response.blob();
403      await fetch(`/api/blob?key=${encodeKey(newKey)}`, {
404        method: "PUT",
405        body: content,
406      });
407      await fetch(`/api/blob?key=${encodeKey(key)}`, { method: "DELETE" });
408      setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));
409      if (selectedBlob && selectedBlob.key === key) {
554                        onClick={() =>
555                          copyToClipboard(
556                            `${window.location.origin}/api/public/${encodeURIComponent(selectedBlob.key.slice(9))}`,
557                          )}
558                        className="text-blue-400 hover:text-blue-300 text-sm"
577                        >
578                          <img
579                            src={`/api/blob?key=${encodeKey(selectedBlob.key)}`}
580                            alt="Blob content"
581                            className="max-w-full h-auto"

1//
2interface Item {
3  id: number; // 	The item's unique id.
4  deleted: boolean; // 	true if the item is deleted.
5  type: "job" | "stroy" | "comment" | "poll" | "pollopt"; // 	The type of item. One of "job", "story", "comment", "poll", or "pollopt".

1# OpenAI Proxy
2
3This OpenAI API proxy injects Val Town's API keys. For usage documentation, check out https://www.val.town/v/std/openai
4
5Migrated from folder: openai/openaiproxy

1import { parseBearerString } from "https://esm.town/v/andreterron/parseBearerString";
2import { API_URL } from "https://esm.town/v/std/API_URL?v=5";
3import { OpenAIUsage } from "https://esm.town/v/std/OpenAIUsage";
4import { RateLimit } from "npm:@rlimit/http";
27  const authHeader = req.headers.get("Proxy-Authorization") || req.headers.get("Authorization");
28  const token = authHeader ? parseBearerString(authHeader) : undefined;
29  const meRes = await fetch(`${API_URL}/v1/me`, { headers: { Authorization: `Bearer ${token}` } });
30  if (!meRes.ok) {
31    return new Response("Unauthorized", { status: 401 });
43
44  // Proxy the request
45  const url = new URL("." + pathname, "https://api.openai.com");
46  url.search = search;
47
48  const headers = new Headers(req.headers);
49  headers.set("Host", url.hostname);
50  headers.set("Authorization", `Bearer ${Deno.env.get("OPENAI_API_KEY")}`);
51  headers.set("OpenAI-Organization", Deno.env.get("OPENAI_API_ORG"));
52
53  const modifiedBody = await limitFreeModel(req, user);

90
91            // Use a CORS proxy as fallback
92            const proxyUrl = `https://api.allorigins.win/get?url=${encodeURIComponent(url)}`;
93            const response = await fetch(proxyUrl);
94            

49Works in all modern browsers that support:
50- ES6 modules
51- Fetch API
52- Clipboard API (for copy functionality)
53- DOMParser

1# Body Measurement System
2
3A computer vision application that calculates body measurements from a single photo using OpenCV and MediaPipe pose detection.
4
5## Features
6
7- Upload a person's photo
8- Automatic pose detection using MediaPipe
9- Calculate key body measurements:
10  - Height
21## How it works
22
231. **Pose Detection**: Uses MediaPipe to detect 33 key body landmarks
242. **Reference Scaling**: Uses known body proportions or user-provided reference measurements
253. **Anthropometric Calculations**: Applies standard body measurement formulas
44```
45├── backend/
46│   ├── index.ts              # Main API server
47│   ├── pose-detection.ts     # MediaPipe pose detection
48│   ├── measurements.ts       # Body measurement calculations
49│   └── utils.ts             # Helper functions
56```
57
58## API Endpoints
59
60- `POST /api/measure` - Upload image and get body measurements
61- `POST /api/report` - Download measurements as text file
62- `GET /api/health` - Health check endpoint
63- `GET /api/docs` - API documentation
64- `GET /` - Serve the main application
65
68This demo currently uses mock pose detection for demonstration purposes. To integrate with real pose detection:
69
70### Option 1: MediaPipe (Recommended for accuracy)
71```bash
72npm install @mediapipe/pose @mediapipe/camera_utils
73```
74

1// Example of how to integrate with real MediaPipe pose detection
2// This file shows how you would replace the mock pose detection with actual MediaPipe
3
4/*
5To use real MediaPipe pose detection, you would need to:
6
71. Install MediaPipe dependencies:
8   - @mediapipe/pose
9   - @mediapipe/camera_utils
10   - @mediapipe/drawing_utils
11
122. Replace the mock pose detection in pose-detection.ts with this implementation:
13
14import { Pose, Results } from '@mediapipe/pose';
15import { Camera } from '@mediapipe/camera_utils';
16
17export class RealPoseDetector {
22    this.pose = new Pose({
23      locateFile: (file) => {
24        return `https://cdn.jsdelivr.net/npm/@mediapipe/pose/${file}`;
25      }
26    });
57        this.pose.onResults((results: Results) => {
58          if (results.poseLandmarks && results.poseLandmarks.length > 0) {
59            // Convert MediaPipe landmarks to our format
60            const landmarks = results.poseLandmarks.map(landmark => ({
61              x: landmark.x,
70        });
71
72        // Send image to MediaPipe
73        this.pose.send({ image: canvas });
74      };
82// For server-side processing (Node.js/Deno), you would use:
83// - @tensorflow/tfjs-node for TensorFlow.js
84// - @mediapipe/tasks-vision for MediaPipe Tasks
85// - opencv4nodejs for OpenCV
86
159    ],
160    cons: [
161      "Only 17 keypoints vs MediaPipe's 33",
162      "No z-coordinate",
163      "Less accurate than MediaPipe"
164    ],
165    bestFor: "Applications where speed and simplicity are more important than maximum accuracy"
185For production use, we recommend:
186
1871. MediaPipe for web applications (client-side processing)
1882. TensorFlow.js PoseNet for server-side processing
1893. Combine with OpenCV for additional image preprocessing

1// Main API server for body measurement system
2import { Hono } from "https://esm.sh/hono@3.11.7";
3import { readFile, serveFile } from "https://esm.town/v/std/utils@85-main/index.ts";
28  const dataScript = `<script>
29    window.__INITIAL_DATA__ = {
30      apiEndpoint: '/api/measure',
31      maxFileSize: 10 * 1024 * 1024, // 10MB
32      supportedFormats: ['image/jpeg', 'image/png', 'image/webp']
39
40// Main measurement endpoint
41app.post("/api/measure", async c => {
42  try {
43    const body: MeasurementRequest = await c.req.json();
105
106// Get measurement report as text
107app.post("/api/report", async c => {
108  try {
109    const body: MeasurementRequest = await c.req.json();
141
142// Health check endpoint
143app.get("/api/health", c => {
144  return c.json({
145    status: "healthy",
149});
150
151// API documentation
152app.get("/api/docs", c => {
153  const docs = {
154    title: "Body Measurement API",
155    version: "1.0.0",
156    endpoints: {
157      "POST /api/measure": {
158        description: "Calculate body measurements from an image",
159        body: {
170        }
171      },
172      "POST /api/report": {
173        description: "Generate a text report of body measurements",
174        body: "Same as /api/measure",
175        response: "text/plain (measurement report)"
176      },
177      "GET /api/health": {
178        description: "Health check endpoint",
179        response: {

169                        };
170
171                        const response = await fetch('/api/measure', {
172                            method: 'POST',
173                            headers: {
209                        };
210
211                        const response = await fetch('/api/report', {
212                            method: 'POST',
213                            headers: {