Likes
35
excalidraw
@pomdtr
HTTP (deprecated)
Excalidraw, embedded inside Val Town ! The drawing will be persisted in your blobs as json / png / svg. You can access the drawing source directly using the /json , /png and /svg subpaths. For example, to embed the image in a markdown document, you can use: ![pomdtr-excalidraw.web.val.run](https://pomdtr-excalidraw.web.val.run/png)
asciiNycCameras
@maxm
HTTP (deprecated)
ASCII NYC Traffic Cameras All of NYC's traffic cameras available as streaming ASCII images: https://maxm-asciinyccameras.web.val.run/ NYC has a bunch of traffic cameras and makes them available through static images like this one . If you refresh the page you'll see the image update every 2 seconds or so. I thought it might be fun to make these cameras viewable as an ASCII art video feed. I made a small library that takes most of its logic from this repo . You can see a basic example of how to convert any image to ASCII here . I pull in NYC GeoJSON from here and then hook up a Server-Sent Events endpoint to stream the ASCII updates to the browser. (Polling would work just as well, I've just been on a bit of a SSE kick lately.) Hilariously (and expectedly) The ASCII representation is about 4x the size of the the source jpeg and harder to see, but it has a retro-nostalgia look to it that is cool to me :)
devtools
@pomdtr
Script
Devtools shortcuts Add useful shortcuts to a val website. Usage /_edit -> go to the val editor /_raw -> view val source /_logs -> view val logs Example import { devtools } from "https://esm.town/v/pomdtr/devtools";
export default devtools((_req: Request) => {
return new Response("hello world");
});
valtownByExample
@pomdtr
HTTP (deprecated)
Val town by example Usage Simple Example To add an example, just create a val.
The val should start with a JSDoc style multi line comment that describes the example: /**
* @title HTTP server: Hello World
* @description An example of a HTTP server that serves a "Hello World" message.
*/
// this comment will be displayed on the left
export const server = () => new Response("Hello world!") The title is required. Then, you can write the code.
Code can be prefixed with a comment that describes the code.
The comment will be rendered next to the code in the example page. Make sure your val is public, then go to https://pomdtr-val_town_by_example.web.val.run/v/<your-username>/<your-val> Using multiple vals You can add another val to your example by adding an @include directive /**
* @title HTTP server: Hello World
* @description An example of a HTTP server that serves a "Hello World" message.
* @include pomdtr/secondary_val
*/ See @pomdtr/react_example Adding external resources to your example You can attach an external link to your val by using the @resource directive. External resources are specified using a markdown link. /**
* @title HTTP server: Hello World
* @description An example of a HTTP server that serves a "Hello World" message.
* @resource [Val Town Docs](https://docs.val.town)
**/ Adding examples to the homepage Just add your val in @pomdtr/val_town_by_example_toc
classless_css
@stevekrouse
HTTP (deprecated)
Utilities for Classless CSS Forked from Paul Kinlan's Classless CSS Demo Usage For projects that should be pretty in an unopinionated way import { randomStyle } from "https://esm.town/v/stevekrouse/classless_css";
export default async function(req: Request): Promise<Response> {
return new Response(`<h1>Welcome to Val Town!</h1>${randomStyle}`, {
headers: {
"Content-Type": "text/html",
},
});
}
sqliteExplorerApp
@nbbaier
HTTP (deprecated)
SQLite Explorer View and interact with your Val Town SQLite data. It's based off Steve's excellent SQLite Admin val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by LibSQL Studio by invisal . This is now more an SPA, with tables, queries and results showing up on the same page. Install Install the latest stable version (v86) by forking this val: Authentication Login to your SQLite Explorer with password authentication with your Val Town API Token as the password. Todos / Plans [ ] improve error handling [ ] improve table formatting [ ] sticky table headers [x] add codemirror [ ] add loading indication to the run button (initial version shipped) [ ] add ability to favorite queries [ ] add saving of last query run for a table (started) [ ] add visible output for non-query statements [ ] add schema viewing [ ] add refresh to table list sidebar after CREATE/DROP/ALTER statements [ ] add automatic execution of initial select query on double click [x] add views to the sidebar [ ] add triggers to sidebar [ ] add upload from SQL, CSV and JSON [ ] add ability to connect to a non-val town Turso database [x] fix wonky sidebar separator height problem (thanks to @stevekrouse) [x] make result tables scrollable [x] add export to CSV, and JSON (CSV and JSON helper functions written in this val . Thanks to @pomdtr for merging the initial version!) [x] add listener for cmd+enter to submit query
static
@pomdtr
HTTP (deprecated)
Static Vals Serve static content from val.town Usage First, fork this val to get your own http endpoint. Then create a val that uses a string as it's default export, or a single string export. The val must be either public or unlisted . export default `<static content>` You can then fetch the exported string from outside val.town using: curl 'https://<owner>-static.web.val.run/<val>.<extension>' The Content-Type will be dynamically set depending on the provided extension. Example https://pomdtr-static.web.val.run/val_town_readme_style.css Val Link