Search

hello

@chilly

An interactive, runnable TypeScript val by chilly

Script

export function hello() {

return "hello";

solidExample

@rayman

@jsxImportSource https://esm.sh/solid-jsx

HTTP

import StlViewer from "npm:react-stl-viewer";

import { renderToString } from "npm:solid-js/web";

function StlViewer() {

return (

<StlViewer

smurf

@tompatiger

An interactive, runnable TypeScript val by tompatiger

Script

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

const url = new URL(request.url);

const processedSmurfText = smurfTransform(initialText); // Transform initial text if available

// Function to generate inline styles from the styles object

const generateStyles = (styles) => {

const text = inputTextArea.value;

const smurfedText = smurfTransform(text); // Call the smurfTransform function

outputText.textContent = smurfedText;

gltf_torus

@vladimyr

Builds a torus as a gltf file and displays it with https://modelviewer.dev/ based on https://www.donmccurdy.com/2023/08/01/generating-gltf/ https://github.com/mrdoob/three.js/tree/dev/src/geometries

HTTP

import { gzip } from "npm:pako";

const app = new Hono();

function createTorus(radius = 1, tube = 0.4, radialSegments = 12, tubularSegments = 48, arc = Math.PI * 2) {

const indicesArray = [];

const positionArray = [];

twitterAlert

@marianogenovese

Twitter 𝕏 keyword Alerts Custom notifications for when you, your company, or anything you care about is mentioned on Twitter. 1. Authentication You'll need a Twitter Bearer Token. Follow these instructions to get one. Unfortunately it costs $100 / month to have a Basic Twitter Developer account. If you subscribe to Val Town Pro, I can let you "borrow" my token. Just comment on this val and I'll hook you up. 2. Query Change the query variable for what you want to get notified for. You can use Twitter's search operators to customize your query, for some collection of keywords, filtering out others, and much more! 3. Notification Below I'm sending these mentions to a private channel in our company Discord, but you can customize that to whatever you want, @std/email, Slack, Telegram, whatever. TODO [x] ~Filter out retweets. We've long wanted to filter these out. Should be a quick fix if anyone wants to send me a PR :)~ Completed by @sumukh

Cron

// const query = `${baseQuery}`.trim();

// console.log(Deno.env.get("twitter"));

// export async function twitterAlert() {

// const results = await twitterSearch({

// query,

// // url: Deno.env.get("mentionsDiscord"),

// // content,

export async function main() {

console.log("ok");

valtowntown

@charmaine

🏘️ Val Town Town Val Town implemented in Val Town. What if you want to build your own Val Town? What if you want features we haven't built yet? Val Town Town demonstrates how you can run untrusted code yourself. Extend it and see what you can build!

HTTP

await contentStore.init();

function Town() {

return (

</div>

function HomePage() {

return (

{`export default async function(req: Request) {

return Response.json("Hello, world!");

</html>

function ContentPage({ handler, id }: { handler: string; id: string }) {

return (

let originalContent = textarea.value;

textarea.addEventListener('input', function() {

if (textarea.value !== originalContent) {

workerify

@postpostscript

workerify: proxy a module through a worker (with types!) Example: import { workerify } from "https://esm.town/v/postpostscript/workerify"; using mod = await workerify(() => import("https://esm.town/v/postpostscript/workerifyExampleUnsafeLibrary")); console.log(await mod.x.y()); Full Example: @postpostscript/workerifyExample @postpostscript/workerifyExampleUnsafeLibrary It's limited by what can be sent over [worker].postMessage() , i.e. inputs and outputs will need to be JSONifiable

Script

// SPDX-License-Identifier: Apache-2.0

export async function workerify<T extends () => unknown>(getModule: T, opts?: WorkerOptions) {

let workerReady: (value: unknown) => void;

await new Promise((resolve) => (workerReady = resolve));

function message(message: { code: string; keys: string[]; args: unknown[] }) {

return new Promise((resolve, reject) => {

...message,

function wrap(keys: string[]): unknown {

return new Proxy(keys.length ? () => {} : {}, {

valle_tmp_03532894464414715356178372159367935

@janpaul123

An interactive, runnable TypeScript val by janpaul123

HTTP

// This function returns an HTML response with a "Hello, World!" message styled using CSS

// to have crazy colors and gradien

export default async function main(req: Request) {

const body = `

<!DOCTYPE html>

woffToTtfConverter

WOFF to TTF Converter Convert .woff or .woff2 font files to ttf by extracting them. The resulting ttf files might not work with your use case. It is recommended to use this converter instead.

HTTP

import { Hono } from 'npm:hono';

function html() {

<!DOCTYPE html>

</html>

function css() {

:root {

opacity: 0.7;

function js() {

import { convert } from 'https://esm.sh/fontverter';

const statusEl = document.getElementById('status');

function handleFiles(files) {

if (files.length === 0) return;

gemini_coder

@stevekrouse

This is an AI code assistant powered by Cerebras , running llama3.3-70b. Inspired by Hassan's Llama Coder . Setup Sign up for Cerebras Get a Cerebras API Key Save it in a Val Town environment variable called CEREBRAS_API_KEY Todos I'm looking for collaborators to help. Fork & send me PRs! [ ] Experiment with two prompt chain (started here )

HTTP

function Hero({

Turn your ideas into fully functional apps in{" "}

function App() {

function handleStarterPromptClick(promptItem: typeof prompts[number]) {

async function handleSubmit(e: React.FormEvent | string) {

function handleVersionChange(direction: "back" | "forward") {

function client() {

function extractCodeFromFence(text: string): string {

async function generateCode(prompt: string, currentCode: string) {

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

SAMPLE_JOKE

@rachelgeorge

// Fetches a random joke.

Cron

import { email } from "https://esm.town/v/std/email?v=9";

// Fetches a random joke.

async function fetchRandomJoke() {

const response = await fetch(

"https://official-joke-api.appspot.com/random_joke",

goldRattlesnake

@jakeplayscode101

// Fetches a random joke.

Script

// ... imports ...

// Fetches a random joke.

async function fetchRandomJoke() {

const response = await fetch(

"https://official-joke-api.appspot.com/random_joke",

goldCheetah

@matthewhu8

// Fetches a random joke.

Cron

import { email } from "https://esm.town/v/std/email?v=9";

// Fetches a random joke.

async function fetchRandomJoke() {

const response = await fetch(

"https://official-joke-api.appspot.com/random_joke",

welcomingPinkAlligator

@stevekrouse

@jsxImportSource https://esm.sh/react

HTTP

import { createRoot } from "https://esm.sh/react-dom/client";

function debounce(func: Function, wait: number) {

let timeout: number | undefined;

return function executedFunction(...args: any[]) {

const later = () => {

timeout = setTimeout(later, wait);

function App() {

const [prompt, setPrompt] = useState("Generate a colorful gradient shader");

}, [code, debouncedRenderShader, retryCount]);

async function handleSubmit(e: React.FormEvent, shaderErrorMessage?: string) {

if (e) e.preventDefault();

</div>

function client() {

createRoot(document.getElementById("root")!).render(<App />);

client();

function renderShader(canvas: HTMLCanvasElement, fragmentShaderSource: string, time: number) {

const gl = canvas.getContext("webgl");

gl_Position = a_position;

function createShader(gl: WebGLRenderingContext, type: number, source: string) {

const shader = gl.createShader(type);

gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);

function extractGLSLCode(text: string): string {

const glslMatch = text.match(/```glsl\n([\s\S]*?)\n```/);

: text.trim();

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

if (req.method === "POST") {

cerebras_coder

@CerebrasCoder

HTTP

function Hero({

Turn your ideas into fully functional apps in{" "}

function App() {

function handleStarterPromptClick(promptItem: typeof prompts[number]) {

async function handleSubmit(e: React.FormEvent | string) {

function handleVersionChange(direction: "back" | "forward") {

function client() {

function extractCodeFromFence(text: string): string {

async function generateCode(prompt: string, currentCode: string) {

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

…

211 212

213

214 215

…

467