Search
sqlite_explorer
@maxbittker
An interactive, runnable TypeScript val by maxbittker
HTTP (deprecated)
export { default } from "https://esm.town/v/nbbaier/sqliteExplorerApp?v=81";
fetch
@vladimyr
Proxied fetch - https://docs.val.town/std/fetch
Script
# Proxied fetch - https://docs.val.town/std/fetch
* Wraps the JavaScript Fetch function to anonymize where the request is
* coming from ([Docs ↗](https://docs.val.town/std/fetch))
* @param {string | URL | Request} input - The resource to fetch.
* @param {RequestInit} [requestInit] - Optional configuration data (HTTP
* method, headers, etc) ([Docs ↗](https://deno.land/api@v1.42.1?s=RequestInit))
export async function fetch(input: string | URL | Request, requestInit?: RequestInit) {
const origReq = new Request(input, requestInit);
const url = new URL("/v1/fetch", API_URL);
url.searchParams.set("url", origReq.url);
serifFonts
@rodrigotello
An interactive, runnable TypeScript val by rodrigotello
Script
export const serifFonts = new Set([
"Times",
"Times New Roman",
"Didot",
"Georgia",
"Garamond",
"Tryst",
"Bodoni",
"serif",
unsplashF
@byrneml
An interactive, runnable TypeScript val by byrneml
Script
import { fetchJSON } from "https://esm.town/v/stevekrouse/fetchJSON?v=41";
export let unsplashF = (token) =>
fetchJSON(
`https://api.unsplash.com/photos`,
headers: {
"Authorization": `Client-ID ${unsplashAccessToken}`,
webassemblyExample
@healeycodes
// Is WebAssembly verboten?
Script
// Is WebAssembly verboten?
(module
(func (export let "addTwo") (param i32 i32) (result i32)
local.get 0
local.get 1
i32.add))
export export let webassemblyExample = (async () => {
const source = new Uint8Array([
0, 97, 115, 109, 1, 0, 0, 0, 1, 7, 1, 96, 2, 127, 127, 1, 127, 3, 2, 1, 0,
7, 10, 1, 6, 97, 100, 100, 84, 119, 111, 0, 0, 10, 9, 1, 7, 0, 32, 0, 32, 1,
outsideBlushShrimp
@MichaelNollox
Code on Val Town Adds a "Code on Val Town" ribbon to your page. This lets your website visitors navigate to the code behind it. This uses github-fork-ribbon-css under the hood. Usage Here are 2 different ways to add the "Code on Val Town" ribbon: 1. Wrap your fetch handler (recommended) import { modifyFetchHandler } from "https://esm.town/v/andreterron/codeOnValTown?v=50";
import { html } from "https://esm.town/v/stevekrouse/html?v=5";
export default modifyFetchHandler(async (req: Request): Promise<Response> => {
return html(`<h2>Hello world!</h2>`);
}); Example: @andreterron/openable_handler 2. Wrap your HTML string import { modifyHtmlString } from "https://esm.town/v/andreterron/codeOnValTown?v=50";
import { html } from "https://esm.town/v/stevekrouse/html?v=5";
export default async (req: Request): Promise<Response> => {
return html(modifyHtmlString(`<h2>Hello world!</h2>`));
}; Example: @andreterron/openable_html Other ways We made sure this was very modular, so you can also add the ribbon using these methods: Get the element string directly: @andreterron/codeOnVT_ribbonElement Modify an HTTP Response: @andreterron/codeOnVT_modifyResponse Use .pipeThrough to append to a stream: @andreterron/InjectCodeOnValTownStream Customization Linking to the val These functions infer the val using the call stack or the request URL. If the inference isn't working, or if you want to ensure it links to a specific val, pass the val argument: modifyFetchHandler(handler, {val: { handle: "andre", name: "foo" }}) modifyHtmlString("<html>...", {val: { handle: "andre", name: "foo" }}) Styling You can set the style parameter to a css string to customize the ribbon. Check out github-fork-ribbon-css to learn more about how to style the element. modifyFetchHandler(handler, {style: ".github-fork-ribbon:before { background-color: #333; }"}) modifyHtmlString("<html>...", {style: ".github-fork-ribbon:before { background-color: #333; }"}) Here's how you can hide the ribbon on small screens: modifyFetchHandler(handler, {style: `@media (max-width: 768px) {
.github-fork-ribbon {
display: none !important;
}
}`}) To-dos [ ] Let users customize the ribbon. Some ideas are the text, color or placement.
Script
# Code on Val Town
Adds a "Code on Val Town" ribbon to your page. This lets your website visitors navigate to the code behind it.
This uses [github-fork-ribbon-css](https://github.com/simonwhitaker/github-fork-ribbon-css) under the hood.
## Usage
Here are 2 different ways to add the "Code on Val Town" ribbon:
* @param bodyText HTML string that will be used to inject the element.
* @param val Define which val should open. Defaults to the root reference
export function modifyHtmlString(
bodyText: string,
myspaceHtml
@jdan
An interactive, runnable TypeScript val by jdan
Script
interface MyspaceProfileArgs {
displayName: string;
info: {
imageUrl: string;
allImagesUrl?: string;
status: string;
gender?: string;
age: number;
location: string[];
lastLogin: string;
endlessMazeStream
@maxm
HTTP (deprecated)
const msg = new TextEncoder().encode("💩");
const delay = 10;
export default async function(req: Request): Promise<Response> {
let timerId: number | undefined;
const body = new ReadableStream({
start(controller) {
controller.enqueue(new TextEncoder().encode(`
<style>
body {
feedGenerator
@lukas
// All of this is heavily based on RobPC's feed generator sample
Script
// All of this is heavily based on RobPC's feed generator sample
// As well as the official bsky sample feed
type Feed = {
uri: string;
type DescribeFeedGeneratorOutput = {
did: string;
feeds: Feed[];
links?: {
privacyPolicy?: string;
termsOfService?: string;
aqi
@adrianlee
AQI Alerts Get email alerts when AQI is unhealthy near you. Set up Click Fork Change location (Line 4) to describe your location. It accepts fairly flexible English descriptions which it turns into locations via nominatim's geocoder API . Click Run Background This val uses nominatim's geocoder to get your lat, lon, and air quality data from OpenAQ. It uses EPA's NowCast
AQI Index calculation and severity levels. Learn more: https://www.val.town/v/stevekrouse.easyAQI
Cron
# AQI Alerts
Get email alerts when AQI is unhealthy near you.
## Set up
1. Click `Fork`
2. Change `location` (Line 4) to describe your location. It accepts fairly flexible English descriptions which it turns into locations via [nominatim's geocoder API](https://www.val.town/v/stevekrouse/nominatimSearch).
export async function aqi(interval: Interval) {
const location = "japanese prespretarian church, seattle, wa, 98144"; // <-- change to place, city, or zip code
const data = await easyAQI({ location });
if (!interval.lastRunAt) {
consoleEmailEx
@cufaoil
An interactive, runnable TypeScript val by cufaoil
Script
export let consoleEmailEx = (() => {
console.email("message"); // any JSON object can be the message
console.email({ html: "<h1>hello html emails!</h1>" }); // you can send HTML emails
console.email({ hi: "there" }, "Subject Line"); // optional second arg is the subject line
console.email({ html: "<b>hi!</b>", subject: "Subject accepted here too" });
plumZebra
@cbfrance
An interactive, runnable TypeScript val by cbfrance
Cron
export const isMyWebsiteDown = async () => {
const URL = "https://christopherbfrance.com";
const [date, time] = new Date().toISOString().split("T");
let ok = true;
let reason: string;
try {
const res = await fetch(URL);
if (res.status !== 200) {
reason = `(status code: ${res.status})`;
ok = false;
milkStore
@_
// set by _.collect at 2023-03-15T03:56:19.995Z
Script
// set by _.collect at 2023-03-15T03:56:19.995Z
export let milkStore = {
"collected": 3
materials
@tmcw
An interactive, runnable TypeScript val by tmcw
Script
const whiskey = new Material("Whiskey", "m-0", materialType.spirit);
const scotchWhiskey = new Material(
"Scotch whiskey",
"m-1",
materialType.spirit,
whiskey,
const bourbonWhiskey = new Material(
"Bourbon whiskey",
"m-2",
materialType.spirit,
