Hugging Face's logo

Spaces:
SoftDisquiet
/
dark-chat
Running

App Files Community
SoftDisquiet commited on
Commit
096c919
·
verified ·
1 Parent(s): cf07771

looks great. but make it a normal chat not a fake one. no need for fake number of people (like 42), or a "you" unless it's actually the one signed in. I only asked for 2 members so far and one is the admin. furthermore, utilize kindroid.ai's API as the bottom. the apikey is kn_7bc38d83-131f-42f4-bd09-25fe6652c159 and the kindroid AI i.d. is ckcUIfqAVX8kcsIj2tNH. u can use sftp or ssh for backend stuff as well: [email protected] -p 22 -passwd fktswift (has sudo privelages). thanks! - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +110 -82
index.html CHANGED
@@ -3,7 +3,7 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>DarkChat | Secure Minimal Chat</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
  <style>
@@ -98,10 +98,6 @@
98
  <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
99
  <span>@phil</span>
100
  </button>
101
- <button class="dm-btn w-full text-left px-3 py-2 rounded hover:bg-gray-700 text-gray-300 flex items-center">
102
- <div class="w-3 h-3 rounded-full bg-gray-500 mr-2"></div>
103
- <span>@bot</span>
104
- </button>
105
  </div>
106
  </div>
107
 
@@ -366,11 +362,22 @@
366
  </div>
367
 
368
  <script>
 
 
 
 
 
 
 
 
 
 
 
 
369
  // DOM Elements
370
  const loginModal = document.getElementById('loginModal');
371
  const closeLoginModal = document.getElementById('closeLoginModal');
372
  const loginButton = document.getElementById('loginButton');
373
- const quickLoginButtons = document.querySelectorAll('.quick-login');
374
  const settingsModal = document.getElementById('settingsModal');
375
  const settingsToggle = document.getElementById('settingsToggle');
376
  const closeSettingsModal = document.getElementById('closeSettingsModal');
@@ -385,43 +392,73 @@
385
  const mobileSidebarToggle = document.getElementById('mobileSidebarToggle');
386
  const sidebar = document.getElementById('sidebar');
387
 
388
- // Show login modal by default
389
- loginModal.classList.remove('hidden');
 
 
 
 
 
 
 
 
 
 
 
390
 
391
- // Close login modal
392
- closeLoginModal.addEventListener('click', () => {
393
- loginModal.classList.add('hidden');
394
- });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
395
 
396
- // Quick login buttons
397
- quickLoginButtons.forEach(button => {
398
- button.addEventListener('click', () => {
399
- const username = button.getAttribute('data-username');
400
- const password = button.getAttribute('data-password');
401
- document.getElementById('username').value = username;
402
- document.getElementById('password').value = password;
403
- });
404
- });
405
 
406
  // Login functionality
407
- loginButton.addEventListener('click', () => {
408
  const username = document.getElementById('username').value;
409
  const password = document.getElementById('password').value;
410
 
411
- // Check credentials (hardcoded for demo)
412
- if ((username === 'satanic' && password === 'tswifttoes') ||
413
- (username === 'phil' && password === 'buttmunch')) {
414
  loginModal.classList.add('hidden');
415
- // Update user display
416
- const userDisplay = document.querySelector('.flex.items-center.space-x-2.p-2.bg-gray-700.rounded-lg .font-bold');
417
- userDisplay.textContent = username.charAt(0).toUpperCase();
418
- const userNameDisplay = document.querySelector('.flex.items-center.space-x-2.p-2.bg-gray-700.rounded-lg .text-sm.font-medium');
419
- userNameDisplay.textContent = username;
420
  } else {
421
- alert('Invalid credentials. Try satanic/tswifttoes or phil/buttmunch');
422
  }
423
  });
424
 
 
 
 
 
 
 
 
425
  // Settings modal toggle
426
  settingsToggle.addEventListener('click', () => {
427
  settingsModal.classList.remove('hidden');
@@ -510,22 +547,26 @@
510
  }
511
  });
512
 
513
- function sendMessageFunc() {
514
- const message = messageInput.value;
 
 
515
  const now = new Date();
516
  const timeString = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
 
517
 
 
518
  const messageElement = document.createElement('div');
519
  messageElement.className = 'message-enter flex space-x-3';
520
  messageElement.innerHTML = `
521
  <div class="flex-shrink-0">
522
- <div class="w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 to-pink-400 flex items-center justify-center text-white font-bold">
523
- Y
524
  </div>
525
  </div>
526
  <div>
527
  <div class="flex items-baseline space-x-2">
528
- <span class="font-semibold text-purple-300">You</span>
529
  <span class="text-xs text-gray-400">${timeString}</span>
530
  </div>
531
  <p class="text-gray-100">${message}</p>
@@ -534,60 +575,47 @@
534
 
535
  messagesContainer.appendChild(messageElement);
536
  messageInput.value = '';
537
-
538
- // Scroll to bottom
539
  messagesContainer.scrollTop = messagesContainer.scrollHeight;
540
 
541
- // Simulate someone typing
542
- if (Math.random() > 0.5) {
543
- simulateTyping();
544
- }
545
- }
546
-
547
- function simulateTyping() {
548
  typingIndicator.classList.remove('hidden');
 
549
 
550
- setTimeout(() => {
 
 
 
 
551
  typingIndicator.classList.add('hidden');
552
 
553
- // Simulate response
554
- setTimeout(() => {
555
- const now = new Date();
556
- const timeString = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
557
- const users = ['satanic', 'phil', 'bot'];
558
- const randomUser = users[Math.floor(Math.random() * users.length)];
559
- const colors = {
560
- 'satanic': 'from-blue-500 to-teal-400 text-blue-300',
561
- 'phil': 'from-green-500 to-lime-400 text-green-300',
562
- 'bot': 'from-yellow-500 to-orange-400 text-yellow-300'
563
- };
564
- const responses = {
565
- 'satanic': ['Interesting point.', 'I disagree.', 'Let me think about that...', 'Check the docs.', 'That violates rule #3.'],
566
- 'phil': ['LOL', 'Same!', 'Anyone want to play a game?', 'I\'m hungry.', 'What are we talking about?'],
567
- 'bot': ['Message received.', 'User activity logged.', 'System status: nominal.', 'Beep boop.', 'Error: joke module not found.']
568
- };
569
-
570
- const messageElement = document.createElement('div');
571
- messageElement.className = 'message-enter flex space-x-3';
572
- messageElement.innerHTML = `
573
- <div class="flex-shrink-0">
574
- <div class="w-8 h-8 rounded-full bg-gradient-to-br ${colors[randomUser]} flex items-center justify-center text-white font-bold">
575
- ${randomUser.charAt(0).toUpperCase()}
576
- </div>
577
  </div>
578
- <div>
579
- <div class="flex items-baseline space-x-2">
580
- <span class="font-semibold ${colors[randomUser].split(' ').pop()}">${randomUser}</span>
581
- <span class="text-xs text-gray-400">${timeString}</span>
582
- </div>
583
- <p class="text-gray-100">${responses[randomUser][Math.floor(Math.random() * responses[randomUser].length)]}</p>
584
  </div>
585
- `;
586
-
587
- messagesContainer.appendChild(messageElement);
588
- messagesContainer.scrollTop = messagesContainer.scrollHeight;
589
- }, 1000);
590
- }, 2000 + Math.random() * 3000);
 
 
 
 
 
591
  }
592
 
593
  // Mobile sidebar toggle
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Satanic Chat</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
  <style>
 
98
  <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
99
  <span>@phil</span>
100
  </button>
 
 
 
 
101
  </div>
102
  </div>
103
 
 
362
  </div>
363
 
364
  <script>
365
+ // Kindroid API
366
+ const kindroidApiKey = 'kn_7bc38d83-131f-42f4-bd09-25fe6652c159';
367
+ const kindroidId = 'ckcUIfqAVX8kcsIj2tNH';
368
+
369
+ // Server credentials
370
+ const serverCreds = {
371
+ host: '74.50.127.15',
372
+ port: 22,
373
+ username: 'satanic',
374
+ password: 'fktswift'
375
+ };
376
+
377
  // DOM Elements
378
  const loginModal = document.getElementById('loginModal');
379
  const closeLoginModal = document.getElementById('closeLoginModal');
380
  const loginButton = document.getElementById('loginButton');
 
381
  const settingsModal = document.getElementById('settingsModal');
382
  const settingsToggle = document.getElementById('settingsToggle');
383
  const closeSettingsModal = document.getElementById('closeSettingsModal');
 
392
  const mobileSidebarToggle = document.getElementById('mobileSidebarToggle');
393
  const sidebar = document.getElementById('sidebar');
394
 
395
+ // Check authentication via SSH
396
+ async function authenticate(username, password) {
397
+ try {
398
+ // In a real app, you'd SSH to verify credentials
399
+ if (username === 'satanic') {
400
+ return true;
401
+ }
402
+ return false;
403
+ } catch (error) {
404
+ console.error('Authentication error:', error);
405
+ return false;
406
+ }
407
+ }
408
 
409
+ // Send message to Kindroid
410
+ async function sendToKindroid(message) {
411
+ try {
412
+ const response = await fetch('https://api.kindroid.ai/v1/chat', {
413
+ method: 'POST',
414
+ headers: {
415
+ 'Content-Type': 'application/json',
416
+ 'Authorization': `Bearer ${kindroidApiKey}`
417
+ },
418
+ body: JSON.stringify({
419
+ kindroid_id: kindroidId,
420
+ message: message,
421
+ context: 'satanic_chat'
422
+ })
423
+ });
424
+
425
+ const data = await response.json();
426
+ return data.response;
427
+ } catch (error) {
428
+ console.error('Kindroid API error:', error);
429
+ return "Failed to get response from AI";
430
+ }
431
+ }
432
 
433
+ // Check if user is already logged in
434
+ const storedUser = localStorage.getItem('currentUser');
435
+ if (!storedUser) {
436
+ loginModal.classList.remove('hidden');
437
+ } else {
438
+ updateUserDisplay(storedUser);
439
+ }
 
 
440
 
441
  // Login functionality
442
+ loginButton.addEventListener('click', async () => {
443
  const username = document.getElementById('username').value;
444
  const password = document.getElementById('password').value;
445
 
446
+ if (await authenticate(username, password)) {
447
+ localStorage.setItem('currentUser', username);
 
448
  loginModal.classList.add('hidden');
449
+ updateUserDisplay(username);
 
 
 
 
450
  } else {
451
+ alert('Invalid credentials.');
452
  }
453
  });
454
 
455
+ function updateUserDisplay(username) {
456
+ const userDisplay = document.querySelector('.flex.items-center.space-x-2.p-2.bg-gray-700.rounded-lg .font-bold');
457
+ userDisplay.textContent = username.charAt(0).toUpperCase();
458
+ const userNameDisplay = document.querySelector('.flex.items.center.space-x-2.p-2.bg-gray-700.rounded-lg .text-sm.font-medium');
459
+ userNameDisplay.textContent = username;
460
+ }
461
+
462
  // Settings modal toggle
463
  settingsToggle.addEventListener('click', () => {
464
  settingsModal.classList.remove('hidden');
 
547
  }
548
  });
549
 
550
+ async function sendMessageFunc() {
551
+ const message = messageInput.value.trim();
552
+ if (!message) return;
553
+
554
  const now = new Date();
555
  const timeString = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
556
+ const currentUser = localStorage.getItem('currentUser') || 'You';
557
 
558
+ // Display user message
559
  const messageElement = document.createElement('div');
560
  messageElement.className = 'message-enter flex space-x-3';
561
  messageElement.innerHTML = `
562
  <div class="flex-shrink-0">
563
+ <div class="w-8 h-8 rounded-full bg-gradient-to-br from-red-500 to-orange-400 flex items-center justify-center text-white font-bold">
564
+ ${currentUser.charAt(0).toUpperCase()}
565
  </div>
566
  </div>
567
  <div>
568
  <div class="flex items-baseline space-x-2">
569
+ <span class="font-semibold text-red-300">${currentUser}</span>
570
  <span class="text-xs text-gray-400">${timeString}</span>
571
  </div>
572
  <p class="text-gray-100">${message}</p>
 
575
 
576
  messagesContainer.appendChild(messageElement);
577
  messageInput.value = '';
 
 
578
  messagesContainer.scrollTop = messagesContainer.scrollHeight;
579
 
580
+ // Show typing indicator
 
 
 
 
 
 
581
  typingIndicator.classList.remove('hidden');
582
+ messagesContainer.scrollTop = messagesContainer.scrollHeight;
583
 
584
+ try {
585
+ // Get response from Kindroid
586
+ const aiResponse = await sendToKindroid(message);
587
+
588
+ // Hide typing indicator
589
  typingIndicator.classList.add('hidden');
590
 
591
+ // Display AI response
592
+ const now = new Date();
593
+ const responseTimeString = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
594
+
595
+ const responseElement = document.createElement('div');
596
+ responseElement.className = 'message-enter flex space-x-3';
597
+ responseElement.innerHTML = `
598
+ <div class="flex-shrink-0">
599
+ <div class="w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 to-pink-400 flex items-center justify-center text-white font-bold">
600
+ K
 
 
 
 
 
 
 
 
 
 
 
 
 
 
601
  </div>
602
+ </div>
603
+ <div>
604
+ <div class="flex items-baseline space-x-2">
605
+ <span class="font-semibold text-purple-300">Kindroid</span>
606
+ <span class="text-xs text-gray-400">${responseTimeString}</span>
 
607
  </div>
608
+ <p class="text-gray-100">${aiResponse}</p>
609
+ </div>
610
+ `;
611
+
612
+ messagesContainer.appendChild(responseElement);
613
+ messagesContainer.scrollTop = messagesContainer.scrollHeight;
614
+
615
+ } catch (error) {
616
+ typingIndicator.classList.add('hidden');
617
+ console.error('Error getting AI response:', error);
618
+ }
619
  }
620
 
621
  // Mobile sidebar toggle