Val Town Code Search

stevensDemo App.tsx8 matches

@ewancameron•Updated 1 month ago

10import { NotebookView } from "./NotebookView.tsx";
11
12const API_BASE = "/api/memories";
13const MEMORIES_PER_PAGE = 20; // Increased from 7 to 20 memories per page
14
90
91    // Fetch avatar image
92    fetch("/api/images/stevens.jpg")
93      .then((response) => {
94        if (response.ok) return response.blob();
104
105    // Fetch wood background
106    fetch("/api/images/wood.jpg")
107      .then((response) => {
108        if (response.ok) return response.blob();
133    setError(null);
134    try {
135      const response = await fetch(API_BASE);
136      if (!response.ok) {
137        throw new Error(`HTTP error! status: ${response.status}`);
176
177    try {
178      const response = await fetch(API_BASE, {
179        method: "POST",
180        headers: { "Content-Type": "application/json" },
199
200    try {
201      const response = await fetch(`${API_BASE}/${id}`, {
202        method: "DELETE",
203      });
231
232    try {
233      const response = await fetch(`${API_BASE}/${editingMemory.id}`, {
234        method: "PUT",
235        headers: { "Content-Type": "application/json" },
606    <div className="font-pixel text-[#f8f1e0]">
607      <style jsx>{`
608        @import url("https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap");
609
610        @tailwind base;

sqliteExplorerApp README.md1 match

@lmammino•Updated 1 month ago

13## Authentication
14
15Login to your SQLite Explorer with [password authentication](https://www.val.town/v/pomdtr/password_auth) with your [Val Town API Token](https://www.val.town/settings/api) as the password.
16
17## Todos / Plans

sqliteExplorerApp main.tsx2 matches

@lmammino•Updated 1 month ago

27      <head>
28        <title>SQLite Explorer</title>
29        <link rel="preconnect" href="https://fonts.googleapis.com" />
30
31        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
32        <link
33          href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap"
34          rel="stylesheet"
35        />

live_prices main.tsx2 matches

@danju4rizzl•Updated 1 month ago

3// Helper function to fetch exchange rates
4async function fetchExchangeRates() {
5  const response = await fetch('https://open.er-api.com/v6/latest/USD');
6  const data = await response.json();
7  return data.rates;
10// Helper function to fetch global news
11async function fetchGlobalNews() {
12  const response = await fetch('https://newsapi.org/v2/top-headlines?country=us&apiKey=YOUR_NEWS_API_KEY');
13  const data = await response.json();
14  return data.articles.slice(0, 5);

groqAudioChat groqAudioChat48 matches

@pierremenard•Updated 1 month ago

6import "jsr:@std/dotenv/load"; // needed for deno run; not req for smallweb or valtown
7
8// Function to handle audio transcription using Groq's Whisper API
9export const audioTranscriptionHandler = async (c) => {
10  console.log("🎤 Audio transcription request received");
20    }
21
22    // Get API key from environment variable
23    const apiKey = Deno.env.get("GROQ_API_KEY");
24    if (!apiKey) {
25      console.error("❌ Transcription error: Missing API key");
26      return c.json({ error: "API key not configured" }, 500);
27    }
28
38
39      // If the file doesn't have a proper name or type, add one
40      // This ensures the file has the right extension for the API
41      if (!audioFile.name || !audioFile.type.startsWith("audio/")) {
42        const newFile = new File(
50    }
51
52    // Prepare the form data for Groq API
53    const groqFormData = new FormData();
54
65    groqFormData.append("timestamp_granularities[]", "word");
66
67    // Call Groq API
68    console.log("🎤 Sending request to Groq Whisper API");
69    const start = Date.now();
70    const response = await fetch("https://api.groq.com/openai/v1/audio/transcriptions", {
71      method: "POST",
72      headers: {
73        "Authorization": `Bearer ${apiKey}`,
74      },
75      body: groqFormData,
76    });
77    const elapsed = Date.now() - start;
78    console.log(`🎤 Groq Whisper API response received in ${elapsed}ms, status: ${response.status}`);
79
80    // Get response content type
99            errorMessage = `Server error: ${response.status} ${response.statusText}`;
100            // Log the full response for debugging
101            console.error("❌ Transcription API error response:", {
102              status: response.status,
103              statusText: response.statusText,
108        }
109      } catch (parseError) {
110        console.error("❌ Error parsing Groq API response:", parseError);
111        errorMessage = "Failed to parse error response from server";
112      }
113
114      return c.json({
115        error: `Groq API error: ${errorMessage}`,
116        status: response.status,
117      }, response.status);
150    console.log(`🔵 Last user message: "${messages.find(m => m.role === "user")?.content?.substring(0, 50)}..."`);
151
152    const GROQ_API_KEY = Deno.env.get("GROQ_API_KEY");
153    if (!GROQ_API_KEY) {
154      console.error("❌ Missing GROQ_API_KEY environment variable");
155      return c.json({ error: "GROQ_API_KEY environment variable is not set" }, 500);
156    }
157
158    console.log("🔵 Sending request to Groq API");
159    const start = Date.now();
160    const response = await fetch("https://api.groq.com/openai/v1/chat/completions", {
161      method: "POST",
162      headers: {
163        "Content-Type": "application/json",
164        "Authorization": `Bearer ${GROQ_API_KEY}`,
165      },
166      body: JSON.stringify({
171    });
172    const elapsed = Date.now() - start;
173    console.log(`🔵 Groq API response received in ${elapsed}ms, status: ${response.status}`);
174
175    if (!response.ok) {
176      const errorData = await response.json();
177      console.error("❌ Chat API error:", errorData);
178      return c.json({ error: "Failed to get chat completion", details: errorData }, response.status);
179    }
206    }
207
208    // Get API key from environment variable
209    const apiKey = Deno.env.get("GROQ_API_KEY");
210    if (!apiKey) {
211      console.error("❌ TTS error: Missing API key");
212      return c.json({ error: "API key not configured" }, 500);
213    }
214
215    // Call Groq Speech API
216    console.log("🔊 Sending request to Groq Speech API");
217    const start = Date.now();
218    const response = await fetch("https://api.groq.com/openai/v1/audio/speech", {
219      method: "POST",
220      headers: {
221        "Content-Type": "application/json",
222        "Authorization": `Bearer ${apiKey}`,
223      },
224      body: JSON.stringify({
230    });
231    const elapsed = Date.now() - start;
232    console.log(`🔊 Groq Speech API response received in ${elapsed}ms, status: ${response.status}`);
233
234    if (!response.ok) {
237        const errorData = await response.json();
238        errorMessage = errorData.error?.message || JSON.stringify(errorData);
239        console.error("❌ TTS API error:", errorData);
240      } catch (e) {
241        // If response is not JSON
242        errorMessage = `Server error: ${response.status} ${response.statusText}`;
243        console.error("❌ TTS API non-JSON error:", errorMessage);
244      }
245
603            // Now immediately send this message to get AI response
604            try {
605              // Prepare messages for the API
606              const apiMessages = this.messages.map(({ role, content }) => ({ role, content }));
607              
608              // Ensure first message is always the correct system message for current mode
609              if (apiMessages.length > 0 && apiMessages[0].role === 'system') {
610                const systemMessage = this.chatMode === 'concise' 
611                  ? 'You are a helpful assistant powered by the Llama-3.3-70b-versatile model. Keep your responses short, concise and conversational. Aim for 1-3 sentences when possible.'
612                  : 'You are a helpful assistant powered by the Llama-3.3-70b-versatile model. Respond conversationally and accurately to the user.';
613                
614                apiMessages[0].content = systemMessage;
615              }
616              
618                method: 'POST',
619                headers: { 'Content-Type': 'application/json' },
620                body: JSON.stringify({ messages: apiMessages })
621              });
622              
681        this.statusMessage = 'Thinking...';
682        
683        // Prepare messages for the API (excluding UI-only properties)
684        const apiMessages = this.messages.map(({ role, content }) => ({ role, content }));
685        
686        // Ensure first message is always the correct system message for current mode
687        if (apiMessages.length > 0 && apiMessages[0].role === 'system') {
688          const systemMessage = this.chatMode === 'concise' 
689            ? 'You are a helpful assistant powered by the Llama-3.3-70b-versatile model. Keep your responses short, concise and conversational. Aim for 1-3 sentences when possible.'
690            : 'You are a helpful assistant powered by the Llama-3.3-70b-versatile model. Respond conversationally and accurately to the user.';
691          
692          apiMessages[0].content = systemMessage;
693        }
694        
697          method: 'POST',
698          headers: { 'Content-Type': 'application/json' },
699          body: JSON.stringify({ messages: apiMessages })
700        });
701        
969
970    <p class="text-center text-sm text-gray-600 mt-4">
971      Powered by Llama-3.3-70b-versatile through Groq API. Audio transcription and speech synthesis provided by Groq. Text-to-speech provided through PlayHT. <a class="underline" href="https://console.groq.com/docs/speech-to-text" target="_blank" rel="noopener noreferrer">Documentation here</a>. <a class="underline" href="https://www.val.town/v/yawnxyz/groqAudioChat" target="_blank" rel="noopener noreferrer">Code here</a>
972    </p>
973    <div class="text-center text-sm text-gray-600 mt-4 w-full mx-auto">

groqAudioChat tts.ts12 matches

@pierremenard•Updated 1 month ago

16    }
17
18    // Get API key from environment variable
19    const apiKey = Deno.env.get("GROQ_API_KEY");
20    if (!apiKey) {
21      console.error("❌ TTS error: Missing API key");
22      return c.json({ error: "API key not configured" }, 500);
23    }
24
25    // Call Groq Speech API
26    console.log("🔊 Sending request to Groq Speech API");
27    const start = Date.now();
28    const response = await fetch("https://api.groq.com/openai/v1/audio/speech", {
29      method: "POST",
30      headers: {
31        "Content-Type": "application/json",
32        "Authorization": `Bearer ${apiKey}`
33      },
34      body: JSON.stringify({
40    });
41    const elapsed = Date.now() - start;
42    console.log(`🔊 Groq Speech API response received in ${elapsed}ms, status: ${response.status}`);
43
44    if (!response.ok) {
47        const errorData = await response.json();
48        errorMessage = errorData.error?.message || JSON.stringify(errorData);
49        console.error("❌ TTS API error:", errorData);
50      } catch (e) {
51        // If response is not JSON
52        errorMessage = `Server error: ${response.status} ${response.statusText}`;
53        console.error("❌ TTS API non-JSON error:", errorMessage);
54      }
55

groqAudioChat README.md8 matches

@pierremenard•Updated 1 month ago

1# Groq Audio Chat
2
3A web-based chat application powered by Groq's LLM API with audio transcription and text-to-speech capabilities.
4
5## Features
6
7- Chat with the Llama-3.3-70b-versatile model through Groq API
8- Multiple ways to record audio input:
9  - Hold spacebar to record audio (keyboard shortcut)
22/
23├── index.ts                 # Main entry point
24├── handlers/                # API endpoint handlers
25│   ├── index.ts             # Exports all handlers
26│   ├── audio.ts             # Audio transcription handler
35```
36
37## API Endpoints
38
39- `GET /` - Main web interface
44## Voice Options
45
46The application features 19 different PlayHT voices through Groq's API:
47- Arista-PlayAI
48- Atlas-PlayAI
67## Environment Variables
68
69- `GROQ_API_KEY` - Your Groq API key
70
71## Technologies Used
74- Alpine.js - Front-end JavaScript framework
75- Tailwind CSS - Utility-first CSS framework
76- Groq API - LLM provider with Llama-3.3-70b-versatile model
77- Groq Whisper API - Audio transcription
78- PlayHT (via Groq) - Text-to-speech synthesis
79

groqAudioChat html.ts1 match

@pierremenard•Updated 1 month ago

198    <footer class="text-center text-gray-500 text-sm mt-8">
199      <p class="text-center text-sm text-gray-600 mt-4">
200        Powered by Llama-3.3-70b-versatile through Groq API. Audio transcription and speech synthesis provided by Groq. Text-to-speech provided through PlayHT.
201      </p>
202      <p class="text-center text-sm text-gray-600 mt-2">

groqAudioChat chat.ts9 matches

@pierremenard•Updated 1 month ago

12    console.log(`🔵 Last user message: "${messages.find(m => m.role === 'user')?.content?.substring(0, 50)}..."`);
13    
14    const GROQ_API_KEY = Deno.env.get("GROQ_API_KEY");
15    if (!GROQ_API_KEY) {
16      console.error("❌ Missing GROQ_API_KEY environment variable");
17      return c.json({ error: "GROQ_API_KEY environment variable is not set" }, 500);
18    }
19
20    console.log("🔵 Sending request to Groq API");
21    const start = Date.now();
22    const response = await fetch("https://api.groq.com/openai/v1/chat/completions", {
23      method: "POST",
24      headers: {
25        "Content-Type": "application/json",
26        "Authorization": `Bearer ${GROQ_API_KEY}`
27      },
28      body: JSON.stringify({
33    });
34    const elapsed = Date.now() - start;
35    console.log(`🔵 Groq API response received in ${elapsed}ms, status: ${response.status}`);
36
37    if (!response.ok) {
38      const errorData = await response.json();
39      console.error("❌ Chat API error:", errorData);
40      return c.json({ error: "Failed to get chat completion", details: errorData }, response.status);
41    }

groqAudioChat audio.ts16 matches

@pierremenard•Updated 1 month ago

1import { Context } from "https://deno.land/x/hono@v3.11.7/mod.ts";
2
3// Function to handle audio transcription using Groq's Whisper API
4export const audioTranscriptionHandler = async (c: Context) => {
5  console.log("🎤 Audio transcription request received");
15    }
16
17    // Get API key from environment variable
18    const apiKey = Deno.env.get("GROQ_API_KEY");
19    if (!apiKey) {
20      console.error("❌ Transcription error: Missing API key");
21      return c.json({ error: "API key not configured" }, 500);
22    }
23
33      
34      // If the file doesn't have a proper name or type, add one
35      // This ensures the file has the right extension for the API
36      if (!audioFile.name || !audioFile.type.startsWith('audio/')) {
37        const newFile = new File(
45    }
46
47    // Prepare the form data for Groq API
48    const groqFormData = new FormData();
49    
60    groqFormData.append("timestamp_granularities[]", "word");
61
62    // Call Groq API
63    console.log("🎤 Sending request to Groq Whisper API");
64    const start = Date.now();
65    const response = await fetch("https://api.groq.com/openai/v1/audio/transcriptions", {
66      method: "POST",
67      headers: {
68        "Authorization": `Bearer ${apiKey}`
69      },
70      body: groqFormData
71    });
72    const elapsed = Date.now() - start;
73    console.log(`🎤 Groq Whisper API response received in ${elapsed}ms, status: ${response.status}`);
74
75    // Get response content type
94            errorMessage = `Server error: ${response.status} ${response.statusText}`;
95            // Log the full response for debugging
96            console.error("❌ Transcription API error response:", {
97              status: response.status,
98              statusText: response.statusText,
103        }
104      } catch (parseError) {
105        console.error("❌ Error parsing Groq API response:", parseError);
106        errorMessage = "Failed to parse error response from server";
107      }
108
109      return c.json({ 
110        error: `Groq API error: ${errorMessage}`,
111        status: response.status
112      }, response.status);