Avatar

maxm

🕳️
76 public vals
Joined January 12, 2023
maxm avatar
staticChess
@maxm
HTTP
Check it out here: https://chess.maxmcd.com Plain, brutalist, no bloat chess. Every page is only html and css. Every chess move is made by clicking a link. Send a link to your friend and they'll send you one back to make your move. No silly animations or slick interactivity to trip up your gameplay. When Google indexes this site will we successfully compute all possible chess moves? Functionality is quite limited, and things might be broken. Please let me know if you find bugs! Inspired by this HN discussion about sites that have all possible game states of tic-tac-toe. I plan on extending this to support real gameplay. I think it could be a nice simple interface for long form games with friends. Might also be fun to add a static AI to play against. Feel free to PR any changes if you'd like to see something added.
maxm avatar
imgGenUrl
@maxm
HTTP
Image generated from a path name powered by fal.ai https://maxm-imggenurl.web.val.run/firefly.jpg https://maxm-imggenurl.web.val.run/retro-computer-hacking.jpg https://maxm-imggenurl.web.val.run/100-yoyos-at-once.jpg
maxm avatar
smileyPNG
@maxm
HTTP
Render a PNG This tiny smiley face is rendered by this val: The image response is cached by the CDN, so make sure to change the image name if you make code changes. Any name with a .png extension will work: https://maxm-smileypng.web.val.run/-.png
maxm avatar
asciiNycCameras
@maxm
HTTP
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 :)
maxm avatar
wasmBlobHost
@maxm
HTTP
WASM Binary Host https://maxm-wasmblobhost.web.val.run/ Where should you host your WASM blobs to use in vals? Host them here! Upload with curl: curl -X POST -H "Content-Type: application/wasm" \ --data-binary @main.wasm https://maxm-wasmBlobHost.web.val.run
maxm avatar
animatedReadmeSVG
@maxm
HTTP
Fancy animated SVGs in readmes, along with centering and image sizing. <div align="center"><img width=200 src="https://gpanders.com/img/DEC_VT100_terminal.jpg"></div> <p align="center"> <img src="https://maxm-animatedreadmesvg.web.val.run/comet.svg" /> </p> <p align="center"> <img src="https://maxm-animatedreadmesvg.web.val.run/custom text!" /> </p>
maxm avatar
selfEditingWebsite
@maxm
HTTP
Self Editing Website Visit and edit at: https://maxm-selfeditingwebsite.web.val.run/
maxm avatar
multiplayerCircles
@maxm
HTTP
Multiplayer Circles Move circles around. State is synced with the server. Open a window in another tab and watch the circles update as you move them .
maxm avatar
streamingGif
@maxm
HTTP
An animated gif that streams the current time:
maxm avatar
valTownChatGPT
@maxm
HTTP
ChatGPT Implemented in Val Town Demonstrated how to use assistants and threads with the OpenAI SDK and how to stream the response with Server-Sent Events.
maxm avatar
freshChartsExample
@maxm
HTTP
Deno Fresh Charts Example Cobbled together from here: https://github.com/denoland/fresh_charts/tree/main/examples Render charts as HTML or as images. This image is rendered by the val below:
maxm avatar
bloomingButton
@maxm
Script
Add a blooming emoji effect when a button is clicked. Import this val as a module and add the bloom-button class to your button. Demo here: https://www.val.town/v/maxm/bloomingButtonDemo /** @jsxImportSource https://esm.sh/react */ import { renderToString } from "npm:react-dom/server"; export default async function(req: Request): Promise<Response> { return new Response( renderToString( <> <link rel="stylesheet" href="https://jenil.github.io/bulmaswatch/simplex/bulmaswatch.min.css" /> <div style={{ textAlign: "center", marginTop: "100px" }}> <button className="is-success button bloom-button" id="treeButton">Click Me</button> </div> <script type="module" src="https://esm.town/v/maxm/bloomingButton" /> </>, ), { headers: { "content-type": "text/html" } }, ); }
maxm avatar
valTownAnalytics
@maxm
HTTP
Val Town Analytics WIP!
maxm avatar
httpStatusBehavior
@maxm
HTTP
HTTP Status Behavior In a bunch of iframes, how does Val Town (cloudflare) handle getting various HTTP status responses.
maxm avatar
tinygoHttpExample
@maxm
HTTP
A Go http handler running in Val Town: The Go source is here . Mandelbrot rendering code taken from here . I used maxm/compileAndUploadTinygoWasm to compile the code and create the val. $ git clone git@github.com:maxmcd/go-town.git $ cd go-town/val-town-tinygo-http-example $ deno run --allow-net --allow-run --allow-read "https://esm.town/v/maxm/compileAndUploadTinygoWasm?v=58" Running tinygo build -o main.wasm -target=wasi . Compliation complete Running wasm-strip main.wasm Copy the following into a val town HTTP val: import { wasmHandler } from "https://esm.town/v/maxm/tinygoHttp"; const resp = await fetch("https://maxm-wasmblobhost.web.val.run/jpxqvyy5tphiwehzklmioklpkpz4gpzs.wasm"); const handler = await wasmHandler(new Uint8Array(await resp.arrayBuffer())); export default async function(req: Request): Promise<Response> { return handler(req); }
maxm avatar
retroVisitCounter
@maxm
HTTP
Retro Visit Counter You are visitor number: How special! Want a retro visitor counter for your myspace page or geocities website? Fork this val and add the image link to your website: <img src="https://maxm-retrovisitcounter.web.val.run/counter.png"> <!-- Make sure you swap this subdomain out with the subdomain of your forked val --> <img src="https://[CHANGE ME!].web.val.run/counter.png">