Val Town Code SearchReturn to Val Town

1# [Infinite SVG Graph](https://maxm-infinitesvggraph.web.val.run/)
2
3[![image.png](https://i.imgur.com/noRUzvk.gif)](https://maxm-infinitesvggraph.web.val.run/)
4
5A connected graph of AI-generated SVG images.
6
7Ask it to make any kind of SVG. Add your contribution to the graph. Make it POP!

20  return new Response(htmlString, {
21    headers: {
22      "content-type": "image/svg+xml",
23    },
24  });

4
5
6![Screenshot 2024-07-17 at 14.14.45@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/b4cd5cc8-84f5-4c1a-1668-7e0abf909100/public)
7
8

1# Test Explorer
2
3![3c584b1ccdd2115d031f49d69f2ac68ea33c450bbde9fdd462036dc2cbf8e907.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/cef156f7-f018-493f-6e25-6649e7f0b500/public)
4
5Click on the play button next to list items to run them.

9const app = new Hono();
10
11const DOWNLOAD_URL = "https://yawnxyz-serve.web.val.run"; // https://yawnxyz-serve.web.val.run/myImage.jpg
12// Define an array of JSON objects
13let blobbyList = await blobby.list();
428                  <form class="input-btn-group | flex flex-row gap-0" @submit.prevent="uploadFromUrl(item.key)">
429                    <button type="submit" class="flex items-center rounded-l-md px-4 py-1 text-sm cursor-pointer bg-gray-100 hover:bg-gray-200">Upload from Url</button>
430                    <input x-text="blobs[item.key]?.uploadUrl" type="text" class="rounded-l-xs rounded-r-md border-1 border-gray-200 px-4 py-1 text-sm text-gray-800 bg-gray-100" @input="updateBlobUrl(item.key, $event.target.value)" placeholder="https://image/mp3/etc">
431                  </form>
432                </div>
461                </template>
462                
463                <template x-if="blobs[item.key]?.type?.includes('image')">
464                  <img :src="blobs[item.key]?.url" controls></audio>
465                </template>
643      <form class="input-btn-group flex flex-row gap-0" @submit.prevent="uploadFromUrl">
644        <button type="submit" class="flex items-center rounded-l-md px-4 py-1 text-sm cursor-pointer bg-gray-100 hover:bg-gray-200">Upload from Url</button>
645        <input x-model="uploadUrl" type="text" class="rounded-l-xs rounded-r-md border-1 border-gray-200 px-4 py-1 text-sm text-gray-800 bg-gray-100" placeholder="https://image/mp3/etc">
646      </form>
647    </div>
676      </template>
677      
678      <template x-if="blobType && blobType.includes('image')">
679        <img :src="blobUrl" alt="Blob content">
680      </template>

3This little webapp is intended to make it easier to copy messages from Slack into other places for sharing or archival, with cleaned-up, readable formatting. I hacked it together on valtown with copious help from an LLM over a weekend; please propose changes or edits, as I'm sure I missed many use-cases and edge-cases. This app runs entirely in your browser and does not send your data anywhere.
4
5![Screenshot 2024-06-24 at 08.49.45@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/3ff8b415-ba7f-439c-458c-5c9c833e4b00/public)
6
7

1# LibSQLStudio
2
3![3fe0fa827f4c3b6e4efcce501182ffcaab898a6f8fb9e12ef44ee25e8e438ded.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/815d9eae-0333-45a2-1ca5-b7e08aec8300/public)
4
5I'll write down the instructions tomorrow. The short version is:

5  // Construct the API URL
6  const apiUrl =
7    `https://en.wikipedia.org/w/api.php?action=query&format=json&prop=extracts|pageimages&exintro=1&explaintext=1&titles=${title}&pithumbsize=300`;
8
9  try {
17      title: page.title,
18      description: page.extract,
19      imageUrl: page.thumbnail?.source || null,
20    };
21  } catch (error) {
30  const wikipediaUrl = `https://en.wikipedia.org${path}`;
31
32  const { title, description, imageUrl } = await getWikipediaInfo(wikipediaUrl);
33
34  const ogMetaTags = `
37    <meta property="og:description" content="">
38    <meta property="twitter:description" content="${description}">
39    <meta name="twitter:card" content="summary_large_image">
40    <meta name="twitter:image" content="https://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Wikipedia-logo-v2.svg/300px-Wikipedia-logo-v2.svg.png">
41    <meta property="og:site_name" content="Wikipedia">
42    <meta property="og:image" content="https://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Wikipedia-logo-v2.svg/300px-Wikipedia-logo-v2.svg.png">
43    <meta property="og:url" content="${wikipediaUrl}">
44    <link rel="canonical" href="${wikipediaUrl}">

1import {
2  ImageMagick,
3  initializeImageMagick,
4  Magick,
5  MagickFormat,
6  Quantum,
7} from "https://esm.sh/@imagemagick/magick-wasm";
8
9const resp = await fetch("https://esm.sh/@imagemagick/magick-wasm@0.0.29/dist/magick.wasm");
10const wasmBytes = await resp.arrayBuffer();
11
12initializeImageMagick(wasmBytes).then(() => {
13  console.log(Magick.imageMagickVersion);
14  console.log("Delegates:", Magick.delegates);
15  console.log("Features:", Magick.features);
17
18  console.log("");
19  ImageMagick.read("logo:", image => {
20    image.resize(100, 100);
21    image.blur(1, 5);
22    console.log(image.toString());
23
24    image.write(MagickFormat.Jpeg, data => {
25      console.log(data.length);
26    });

3Outputs:
4```text
5ImageMagick 7.1.1-30 Q8 x86_64 dd459b01f:20240407 https://imagemagick.org
6Delegates: freetype heic jng jp2 jpeg jxl lcms lqr openexr png raw tiff webp xml zlib
7Features: Cipher