Search

Results include substring matches and semantically similar vals. Learn more
skyehersh avatar
dataTableScript
@skyehersh
// Changes to the inputs will trigger a redraw to update the table
Script
const minEl = document.getElementById("min");
const maxEl = document.getElementById("max");
const searchEl = document.getElementById("search");
const desiredGenderEl = document.getElementById("desired-gender");
const yourGenderEl = document.getElementById("your-gender");
const styleEl = document.getElementById("style");
DataTable.ext.search.push(function(settings, data, dataIndex) {
let min = parseInt(minEl.value, 10);
let max = parseInt(maxEl.value, 10);
let age = parseFloat(data[1]) || 0;
easrng avatar
getCaller
@easrng
An interactive, runnable TypeScript val by easrng
Script
export async function getCaller() {
if (arguments[0])
return;
// val callers are now tracked in an AsyncLocalStorage object
let asyncLocalStorage;
// we need to set up a hook to intercept it,
// since the object is only defined in internals.ts
const { AsyncLocalStorage } = await dynamicImport(
"node:async_hooks",
const realGetStore = AsyncLocalStorage.prototype.getStore;
politelyinvinciblepointer avatar
getmiraclechildcounter
@politelyinvinciblepointer
An interactive, runnable TypeScript val by politelyinvinciblepointer
Script
import { miraclechildcounter } from "https://esm.town/v/politelyinvinciblepointer/miraclechildcounter";
export function getmiraclechildcounter() {
return miraclechildcounter;
janpaul123 avatar
valle_tmp_59342510692095097966010158625245
@janpaul123
// This val responds with an HTML form to input the user's name and greets them
HTTP
// This val responds with an HTML form to input the user's name and greets them
export default async function(req: Request): Promise<Response> {
const htmlResponse = `
<form action="/" method="POST">
<label for="name">Enter your name:</label><br>
<input type="text" id="name" name="name"><br>
<input type="submit" value="Submit">
</form>
return new Response(htmlResponse, {
headers: { "Content-Type": "text/html" },
webup avatar
chatSampleSystemRoleExpert
@webup
An interactive, runnable TypeScript val by webup
Script
export const chatSampleSystemRoleExpert = (async () => {
const system = `
## Role: Bio 生成器
## Profile:
- author: Arthur
- version: 0.2
- language: 中文
- description: 熟知各个互联网平台的运行规律,熟知互联网信息传播规律。
## Goals: 帮助用户快速生成互联网平台上可以使用的Bio
## Constrains:
claytn avatar
replitSet
@claytn
An interactive, runnable TypeScript val by claytn
Script
import { fetch } from "https://esm.town/v/std/fetch";
export let replitSet = (REPLIT_DB_URL, key, value) =>
fetch(`${REPLIT_DB_URL}/${key}=${encodeURIComponent(value)}`, {
method: "POST",
headers: { "Content-Type": "application/x-www-form-urlencoded" },
easrng avatar
umdImport
@easrng
An interactive, runnable TypeScript val by easrng
Script
export async function umdImport(url: string | URL, globals = {}) {
const res = await fetch(url);
if (!res.ok) throw new Error(await res.text());
let code = await res.text();
code = code.replace(/^#!/gm, "// #!");
const module = {
exports: {} as any,
const global = new Proxy({}, {
...Reflect,
get(o, k) {
dhvanil avatar
val_iHF6nZHjLM
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export default async function handler(req) {
try {
const result = await (async () => {
function findLowestThreeDigitFibonacci() {
let fib = [0, 1];
let nextFib = 1;
while (nextFib < 1000) {
nextFib = fib[fib.length - 1] + fib[fib.length - 2];
fib.push(nextFib);
return fib.filter(num => num >= 100 && num < 1000);
metart43 avatar
getOctopusEnergyRates
@metart43
// Declare the function as async and export it
HTTP
// Declare the function as async and export it
export const htmlExample = async () => {
const url = new URL(
"https://api.octopus.energy/v1/products/AGILE-24-10-01/electricity-tariffs/E-1R-AGILE-24-10-01-A/standard-unit-rates/",
const todaysDate = new Date();
// Helper function to format the date
function formatDateForOctopus(date) {
const isoString = date.toISOString();
return isoString.slice(0, 16) + "Z"; // Trims milliseconds and keeps up to minutes
// Create start of the day (00:00)
stevekrouse avatar
upstashEx
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
import { Redis } from "npm:@upstash/redis";
const redis = new Redis({
url: Deno.env.get("upstashURL"),
token: Deno.env.get("upstashToken"),
const start = performance.now();
console.log(await redis.set("foo", new Date()));
console.log("set time: " + (performance.now() - start));
const start2 = performance.now();
console.log(await redis.get("foo"));
console.log("get time: " + (performance.now() - start2));
stevekrouse avatar
codeOnValTown
@stevekrouse
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
![Screenshot 2024-02-27 at 1.25.46 PM.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/6b67bb0a-d80f-4f3d-5b17-57b5378b3
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,
Exam6918 avatar
aqi
@Exam6918
An interactive, runnable TypeScript val by Exam6918
Cron
export let aqi = async () => {
let pm25 = (
await fetchJSON(
"https://api.openaq.org/v2/latest?" +
new URLSearchParams({
limit: "10",
page: "1",
location: "San Francisco",
offset: "0",
sort: "desc",
ejfox avatar
nasa
@ejfox
* This program creates an HTTP server that fetches various data from NASA APIs * and returns a JSON response with a collection of interesting information about today. * It uses multiple NASA APIs to gather diverse space-related data, including real-time imagery * and additional interesting data points.
HTTP
* This program creates an HTTP server that fetches various data from NASA APIs
* and returns a JSON response with a collection of interesting information about today.
* It uses multiple NASA APIs to gather diverse space-related data, including real-time imagery
* and additional interesting data points.
const NASA_API_KEY = 'vYg1cCNLVbcgNemMWuLEjoJsGOGbBXZjZjmwVwuV';
async function fetchNASAData() {
const today = new Date().toISOString().split('T')[0];
// Fetch Astronomy Picture of the Day
const apodResponse = await fetch(`https://api.nasa.gov/planetary/apod?api_key=${NASA_API_KEY}`);
const apodData = await apodResponse.json();
dhvanil avatar
val_7zpl8w4v8d
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export default async function handler(req) {
try {
const result = await (async () => {
function findLowestThreeDigitFibonacci() {
let a = 0, b = 1;
let lowestThreeDigitFibonacci = 0;
while (b < 1000) {
let temp = b;
b = a + b;
a = temp;
dhvanil avatar
val_BTlYzYgxkV
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export const jsonOkExample = () => Response.json({ ok: true });