Search

getMaterialIds

@tmcw

An interactive, runnable TypeScript val by tmcw

Script

import { getCookie } from "https://esm.town/v/tmcw/getCookie";

import { Context } from "npm:hono@3.8.1";

export function getMaterialIds(c: Context | null) {

if (!c) return new Set();

try {

countWeekdaysInMonth

@augustohp

An interactive, runnable TypeScript val by augustohp

Script

const { default: dayjs } = await import("https://esm.sh/dayjs");

export async function countWeekdaysInMonth(

weekday:

| "Monday"

htmlUtils

@xkonti

* Wraps `content` between `open` and `close` content. If the content is a list, it puts each in a new line.

Script

* Wraps `content` between `open` and `close` content. If the content is a list, it puts each in a new line.

export function wrap(open: string, content: string | string[], close: string): string {

let contentString: string = Array.isArray(content)

? content.join("\n")

cipher

@bao

A web app to practice aristocrat and patristocrat cipher decoding.

HTTP

function getUniqueLetters(word: string): string {

function incrementAgain(input: string): string {

function appendToLocalStorage(text: string, author: string | null): void {

function isTextKnown(text: string, author: string | null): boolean {

function knownTexts(): string[] {

function generateHint(quote: string): { hint: string; source: "first" | "last" } {

function randomLetter(): string {

function randomWordFromSentence(sentence: string): string {

function randomSubstitutionMap(): {

function substitutionAndReverseMaps(

@yawnxyz

Ever wonder how GitHub generates their images when you share a repo on social media? In this example we're using satori and a Deno-friendly SVG WASM creating an OpenGraph image dynamically. E.g. this image can be used when sharing a website, and it'll show up in iMessage or Twitter / other socials. Generated images are cached in Valtown's Blob system. To check metatags, you can use https://metatags.io/?url=https://yawnxyz-og.web.val.run

HTTP

} as const;

function getTailwindColor(colorName: string): string {

// Handle empty or invalid input

// Fetch Inter font from CDN

async function fetchFont(url: string) {

const res = await fetch(url);

let timerInterval;

function startTimer() {

startTime = Date.now();

timerInterval = setInterval(updateTimer, 10);

function stopTimer() {

clearInterval(timerInterval);

timerDisplay.classList.add('text-green-600');

function updateTimer() {

const elapsedTime = ((Date.now() - startTime) / 1000).toFixed(2);

timerDisplay.textContent = elapsedTime + 's';

async function updateImageList() {

const images = await db.images.reverse().limit(50).toArray();

await updateImageList();

function displayImageData(image) {

document.getElementById('link').value = image.link;

updateImageStats(image.imageUrl);

async function updateImageStats(url) {

const response = await fetch(url);

const img = new Image();

img.onload = function() {

imageWidth.textContent = this.width;

tidbytStar

@andreterron

An interactive, runnable TypeScript val by andreterron

Script

import { tidbytCircle } from "https://esm.town/v/andreterron/tidbytCircle";

export async function tidbytStar({ size = 7, bg = 0x047857ff, star = 0xffffffff }: {

size?: number;

bg?: number;

blueskyThreadToRss

@vlad

Subscribe to a Bluesky thread as an RSS feed https://vlad-blueskythreadtorss.web.val.run/<thread top post url> would give you the respective RSS Example: https://vlad-blueskythreadtorss.web.val.run/https://bsky.app/profile/maggieappleton.com/post/3lcip64rko22u

HTTP

import { renderToString } from "npm:react-dom/server";

export default async function handleRequest(req: Request): Promise<Response> {

const urlObj = new URL(req.url);

"Content-Type": "application/xml; charset=UTF-8",

function UrlForm() {

const script = `

</html>

export async function fetchPost(url: string | URL) {

const postURL = new URL(url);

dotProduct

@wilt

Find the dot product between two arrays of numbers (representing 1-dimensional vectors). Requires that both arrays be the same length, but for speed doesn't actually check this - be sure to check yourself if there's a possibility they might not be.

Script

export function dotProduct(vec1: number[], vec2: number[]): number {

let sum = 0;

for (let i = 0; i < vec1.length; i++) {

raindropBookmarksToEmail

@ramkarthik

An interactive, runnable TypeScript val by ramkarthik

Script

import { raindropBookmarksSinceLastRun } from "https://esm.town/v/ramkarthik/raindropBookmarksSinceLastRun";

import { daysAgoFromToday } from "https://esm.town/v/ramkarthik/daysAgoFromToday";

export async function raindropBookmarksToEmail(interval: Interval) {

let lastRunAt = interval.lastRunAt?.toISOString() ||

daysAgoFromToday(7);

datetime

@tudorizer

An interactive, runnable TypeScript val by tudorizer

HTTP

export default async function(req: Request): Promise<Response> {

interface DateTimeFormatsOutput {

unix: number;

function getSpecificDateTime(): Date {

return new Date();

function generateDateTimeFormatsOutput(): DateTimeFormatsOutput {

const specificDateTime = getSpecificDateTime();

valle_tmp_02120335861688782403050764969785935

@janpaul123

An interactive, runnable TypeScript val by janpaul123

HTTP

const word = "apple"; // Assumes the word to guess is "apple"

function checkGuess() {

const guess = document.getElementById("guess").value.toLowerCase();

let count = 0;

count++;

displayResult(count);

function displayResult(count) {

let resultText = "";

switch (count) {

whackaghost

@Ttt

Project : Whack-a-Ghost A responsive, browser based game where players click on randomly appearing ghosts. Features 4 difficulty levels with increasing grid sizes (4x4 to 7x7) 20-second time limit per game Score tracking with 15-point win condition Responsive design for desktop and mobile How to Play Select a difficulty level Click on ghosts as they appear Avoid empty cells (max 10 misses) Score 15 points within 20 seconds to win Show less

HTTP

* @param {Function} props.onClick - Function to handle button click

function HomeButton({ onClick }) {

* @param {Function} props.onHomeClick - Function to handle home button click

function SpookyMessage({ onHomeClick, isTimeOut, score, isTooManyWrongClicks, isWin }) {

function GameDescription() {

function App() {

* Client-side rendering function

export function client() {

* Server-side rendering function

export default async function server(request: Request): Promise<Response> {

valle_tmp_84995905331198962373155279224348

@janpaul123

// I can help you with TypeScript code. For creating an HTML Wordle game with CSS, it's best to use a live HTML editor like CodePen or JSFiddle to see the rendering in action. Feel free to copy the following HTML, CSS, and JavaScript code into an HTML file and open it in a browser to see the styling and functionality:

HTTP

ript code into an HTML file and open it in a browser to see the styling and functionality:

// HTML

<!DOCTYPE html>

convertEmailToMarkdown

@feb

An interactive, runnable TypeScript val by feb

Script

const turndownService = new Turndown();

turndownService.use(gfm);

export default function(e: Email): string | undefined {

if (e.html) {

return turndownService.turndown(e.html);

colorRequestSender

@magistris

@jsxImportSource https://esm.sh/react@18.2.0

HTTP

// Client-side React Component

function App() {

const [color1, setColor1] = useState("#000000");

setMessage("Failed to submit color");

// Function to select a saved color

const handleSavedColorSelect = (colorEntry: ColorEntry) => {

</div>

// Client-side rendering function

function client() {

const rootElement = document.getElementById("root");

client();

// Server-side function for handling requests

async function server(request: Request): Promise<Response> {

const { blob } = await import("https://esm.town/v/std/blob");

…

373 374

375

376 377

…

403