Hugging Face's logo

Spaces:
magikx
/
test
Running

App Files Community
magikx commited on
Commit
9e3c379
·
verified ·
1 Parent(s): 5426d22

undefined - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +390 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Test
3
- emoji: 🏢
4
- colorFrom: pink
5
- colorTo: red
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: red
5
+ colorTo: blue
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,390 @@
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="pl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>System Zgłaszania Błędów</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <script src="https://unpkg.com/lucide@latest/dist/umd/lucide.js"></script>
9
+ <style>
10
+ .dragging {
11
+ opacity: 0.5;
12
+ transform: rotate(5deg);
13
+ }
14
+
15
+ .drop-zone {
16
+ background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
17
+ border: 2px dashed #0ea5e9;
18
+ }
19
+
20
+ .priority-high {
21
+ border-left: 4px solid #ef4444;
22
+ background: linear-gradient(90deg, #fef2f2 0%, #ffffff 100%);
23
+ }
24
+
25
+ .priority-medium {
26
+ border-left: 4px solid #f59e0b;
27
+ background: linear-gradient(90deg, #fffbeb 0%, #ffffff 100%);
28
+ }
29
+
30
+ .priority-low {
31
+ border-left: 4px solid #10b981;
32
+ background: linear-gradient(90deg, #f0fdf4 0%, #ffffff 100%);
33
+ }
34
+
35
+ .vote-btn {
36
+ transition: all 0.2s ease;
37
+ }
38
+
39
+ .vote-btn:hover {
40
+ transform: scale(1.1);
41
+ }
42
+
43
+ .vote-btn:active {
44
+ transform: scale(0.9);
45
+ }
46
+
47
+ .kanban-card {
48
+ transition: all 0.3s ease;
49
+ animation: slideIn 0.3s ease-out;
50
+ }
51
+
52
+ @keyframes slideIn {
53
+ from {
54
+ opacity: 0;
55
+ transform: translateY(-20px);
56
+ }
57
+ to {
58
+ opacity: 1;
59
+ transform: translateY(0);
60
+ }
61
+ }
62
+
63
+ .badge-pulse {
64
+ animation: pulse 2s infinite;
65
+ }
66
+
67
+ @keyframes pulse {
68
+ 0% {
69
+ opacity: 1;
70
+ }
71
+ 50% {
72
+ opacity: 0.5;
73
+ }
74
+ 100% {
75
+ opacity: 1;
76
+ }
77
+ }
78
+ </style>
79
+ </head>
80
+ <body class="bg-gray-50 min-h-screen">
81
+ <div class="container mx-auto px-4 py-8">
82
+ <header class="mb-8">
83
+ <h1 class="text-4xl font-bold text-gray-800 mb-2">System Zgłaszania Błędów</h1>
84
+ <p class="text-gray-600">Zarządzaj zgłoszeniami w formie tablicy Kanban</p>
85
+ <button onclick="showAddForm()" class="mt-4 bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 transition-colors flex items-center gap-2">
86
+ <i data-lucide="plus-circle"></i>
87
+ Dodaj nowe zgłoszenie
88
+ </button>
89
+ </header>
90
+
91
+ <!-- Formularz dodawania zgłoszenia -->
92
+ <div id="addFormModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
93
+ <div class="bg-white rounded-lg p-8 max-w-md w-full mx-4 transform transition-all">
94
+ <h2 class="text-2xl font-bold mb-4">Nowe zgłoszenie błędu</h2>
95
+ <form id="bugForm" onsubmit="addBug(event)" class="space-y-4">
96
+ <div>
97
+ <label class="block text-sm font-medium mb-2">Tytuł zgłoszenia</label>
98
+ <input type="text" id="bugTitle" required class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
99
+ </div>
100
+ <div>
101
+ <label class="block text-sm font-medium mb-2">Opis</label>
102
+ <textarea id="bugDescription" required class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" rows="3"></textarea>
103
+ </div>
104
+ <div>
105
+ <label class="block text-sm font-medium mb-2">Kategoria</label>
106
+ <select id="bugCategory" required class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
107
+ <option value="">Wybierz kategorię</option>
108
+ <option value="frontend">Frontend</option>
109
+ <option value="backend">Backend</option>
110
+ <option value="baza-danych">Baza danych</option>
111
+ <option value="ui-ux">UI/UX</option>
112
+ <option value="bezpieczenstwo">Bezpieczeństwo</option>
113
+ </select>
114
+ </div>
115
+ <div>
116
+ <label class="block text-sm font-medium mb-2">Priorytet</label>
117
+ <select id="bugPriority" required class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
118
+ <option value="low">Niski</option>
119
+ <option value="medium">Średni</option>
120
+ <option value="high">Wysoki</option>
121
+ </select>
122
+ </div>
123
+ <div class="flex gap-2">
124
+ <button type="submit" class="flex-1 bg-green-600 text-white py-2 rounded-lg hover:bg-green-700 transition-colors">
125
+ Zapisz zgłoszenie
126
+ </button>
127
+ <button type="button" onclick="hideAddForm()" class="flex-1 bg-gray-600 text-white py-2 rounded-lg hover:bg-gray-700 transition-colors">
128
+ Anuluj
129
+ </button>
130
+ </div>
131
+ </form>
132
+ </div>
133
+ </div>
134
+
135
+ <!-- Tablica Kanban -->
136
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
137
+ <div class="bg-gray-100 rounded-lg p-4">
138
+ <h3 class="font-bold text-lg mb-4 flex items-center gap-2">
139
+ <i data-lucide="circle" class="text-gray-500"></i>
140
+ Nowe
141
+ <span id="newCount" class="bg-gray-500 text-white px-2 py-1 rounded-full text-sm">0</span>
142
+ </h3>
143
+ <div id="newColumn" class="space-y-3 min-h-96" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
144
+ </div>
145
+
146
+ <div class="bg-blue-100 rounded-lg p-4">
147
+ <h3 class="font-bold text-lg mb-4 flex items-center gap-2">
148
+ <i data-lucide="loader" class="text-blue-500"></i>
149
+ W trakcie
150
+ <span id="progressCount" class="bg-blue-500 text-white px-2 py-1 rounded-full text-sm">0</span>
151
+ </h3>
152
+ <div id="progressColumn" class="space-y-3 min-h-96" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
153
+ </div>
154
+
155
+ <div class="bg-yellow-100 rounded-lg p-4">
156
+ <h3 class="font-bold text-lg mb-4 flex items-center gap-2">
157
+ <i data-lucide="check-circle-2" class="text-yellow-500"></i>
158
+ Do weryfikacji
159
+ <span id="reviewCount" class="bg-yellow-500 text-white px-2 py-1 rounded-full text-sm">0</span>
160
+ </h3>
161
+ <div id="reviewColumn" class="space-y-3 min-h-96" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
162
+ </div>
163
+
164
+ <div class="bg-green-100 rounded-lg p-4">
165
+ <h3 class="font-bold text-lg mb-4 flex items-center gap-2">
166
+ <i data-lucide="check" class="text-green-500"></i>
167
+ Zakończone
168
+ <span id="doneCount" class="bg-green-500 text-white px-2 py-1 rounded-full text-sm">0</span>
169
+ </h3>
170
+ <div id="doneColumn" class="space-y-3 min-h-96" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
171
+ </div>
172
+ </div>
173
+ </div>
174
+
175
+ <script>
176
+ let bugs = [];
177
+ let draggedElement = null;
178
+
179
+ // Inicjalizacja
180
+ document.addEventListener('DOMContentLoaded', () => {
181
+ lucide.createIcons();
182
+ loadSampleData();
183
+ renderBugs();
184
+ updateCounts();
185
+ });
186
+
187
+ function loadSampleData() {
188
+ bugs = [
189
+ {
190
+ id: 1,
191
+ title: "Przycisk wylogowania nie działa",
192
+ description: "Po kliknięciu przycisku 'Wyloguj' nic się nie dzieje",
193
+ category: "frontend",
194
+ priority: "high",
195
+ status: "new",
196
+ votes: 5,
197
+ date: new Date()
198
+ },
199
+ {
200
+ id: 2,
201
+ title: "Błąd w zapytaniu SQL",
202
+ description: "Niepoprawne łączenie tabel w raporcie sprzedaży",
203
+ category: "baza-danych",
204
+ priority: "medium",
205
+ status: "progress",
206
+ votes: 2,
207
+ date: new Date()
208
+ },
209
+ {
210
+ id: 3,
211
+ title: "Logo nie wyświetla się poprawnie na Safari",
212
+ description: "Na przeglądarce Safari logo jest rozciągnięte",
213
+ category: "ui-ux",
214
+ priority: "low",
215
+ status: "review",
216
+ votes: 1,
217
+ date: new Date()
218
+ }
219
+ ];
220
+ }
221
+
222
+ function renderBugs() {
223
+ // Wyczyść kolumny
224
+ ['new', 'progress', 'review', 'done'].forEach(status => {
225
+ const column = document.getElementById(`${status}Column`);
226
+ column.innerHTML = '';
227
+ });
228
+
229
+ // Renderuj zgłoszenia
230
+ bugs.forEach(bug => {
231
+ const card = createBugCard(bug);
232
+ const column = document.getElementById(`${bug.status}Column`);
233
+ column.appendChild(card);
234
+ });
235
+
236
+ updateCounts();
237
+ lucide.createIcons();
238
+ }
239
+
240
+ function createBugCard(bug) {
241
+ const card = document.createElement('div');
242
+ card.className = `kanban-card bg-white p-4 rounded-lg shadow-md cursor-move priority-${bug.priority}`;
243
+ card.draggable = true;
244
+ card.dataset.id = bug.id;
245
+
246
+ const categoryMap = {
247
+ 'frontend': 'Frontend',
248
+ 'backend': 'Backend',
249
+ 'baza-danych': 'Baza danych',
250
+ 'ui-ux': 'UI/UX',
251
+ 'bezpieczenstwo': 'Bezpieczeństwo'
252
+ };
253
+
254
+ const priorityMap = {
255
+ 'high': { text: 'Wysoki', color: 'red' },
256
+ 'medium': { text: 'Średni', color: 'yellow' },
257
+ 'low': { text: 'Niski', color: 'green' }
258
+ };
259
+
260
+ const priority = priorityMap[bug.priority];
261
+
262
+ card.innerHTML = `
263
+ <div class="flex justify-between items-start mb-2">
264
+ <h4 class="font-semibold text-gray-800">${bug.title}</h4>
265
+ <div class="flex items-center gap-1">
266
+ <button onclick="voteUp(${bug.id})" class="vote-btn text-gray-500 hover:text-blue-600">
267
+ <i data-lucide="thumbs-up" class="w-4 h-4"></i>
268
+ </button>
269
+ <span class="text-sm text-gray-600">${bug.votes}</span>
270
+ </div>
271
+ </div>
272
+ <p class="text-sm text-gray-600 mb-3">${bug.description}</p>
273
+ <div class="flex items-center justify-between">
274
+ <span class="text-xs bg-gray-200 px-2 py-1 rounded">${categoryMap[bug.category]}</span>
275
+ <span class="text-xs bg-${priority.color}-100 text-${priority.color}-700 px-2 py-1 rounded">${priority.text}</span>
276
+ </div>
277
+ <div class="mt-2 text-xs text-gray-500">
278
+ ${bug.date.toLocaleDateString('pl-PL')}
279
+ </div>
280
+ `;
281
+
282
+ // Event listeners dla drag & drop
283
+ card.addEventListener('dragstart', dragStart);
284
+ card.addEventListener('dragend', dragEnd);
285
+
286
+ return card;
287
+ }
288
+
289
+ function addBug(event) {
290
+ event.preventDefault();
291
+
292
+ const newBug = {
293
+ id: Date.now(),
294
+ title: document.getElementById('bugTitle').value,
295
+ description: document.getElementById('bugDescription').value,
296
+ category: document.getElementById('bugCategory').value,
297
+ priority: document.getElementById('bugPriority').value,
298
+ status: 'new',
299
+ votes: 0,
300
+ date: new Date()
301
+ };
302
+
303
+ bugs.push(newBug);
304
+ renderBugs();
305
+ hideAddForm();
306
+ document.getElementById('bugForm').reset();
307
+ }
308
+
309
+ function voteUp(bugId) {
310
+ const bug = bugs.find(b => b.id === bugId);
311
+ if (bug) {
312
+ bug.votes++;
313
+
314
+ // Animacja głosu
315
+ const card = document.querySelector(`[data-id="${bugId}"]`);
316
+ const voteBtn = card.querySelector('.vote-btn');
317
+ voteBtn.style.color = '#3b82f6';
318
+
319
+ setTimeout(() => {
320
+ voteBtn.style.color = '';
321
+ }, 300);
322
+
323
+ renderBugs();
324
+ }
325
+ }
326
+
327
+ function showAddForm() {
328
+ document.getElementById('addFormModal').classList.remove('hidden');
329
+ document.getElementById('addFormModal').classList.add('flex');
330
+ }
331
+
332
+ function hideAddForm() {
333
+ document.getElementById('addFormModal').classList.add('hidden');
334
+ document.getElementById('addFormModal').classList.remove('flex');
335
+ }
336
+
337
+ function updateCounts() {
338
+ const counts = {
339
+ new: bugs.filter(b => b.status === 'new').length,
340
+ progress: bugs.filter(b => b.status === 'progress').length,
341
+ review: bugs.filter(b => b.status === 'review').length,
342
+ done: bugs.filter(b => b.status === 'done').length
343
+ };
344
+
345
+ Object.keys(counts).forEach(status => {
346
+ const countElement = document.getElementById(`${status}Count`);
347
+ countElement.textContent = counts[status];
348
+
349
+ // Pulsująca animacja gdy pojawi się nowe zgłoszenie
350
+ if (counts[status] > 0) {
351
+ countElement.classList.add('badge-pulse');
352
+ }
353
+ });
354
+ }
355
+
356
+ // Drag & Drop functions
357
+ function dragStart(e) {
358
+ draggedElement = e.target;
359
+ e.target.classList.add('dragging');
360
+ }
361
+
362
+ function dragEnd(e) {
363
+ e.target.classList.remove('dragging');
364
+ }
365
+
366
+ function allowDrop(e) {
367
+ e.preventDefault();
368
+ e.currentTarget.classList.add('drop-zone');
369
+ }
370
+
371
+ function drop(e) {
372
+ e.preventDefault();
373
+ e.currentTarget.classList.remove('drop-zone');
374
+
375
+ if (draggedElement) {
376
+ const bugId = parseInt(draggedElement.dataset.id);
377
+ const newStatus = e.currentTarget.id.replace('Column', '');
378
+
379
+ const bug = bugs.find(b => b.id === bugId);
380
+ if (bug && bug.status !== newStatus) {
381
+ bug.status = newStatus;
382
+ renderBugs();
383
+ }
384
+
385
+ draggedElement = null;
386
+ }
387
+ }
388
+ </script>
389
+ <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=magikx/test" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
390
+ </html>