Log inSign up

Search

Results include substring matches and semantically similar vals. Learn more
postpostscript avatar
valTownLogo
@postpostscript
// let me know if this is an issue :)
Script
export const logo = {
white: html(svg2dataURL(
"<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"600\" height=\"237\" fill=\"none\"><path d=\"M0 0h600v237H0z\"/><g fil
black: html(svg2dataURL(
"<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"600\" height=\"237\" fill=\"none\"><path d=\"M0 0h600v237H0z\"/><g fil
export const mark = {
white: html(svg2dataURL(
"<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"400\" height=\"400\" fill=\"none\"><path d=\"M0 0h400v400H0z\"/><g fil
black: html(svg2dataURL(
"<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"400\" height=\"400\" fill=\"none\"><path d=\"M0 0h400v400H0z\"/><g fil
edgeeffect avatar
whatDoYouThinkOfItSoFar
@edgeeffect
What Do You Think of it so far? Rubbish! Our bin men (garbage men to you) come round every Friday morning. But alternate weeks, they take either rubbish or recycling. This val extracts from our local council website which collection they're doing this week and E. mails me the details every Thursday afternoon. I've hidden the URL in an environment variable (sorry) but the URL has details of our address and I'm not sure how happy our local council would be to start getting loads of hits from all round the world. But it's here as a sample of how easy it is to scrape a website and E. mail the details to yourself. And, on that subject, can I just say "hats off to val.town", I've been looking for a little cloud host that will let me E. mail myself from a cron for absolutely ages.
Cron
# What Do You Think of it so far?
Rubbish!
Our bin men (garbage men to you) come round every Friday morning.
But alternate weeks, they take either rubbish or recycling.
This val extracts from our local council website which collection they're doing this week
and E. mails me the details every Thursday afternoon.
const extracted = (html: string) => {
const doc = new DOMParser().parseFromString(html, "text/html");
const newDoc = ["<div style=\"color: #000\">"];
doc.querySelectorAll(".bin-collection-container").forEach(
paul_lecam avatar
EnkakuAuthenticatedAPI
@paul_lecam
An interactive, runnable TypeScript val by paul_lecam
HTTP
await sqlite.execute(`create table if not exists kv(key text unique, value text)`);
async function getValue(key: string): Promise<string | null> {
const res = await sqlite.execute({ sql: `select value from kv where key = :key`, args: { key } });
return res.rows[0]?.[0] ?? null;
async function listEntries(): Promise<Array<[string, string | null]>> {
const res = await sqlite.execute("select key, value from kv");
return res.rows as Array<[string, string | null]>;
async function setValue(key: string, value: string | null): Promise<void> {
await sqlite.execute({ sql: `insert or replace into kv(key, value) values(:key, :value)`, args: { key, value } });
const transport = new ServerTransport();
dhvanil avatar
val_dO1pTtU7X9
@dhvanil
An interactive, runnable TypeScript val by dhvanil
Script
export default async function handler(req) {
try {
const result = await (async () => {
function isPrime(num) {
if (num <= 1) return false;
for (let i = 2; i <= Math.sqrt(num); i++) {
if (num % i === 0) return false;
return true;
function findLowestThreeDigitPrime() {
for (let num = 100; num < 1000; num++) {
vladimyr avatar
sqliteServer
@vladimyr
An interactive, runnable TypeScript val by vladimyr
Script
export type SQLiteDB = ReturnType<typeof createSqlite>;
export const createServer = (dbFactory: () => Promise<SQLiteDB>) => new SQLiteServer(dbFactory);
export class SQLiteServer {
constructor(
private dbFactory: () => Promise<SQLiteDB>,
handleExecute = async (req: Request) => {
const { statement } = await req.json<any>();
const sqlite = await this.dbFactory();
const res = await sqlite.execute(statement);
return Response.json(res);
agmm avatar
emailAPI
@agmm
// https://username-valname.web.val.run?k=myKey&s=mySubject&m=myMessage
HTTP
// Usage exmaple:
// https://username-valname.web.val.run?k=myKey&s=mySubject&m=myMessage
const app = new Hono();
app.get("/", async (c) => {
const now = new Date();
let { to, s, m, k } = c.req.query();
s = s || "message from api";
m = m || "<empty>";
const checks = [
c.req.header("cf-ipcountry") === "US",
rafter avatar
saveFormData
@rafter
// Forked from @vtdocs.saveFormData
Express (deprecated)
import { testFormData } from "https://esm.town/v/rafter/testFormData";
export const saveFormData = (req: express.Request, res: express.Response) => {
// Pick out the form data
const formData = req.body;
testFormData.push(formData);
return res.send(`Thanks you submitted ${Object.keys(req.body)}`);
// Forked from @vtdocs.saveFormData
crsven avatar
embedBirdSound
@crsven
An interactive, runnable TypeScript val by crsven
HTTP
export let embedBirdSound = async (req, res) => {
const [title, file, image] = req.query.args.split(",");
res.send(
`<div style="text-align: center;"><h3 style="font-size: 5rem; margin: 5rem auto;">${title}</h3><img style="display: block
netux avatar
todepondLabLoginBanUser
@netux
An interactive, runnable TypeScript val by netux
HTTP
export default async function(req: Request): Promise<Response> {
const TABLE_NAME = "todepond_lab_login_users_with_times";
const body = await req.json();
const { username, password, type, target } = body;
const tpUserQuery = await sqlite.execute({
sql: `SELECT * FROM ${TABLE_NAME} WHERE username = ?`,
args: ["TodePond"],
if (tpUserQuery.rows.length === 0) {
return new Response(JSON.stringify({ error: "admin user not found" }), { status: 404 });
const tpUser = tpUserQuery.rows[0];
zbeastly1 avatar
aqi
@zbeastly1
An interactive, runnable TypeScript val by zbeastly1
Script
export let aqi = async () => {
return await fetchJSON(
"https://api.openaq.org/v2/latest?" +
new URLSearchParams({
limit: "10",
page: "1",
location_id: "61498",
offset: "0",
sort: "desc",
radius: "100000",
pomdtr avatar
vt_playground_demo
@pomdtr
An interactive, runnable TypeScript val by pomdtr
HTTP
const body = `<!doctype html>
<html>
<head>
<title>VT Playground</title>
<script
type="module"
src="https://raw.esm.sh/vt-playground@0.1.8/dist/vt-playground.js"
></script>
</head>
<body>
felixnordgren avatar
impressiveAzureJellyfish
@felixnordgren
An interactive, runnable TypeScript val by felixnordgren
HTTP
export default async function(req: Request): Promise<Response> {
// Setup CORS Headers
const headers = new Headers();
headers.set("Access-Control-Allow-Origin", "*");
headers.set("Access-Control-Allow-Methods", "GET, PUT, DELETE, OPTIONS");
headers.set("Access-Control-Allow-Headers", "Content-Type");
// List of image URLs
const images = [
"https://i.postimg.cc/QxpJhDB5/01.png",
"https://i.postimg.cc/9XwBgZCL/02.png",
sparker avatar
tldraw_computer_example
@sparker
tldraw computer custom endpoint example This val is an example custom endpoint for tldraw computer 's data component. Usage To use this val with tldraw.computer, follow these steps: Fork this Val. Click the Copy endpoint button on your new Val. Open a project on tldraw.computer Create a Data component in your tldraw computer project In the Source dropdown, select Custom and the POST method Paste the endpoint into Data component's the HTTP Endpoint input. Run the component. To see the output, connect the Data component to a Text component. How it works In tldraw computer, you can configure a Data component to use a custom HTTP endpoint as its data source. You can also configure the request method, either GET or POST. If a Data component's request method is POST, then when the component next updates, it will send a POST request to the endpoint. The request's body will contain an array of the Data objects that the component had received as inputs. If the request method if GET, then the component will only make the request—its body will be empty. In both cases, the component will expect back a response that includes an array of Data objects these objects will be passed along as the data component's outputs. The endpoint (your forked version of this Val) can do whatever it likes between the request and response, but the response must include data in the correct format. If the format is wrong, the computer app will create a text data object instead that includes the response as plain text. Support If you're running into any difficulties, check out the #tldraw-computer channel on the tldraw discord.
HTTP
# tldraw computer custom endpoint example
This val is an example custom endpoint for [tldraw computer](tldraw.computer)'s data component.
### Usage
To use this val with tldraw.computer, follow these steps:
1. Fork this Val.
2. Click the **Copy endpoint** button on your new Val.
// This endpoint accepts and returns data.
type BooleanData = {
type: "boolean";
text: "true" | "false" | "maybe";
yawnxyz avatar
lucia_sqlite
@yawnxyz
An interactive, runnable TypeScript val by yawnxyz
Script
export async function createTables(userTable: string, sessionTable: string) {
return sqlite.batch([
`CREATE TABLE ${userTable} (
id TEXT NOT NULL PRIMARY KEY,
username TEXT NOT NULL UNIQUE,
hashed_password TEXT,
github_id INTEGER UNIQUE,
google_id TEXT UNIQUE
`CREATE TABLE ${sessionTable} (
id TEXT NOT NULL PRIMARY KEY,
summerboys avatar
htmlExample
@summerboys
HTML example This is an example of how to return an HTML response. You can also preview it at https://andreterron-htmlExample.web.val.run?name=Andre
HTTP
# HTML example
This is an example of how to return an HTML response.
You can also preview it at https://andreterron-htmlExample.web.val.run?name=Andre
// View at https://andreterron-htmlExample.web.val.run?name=Andre
export default async function(req: Request): Promise<Response> {
const query = new URL(req.url).searchParams;
// Read name from the querystring or body. Defaults to "you" if not present.
const name = query.get("name") || (await req.json().catch(() => ({}))).name || "you";
// Returns the HTML response
return new Response(`<h1>Hi summer ${name}!</h1>`, {
…
228
…
Next