Val Town Code Search

Eaglemajdeshomeandservices style.css1 match

@godinoarts•Updated 1 week ago

156}
157
158.garden-card-image {
159  width: 100%;
160  height: 200px;

Freelancing index.html1 match

@Sandra_Ozumba•Updated 1 week ago

7    <script src="https://cdn.twind.style" crossorigin></script>
8    <script src="https://esm.town/v/std/catch"></script>
9    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>💼</text></svg>">
10    <style>
11        /* Custom animations and styles */

Eaglemajdeshomeandservices index.html1 match

@godinoarts•Updated 1 week ago

8    
9    <!-- Favicon -->
10    <link rel="icon" type="image/svg+xml" href="/frontend/favicon.svg">
11    
12    <!-- TailwindCSS -->

Eaglemajdeshomeandservices types.ts8 matches

@godinoarts•Updated 1 week ago

10  totalPlots: number;
11  amenities: string[];
12  images: string[];
13  featured: boolean;
14}
96    totalPlots: 100,
97    amenities: ['24/7 Security', 'Good Road Network', 'Electricity', 'Water Supply', 'Drainage System'],
98    images: [],
99    featured: true
100  },
108    totalPlots: 80,
109    amenities: ['Gated Community', 'Recreation Center', 'Shopping Complex', 'School', 'Hospital'],
110    images: [],
111    featured: true
112  },
120    totalPlots: 120,
121    amenities: ['Security', 'Road Network', 'Electricity', 'Water'],
122    images: [],
123    featured: false
124  },
132    totalPlots: 90,
133    amenities: ['Playground', 'Security', 'Good Roads', 'Power Supply'],
134    images: [],
135    featured: false
136  },
144    totalPlots: 50,
145    amenities: ['Luxury Clubhouse', 'Swimming Pool', 'Gym', 'Security', 'Parking'],
146    images: [],
147    featured: true
148  },
156    totalPlots: 85,
157    amenities: ['Security', 'Good Roads', 'Electricity', 'Water Supply'],
158    images: [],
159    featured: false
160  },
168    totalPlots: 110,
169    amenities: ['Green Spaces', 'Security', 'Road Network', 'Utilities'],
170    images: [],
171    featured: false
172  }

Createajobposting index.html1 match

@fridayangela•Updated 1 week ago

7    <script src="https://cdn.twind.style" crossorigin></script>
8    <script src="https://esm.town/v/std/catch"></script>
9    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>💼</text></svg>">
10</head>
11<body class="bg-gray-50 min-h-screen">

templateTwitterAlert README.md3 matches

@ahmedashraf•Updated 1 week ago

9## Example
10This val tracks mentions of "Val Town" and related terms, excluding noise like retweets and irrelevant accounts. Notifications are sent to a Discord webhook but can be easily reconfigured for other platforms.
11<img src="https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/85912106-f625-443e-5321-6e2699453200/public" width="500"/>
12To see exactly how we use this template at Val Town: https://www.val.town/x/stevekrouse/twitterAlert
13
16### 1. Fork this Val
17To use this template, fork this val on the top right corner of this page.
18![Screenshot 2025-01-10 at 1.22.10 PM.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/c4ae349d-7e28-4378-8646-21c8958e1f00/public)
19
20### 2. View Source Code
21<em>The `CODE` box shows you the the full source code of this val, you may need to scroll down to see it.</em>
22![image.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/6a4dabb4-3b27-4cea-fce3-95a1a1c3cd00/public)
23
24### 3. Customize Query

untitled-5321 README.md5 matches

@Lyte•Updated 1 week ago

1# AI Tool App
2
3A comprehensive AI assistant that can answer questions and generate images.
4
5## Features
6
7- **Chat Interface**: Ask questions and get AI-powered responses using GPT-4
8- **Image Generation**: Generate images from text descriptions using AI
9- **Real-time Interface**: Clean, responsive UI with real-time interactions
10
18│   │   ├── App.tsx          # Main application component
19│   │   ├── ChatInterface.tsx # Chat component for Q&A
20│   │   └── ImageGenerator.tsx # Image generation component
21│   ├── index.html           # Main HTML template
22│   ├── index.tsx            # Frontend entry point
31- `GET /` - Serves the main application
32- `POST /api/chat` - Handles chat/question requests
33- `POST /api/generate-image` - Handles image generation requests
34
35## Environment Variables
411. Navigate to the app URL
422. Use the chat interface to ask questions
433. Use the image generator to create images from descriptions
444. Switch between modes using the tab interface

untitled-5321 index.ts16 matches

@Lyte•Updated 1 week ago

2import { OpenAI } from "https://esm.town/v/std/openai";
3import { readFile, serveFile } from "https://esm.town/v/std/utils@85-main/index.ts";
4import type { ChatRequest, ChatResponse, ImageGenerationRequest, ImageGenerationResponse } from "../shared/types.ts";
5
6const app = new Hono();
87});
88
89// Image generation API endpoint
90app.post("/api/generate-image", async c => {
91  try {
92    const body: ImageGenerationRequest = await c.req.json();
93    
94    if (!body.prompt?.trim()) {
95      return c.json<ImageGenerationResponse>({
96        imageUrl: "",
97        success: false,
98        error: "Prompt is required"
100    }
101
102    const response = await openai.images.generate({
103      model: "dall-e-3",
104      prompt: body.prompt,
108    });
109
110    const imageUrl = response.data[0]?.url;
111    
112    if (!imageUrl) {
113      throw new Error("No image URL returned from OpenAI");
114    }
115
116    return c.json<ImageGenerationResponse>({
117      imageUrl: imageUrl,
118      success: true
119    });
120
121  } catch (error) {
122    console.error("Image generation error:", error);
123    return c.json<ImageGenerationResponse>({
124      imageUrl: "",
125      success: false,
126      error: "Failed to generate image. Please try again with a different prompt."
127    }, 500);
128  }

untitled-5321 ImageGenerator.tsx40 matches

@Lyte•Updated 1 week ago

1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState } from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3import type { ImageGenerationRequest, ImageGenerationResponse } from "../../shared/types.ts";
4
5interface GeneratedImage {
6  id: string;
7  prompt: string;
10}
11
12export default function ImageGenerator() {
13  const [prompt, setPrompt] = useState('');
14  const [size, setSize] = useState<'256x256' | '512x512' | '1024x1024'>('1024x1024');
15  const [isGenerating, setIsGenerating] = useState(false);
16  const [generatedImages, setGeneratedImages] = useState<GeneratedImage[]>([]);
17  const [error, setError] = useState<string | null>(null);
18
19  const generateImage = async () => {
20    if (!prompt.trim() || isGenerating) return;
21
24
25    try {
26      const request: ImageGenerationRequest = {
27        prompt: prompt.trim(),
28        size: size
29      };
30
31      const response = await fetch('/api/generate-image', {
32        method: 'POST',
33        headers: {
37      });
38
39      const data: ImageGenerationResponse = await response.json();
40
41      if (data.success) {
42        const newImage: GeneratedImage = {
43          id: Date.now().toString(),
44          prompt: prompt.trim(),
45          url: data.imageUrl,
46          timestamp: new Date()
47        };
48        setGeneratedImages(prev => [newImage, ...prev]);
49        setPrompt('');
50      } else {
51        setError(data.error || 'Failed to generate image');
52      }
53    } catch (error) {
54      console.error('Error generating image:', error);
55      setError('Failed to generate image. Please try again.');
56    } finally {
57      setIsGenerating(false);
62    if (e.key === 'Enter' && !e.shiftKey) {
63      e.preventDefault();
64      generateImage();
65    }
66  };
67
68  const clearImages = () => {
69    setGeneratedImages([]);
70    setError(null);
71  };
72
73  const downloadImage = async (imageUrl: string, prompt: string) => {
74    try {
75      const response = await fetch(imageUrl);
76      const blob = await response.blob();
77      const url = window.URL.createObjectURL(blob);
84      document.body.removeChild(a);
85    } catch (error) {
86      console.error('Error downloading image:', error);
87    }
88  };
91    <div className="bg-white rounded-lg shadow-lg p-6">
92      <div className="flex justify-between items-center mb-4">
93        <h2 className="text-2xl font-semibold text-gray-800">Image Generator</h2>
94        {generatedImages.length > 0 && (
95          <button
96            onClick={clearImages}
97            className="px-4 py-2 text-sm bg-gray-100 hover:bg-gray-200 rounded-md transition-colors"
98          >
99            Clear Images
100          </button>
101        )}
106        <div className="mb-4">
107          <label className="block text-sm font-medium text-gray-700 mb-2">
108            Image Description
109          </label>
110          <textarea
112            onChange={(e) => setPrompt(e.target.value)}
113            onKeyPress={handleKeyPress}
114            placeholder="Describe the image you want to generate... (Press Enter to generate)"
115            className="w-full p-3 border rounded-lg resize-none focus:outline-none focus:ring-2 focus:ring-blue-500"
116            rows={3}
122          <div className="flex-1">
123            <label className="block text-sm font-medium text-gray-700 mb-2">
124              Image Size
125            </label>
126            <select
136          </div>
137          <button
138            onClick={generateImage}
139            disabled={!prompt.trim() || isGenerating}
140            className="px-6 py-3 bg-blue-500 text-white rounded-lg hover:bg-blue-600 disabled:bg-gray-300 disabled:cursor-not-allowed transition-colors"
156        <div className="mb-6 p-8 text-center bg-gray-50 rounded-lg">
157          <div className="text-4xl mb-2">🎨</div>
158          <p className="text-gray-600">Creating your image...</p>
159          <div className="mt-2">
160            <div className="inline-block animate-spin rounded-full h-6 w-6 border-b-2 border-blue-500"></div>
163      )}
164
165      {/* Generated Images */}
166      <div className="image-container">
167        {generatedImages.length === 0 && !isGenerating ? (
168          <div className="text-center text-gray-500 py-8">
169            <div className="text-4xl mb-2">🖼️</div>
170            <p>No images generated yet. Describe an image to get started!</p>
171          </div>
172        ) : (
173          <div className="grid gap-6">
174            {generatedImages.map((image) => (
175              <div key={image.id} className="generated-image border rounded-lg p-4 bg-gray-50">
176                <div className="mb-3">
177                  <h3 className="font-medium text-gray-800 mb-1">"{image.prompt}"</h3>
178                  <p className="text-sm text-gray-500">
179                    Generated on {image.timestamp.toLocaleString()}
180                  </p>
181                </div>
182                <div className="relative group">
183                  <img
184                    src={image.url}
185                    alt={image.prompt}
186                    className="w-full rounded-lg shadow-md"
187                    loading="lazy"
189                  <div className="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-20 transition-all duration-200 rounded-lg flex items-center justify-center">
190                    <button
191                      onClick={() => downloadImage(image.url, image.prompt)}
192                      className="opacity-0 group-hover:opacity-100 transition-opacity duration-200 px-4 py-2 bg-white text-gray-800 rounded-lg shadow-md hover:bg-gray-100"
193                    >

untitled-5321 App.tsx7 matches

@Lyte•Updated 1 week ago

2import React, { useState } from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3import ChatInterface from "./ChatInterface.tsx";
4import ImageGenerator from "./ImageGenerator.tsx";
5
6type TabType = 'chat' | 'image';
7
8export default function App() {
18          </h1>
19          <p className="text-gray-600 text-lg">
20            Your intelligent assistant for questions and image generation
21          </p>
22        </div>
36            </button>
37            <button
38              onClick={() => setActiveTab('image')}
39              className={`px-6 py-3 rounded-md font-medium transition-all duration-200 ${
40                activeTab === 'image'
41                  ? 'bg-blue-500 text-white shadow-md'
42                  : 'text-gray-600 hover:text-blue-500'
43              }`}
44            >
45              🎨 Image Generator
46            </button>
47          </div>
51        <div className="max-w-4xl mx-auto">
52          {activeTab === 'chat' && <ChatInterface />}
53          {activeTab === 'image' && <ImageGenerator />}
54        </div>
55      </div>

« Previous

1...100 101 102 103 104 105 106...951

Projects

View all 105 vals

thilenius-webcam1 file match

@stabbylambda•Updated 1 day ago

Image proxy for the latest from https://gliderport.thilenius.com

Users

View all 2 users

"Focal Lens with Atig Wazir" "Welcome to my photography journey! I'm Atiq Wazir, a passionate photographer capturing life's beauty one frame at a time. Explore my gallery for stunning images, behind-the-scenes stories, and tips & tricks to enhance your own

Documentation

View all 7 documentation results

Val Town Code Search Return to Val Town

Eaglemajdeshomeandservices style.css1 match

Freelancing index.html1 match

Eaglemajdeshomeandservices index.html1 match

Eaglemajdeshomeandservices types.ts8 matches

Createajobposting index.html1 match

templateTwitterAlert README.md3 matches

untitled-5321 README.md5 matches

untitled-5321 index.ts16 matches

untitled-5321 ImageGenerator.tsx40 matches

untitled-5321 App.tsx7 matches

Projects

thilenius-webcam1 file match

image_generator1 file match

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code SearchReturn to Val Town

Eaglemajdeshomeandservicesstyle.css1 match

Freelancingindex.html1 match

Eaglemajdeshomeandservicesindex.html1 match

Eaglemajdeshomeandservicestypes.ts8 matches

Createajobpostingindex.html1 match

templateTwitterAlertREADME.md3 matches

untitled-5321README.md5 matches

untitled-5321index.ts16 matches

untitled-5321ImageGenerator.tsx40 matches

untitled-5321App.tsx7 matches

Projects

thilenius-webcam1 file match

image_generator1 file match

Users

@Chrimage1 val

@Atiq1 val

Documentation

Val Town Code Search Return to Val Town

Eaglemajdeshomeandservices style.css1 match

Freelancing index.html1 match

Eaglemajdeshomeandservices index.html1 match

Eaglemajdeshomeandservices types.ts8 matches

Createajobposting index.html1 match

templateTwitterAlert README.md3 matches

untitled-5321 README.md5 matches

untitled-5321 index.ts16 matches

untitled-5321 ImageGenerator.tsx40 matches

untitled-5321 App.tsx7 matches