Search
val_CQqfNR6svd
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_CQqfNR6svd(req) {
try {
// Execute the code directly and capture its result
const result = await (async () => {
const getImageData = async () => { const img = new Image(); img.src = 'https://example.com/path-to-mandelbrot-image.png'; await img.decode(); const canvas = document.createElement('canvas'); canvas.width = img.width; canvas.height = img.height; const ctx = canvas.getContext('2d'); ctx.drawImage(img, 0, 0); return ctx.getImageData(0, 0, canvas.width, canvas.height).data; }; return await getImageData();
// Return the result in a properly formatted response
return new Response(JSON.stringify({
result: result,
type: typeof result
headers: { 'Content-Type': 'application/json' }
val_zFIaCfbFds
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_zFIaCfbFds(req) {
try {
// Execute the code directly and capture its result
const result = await (async () => {
const calculateFractalDimension = (points) => { const boxCount = (size) => { let count = 0; for (let i = 0; i < points.length; i++) { if (points[i].x < size && points[i].y < size) count++; } return count; }; const sizes = [1, 0.5, 0.25, 0.125]; const counts = sizes.map(size => boxCount(size)); const logCounts = counts.map(count => Math.log(count)); const logSizes = sizes.map(size => Math.log(1/size)); const slope = (logCounts[1] - logCounts[0]) / (logSizes[1] - logSizes[0]); return -slope; }; const mandelbrotPoints = []; const sierpinskiPoints = []; // Generate points for Mandelbrot and Sierpinski triangle for (let x = -2; x <= 2; x += 0.01) { for (let y = -2; y <= 2; y += 0.01) { // Mandelbrot set calculation let zx = 0, zy = 0, i = 0; const maxIter = 100; while (zx * zx + zy * zy < 4 && i < maxIter) { const tmp = zx * zx - zy * zy + x; zy = 2.0 * zx * zy + y; zx = tmp; i++; } if (i === maxIter) mandelbrotPoints.push({x, y}); } } // Sierpinski triangle generation (recursive) const sierpinski = (x, y, size) => { if (size < 1) return; sierpinskiPoints.push({x, y}); sierpinski(x, y, size / 2); sierpinski(x + size / 2, y, size / 2); sierpinski(x + size / 4, y + Math.sqrt(3) * size / 4, size / 2); }; sierpinski(0, 0, 16); const mandelbrotDimension = calculateFractalDimension(mandelbrotPoints); const sierpinskiDimension = calculateFractalDimension(sierpinskiPoints); return { mandelbrotDimension, sierpinskiDimension }; }; return calculateFractalDimension();
// Return the result in a properly formatted response
return new Response(JSON.stringify({
result: result,
type: typeof result
headers: { 'Content-Type': 'application/json' }
val_7Pb2YNVSqH
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_7Pb2YNVSqH(req) {
try {
// Execute the code directly and capture its result
const result = await (async () => {
const chiSquaredTest = (observed, expected) => { const chiSquared = observed.reduce((sum, obs, index) => sum + Math.pow(obs - expected[index], 2) / expected[index], 0); return chiSquared; }; const observed = [0.486, 0.084]; const expected = [0.5, 0.1]; const result = chiSquaredTest(observed, expected); return result;
// Return the result in a properly formatted response
return new Response(JSON.stringify({
result: result,
type: typeof result
headers: { 'Content-Type': 'application/json' }
playMeASong
@dthyresson
Play me a song Search and if we find it, it'll open the song in Spotify! Feeling Lucky? Play a random song . Like a band? Play one of their tracks.
HTTP
# Play me a song
Search and if we find it, it'll open the song in Spotify!
Feeling Lucky? Play a [random song](https://dthyresson-playrandomsong.web.val.run).
Like a band? Play [one](https://dthyresson-playrandomsong.web.val.run?artist=New+Order) of their tracks.
/** @jsxImportSource npm:hono@3/jsx */
type Track = {
id: number | null;
artist: string;
title: string;
track_id: string | null;
val_eYhhIv3Mvd
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_eYhhIv3Mvd(req) {
try {
// Execute the code directly and capture its result
const result = await (async () => {
// Let's try one more time with a very simple art
const heart = `
<3 <3
<3 <3
<3 <3
return heart;
valle_tmp_98577615540709697524214250928494
@janpaul123
// This val will serve an HTML page emulating a Hacker News clone.
HTTP
// This val will serve an HTML page emulating a Hacker News clone.
// It uses plain HTML and CSS to create the frontend. Eventually,
// we can make it interactive with additional scripts.
export default async function(req: Request): Promise<Response> {
const url = new URL(req.url);
const pathname = url.pathname;
// If the user navigates to a specific story page
if (pathname.startsWith("/story/")) {
const storyId = pathname.split("/")[2];
return new Response(renderStoryPage(storyId), {
Chatio
@curtcox
An interactive, runnable TypeScript val by curtcox
HTTP
import { chatio } from "https://esm.town/v/curtcox/_chatio";
export const Chatio = (req: Request) => {
return chatio(req);
val_1JZbRgM75w
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export default async function handler(req) {
try {
const result = await (async () => {
return 100;
return Response.json({ success: true, result });
} catch (error) {
return Response.json({
success: false,
error: error.message
}, { status: 500 });
EditLinkModal
@iamseeley
An interactive, runnable TypeScript val by iamseeley
Script
/** @jsx jsx */
/** @jsxFrag Fragment */
export default function EditLinkModal({ username, linkId, label, url }) {
return (
<div id="edit-link-modal" className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50">
<div className="bg-white rounded-lg shadow-xl p-8 w-full max-w-md mx-4 mt-4 mb-0">
<h2 className="text-xl font-bold mb-4">Edit Link</h2>
<form action={`/links/${linkId}`} method="put" className="space-y-4" hx-push-url={`/edit-profile/${username}`}>
<input
type="text"
valle_tmp_2933423436079547503473880922680217
@janpaul123
// This val will respond with a simple HTML page with fun CSS styles like crazy fonts and gradients
HTTP
// This val will respond with a simple HTML page with fun CSS styles like crazy fonts and gradients
export default async function main(): Promise<Response> {
const htmlContent = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World</title>
<style>
body {
html
@postpostscript
html: create sanitized HTML using tagged templates Examples import { html } from "https://esm.town/v/postpostscript/html"
const unsafeInput = "<script>alert(1)</script>"
console.log(html`Value: ${unsafeInput}`)
// Value: <script>alert(1)</script> These can be combined -- HTML marked as safe (instance is RawHTML ) will be directly inserted: const scripts = html`<script>alert(1)</script>`
console.log(html`<head>
${scripts}
</head>`.toString())
// <head>
// <script>alert(1)</script>
// </head> To easily create HTTP Response outputs like @stevekrouse/html, use the htmlResponse utility: import { html, htmlResponse } from "https://esm.town/v/postpostscript/html";
export default function(req: Request) {
return htmlResponse`
Request URL: ${decodeURIComponent(req.url)}
`;
} Tests: @postpostscript/htmlTest
Script
# html: create sanitized HTML using tagged templates
## Examples
```ts
const unsafeInput = "<script>alert(1)</script>"
console.log(html`Value: ${unsafeInput}`)
// Value: <script>alert(1)</script>
export class RawHTML extends String {
constructor(value: unknown) {
if (value instanceof RawHTML) {
super(value);
web_JaU2oUlDg0
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function web_JaU2oUlDg0(req) {
return new Response(`<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Retro Space Interface</title>
<style>
body {
margin: 0;
createAPI
@websandbox
An interactive, runnable TypeScript val by websandbox
HTTP
const cors = {
"access-control-allow-origin": "*",
"access-control-allow-headers": "*",
export default async function(req: Request): Promise<Response> {
try {
if (req.method === "OPTIONS") {
return new Response(null, {
headers: cors,
if (req.method !== "POST") {
throw new Error("must POST");
valle_tmp_8772577792541712013582363429356
@janpaul123
// This val will respond to any request with an HTML "Hello, world!" message with some fun CSS styles and an animated cat
HTTP
// This val will respond to any request with an HTML "Hello, world!" message with some fun CSS styles and an animated cat
export default async function(req: Request): Promise<Response> {
const html = `
<html>
<head>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
val_wKbtsxNAcg
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_wKbtsxNAcg(req) {
try {
// Execute the code directly and capture its result
const result = await (async () => {
// Create a pixel art bunny
const bunnyAscii = `
( °w° )
return bunnyAscii;
// Return the result in a properly formatted response
return new Response(JSON.stringify({