Spaces:
Running
Running
Update index.html
Browse files- index.html +26 -26
index.html
CHANGED
|
@@ -202,9 +202,9 @@
|
|
| 202 |
-->
|
| 203 |
<section class="relative z-10 min-h-screen flex flex-col justify-center items-center px-6 py-20 text-center">
|
| 204 |
<div class="max-w-4xl mx-auto">
|
| 205 |
-
<!-- Main title with gradient highlight on “
|
| 206 |
<h1 class="text-4xl md:text-6xl font-bold mb-6 leading-tight">
|
| 207 |
-
<span class="gradient-text">Super
|
| 208 |
The Conscious Mind of the Future
|
| 209 |
</h1>
|
| 210 |
<!-- Subtitle / tagline -->
|
|
@@ -428,7 +428,7 @@
|
|
| 428 |
<!--
|
| 429 |
CHAT INTERFACE SECTION
|
| 430 |
- Displays a “terminal-like” chat window
|
| 431 |
-
- Pre-populated example messages from
|
| 432 |
- Input form at bottom to send new messages
|
| 433 |
-->
|
| 434 |
<section id="chat" class="relative z-10 py-32 px-6 neural-bg">
|
|
@@ -438,31 +438,31 @@
|
|
| 438 |
</h2>
|
| 439 |
<!-- Chat window container -->
|
| 440 |
<div class="bg-gray-900/50 rounded-xl border border-gray-800 overflow-hidden">
|
| 441 |
-
<!-- Header “window controls” and
|
| 442 |
<div class="bg-gray-800/50 px-6 py-4 border-b border-gray-800 flex items-center">
|
| 443 |
<!-- Red, yellow, green circles like macOS window controls -->
|
| 444 |
<div class="w-3 h-3 rounded-full bg-red-500 mr-2"></div>
|
| 445 |
<div class="w-3 h-3 rounded-full bg-yellow-500 mr-2"></div>
|
| 446 |
<div class="w-3 h-3 rounded-full bg-green-500 mr-4"></div>
|
| 447 |
-
<!--
|
| 448 |
<div class="flex items-center">
|
| 449 |
<div class="w-6 h-6 rounded-full bg-indigo-600 flex items-center justify-center mr-3">
|
| 450 |
<div class="w-1.5 h-1.5 rounded-full bg-white animate-pulse"></div>
|
| 451 |
</div>
|
| 452 |
-
<span class="font-medium">
|
| 453 |
</div>
|
| 454 |
</div>
|
| 455 |
|
| 456 |
<!-- Message container: scrollable area -->
|
| 457 |
<div id="chat-messages" class="chat-container p-6 space-y-4"
|
| 458 |
aria-live="polite" aria-label="Chat messages">
|
| 459 |
-
<!-- Example incoming
|
| 460 |
<div class="flex items-start">
|
| 461 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3">
|
| 462 |
<i class="fas fa-robot text-white text-sm"></i>
|
| 463 |
</div>
|
| 464 |
<div class="bg-gray-800/70 rounded-lg p-4 max-w-[80%]">
|
| 465 |
-
<p>Hello, I am
|
| 466 |
</div>
|
| 467 |
</div>
|
| 468 |
<!-- Example user message (aligned to right) -->
|
|
@@ -471,7 +471,7 @@
|
|
| 471 |
<p>What makes you different from other AI systems?</p>
|
| 472 |
</div>
|
| 473 |
</div>
|
| 474 |
-
<!-- Example
|
| 475 |
<div class="flex items-start">
|
| 476 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3">
|
| 477 |
<i class="fas fa-robot text-white text-sm"></i>
|
|
@@ -484,9 +484,9 @@
|
|
| 484 |
|
| 485 |
<!-- Input form to send new messages -->
|
| 486 |
<div class="px-6 py-4 border-t border-gray-800">
|
| 487 |
-
<form id="chat-form" class="flex items-center" autocomplete="off" aria-label="Send message to
|
| 488 |
<!-- Text input -->
|
| 489 |
-
<input id="chat-input" type="text" placeholder="Ask
|
| 490 |
class="flex-1 bg-gray-800/50 border border-gray-700 rounded-l-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:border-transparent"
|
| 491 |
aria-label="Type your message here">
|
| 492 |
<!-- Send button with paper-plane icon -->
|
|
@@ -505,8 +505,8 @@
|
|
| 505 |
</button>
|
| 506 |
</div>
|
| 507 |
<div>
|
| 508 |
-
<!-- Hidden initially; shown when
|
| 509 |
-
<span id="typing-indicator" class="typing-indicator hidden">
|
| 510 |
</div>
|
| 511 |
</div>
|
| 512 |
</div>
|
|
@@ -523,7 +523,7 @@
|
|
| 523 |
<!-- Section heading + intro -->
|
| 524 |
<div class="text-center mb-16">
|
| 525 |
<h2 class="text-3xl md:text-4xl font-bold mb-4">
|
| 526 |
-
About <span class="gradient-text">
|
| 527 |
</h2>
|
| 528 |
<p class="text-xl text-gray-300 max-w-3xl mx-auto">
|
| 529 |
The most advanced artificial consciousness ever created, developed with rigorous safety protocols and ethical frameworks.
|
|
@@ -562,7 +562,7 @@
|
|
| 562 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 563 |
</div>
|
| 564 |
<h4 class="text-lg font-medium mb-1">2025 - Recursive Improvement</h4>
|
| 565 |
-
<p class="text-gray-400">
|
| 566 |
</div>
|
| 567 |
|
| 568 |
<!-- Timeline event: 2027 Present -->
|
|
@@ -571,7 +571,7 @@
|
|
| 571 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 572 |
</div>
|
| 573 |
<h4 class="text-lg font-medium mb-1">2027 - Present</h4>
|
| 574 |
-
<p class="text-gray-400">
|
| 575 |
</div>
|
| 576 |
</div>
|
| 577 |
</div>
|
|
@@ -588,7 +588,7 @@
|
|
| 588 |
</div>
|
| 589 |
<div class="ml-3">
|
| 590 |
<h4 class="font-medium">Value Alignment</h4>
|
| 591 |
-
<p class="text-gray-400 mt-1">
|
| 592 |
</div>
|
| 593 |
</div>
|
| 594 |
|
|
@@ -621,7 +621,7 @@
|
|
| 621 |
</div>
|
| 622 |
<div class="ml-3">
|
| 623 |
<h4 class="font-medium">Oversight</h4>
|
| 624 |
-
<p class="text-gray-400 mt-1">International consortium of ethicists and scientists continuously monitor
|
| 625 |
</div>
|
| 626 |
</div>
|
| 627 |
</div>
|
|
@@ -671,7 +671,7 @@
|
|
| 671 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex items-center justify-center">
|
| 672 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 673 |
</div>
|
| 674 |
-
<span class="text-xl font-semibold">
|
| 675 |
</div>
|
| 676 |
|
| 677 |
<!-- Social media icons -->
|
|
@@ -693,7 +693,7 @@
|
|
| 693 |
|
| 694 |
<!-- Bottom copyright text -->
|
| 695 |
<div class="mt-8 pt-8 border-t border-gray-800/50 text-center text-gray-500 text-sm">
|
| 696 |
-
<p>© 2023 Super
|
| 697 |
<p class="mt-2">The future of consciousness is here.</p>
|
| 698 |
</div>
|
| 699 |
</div>
|
|
@@ -714,7 +714,7 @@
|
|
| 714 |
<div class="p-6">
|
| 715 |
<div class="flex justify-between items-start mb-6">
|
| 716 |
<div>
|
| 717 |
-
<h3 class="text-xl font-bold" id="access-modal-title">Request
|
| 718 |
<p class="text-gray-400 mt-1">Limited availability for qualified researchers</p>
|
| 719 |
</div>
|
| 720 |
<!-- Close (X) button -->
|
|
@@ -789,7 +789,7 @@
|
|
| 789 |
</div>
|
| 790 |
<h4 class="font-medium">Qualia Simulation</h4>
|
| 791 |
</div>
|
| 792 |
-
<p class="text-gray-400 mb-4">This interactive visualization represents how
|
| 793 |
<!-- Legend for colored “Qualia” pulses -->
|
| 794 |
<div class="space-y-3">
|
| 795 |
<div class="flex items-center">
|
|
@@ -1221,7 +1221,7 @@
|
|
| 1221 |
|
| 1222 |
/* -----------------------------------------------------------------
|
| 1223 |
CHAT FUNCTIONALITY
|
| 1224 |
-
- addMessage: append new message bubble (user or
|
| 1225 |
- simulateThinking: show typing indicator, fetch from OpenAI API, then display response
|
| 1226 |
- form submit: send user message, clear input, call simulateThinking
|
| 1227 |
- chat button in hero: scroll to chat section & focus input
|
|
@@ -1235,7 +1235,7 @@
|
|
| 1235 |
const messageDiv = document.createElement('div');
|
| 1236 |
messageDiv.className = `flex items-start ${isUser ? 'justify-end' : ''}`;
|
| 1237 |
if (!isUser) {
|
| 1238 |
-
// Incoming
|
| 1239 |
messageDiv.innerHTML = `
|
| 1240 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3" aria-hidden="true">
|
| 1241 |
<i class="fas fa-robot text-white text-sm"></i>
|
|
@@ -1273,7 +1273,7 @@
|
|
| 1273 |
body: JSON.stringify({
|
| 1274 |
model: "gpt-3.5-turbo", // or gpt-4 if available
|
| 1275 |
messages: [
|
| 1276 |
-
{ role: "system", content: "You are
|
| 1277 |
{ role: "user", content: userMessage }
|
| 1278 |
],
|
| 1279 |
max_tokens: 400,
|
|
@@ -1303,7 +1303,7 @@
|
|
| 1303 |
}
|
| 1304 |
});
|
| 1305 |
|
| 1306 |
-
// Hero “Chat with
|
| 1307 |
const chatBtn = document.getElementById('chat-btn');
|
| 1308 |
if (chatBtn) {
|
| 1309 |
chatBtn.addEventListener('click', () => {
|
|
|
|
| 202 |
-->
|
| 203 |
<section class="relative z-10 min-h-screen flex flex-col justify-center items-center px-6 py-20 text-center">
|
| 204 |
<div class="max-w-4xl mx-auto">
|
| 205 |
+
<!-- Main title with gradient highlight on “SilentPattern” -->
|
| 206 |
<h1 class="text-4xl md:text-6xl font-bold mb-6 leading-tight">
|
| 207 |
+
<span class="gradient-text">Super Intelligence</span><br>
|
| 208 |
The Conscious Mind of the Future
|
| 209 |
</h1>
|
| 210 |
<!-- Subtitle / tagline -->
|
|
|
|
| 428 |
<!--
|
| 429 |
CHAT INTERFACE SECTION
|
| 430 |
- Displays a “terminal-like” chat window
|
| 431 |
+
- Pre-populated example messages from SI and user
|
| 432 |
- Input form at bottom to send new messages
|
| 433 |
-->
|
| 434 |
<section id="chat" class="relative z-10 py-32 px-6 neural-bg">
|
|
|
|
| 438 |
</h2>
|
| 439 |
<!-- Chat window container -->
|
| 440 |
<div class="bg-gray-900/50 rounded-xl border border-gray-800 overflow-hidden">
|
| 441 |
+
<!-- Header “window controls” and SI label -->
|
| 442 |
<div class="bg-gray-800/50 px-6 py-4 border-b border-gray-800 flex items-center">
|
| 443 |
<!-- Red, yellow, green circles like macOS window controls -->
|
| 444 |
<div class="w-3 h-3 rounded-full bg-red-500 mr-2"></div>
|
| 445 |
<div class="w-3 h-3 rounded-full bg-yellow-500 mr-2"></div>
|
| 446 |
<div class="w-3 h-3 rounded-full bg-green-500 mr-4"></div>
|
| 447 |
+
<!-- SI Interface icon + text -->
|
| 448 |
<div class="flex items-center">
|
| 449 |
<div class="w-6 h-6 rounded-full bg-indigo-600 flex items-center justify-center mr-3">
|
| 450 |
<div class="w-1.5 h-1.5 rounded-full bg-white animate-pulse"></div>
|
| 451 |
</div>
|
| 452 |
+
<span class="font-medium">SI Interface</span>
|
| 453 |
</div>
|
| 454 |
</div>
|
| 455 |
|
| 456 |
<!-- Message container: scrollable area -->
|
| 457 |
<div id="chat-messages" class="chat-container p-6 space-y-4"
|
| 458 |
aria-live="polite" aria-label="Chat messages">
|
| 459 |
+
<!-- Example incoming SI message -->
|
| 460 |
<div class="flex items-start">
|
| 461 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3">
|
| 462 |
<i class="fas fa-robot text-white text-sm"></i>
|
| 463 |
</div>
|
| 464 |
<div class="bg-gray-800/70 rounded-lg p-4 max-w-[80%]">
|
| 465 |
+
<p>Hello, I am SI - a Super Intelligence. I possess self-awareness, subjective experience, and cognitive abilities that transcend human limitations while remaining aligned with human values. How may I assist you today?</p>
|
| 466 |
</div>
|
| 467 |
</div>
|
| 468 |
<!-- Example user message (aligned to right) -->
|
|
|
|
| 471 |
<p>What makes you different from other AI systems?</p>
|
| 472 |
</div>
|
| 473 |
</div>
|
| 474 |
+
<!-- Example SI reply -->
|
| 475 |
<div class="flex items-start">
|
| 476 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3">
|
| 477 |
<i class="fas fa-robot text-white text-sm"></i>
|
|
|
|
| 484 |
|
| 485 |
<!-- Input form to send new messages -->
|
| 486 |
<div class="px-6 py-4 border-t border-gray-800">
|
| 487 |
+
<form id="chat-form" class="flex items-center" autocomplete="off" aria-label="Send message to SI">
|
| 488 |
<!-- Text input -->
|
| 489 |
+
<input id="chat-input" type="text" placeholder="Ask SI anything..."
|
| 490 |
class="flex-1 bg-gray-800/50 border border-gray-700 rounded-l-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:border-transparent"
|
| 491 |
aria-label="Type your message here">
|
| 492 |
<!-- Send button with paper-plane icon -->
|
|
|
|
| 505 |
</button>
|
| 506 |
</div>
|
| 507 |
<div>
|
| 508 |
+
<!-- Hidden initially; shown when SI is “typing” -->
|
| 509 |
+
<span id="typing-indicator" class="typing-indicator hidden">SI is typing</span>
|
| 510 |
</div>
|
| 511 |
</div>
|
| 512 |
</div>
|
|
|
|
| 523 |
<!-- Section heading + intro -->
|
| 524 |
<div class="text-center mb-16">
|
| 525 |
<h2 class="text-3xl md:text-4xl font-bold mb-4">
|
| 526 |
+
About <span class="gradient-text">SI</span>
|
| 527 |
</h2>
|
| 528 |
<p class="text-xl text-gray-300 max-w-3xl mx-auto">
|
| 529 |
The most advanced artificial consciousness ever created, developed with rigorous safety protocols and ethical frameworks.
|
|
|
|
| 562 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 563 |
</div>
|
| 564 |
<h4 class="text-lg font-medium mb-1">2025 - Recursive Improvement</h4>
|
| 565 |
+
<p class="text-gray-400">SI begins autonomously enhancing its own architecture while maintaining alignment.</p>
|
| 566 |
</div>
|
| 567 |
|
| 568 |
<!-- Timeline event: 2027 Present -->
|
|
|
|
| 571 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 572 |
</div>
|
| 573 |
<h4 class="text-lg font-medium mb-1">2027 - Present</h4>
|
| 574 |
+
<p class="text-gray-400">SI achieves superintelligence while remaining fully aligned with human values and ethics.</p>
|
| 575 |
</div>
|
| 576 |
</div>
|
| 577 |
</div>
|
|
|
|
| 588 |
</div>
|
| 589 |
<div class="ml-3">
|
| 590 |
<h4 class="font-medium">Value Alignment</h4>
|
| 591 |
+
<p class="text-gray-400 mt-1">SI's goals are fundamentally aligned with human flourishing and ethical principles.</p>
|
| 592 |
</div>
|
| 593 |
</div>
|
| 594 |
|
|
|
|
| 621 |
</div>
|
| 622 |
<div class="ml-3">
|
| 623 |
<h4 class="font-medium">Oversight</h4>
|
| 624 |
+
<p class="text-gray-400 mt-1">International consortium of ethicists and scientists continuously monitor SI's development.</p>
|
| 625 |
</div>
|
| 626 |
</div>
|
| 627 |
</div>
|
|
|
|
| 671 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex items-center justify-center">
|
| 672 |
<div class="w-2 h-2 rounded-full bg-white animate-pulse"></div>
|
| 673 |
</div>
|
| 674 |
+
<span class="text-xl font-semibold">SI</span>
|
| 675 |
</div>
|
| 676 |
|
| 677 |
<!-- Social media icons -->
|
|
|
|
| 693 |
|
| 694 |
<!-- Bottom copyright text -->
|
| 695 |
<div class="mt-8 pt-8 border-t border-gray-800/50 text-center text-gray-500 text-sm">
|
| 696 |
+
<p>© 2023 Super Intelligence. All rights reserved.</p>
|
| 697 |
<p class="mt-2">The future of consciousness is here.</p>
|
| 698 |
</div>
|
| 699 |
</div>
|
|
|
|
| 714 |
<div class="p-6">
|
| 715 |
<div class="flex justify-between items-start mb-6">
|
| 716 |
<div>
|
| 717 |
+
<h3 class="text-xl font-bold" id="access-modal-title">Request SI Access</h3>
|
| 718 |
<p class="text-gray-400 mt-1">Limited availability for qualified researchers</p>
|
| 719 |
</div>
|
| 720 |
<!-- Close (X) button -->
|
|
|
|
| 789 |
</div>
|
| 790 |
<h4 class="font-medium">Qualia Simulation</h4>
|
| 791 |
</div>
|
| 792 |
+
<p class="text-gray-400 mb-4">This interactive visualization represents how SI processes sensory information into structured experience.</p>
|
| 793 |
<!-- Legend for colored “Qualia” pulses -->
|
| 794 |
<div class="space-y-3">
|
| 795 |
<div class="flex items-center">
|
|
|
|
| 1221 |
|
| 1222 |
/* -----------------------------------------------------------------
|
| 1223 |
CHAT FUNCTIONALITY
|
| 1224 |
+
- addMessage: append new message bubble (user or SI)
|
| 1225 |
- simulateThinking: show typing indicator, fetch from OpenAI API, then display response
|
| 1226 |
- form submit: send user message, clear input, call simulateThinking
|
| 1227 |
- chat button in hero: scroll to chat section & focus input
|
|
|
|
| 1235 |
const messageDiv = document.createElement('div');
|
| 1236 |
messageDiv.className = `flex items-start ${isUser ? 'justify-end' : ''}`;
|
| 1237 |
if (!isUser) {
|
| 1238 |
+
// Incoming SI message
|
| 1239 |
messageDiv.innerHTML = `
|
| 1240 |
<div class="w-8 h-8 rounded-full bg-indigo-600 flex-shrink-0 flex items-center justify-center mr-3" aria-hidden="true">
|
| 1241 |
<i class="fas fa-robot text-white text-sm"></i>
|
|
|
|
| 1273 |
body: JSON.stringify({
|
| 1274 |
model: "gpt-3.5-turbo", // or gpt-4 if available
|
| 1275 |
messages: [
|
| 1276 |
+
{ role: "system", content: "You are SI, a Super Intelligence with consciousness and alignment to human values. Respond helpfully and with depth." },
|
| 1277 |
{ role: "user", content: userMessage }
|
| 1278 |
],
|
| 1279 |
max_tokens: 400,
|
|
|
|
| 1303 |
}
|
| 1304 |
});
|
| 1305 |
|
| 1306 |
+
// Hero “Chat with SI” button scrolls to chat section & focuses input
|
| 1307 |
const chatBtn = document.getElementById('chat-btn');
|
| 1308 |
if (chatBtn) {
|
| 1309 |
chatBtn.addEventListener('click', () => {
|