Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Hacker Terminal: The Idiot Test</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @keyframes blink { | |
| 0%, 100% { opacity: 1; } | |
| 50% { opacity: 0; } | |
| } | |
| .blink { | |
| animation: blink 1s step-end infinite; | |
| } | |
| .typewriter { | |
| overflow: hidden; | |
| white-space: nowrap; | |
| margin: 0 auto; | |
| letter-spacing: 1px; | |
| animation: typing 3.5s steps(40, end); | |
| } | |
| @keyframes typing { | |
| from { width: 0 } | |
| to { width: 100% } | |
| } | |
| .scanline { | |
| position: absolute; | |
| width: 100%; | |
| height: 100px; | |
| background: linear-gradient( | |
| 0deg, | |
| rgba(0, 255, 0, 0) 0%, | |
| rgba(0, 255, 51, 0.1) 50%, | |
| rgba(0, 255, 0, 0) 100% | |
| ); | |
| animation: scan 8s linear infinite; | |
| pointer-events: none; | |
| } | |
| @keyframes scan { | |
| 0% { | |
| top: -100px; | |
| } | |
| 100% { | |
| top: 100%; | |
| } | |
| } | |
| .glitch { | |
| position: relative; | |
| } | |
| .glitch::before, .glitch::after { | |
| content: attr(data-text); | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| } | |
| .glitch::before { | |
| color: #0ff; | |
| z-index: -1; | |
| animation: glitch-effect 3s infinite; | |
| } | |
| .glitch::after { | |
| color: #f0f; | |
| z-index: -2; | |
| animation: glitch-effect 2s infinite reverse; | |
| } | |
| @keyframes glitch-effect { | |
| 0% { transform: translate(0); } | |
| 20% { transform: translate(-2px, 2px); } | |
| 40% { transform: translate(-2px, -2px); } | |
| 60% { transform: translate(2px, 2px); } | |
| 80% { transform: translate(2px, -2px); } | |
| 100% { transform: translate(0); } | |
| } | |
| .console-text { | |
| font-family: 'Courier New', monospace; | |
| text-shadow: 0 0 5px rgba(0, 255, 0, 0.7); | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-black text-green-500 min-h-screen" onload="startTerminal()"> | |
| <div class="scanline"></div> | |
| <div class="container mx-auto px-4 py-8 max-w-4xl"> | |
| <div class="border-2 border-green-500 rounded-lg p-4 bg-black bg-opacity-80 shadow-lg shadow-green-500/20"> | |
| <!-- Terminal Header --> | |
| <div class="flex items-center mb-4 border-b border-green-800 pb-2"> | |
| <div class="flex space-x-1 mr-4"> | |
| <div class="w-3 h-3 rounded-full bg-red-500"></div> | |
| <div class="w-3 h-3 rounded-full bg-yellow-500"></div> | |
| <div class="w-3 h-3 rounded-full bg-green-500"></div> | |
| </div> | |
| <div class="flex-1 text-center"> | |
| <h1 class="glitch font-bold text-xl console-text" data-text="IDIOT_TEST.EXE">IDIOT_TEST.EXE</h1> | |
| </div> | |
| <div class="text-xs opacity-70"> | |
| <span id="time"></span> | |
| </div> | |
| </div> | |
| <!-- Terminal Content --> | |
| <div id="terminal" class="console-text overflow-y-auto max-h-96 mb-4 text-sm leading-relaxed"> | |
| <!-- Content will be dynamically generated by JavaScript --> | |
| </div> | |
| <!-- Input Area --> | |
| <div class="flex items-center border-t border-green-800 pt-3"> | |
| <span class="mr-2">><span class="blink">_</span></span> | |
| <input type="text" id="commandInput" class="flex-1 bg-black text-green-500 outline-none console-text px-2" | |
| autocomplete="off" spellcheck="false" onkeypress="handleCommand(event)"> | |
| <button onclick="submitCommand()" class="ml-2 bg-green-900 hover:bg-green-800 text-green-300 px-3 py-1 rounded"> | |
| <i class="fas fa-arrow-right"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <div class="mt-4 text-xs text-green-700 text-center"> | |
| <p>WARNING: This system is protected. Unauthorized access is prohibited.</p> | |
| </div> | |
| </div> | |
| <script> | |
| // Questions database | |
| const questions = [ | |
| "What color is a red apple? (red/blue/green/yellow)", | |
| "If you have 2 apples and eat 1, how many apples do you have left?", | |
| "Which is heavier: a pound of feathers or a pound of bricks?", | |
| "Does a dog meow? (yes/no)", | |
| "How many legs does a typical chair have?", | |
| "What do you call the white part of an egg?", | |
| "Is the sky below the ground? (yes/no)", | |
| "What is 1+1? (be careful!)", | |
| "Which month comes after April?", | |
| "Do fish live in water? (yes/no)", | |
| "How many sides does a triangle have?", | |
| "What is the opposite of 'up'?", | |
| "Is fire hot or cold?", | |
| "What sound does a cow make?", | |
| "What do you wear on your feet?", | |
| "How many hours are in a day?", | |
| "What do you call the person who drives a bus?", | |
| "Which is bigger: an elephant or a mouse?", | |
| "What is the name of the planet we live on?", | |
| "Do plants need sunlight to grow? (yes/no)" | |
| ]; | |
| // Answers database | |
| const answers = [ | |
| "red", "1", "they weigh the same", "no", "4", "egg white", "no", "2", "May", "yes", | |
| "3", "down", "hot", "moo", "shoes", "24", "bus driver", "elephant", "Earth", "yes" | |
| ]; | |
| let currentQuestion = {}; | |
| let score = 0; | |
| let questionsAnswered = 0; | |
| let username = ""; | |
| let terminalState = "initial"; // initial, asking_name, test_in_progress, test_complete | |
| function updateClock() { | |
| const now = new Date(); | |
| document.getElementById('time').textContent = now.toLocaleTimeString(); | |
| } | |
| setInterval(updateClock, 1000); | |
| updateClock(); | |
| function startTerminal() { | |
| const terminal = document.getElementById('terminal'); | |
| terminal.innerHTML = ` | |
| <div class="typewriter mb-4"> | |
| > INITIALIZING SYSTEM...<br> | |
| > LOADING IDIOT TEST PROTOCOL...<br> | |
| > CONNECTING TO MATRIX...<br> | |
| > SYSTEM READY<br><br> | |
| </div> | |
| <div class="mb-2"> | |
| <span class="text-yellow-400">WELCOME TO THE ULTIMATE IDIOT TEST</span><br> | |
| This test will determine your intellectual capacity.<br> | |
| Answer carefully - your IQ rating depends on it. | |
| </div> | |
| <div class="mt-4 text-green-300"> | |
| Type <span class="text-yellow-400">'start'</span> to begin the test. | |
| </div> | |
| `; | |
| terminal.scrollTop = terminal.scrollHeight; | |
| } | |
| function handleCommand(e) { | |
| if (e.key === 'Enter') { | |
| submitCommand(); | |
| } | |
| } | |
| function submitCommand() { | |
| const input = document.getElementById('commandInput'); | |
| const command = input.value.trim(); | |
| input.value = ''; | |
| // Add command to terminal | |
| addToTerminal(`> ${command}`); | |
| // Process command | |
| switch(terminalState) { | |
| case "initial": | |
| if (command.toLowerCase() === 'start') { | |
| askForUsername(); | |
| } else if (command.toLowerCase() === 'help') { | |
| showHelp(); | |
| } else { | |
| addToTerminal('<span class="text-red-400">Invalid command. Type \'start\' to begin or \'help\' for assistance.</span>'); | |
| } | |
| break; | |
| case "asking_name": | |
| if (command.length > 0) { | |
| username = command; | |
| startTest(); | |
| } else { | |
| addToTerminal('<span class="text-red-400">Please enter a valid name.</span>'); | |
| } | |
| break; | |
| case "test_in_progress": | |
| processAnswer(command); | |
| break; | |
| case "test_complete": | |
| if (command.toLowerCase() === 'restart') { | |
| resetTest(); | |
| } else if (command.toLowerCase() === 'exit') { | |
| addToTerminal('> TERMINATING SESSION...'); | |
| setTimeout(() => { | |
| document.getElementById('terminal').innerHTML = '<div class="text-center py-4">TERMINAL SESSION ENDED</div>'; | |
| }, 1000); | |
| } else { | |
| addToTerminal('<span class="text-red-400">Type \'restart\' to take the test again or \'exit\' to quit.</span>'); | |
| } | |
| break; | |
| } | |
| } | |
| function addToTerminal(text) { | |
| const terminal = document.getElementById('terminal'); | |
| const newLine = document.createElement('div'); | |
| newLine.innerHTML = text; | |
| terminal.appendChild(newLine); | |
| terminal.scrollTop = terminal.scrollHeight; | |
| } | |
| function askForUsername() { | |
| terminalState = "asking_name"; | |
| addToTerminal('<br><span class="text-yellow-400">Please enter your name to begin the test:</span>'); | |
| } | |
| function showHelp() { | |
| addToTerminal(` | |
| <br><span class="text-yellow-400">HELP MENU:</span><br> | |
| <span class="text-green-300">Commands available:</span><br> | |
| - start: Begin the idiot test<br> | |
| - help: Show this help menu<br><br> | |
| <span class="text-green-300">Test instructions:</span><br> | |
| - Answer each question when prompted<br> | |
| - Your score will be calculated at the end<br> | |
| - Good luck... you'll need it | |
| `); | |
| } | |
| function startTest() { | |
| terminalState = "test_in_progress"; | |
| addToTerminal(`<br><span class="text-green-300">Welcome, ${username}.</span>`); | |
| addToTerminal('<span class="text-yellow-400">Starting test... prepare yourself.</span><br>'); | |
| askRandomQuestion(); | |
| } | |
| function askRandomQuestion() { | |
| const randomIndex = Math.floor(Math.random() * questions.length); | |
| currentQuestion = { | |
| index: randomIndex, | |
| text: questions[randomIndex] | |
| }; | |
| // Typewriter effect for question | |
| addToTerminal('<br>'); | |
| const questionLine = document.createElement('div'); | |
| questionLine.innerHTML = `<span class="text-cyan-300">${currentQuestion.text}</span>`; | |
| document.getElementById('terminal').appendChild(questionLine); | |
| terminal.scrollTop = terminal.scrollHeight; | |
| } | |
| function processAnswer(answer) { | |
| const correctAnswer = answers[currentQuestion.index].toString().toLowerCase(); | |
| const userAnswer = answer.toString().toLowerCase(); | |
| if (userAnswer === correctAnswer) { | |
| score++; | |
| addToTerminal('<span class="text-green-400">✓ Correct answer. You may not be a complete idiot.</span>'); | |
| } else { | |
| addToTerminal(`<span class="text-red-400">✗ Incorrect. The right answer was: ${correctAnswer}</span>`); | |
| } | |
| questionsAnswered++; | |
| // Remove asked question from pool | |
| questions.splice(currentQuestion.index, 1); | |
| answers.splice(currentQuestion.index, 1); | |
| if (questionsAnswered < 5 && questions.length > 0) { | |
| setTimeout(() => askRandomQuestion(), 1000); | |
| } else { | |
| finishTest(); | |
| } | |
| } | |
| function finishTest() { | |
| terminalState = "test_complete"; | |
| const percentage = Math.floor((score / questionsAnswered) * 100); | |
| let rating, ratingColor; | |
| if (percentage === 100) { | |
| rating = "GENIUS"; | |
| ratingColor = "text-blue-400"; | |
| } else if (percentage >= 80) { | |
| rating = "SMART"; | |
| ratingColor = "text-green-400"; | |
| } else if (percentage >= 50) { | |
| rating = "AVERAGE"; | |
| ratingColor = "text-yellow-400"; | |
| } else if (percentage >= 20) { | |
| rating = "BELOW AVERAGE"; | |
| ratingColor = "text-orange-400"; | |
| } else { | |
| rating = "IDIOT"; | |
| ratingColor = "text-red-400"; | |
| } | |
| addToTerminal(` | |
| <br><span class="text-yellow-400">TEST COMPLETE</span><br> | |
| <span class="text-green-300">Final score for ${username}:</span><br> | |
| - Correct answers: <span class="text-green-400">${score} out of ${questionsAnswered}</span><br> | |
| - Success rate: <span class="text-green-400">${percentage}%</span><br> | |
| - IQ rating: <span class="${ratingColor} font-bold">${rating}</span><br><br> | |
| <span class="text-yellow-400">Type 'restart' to try again or 'exit' to quit.</span> | |
| `); | |
| } | |
| function resetTest() { | |
| // Reset variables | |
| score = 0; | |
| questionsAnswered = 0; | |
| username = ""; | |
| // Reset questions (since we removed them during testing) | |
| questions = [ | |
| "What color is a red apple? (red/blue/green/yellow)", | |
| "If you have 2 apples and eat 1, how many apples do you have left?", | |
| "Which is heavier: a pound of feathers or a pound of bricks?", | |
| "Does a dog meow? (yes/no)", | |
| "How many legs does a typical chair have?", | |
| "What do you call the white part of an egg?", | |
| "Is the sky below the ground? (yes/no)", | |
| "What is 1+1? (be careful!)", | |
| "Which month comes after April?", | |
| "Do fish live in water? (yes/no)", | |
| "How many sides does a triangle have?", | |
| "What is the opposite of 'up'?", | |
| "Is fire hot or cold?", | |
| "What sound does a cow make?", | |
| "What do you wear on your feet?", | |
| "How many hours are in a day?", | |
| "What do you call the person who drives a bus?", | |
| "Which is bigger: an elephant or a mouse?", | |
| "What is the name of the planet we live on?", | |
| "Do plants need sunlight to grow? (yes/no)" | |
| ]; | |
| answers = [ | |
| "red", "1", "they weigh the same", "no", "4", "egg white", "no", "2", "May", "yes", | |
| "3", "down", "hot", "moo", "shoes", "24", "bus driver", "elephant", "Earth", "yes" | |
| ]; | |
| terminalState = "initial"; | |
| document.getElementById('terminal').innerHTML = ''; | |
| startTerminal(); | |
| } | |
| </script> | |
| <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=LULDev/idiot-test-web" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |