Hugging Face's logo

Spaces:
voidisopenyt
/
deepsite-project
Running

App Files Community
voidisopenyt commited on
Commit
a92bd4c
·
verified ·
1 Parent(s): f6cec31

Manual changes saved

Browse files
Files changed (1) hide show
  1. index.html +148 -22
index.html CHANGED
@@ -1,24 +1,150 @@
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 class="card">
18
- <h2>AI Database Generator</h2>
19
- <p>Generate custom AI training datasets with our interactive tool:</p>
20
- <a href="generator.html" class="button">Launch AI Generator</a>
21
- </div>
22
- </div>
23
- </body>
24
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
  <!doctype html>
2
  <html>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width" />
6
+ <title>AI Database Generator</title>
7
+ <link rel="stylesheet" href="style.css" />
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <style>
10
+ .sidebar {
11
+ width: 300px;
12
+ height: 100vh;
13
+ position: fixed;
14
+ right: 0;
15
+ top: 0;
16
+ background: #f5f5f5;
17
+ padding: 20px;
18
+ border-left: 1px solid #ddd;
19
+ overflow-y: auto;
20
+ }
21
+ .main-content {
22
+ margin-right: 320px;
23
+ padding: 20px;
24
+ }
25
+ .chat-message {
26
+ margin-bottom: 10px;
27
+ padding: 10px;
28
+ border-radius: 5px;
29
+ }
30
+ .user-message {
31
+ background: #e3f2fd;
32
+ }
33
+ .ai-message {
34
+ background: #f1f1f1;
35
+ }
36
+ .api-key-input {
37
+ margin-bottom: 20px;
38
+ }
39
+ </style>
40
+ </head>
41
+ <body>
42
+ <div class="sidebar">
43
+ <h2>AI Assistant</h2>
44
+ <div class="api-key-input">
45
+ <label for="api-key">Enter Gemini API Key:</label>
46
+ <input type="password" id="api-key" placeholder="Your Gemini API key">
47
+ <button id="save-key">Save</button>
48
+ </div>
49
+ <div id="chat-container">
50
+ <div class="chat-message ai-message">
51
+ Hello! I'm here to help you build your AI training dataset. What would you like to generate today?
52
+ </div>
53
+ </div>
54
+ <div class="chat-input">
55
+ <input type="text" id="user-input" placeholder="Ask me anything...">
56
+ <button id="send-message">Send</button>
57
+ </div>
58
+ </div>
59
+
60
+ <div class="main-content">
61
+ <h1>AI Database Generator</h1>
62
+ <div class="card">
63
+ <h2>Configuration</h2>
64
+ <div class="form-group">
65
+ <label>Dataset Type:</label>
66
+ <select id="dataset-type">
67
+ <option value="conversational">Conversational</option>
68
+ <option value="qna">Q&A</option>
69
+ <option value="code">Code Examples</option>
70
+ </select>
71
+ </div>
72
+ <div class="form-group">
73
+ <label>Prompt:</label>
74
+ <textarea id="dataset-prompt" rows="4" placeholder="Describe what you want in your dataset..."></textarea>
75
+ </div>
76
+ <button id="generate-btn">Generate Dataset</button>
77
+ </div>
78
+
79
+ <div class="card" id="output-section" style="display:none;">
80
+ <h2>Generated Output</h2>
81
+ <div id="generated-content"></div>
82
+ <div class="export-options">
83
+ <button id="export-ipynb">Export as Jupyter Notebook</button>
84
+ <button id="export-zip">Export as ZIP (with training scripts)</button>
85
+ </div>
86
+ <div class="training-instructions">
87
+ <h3>Training Instructions</h3>
88
+ <p>To train your model:</p>
89
+ <pre>pip install -r requirements.txt
90
+ python train.py</pre>
91
+ </div>
92
+ </div>
93
+ </div>
94
+
95
+ <script>
96
+ document.getElementById('generate-btn').addEventListener('click', function() {
97
+ const apiKey = document.getElementById('api-key').value;
98
+ if (!apiKey) {
99
+ alert('Please enter your Gemini API key first');
100
+ return;
101
+ }
102
+
103
+ const datasetType = document.getElementById('dataset-type').value;
104
+ const prompt = document.getElementById('dataset-prompt').value;
105
+
106
+ // Simulate generation (in a real app, this would call the Gemini API)
107
+ document.getElementById('output-section').style.display = 'block';
108
+ document.getElementById('generated-content').innerHTML = `
109
+ <p>Generating ${datasetType} dataset based on: "${prompt}"</p>
110
+ <p>Dataset generation complete! Ready for export.</p>
111
+ `;
112
+
113
+ // Add to chat
114
+ const chatContainer = document.getElementById('chat-container');
115
+ const userMessage = document.createElement('div');
116
+ userMessage.className = 'chat-message user-message';
117
+ userMessage.textContent = `I want to generate a ${datasetType} dataset about: ${prompt}`;
118
+ chatContainer.appendChild(userMessage);
119
+
120
+ const aiMessage = document.createElement('div');
121
+ aiMessage.className = 'chat-message ai-message';
122
+ aiMessage.textContent = `I've generated your ${datasetType} dataset. You can now export it for training.`;
123
+ chatContainer.appendChild(aiMessage);
124
+ });
125
+
126
+ document.getElementById('send-message').addEventListener('click', function() {
127
+ const input = document.getElementById('user-input').value;
128
+ if (!input) return;
129
+
130
+ const chatContainer = document.getElementById('chat-container');
131
+ const userMessage = document.createElement('div');
132
+ userMessage.className = 'chat-message user-message';
133
+ userMessage.textContent = input;
134
+ chatContainer.appendChild(userMessage);
135
+
136
+ // Simulate AI response
137
+ setTimeout(() => {
138
+ const aiMessage = document.createElement('div');
139
+ aiMessage.className = 'chat-message ai-message';
140
+ aiMessage.textContent = "I can help you refine your dataset requirements. What specific aspects would you like to focus on?";
141
+ chatContainer.appendChild(aiMessage);
142
+ chatContainer.scrollTop = chatContainer.scrollHeight;
143
+ }, 1000);
144
+
145
+ document.getElementById('user-input').value = '';
146
+ chatContainer.scrollTop = chatContainer.scrollHeight;
147
+ });
148
+ </script>
149
+ </body>
150
+ </html>