1// This val responds with a styled "Hello, world!" in HTML with funky CSS gradients
2export default async function main(req: Request): Promise<Response> {
3const htmlContent = `
4<html>
1// This val responds with an HTML page styled with funky CSS gradients
2export default async function main(req: Request): Promise<Response> {
3const html = `
4<html>
1// This val responds with "Hello, world!"
2export default async function main(req: Request): Promise<Response> {
3return new Response("Hello, world!");
4}
32};
3334function renderComments(comments): string {
35return comments
36.map(
45}
4647export default async function (req: Request): Promise<Response> {
48const url = new URL(req.url);
49const pathname = url.pathname;
65}
6667function renderStoryPage(storyId: string): string {
68const story = stories[storyId] || {
69title: "Story Not Found",
107}
108109function renderMainPage(): string {
110return `
111<!DOCTYPE html>
41};
4243function renderComments(comments: Comment[]): string {
44return comments.map(comment => `
45<div class="comment">
50}
5152function renderStoryPage(storyId: string): string {
53const story = stories[storyId] || { title: "Story Not Found", content: "The story you are looking for does not exist.", comments: [] };
5488}
8990function renderMainPage(): string {
91const storyHtml = Object.entries(stories).map(([id, story]) => `
92<div class="story">
126}
127128export default async function(req: Request): Promise<Response> {
129const url = new URL(req.url);
130const pathname = url.pathname;
40};
4142export default async function(req: Request): Promise<Response> {
43const url = new URL(req.url);
44const pathname = url.pathname;
60}
6162function renderStoryPage(storyId: string): string {
63const story = stories[storyId] || { title: "Story Not Found", content: "The story you are looking for does not exist.", comments: [] };
64const commentsHtml = story.comments.map(comment => `
104}
105106function renderHomePage(): string {
107const storiesHtml = Object.entries(stories).map(([id, story]) => `
108<div class="story">
3// we can make it interactive with additional scripts.
45export default async function(req: Request): Promise<Response> {
6const url = new URL(req.url);
7const pathname = url.pathname;
57}
5859function renderStoryPage(storyId: string): string {
60const stories = {
61"1": {
tomatoSawfishmain.tsx1 match
2import { render } from "npm:preact-render-to-string";
34export default async function(req: Request) {
5return new Response(
6render(
valPreviewmain.tsx9 matches
1export async function fetchVal(valId: string) {
2try {
3const response = await fetch(`https://api.val.town/v1/vals/${valId}`);
13}
1415export async function evalCode(code: string) {
16try {
17const response = await fetch(`https://api.val.town/v1/eval`, {
46}
4748function handleEvalCode(elementId: string) {
49const element = document.getElementById(`code-${elementId}`);
50if (element) {
73}
7475export async function previewVal(valName: string, resultElementId: string) {
76try {
77const resultElement = document.getElementById(resultElementId);
94}
9596function escapeHtml(unsafe: string) {
97return unsafe
98.replace(/&/g, "&")
103}
104105export function injectValContent(valId: string, elementId: string) {
106return fetchVal(valId).then(data => {
107if (data) {
225}
226227export function initializeValComponents() {
228document.querySelectorAll('[data-val-id]').forEach(element => {
229const valId = element.getAttribute('data-val-id');
237}
238239function handlePreviewVal(elementId: string, valName: string) {
240const previewElementId = `preview-${elementId}`;
241previewVal(valName, previewElementId).catch(error => {
248}
249250// Ensure the handler functions are accessible globally
251(window as any).handlePreviewVal = handlePreviewVal;
252(window as any).handleEvalCode = handleEvalCode;
1// This val responds to HTTP requests with "Hello world"
2export default async function main(req: Request): Promise<Response> {
3return new Response("Hello world");
4}