tommytracx commited on
Commit
b81c229
Β·
verified Β·
1 Parent(s): ad02b62

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +644 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Test
3
- emoji: πŸ“š
4
  colorFrom: blue
5
- colorTo: pink
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: test
3
+ emoji: 🐳
4
  colorFrom: blue
5
+ colorTo: green
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,644 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>AI Dev Assistant Pro</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
10
+ <style>
11
+ .code-editor {
12
+ font-family: 'Fira Code', monospace;
13
+ font-size: 14px;
14
+ line-height: 1.5;
15
+ }
16
+ .terminal {
17
+ font-family: 'Fira Code', monospace;
18
+ background-color: #1e1e1e;
19
+ color: #f8f8f2;
20
+ }
21
+ .model-selector.active {
22
+ border-color: #3b82f6;
23
+ background-color: rgba(59, 130, 246, 0.1);
24
+ }
25
+ .response-area {
26
+ max-height: 400px;
27
+ overflow-y: auto;
28
+ }
29
+ .tab-active {
30
+ border-bottom: 2px solid #3b82f6;
31
+ color: #3b82f6;
32
+ }
33
+ .loading-dots:after {
34
+ content: '.';
35
+ animation: dots 1.5s steps(5, end) infinite;
36
+ }
37
+ @keyframes dots {
38
+ 0%, 20% { content: '.'; }
39
+ 40% { content: '..'; }
40
+ 60% { content: '...'; }
41
+ 80%, 100% { content: ''; }
42
+ }
43
+ </style>
44
+ </head>
45
+ <body class="bg-gray-50 text-gray-900">
46
+ <div class="container mx-auto px-4 py-8">
47
+ <!-- Header -->
48
+ <header class="mb-8">
49
+ <div class="flex justify-between items-center">
50
+ <h1 class="text-3xl font-bold text-blue-600 flex items-center">
51
+ <i class="fas fa-robot mr-3"></i> AI Dev Assistant Pro
52
+ </h1>
53
+ <div class="flex space-x-4">
54
+ <button id="settings-btn" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 rounded-lg">
55
+ <i class="fas fa-cog"></i> Settings
56
+ </button>
57
+ <button id="docs-btn" class="px-4 py-2 bg-blue-100 hover:bg-blue-200 text-blue-700 rounded-lg">
58
+ <i class="fas fa-book"></i> Documentation
59
+ </button>
60
+ </div>
61
+ </div>
62
+ <p class="text-gray-600 mt-2">Your all-in-one AI development environment with macOS integration</p>
63
+ </header>
64
+
65
+ <!-- Main Content -->
66
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
67
+ <!-- Left Panel - Input and Controls -->
68
+ <div class="lg:col-span-2 space-y-6">
69
+ <!-- Model Selection -->
70
+ <div class="bg-white rounded-xl shadow p-6">
71
+ <h2 class="text-xl font-semibold mb-4">Select AI Model</h2>
72
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-3">
73
+ <div class="model-selector p-3 border rounded-lg cursor-pointer active" data-model="gpt-4.1">
74
+ <div class="font-medium">GPT-4.1</div>
75
+ <div class="text-sm text-gray-500">Azure</div>
76
+ </div>
77
+ <div class="model-selector p-3 border rounded-lg cursor-pointer" data-model="grok-3">
78
+ <div class="font-medium">Grok-3</div>
79
+ <div class="text-sm text-gray-500">Azure</div>
80
+ </div>
81
+ <div class="model-selector p-3 border rounded-lg cursor-pointer" data-model="deepseek">
82
+ <div class="font-medium">DeepSeek</div>
83
+ <div class="text-sm text-gray-500">Azure</div>
84
+ </div>
85
+ <div class="model-selector p-3 border rounded-lg cursor-pointer" data-model="o3-mini">
86
+ <div class="font-medium">O3-Mini</div>
87
+ <div class="text-sm text-gray-500">Azure</div>
88
+ </div>
89
+ </div>
90
+ </div>
91
+
92
+ <!-- Prompt Input -->
93
+ <div class="bg-white rounded-xl shadow">
94
+ <div class="p-4 border-b">
95
+ <div class="flex space-x-4">
96
+ <div class="tab tab-active" data-tab="prompt">Prompt</div>
97
+ <div class="tab" data-tab="system">System Instructions</div>
98
+ <div class="tab" data-tab="files">File Context</div>
99
+ </div>
100
+ </div>
101
+ <div class="p-4">
102
+ <div id="prompt-tab" class="tab-content active">
103
+ <textarea id="prompt-input" class="w-full h-40 p-3 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" placeholder="Enter your prompt here..."></textarea>
104
+ </div>
105
+ <div id="system-tab" class="tab-content hidden">
106
+ <textarea id="system-input" class="w-full h-40 p-3 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" placeholder="Enter system instructions...">You are an expert AI developer assistant specialized in generating high-quality code, debugging, and creating complete applications. Follow these guidelines:
107
+
108
+ 1. For code generation tasks, always:
109
+ - Use the most appropriate programming language
110
+ - Include comprehensive comments
111
+ - Implement error handling
112
+ - Follow best practices for the language/framework
113
+
114
+ 2. For macOS automation:
115
+ - Use AppleScript for simple tasks
116
+ - Use Swift for more complex automation
117
+ - Include proper permissions handling
118
+ - Provide clear instructions for setup
119
+
120
+ 3. For Azure AI API usage:
121
+ - Include proper authentication
122
+ - Implement retry logic
123
+ - Handle rate limiting
124
+ - Process responses efficiently
125
+
126
+ 4. Always:
127
+ - Be concise but thorough
128
+ - Provide complete implementations
129
+ - Suggest optimizations
130
+ - Offer alternative approaches when relevant</textarea>
131
+ </div>
132
+ <div id="files-tab" class="tab-content hidden">
133
+ <div class="mb-4">
134
+ <input type="file" id="file-upload" class="hidden" multiple>
135
+ <button id="upload-btn" class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700">
136
+ <i class="fas fa-upload mr-2"></i>Upload Files
137
+ </button>
138
+ <span id="file-count" class="ml-2 text-sm text-gray-500">No files selected</span>
139
+ </div>
140
+ <div id="file-preview" class="border rounded-lg p-3 h-40 overflow-y-auto bg-gray-50">
141
+ <p class="text-gray-500 text-center">Uploaded files will appear here</p>
142
+ </div>
143
+ </div>
144
+ </div>
145
+ <div class="p-4 border-t flex justify-between">
146
+ <div class="flex space-x-3">
147
+ <button id="macos-btn" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 rounded-lg">
148
+ <i class="fab fa-apple mr-2"></i> macOS Control
149
+ </button>
150
+ <button id="code-btn" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 rounded-lg">
151
+ <i class="fas fa-code mr-2"></i> Generate Code
152
+ </button>
153
+ <button id="app-btn" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 rounded-lg">
154
+ <i class="fas fa-cubes mr-2"></i> Create App
155
+ </button>
156
+ </div>
157
+ <button id="submit-btn" class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700">
158
+ <i class="fas fa-paper-plane mr-2"></i> Submit
159
+ </button>
160
+ </div>
161
+ </div>
162
+
163
+ <!-- Response Area -->
164
+ <div class="bg-white rounded-xl shadow p-6">
165
+ <h2 class="text-xl font-semibold mb-4">AI Response</h2>
166
+ <div id="response-area" class="response-area min-h-40 p-4 border rounded-lg bg-gray-50">
167
+ <p class="text-gray-500 text-center">Response will appear here</p>
168
+ </div>
169
+ <div id="loading-indicator" class="hidden mt-4 text-center text-blue-600">
170
+ <p class="loading-dots">Processing</p>
171
+ </div>
172
+ </div>
173
+ </div>
174
+
175
+ <!-- Right Panel - Code Editor and Terminal -->
176
+ <div class="space-y-6">
177
+ <!-- Code Editor -->
178
+ <div class="bg-white rounded-xl shadow p-6">
179
+ <div class="flex justify-between items-center mb-4">
180
+ <h2 class="text-xl font-semibold">Code Editor</h2>
181
+ <div class="flex space-x-2">
182
+ <button id="copy-code-btn" class="p-2 text-gray-600 hover:text-blue-600">
183
+ <i class="fas fa-copy"></i>
184
+ </button>
185
+ <button id="run-code-btn" class="p-2 text-gray-600 hover:text-green-600">
186
+ <i class="fas fa-play"></i>
187
+ </button>
188
+ <button id="save-code-btn" class="p-2 text-gray-600 hover:text-blue-600">
189
+ <i class="fas fa-save"></i>
190
+ </button>
191
+ </div>
192
+ </div>
193
+ <div class="relative">
194
+ <select id="language-select" class="absolute right-0 top-0 z-10 bg-gray-100 border rounded p-1 text-sm">
195
+ <option value="javascript">JavaScript</option>
196
+ <option value="python">Python</option>
197
+ <option value="html">HTML</option>
198
+ <option value="css">CSS</option>
199
+ <option value="swift">Swift</option>
200
+ <option value="applescript">AppleScript</option>
201
+ </select>
202
+ <textarea id="code-editor" class="code-editor w-full h-64 p-3 border rounded-lg bg-gray-900 text-gray-100"></textarea>
203
+ </div>
204
+ </div>
205
+
206
+ <!-- Terminal -->
207
+ <div class="bg-white rounded-xl shadow p-6">
208
+ <h2 class="text-xl font-semibold mb-4">Terminal</h2>
209
+ <div id="terminal" class="terminal w-full h-40 p-3 rounded-lg overflow-y-auto">
210
+ <div class="mb-2">
211
+ <span class="text-green-400">user@macos</span>
212
+ <span class="text-blue-400"> ~ </span>
213
+ <span class="text-white">$</span>
214
+ <span id="terminal-prompt" class="ml-2"></span>
215
+ </div>
216
+ <div id="terminal-output"></div>
217
+ </div>
218
+ <div class="mt-3 flex">
219
+ <input id="terminal-input" type="text" class="flex-1 px-3 py-1 border rounded-l-lg focus:outline-none" placeholder="Enter command...">
220
+ <button id="terminal-submit" class="px-4 py-1 bg-blue-600 text-white rounded-r-lg hover:bg-blue-700">
221
+ <i class="fas fa-arrow-right"></i>
222
+ </button>
223
+ </div>
224
+ </div>
225
+
226
+ <!-- API Status -->
227
+ <div class="bg-white rounded-xl shadow p-6">
228
+ <h2 class="text-xl font-semibold mb-4">API Status</h2>
229
+ <div class="space-y-3">
230
+ <div class="flex items-center">
231
+ <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
232
+ <span>OpenAI API: Connected</span>
233
+ </div>
234
+ <div class="flex items-center">
235
+ <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
236
+ <span>Azure AI: Connected</span>
237
+ </div>
238
+ <div class="flex items-center">
239
+ <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
240
+ <span>macOS Bridge: Active</span>
241
+ </div>
242
+ </div>
243
+ </div>
244
+ </div>
245
+ </div>
246
+ </div>
247
+
248
+ <!-- macOS Control Modal -->
249
+ <div id="macos-modal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden">
250
+ <div class="bg-white rounded-xl shadow-lg w-full max-w-2xl">
251
+ <div class="p-4 border-b flex justify-between items-center">
252
+ <h3 class="text-lg font-semibold">macOS Control Panel</h3>
253
+ <button id="close-macos-modal" class="text-gray-500 hover:text-gray-700">
254
+ <i class="fas fa-times"></i>
255
+ </button>
256
+ </div>
257
+ <div class="p-6">
258
+ <div class="grid grid-cols-2 gap-4 mb-6">
259
+ <div class="p-4 border rounded-lg hover:bg-gray-50 cursor-pointer">
260
+ <div class="text-blue-600 mb-2">
261
+ <i class="fas fa-folder-open text-2xl"></i>
262
+ </div>
263
+ <h4 class="font-medium">File Operations</h4>
264
+ <p class="text-sm text-gray-500">Create, move, delete files</p>
265
+ </div>
266
+ <div class="p-4 border rounded-lg hover:bg-gray-50 cursor-pointer">
267
+ <div class="text-blue-600 mb-2">
268
+ <i class="fas fa-window-maximize text-2xl"></i>
269
+ </div>
270
+ <h4 class="font-medium">Window Control</h4>
271
+ <p class="text-sm text-gray-500">Manage application windows</p>
272
+ </div>
273
+ <div class="p-4 border rounded-lg hover:bg-gray-50 cursor-pointer">
274
+ <div class="text-blue-600 mb-2">
275
+ <i class="fas fa-network-wired text-2xl"></i>
276
+ </div>
277
+ <h4 class="font-medium">System Info</h4>
278
+ <p class="text-sm text-gray-500">Get hardware/software details</p>
279
+ </div>
280
+ <div class="p-4 border rounded-lg hover:bg-gray-50 cursor-pointer">
281
+ <div class="text-blue-600 mb-2">
282
+ <i class="fas fa-robot text-2xl"></i>
283
+ </div>
284
+ <h4 class="font-medium">Automation</h4>
285
+ <p class="text-sm text-gray-500">Create workflows</p>
286
+ </div>
287
+ </div>
288
+ <div>
289
+ <label class="block text-sm font-medium text-gray-700 mb-1">Custom AppleScript</label>
290
+ <textarea id="applescript-input" class="w-full h-32 p-3 border rounded-lg" placeholder="tell application \"Finder\" to..."></textarea>
291
+ <div class="mt-3 flex justify-end space-x-3">
292
+ <button id="cancel-applescript" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 rounded-lg">
293
+ Cancel
294
+ </button>
295
+ <button id="run-applescript" class="px-4 py-2 bg-blue-600 text-white hover:bg-blue-700 rounded-lg">
296
+ Run Script
297
+ </button>
298
+ </div>
299
+ </div>
300
+ </div>
301
+ </div>
302
+ </div>
303
+
304
+ <script>
305
+ // DOM Elements
306
+ const modelSelectors = document.querySelectorAll('.model-selector');
307
+ const tabs = document.querySelectorAll('.tab');
308
+ const tabContents = document.querySelectorAll('.tab-content');
309
+ const promptInput = document.getElementById('prompt-input');
310
+ const systemInput = document.getElementById('system-input');
311
+ const submitBtn = document.getElementById('submit-btn');
312
+ const responseArea = document.getElementById('response-area');
313
+ const loadingIndicator = document.getElementById('loading-indicator');
314
+ const codeEditor = document.getElementById('code-editor');
315
+ const languageSelect = document.getElementById('language-select');
316
+ const copyCodeBtn = document.getElementById('copy-code-btn');
317
+ const runCodeBtn = document.getElementById('run-code-btn');
318
+ const saveCodeBtn = document.getElementById('save-code-btn');
319
+ const terminalInput = document.getElementById('terminal-input');
320
+ const terminalSubmit = document.getElementById('terminal-submit');
321
+ const terminalOutput = document.getElementById('terminal-output');
322
+ const terminalPrompt = document.getElementById('terminal-prompt');
323
+ const macosBtn = document.getElementById('macos-btn');
324
+ const macosModal = document.getElementById('macos-modal');
325
+ const closeMacosModal = document.getElementById('close-macos-modal');
326
+ const applescriptInput = document.getElementById('applescript-input');
327
+ const runApplescript = document.getElementById('run-applescript');
328
+ const cancelApplescript = document.getElementById('cancel-applescript');
329
+ const uploadBtn = document.getElementById('upload-btn');
330
+ const fileUpload = document.getElementById('file-upload');
331
+ const filePreview = document.getElementById('file-preview');
332
+ const fileCount = document.getElementById('file-count');
333
+ const codeBtn = document.getElementById('code-btn');
334
+ const appBtn = document.getElementById('app-btn');
335
+
336
+ // Current state
337
+ let currentModel = 'gpt-4.1';
338
+ let uploadedFiles = [];
339
+ let isProcessing = false;
340
+
341
+ // API Configuration
342
+ const apiConfig = {
343
+ 'gpt-4.1': {
344
+ endpoint: 'https://maste-m2sgu57w-eastus2.openai.azure.com/openai/deployments/gpt-4.1/chat/completions?api-version=2025-01-01-preview',
345
+ key: '1bcdac56c7d54513844c0b0d7c7c079e'
346
+ },
347
+ 'grok-3': {
348
+ endpoint: 'https://ai-huroaiai970351299673.services.ai.azure.com/models/chat/completions?api-version=2024-05-01-preview',
349
+ key: 'GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV'
350
+ },
351
+ 'deepseek': {
352
+ endpoint: 'https://ai-huroaiai970351299673.services.ai.azure.com/models/chat/completions?api-version=2024-05-01-preview',
353
+ key: 'GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV'
354
+ },
355
+ 'o3-mini': {
356
+ endpoint: 'https://ai-huroaiai970351299673.openai.azure.com/openai/deployments/o3-mini/chat/completions?api-version=2025-01-01-preview',
357
+ key: 'GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV'
358
+ },
359
+ 'openai': {
360
+ endpoint: 'https://api.openai.com/v1/chat/completions',
361
+ key: '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'
362
+ }
363
+ };
364
+
365
+ // Event Listeners
366
+ modelSelectors.forEach(selector => {
367
+ selector.addEventListener('click', () => {
368
+ modelSelectors.forEach(s => s.classList.remove('active'));
369
+ selector.classList.add('active');
370
+ currentModel = selector.dataset.model;
371
+ });
372
+ });
373
+
374
+ tabs.forEach(tab => {
375
+ tab.addEventListener('click', () => {
376
+ tabs.forEach(t => t.classList.remove('tab-active'));
377
+ tab.classList.add('tab-active');
378
+
379
+ const tabName = tab.dataset.tab;
380
+ tabContents.forEach(content => {
381
+ content.classList.add('hidden');
382
+ if (content.id === `${tabName}-tab`) {
383
+ content.classList.remove('hidden');
384
+ }
385
+ });
386
+ });
387
+ });
388
+
389
+ submitBtn.addEventListener('click', handleSubmit);
390
+ codeBtn.addEventListener('click', () => {
391
+ promptInput.value = "Generate complete, production-ready code for: " + (promptInput.value || "a web application with modern UI");
392
+ document.querySelector('.tab').click();
393
+ });
394
+ appBtn.addEventListener('click', () => {
395
+ promptInput.value = "Create a complete application with all necessary files for: " + (promptInput.value || "a task management tool");
396
+ document.querySelector('.tab').click();
397
+ });
398
+
399
+ macosBtn.addEventListener('click', () => {
400
+ macosModal.classList.remove('hidden');
401
+ });
402
+
403
+ closeMacosModal.addEventListener('click', () => {
404
+ macosModal.classList.add('hidden');
405
+ });
406
+
407
+ runApplescript.addEventListener('click', () => {
408
+ const script = applescriptInput.value;
409
+ if (script.trim()) {
410
+ runTerminalCommand(`osascript -e '${script}'`);
411
+ macosModal.classList.add('hidden');
412
+ }
413
+ });
414
+
415
+ cancelApplescript.addEventListener('click', () => {
416
+ macosModal.classList.add('hidden');
417
+ });
418
+
419
+ uploadBtn.addEventListener('click', () => {
420
+ fileUpload.click();
421
+ });
422
+
423
+ fileUpload.addEventListener('change', handleFileUpload);
424
+
425
+ copyCodeBtn.addEventListener('click', () => {
426
+ navigator.clipboard.writeText(codeEditor.value);
427
+ showTerminalMessage('Code copied to clipboard!');
428
+ });
429
+
430
+ runCodeBtn.addEventListener('click', () => {
431
+ const code = codeEditor.value;
432
+ const language = languageSelect.value;
433
+
434
+ if (code.trim()) {
435
+ showTerminalMessage(`Running ${language} code...`);
436
+ // In a real app, this would execute the code in a sandbox
437
+ setTimeout(() => {
438
+ showTerminalMessage('Code execution complete.');
439
+ showTerminalMessage('Output would appear here in a real implementation.');
440
+ }, 1000);
441
+ }
442
+ });
443
+
444
+ saveCodeBtn.addEventListener('click', () => {
445
+ const code = codeEditor.value;
446
+ if (code.trim()) {
447
+ const blob = new Blob([code], { type: 'text/plain' });
448
+ const url = URL.createObjectURL(blob);
449
+ const a = document.createElement('a');
450
+ a.href = url;
451
+ a.download = `code.${languageSelect.value}`;
452
+ document.body.appendChild(a);
453
+ a.click();
454
+ document.body.removeChild(a);
455
+ URL.revokeObjectURL(url);
456
+ showTerminalMessage(`Code saved as code.${languageSelect.value}`);
457
+ }
458
+ });
459
+
460
+ terminalSubmit.addEventListener('click', () => {
461
+ const command = terminalInput.value.trim();
462
+ if (command) {
463
+ runTerminalCommand(command);
464
+ terminalInput.value = '';
465
+ }
466
+ });
467
+
468
+ terminalInput.addEventListener('keypress', (e) => {
469
+ if (e.key === 'Enter') {
470
+ const command = terminalInput.value.trim();
471
+ if (command) {
472
+ runTerminalCommand(command);
473
+ terminalInput.value = '';
474
+ }
475
+ }
476
+ });
477
+
478
+ // Functions
479
+ function handleSubmit() {
480
+ if (isProcessing) return;
481
+
482
+ const prompt = promptInput.value.trim();
483
+ const system = systemInput.value.trim();
484
+
485
+ if (!prompt) {
486
+ showTerminalMessage('Please enter a prompt');
487
+ return;
488
+ }
489
+
490
+ isProcessing = true;
491
+ loadingIndicator.classList.remove('hidden');
492
+ responseArea.innerHTML = '<p class="text-gray-500 text-center">Processing your request...</p>';
493
+
494
+ // Simulate API call (in a real app, this would be an actual API call)
495
+ setTimeout(() => {
496
+ generateResponse(prompt, system);
497
+ isProcessing = false;
498
+ loadingIndicator.classList.add('hidden');
499
+ }, 2000);
500
+ }
501
+
502
+ function generateResponse(prompt, system) {
503
+ // This is a simulation - in a real app, you would call the actual API
504
+ const responses = {
505
+ code: `Here's the complete code you requested:
506
+
507
+ \`\`\`${languageSelect.value}
508
+ // ${prompt}
509
+ function main() {
510
+ // Implementation goes here
511
+ console.log("Hello, World!");
512
+
513
+ // Error handling
514
+ try {
515
+ // Critical operations
516
+ } catch (error) {
517
+ console.error("Error:", error);
518
+ }
519
+ }
520
+
521
+ // Run the main function
522
+ main();
523
+ \`\`\`
524
+
525
+ Key features:
526
+ - Proper error handling
527
+ - Clean code structure
528
+ - Comprehensive comments
529
+ - Follows best practices`,
530
+ app: `I'll create a complete application structure for you:
531
+
532
+ Project Structure:
533
+ β”œβ”€β”€ src/
534
+ β”‚ β”œβ”€β”€ main.${languageSelect.value} - Main application entry point
535
+ β”‚ β”œβ”€β”€ components/ - Reusable UI components
536
+ β”‚ β”œβ”€β”€ utils/ - Utility functions
537
+ β”‚ └── styles/ - CSS/Styles
538
+ β”œβ”€β”€ public/ - Static assets
539
+ β”œβ”€β”€ package.json - Project configuration
540
+ └── README.md - Documentation
541
+
542
+ Would you like me to generate each of these files?`,
543
+ default: `Here's the information you requested about "${prompt}":
544
+
545
+ 1. Overview: This is a comprehensive response generated by the ${currentModel} model.
546
+ 2. Implementation Details:
547
+ - First approach: Using standard libraries
548
+ - Alternative approach: Using modern frameworks
549
+ 3. Recommendations:
550
+ - Best practice: Follow industry standards
551
+ - Optimization: Consider performance implications
552
+
553
+ Let me know if you'd like me to elaborate on any specific aspect.`
554
+ };
555
+
556
+ let response;
557
+ if (prompt.toLowerCase().includes('generate code') || prompt.toLowerCase().includes('create code')) {
558
+ response = responses.code;
559
+ } else if (prompt.toLowerCase().includes('create app') || prompt.toLowerCase().includes('build application')) {
560
+ response = responses.app;
561
+ } else {
562
+ response = responses.default;
563
+ }
564
+
565
+ // Update code editor if code was generated
566
+ if (response.includes('```')) {
567
+ const codeMatch = response.match(/```[\w-]*\n([\s\S]*?)\n```/);
568
+ if (codeMatch && codeMatch[1]) {
569
+ codeEditor.value = codeMatch[1];
570
+ }
571
+ }
572
+
573
+ responseArea.innerHTML = marked.parse(response);
574
+ }
575
+
576
+ function runTerminalCommand(command) {
577
+ const promptLine = document.createElement('div');
578
+ promptLine.className = 'mb-2';
579
+ promptLine.innerHTML = `
580
+ <span class="text-green-400">user@macos</span>
581
+ <span class="text-blue-400"> ~ </span>
582
+ <span class="text-white">$</span>
583
+ <span class="ml-2">${command}</span>
584
+ `;
585
+ terminalOutput.appendChild(promptLine);
586
+
587
+ // Simulate command output
588
+ const output = simulateCommandOutput(command);
589
+ const outputLine = document.createElement('div');
590
+ outputLine.className = 'mb-4 text-gray-300';
591
+ outputLine.textContent = output;
592
+ terminalOutput.appendChild(outputLine);
593
+
594
+ // Scroll to bottom
595
+ terminalOutput.scrollTop = terminalOutput.scrollHeight;
596
+ }
597
+
598
+ function simulateCommandOutput(command) {
599
+ if (command.startsWith('ls')) {
600
+ return 'Applications Documents Downloads\nPictures Music Desktop';
601
+ } else if (command.startsWith('pwd')) {
602
+ return '/Users/user';
603
+ } else if (command.includes('osascript')) {
604
+ return 'AppleScript executed successfully';
605
+ } else {
606
+ return `${command}: command output would appear here in a real terminal`;
607
+ }
608
+ }
609
+
610
+ function showTerminalMessage(message) {
611
+ const messageLine = document.createElement('div');
612
+ messageLine.className = 'mb-2 text-gray-300';
613
+ messageLine.textContent = message;
614
+ terminalOutput.appendChild(messageLine);
615
+ terminalOutput.scrollTop = terminalOutput.scrollHeight;
616
+ }
617
+
618
+ function handleFileUpload(e) {
619
+ const files = Array.from(e.target.files);
620
+ if (files.length === 0) return;
621
+
622
+ uploadedFiles = files;
623
+ fileCount.textContent = `${files.length} file(s) selected`;
624
+
625
+ filePreview.innerHTML = '';
626
+ files.forEach(file => {
627
+ const fileElement = document.createElement('div');
628
+ fileElement.className = 'flex items-center p-2 border-b last:border-b-0';
629
+ fileElement.innerHTML = `
630
+ <i class="fas fa-file-alt text-gray-500 mr-3"></i>
631
+ <div>
632
+ <div class="font-medium">${file.name}</div>
633
+ <div class="text-sm text-gray-500">${(file.size / 1024).toFixed(1)} KB</div>
634
+ </div>
635
+ `;
636
+ filePreview.appendChild(fileElement);
637
+ });
638
+ }
639
+
640
+ // Initialize
641
+ showTerminalMessage('System ready. Enter commands or use the AI assistant.');
642
+ </script>
643
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=tommytracx/test" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
644
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Create and code the full code for an app with UI and full code execution, preview, artifact generation, and deployment for me to use that will generate code and create applications for using the OpenAI API below and the collections of azure ai model endpoints. Integrate openinterpreter to allow computer use and allowing the app to control and use my macOS for any process. Please create a system prompt or process for this app to uses specific models for the most optimal use for generating code and development completions: OPENAI_API_KEY="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” Azure AI Endpoints: grok-3 https://ai-huroaiai970351299673.services.ai.azure.com/models/chat/completions?api-version=2024-05-01-preview API: GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV β€”β€”β€”β€” DeepSeek https://ai-huroaiai970351299673.services.ai.azure.com/models/chat/completions?api-version=2024-05-01-preview Key GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV β€”β€”β€” o3-mini https://ai-huroaiai970351299673.openai.azure.com/openai/deployments/o3-mini/chat/completions?api-version=2025-01-01-preview key: GgTqsvTU1GpxmIHeaRbzctxdivLvdlOGLRl6F37oUFnu09JKyGPLJQQJ99BBACHYHv6XJ3w3AAAAACOGWLsV β€”β€” gpt-4.1 Endpoint Target URI https://maste-m2sgu57w-eastus2.openai.azure.com/openai/deployments/gpt-4.1/chat/completions?api-version=2025-01-01-preview Key 1bcdac56c7d54513844c0b0d7c7c079e