12const valtown = new ValTown();
13
14export default async function GitHubPush(c: Context) {
15 // auth check in /index
16 const user = await valtown.me.profile.retrieve();
18
19/**
20 * General use function to commit files to GitHub
21 */
22export async function commitFiles({
23 token,
24 owner,
25};
26
27export default async function(req: Request): Promise<Response> {
28 const url = new URL(req.url);
29
6
7 let model;
8 async function loadModel() {
9 model = await tf.loadLayersModel('https://your-model-url.com/model.json');
10 console.log("Model loaded successfully!");
22 const reader = new FileReader();
23
24 reader.onload = async function(event) {
25 const image = new Image();
26 image.src = event.target.result;
27 image.onload = async function() {
28 const tensor = tf.browser.fromPixels(image)
29 .resizeBilinear([224, 224])
240
241// Debugging component to catch rendering errors
242function ErrorBoundary({ children }) {
243 const [hasError, setHasError] = useState(false);
244
272}
273
274function FileDownloadButton({ files }) {
275 const handleDownload = async (file) => {
276 try {
319}
320
321function TrainingModule({ module, onSelect }) {
322 return (
323 <div
344}
345
346function ChallengeModal({ challenge, onClose, onSubmitFlag }) {
347 const [submittedFlag, setSubmittedFlag] = useState("");
348 const [flagStatus, setFlagStatus] = useState(null);
455}
456
457function App() {
458 const [selectedModule, setSelectedModule] = useState(null);
459 const [selectedChallenge, setSelectedChallenge] = useState(null);
576}
577
578function client() {
579 console.log("Client function called");
580 try {
581 const rootElement = document.getElementById("root");
598}
599
600// Ensure client function runs only in browser
601if (typeof document !== "undefined") {
602 console.log("Document is defined, calling client");
604}
605
606export default async function server(request: Request): Promise<Response> {
607 const url = new URL(request.url);
608
41
42// Enhanced logging utility
43function log(level: "INFO" | "WARN" | "ERROR", message: string, context?: any) {
44 const timestamp = new Date().toISOString();
45 const logEntry = {
53}
54
55function App() {
56 const [messages, setMessages] = useState<ChatMessage[]>([
57 {
305}
306
307function client() {
308 createRoot(document.getElementById("root")).render(<App />);
309}
310if (typeof document !== "undefined") { client(); }
311
312export default async function server(request: Request): Promise<Response> {
313 const { OpenAI } = await import("https://esm.town/v/std/openai");
314 const { sqlite } = await import("https://esm.town/v/stevekrouse/sqlite");
315
316 // Enhanced server-side logging
317 function serverLog(level: "INFO" | "WARN" | "ERROR", message: string, context?: any) {
318 const timestamp = new Date().toISOString();
319 const logEntry = {
408 const method = request.method;
409
410 // Function to check cache before processing request
411 const checkCache = async (path: string, method: string): Promise<Response | null> => {
412 // Only cache GET requests
482 };
483
484 // Function to store response in cache
485 const cacheResponse = async (
486 path: string,
1364 import { createRoot } from 'https://esm.sh/react-dom@18.2.0/client';
1365
1366 async function loadApp() {
1367 try {
1368 const module = await import('${import.meta.url}');
5const openai = new OpenAI({ apiKey: Deno.env.get("OPENAI_API_KEY") });
6
7export async function createProject(prompt: string) {
8 const projectResult = await sqlite.execute(
9 `INSERT INTO ${PROJECTS_TABLE} (initial_prompt) VALUES (?)`,
14}
15
16export async function getNextVersionNumber(projectId: number) {
17 const data = await sqlite.execute(
18 `SELECT version_number FROM ${ITERATIONS_TABLE}
24}
25
26export async function insertVersion(projectId: number, versionNumber: number, prompt: string, code: string) {
27 await sqlite.execute(
28 `INSERT INTO ${ITERATIONS_TABLE}
32}
33
34export async function getCodeInner(table: string, project: string, version?: string) {
35 let data;
36 if (version === undefined) {
53}
54
55export async function getCode(project: string, version?: string) {
56 // try to get code in the new table partition first
57 const code = await getCodeInner(ITERATIONS_TABLE, project, version);
60
61// Example of using OpenAI (you'll need to adapt this to your specific use case)
62export async function generateText(prompt: string) {
63 try {
64 const completion = await openai.chat.completions.create({
77const currentVersion = data.rows[0]?.[0] as number || 0;
78
79export async function getInitialPrompt(projectId: number) {
80 const data = await sqlite.execute(
81 `SELECT initial_prompt FROM ${PROJECTS_TABLE} WHERE id = ?`,
5const openai = new OpenAI({ apiKey: Deno.env.get("OPENAI_API_KEY") });
6
7export async function createProject(prompt: string) {
8 const projectResult = await sqlite.execute(
9 `INSERT INTO ${PROJECTS_TABLE} (initial_prompt) VALUES (?)`,
14}
15
16export async function getNextVersionNumber(projectId: number) {
17 const data = await sqlite.execute(
18 `SELECT version_number FROM ${ITERATIONS_TABLE}
24}
25
26export async function insertVersion(projectId: number, versionNumber: number, prompt: string, code: string) {
27 await sqlite.execute(
28 `INSERT INTO ${ITERATIONS_TABLE}
32}
33
34export async function getCodeInner(table: string, project: string, version?: string) {
35 let data;
36 if (version === undefined) {
53}
54
55export async function getCode(project: string, version?: string) {
56 // try to get code in the new table partition first
57 const code = await getCodeInner(ITERATIONS_TABLE, project, version);
60
61// Example of using OpenAI (you'll need to adapt this to your specific use case)
62export async function generateText(prompt: string) {
63 try {
64 const completion = await openai.chat.completions.create({
2import STARTER_PROMPTS from "../public/starter-prompts.js";
3
4function extractCodeFromFence(text: string): string {
5 const htmlMatch = text.match(/``````/);
6 return htmlMatch ? htmlMatch[1].trim() : text;
7}
8
9export async function generateCode(prompt: string, currentCode: string) {
10 const starterPrompt = STARTER_PROMPTS.find(p => p.prompt === prompt);
11 if (starterPrompt) {
3 "prompt": "todo list app persisted in local storage, pretty",
4 "title": "Todo App",
5 "code": "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Task Master</title>\n <link href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\" rel=\"stylesheet\">\n</head>\n<body class=\"bg-gray-100\">\n <div class=\"max-w-md mx-auto mt-12 p-6 rounded-lg shadow-md bg-white\">\n <div class=\"flex justify-between items-center mb-6\">\n <h2 class=\"text-2xl font-bold\">Task Master</h2>\n <span class=\"text-gray-600\">Manage your tasks efficiently</span>\n </div>\n <ul class=\"todo-list\" id=\"todo-list\"></ul>\n <div class=\"add-todo mt-6 flex justify-between items-center\">\n <input type=\"text\" id=\"todo-input\" placeholder=\"Add new task\" class=\"w-full py-2 pl-10 text-sm text-gray-800 border border-gray-400 rounded-lg focus:outline-none focus:ring-2 focus:ring-gray-600 bg-gray-50\">\n <button type=\"button\" id=\"add-todo-btn\" class=\"ml-4 px-4 py-2 bg-green-500 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-green-700 hover:shadow-lg focus:bg-green-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-green-800 active:shadow-lg transition duration-150 ease-in-out\">Add Task</button>\n </div>\n <div class=\"mt-6 text-center text-gray-600\">\n Built on <a href=\"https://cerebrascoder.com\" target=\"_blank\" class=\"text-gray-900 underline\">Cerebras Coder</a>\n </div>\n </div>\n\n <script>\n // Get the todo list and add todo button elements\n const todoList = document.getElementById('todo-list');\n const addTodoBtn = document.getElementById('add-todo-btn');\n const todoInput = document.getElementById('todo-input');\n\n // Load todos from local storage\n let todos = JSON.parse(localStorage.getItem('todos')) || [];\n\n // Function to render the todo list\n function renderTodoList() {\n todoList.innerHTML = '';\n todos.forEach((todo, index) => {\n const todoItem = document.createElement('li');\n todoItem.innerHTML = `\n <div class=\"flex justify-between items-center py-4 border-b border-gray-300\">\n <div class=\"flex items-center\">\n <input type=\"checkbox\" id=\"todo-${index}\" class=\"mr-4\" ${todo.completed ? 'checked' : ''}>\n <span class=\"todo-text ${todo.completed ? 'text-gray-400 line-through' : 'text-gray-600'}\">${todo.text}</span>\n </div>\n <button type=\"button\" class=\"px-4 py-2 bg-red-500 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-red-700 hover:shadow-lg focus:bg-red-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-red-800 active:shadow-lg transition duration-150 ease-in-out delete-todo\" data-index=\"${index}\">Delete</button>\n </div>\n `;\n todoList.appendChild(todoItem);\n });\n }\n\n // Render the initial todo list\n renderTodoList();\n\n // Add event listener to the add todo button\n addTodoBtn.addEventListener('click', () => {\n const todoText = todoInput.value.trim();\n if (todoText) {\n todos.push({ text: todoText, completed: false });\n localStorage.setItem('todos', JSON.stringify(todos));\n todoInput.value = '';\n renderTodoList();\n }\n });\n\n // Add event listener to the todo list\n todoList.addEventListener('change', (e) => {\n if (e.target.type === 'checkbox') {\n const index = parseInt(e.target.id.split('-')[1]);\n todos[index].completed = e.target.checked;\n localStorage.setItem('todos', JSON.stringify(todos));\n renderTodoList();\n }\n });\n\n // Add event listener to the delete todo buttons\n todoList.addEventListener('click', (e) => {\n if (e.target.classList.contains('delete-todo')) {\n const index = parseInt(e.target.dataset.index);\n todos.splice(index, 1);\n localStorage.setItem('todos', JSON.stringify(todos));\n renderTodoList();\n }\n });\n </script>\n</body>\n</html>",
6 "performance": {
7 "tokensPerSecond": 2298.56,
23 "prompt": "two column interactive markdown editor with live preview and default text to explain markdown features",
24 "title": "Markdown Editor",
25 "code": "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Markdown Editor</title>\n <link href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\" rel=\"stylesheet\">\n</head>\n<body class=\"bg-white\">\n <div class=\"max-w-full mx-auto p-4 pt-6 md:p-6 lg:p-8\">\n <h1 class=\"text-3xl text-center mb-4\">Markdown Editor</h1>\n <div class=\"flex flex-row\">\n <div class=\"editor p-4 rounded-lg border border-gray-200 w-full md:w-1/2\">\n <textarea id=\"editor\" class=\"w-full h-screen p-2 border border-gray-200 rounded-lg\" placeholder=\"Type your Markdown here...\"></textarea>\n </div>\n <div class=\"preview p-4 rounded-lg border border-gray-200 w-full md:w-1/2 ml-2 md:ml-4 lg:ml-8\">\n <div id=\"preview\"></div>\n </div>\n </div>\n <p class=\"text-center mt-4\">Built on <a href=\"https://cerebrascoder.com\">Cerebras Coder</a></p>\n </div>\n\n <script>\n const editor = document.getElementById('editor');\n const preview = document.getElementById('preview');\n\n // Initialize textarea with default markdown\n const defaultMarkdown = `\n# Introduction to Markdown\nMarkdown is a lightweight markup language that is easy to read and write. It is often used for formatting text in plain text editors, chat applications, and even web pages.\n\n## Headers\nHeaders are denoted by the # symbol followed by a space. The number of # symbols determines the level of the header:\n# Heading 1\n## Heading 2\n### Heading 3\n\n## Emphasis\nYou can use emphasis to make your text **bold** or *italic*:\n*Italics*\n**Bold**\n\n## Lists\nYou can use lists to organize your text:\n* Item 1\n* Item 2\n* Item 3\nOr\n1. Item 1\n2. Item 2\n3. Item 3\n\n## Links\nYou can use links to reference external resources:\n[Google](https://www.google.com)\n\n## Images\nYou can use images to add visual content:\n\n`;\n editor.value = defaultMarkdown;\n\n // Update preview on input\n editor.addEventListener('input', () => {\n const markdown = editor.value;\n const html = markdownToHtml(markdown);\n preview.innerHTML = html;\n });\n\n // Initialize preview with default markdown\n const defaultHtml = markdownToHtml(defaultMarkdown);\n preview.innerHTML = defaultHtml;\n\n // Function to convert Markdown to HTML\n function markdownToHtml(markdown) {\n // Bold\n markdown = markdown.replace(/\\*\\*(.*?)\\*\\*/g, '<b>$1</b>');\n\n // Italic\n markdown = markdown.replace(/\\*(.*?)\\*/g, '<i>$1</i>');\n\n // Links\n markdown = markdown.replace(/\\[(.*?)\\]\\((.*?)\\)/g, '<a href=\"$2\">$1</a>');\n\n // Images\n markdown = markdown.replace(/!\\[(.*?)\\]\\((.*?)\\)/g, '<img src=\"$2\" alt=\"$1\">');\n\n // Headings\n markdown = markdown.replace(/(^#{1,6} )(.*)/gm, (match, level, text) => {\n return `<h${level.length}>${text}</h${level.length}>`;\n });\n\n // Lists\n markdown = markdown.replace(/^(\\*|\\d+\\.) (.*)/gm, (match, marker, text) => {\n if (marker.startsWith('*')) {\n return `<li>${text}</li>`;\n } else {\n return `<li>${text}</li>`;\n }\n });\n\n // Line breaks\n markdown = markdown.replace(/\\n/g, '<br>');\n\n // Fix for nested lists\n markdown = markdown.replace(/<li><li>/g, '<li>');\n markdown = markdown.replace(/<\\/li><\\/li>/g, '</li>');\n\n // Wrap lists in ul\n markdown = markdown.replace(/(<li>.*<\\/li>)/g, '<ul>$1</ul>');\n\n return markdown;\n }\n </script>\n</body>\n</html>",
26 "performance": {
27 "tokensPerSecond": 4092.96,
