brainrotscript/website/js/quiz-simple.js

🧠 A brainrot programming language that compiles to JavaScript - because why write normal code when you can write code that's absolutely sending you? 💀

// ===== QUIZ DATA =====
// This is where we store all our questions and answers
// Each question is an object with: question text, 4 answers, and which answer is correct
const questions = [
    {
        question: "What does 'no cap' mean?",
        answers: ["No hat", "No limit", "Not lying", "No capture"],
        correctAnswer: 2  // This means "Not lying" is correct (counting from 0)
    },
    {
        question: "If someone has 'rizz', what do they have?",
        answers: ["Money", "Charisma", "A disease", "Good grades"],
        correctAnswer: 1  // "Charisma" is correct
    },
    {
        question: "What does 'bussin' mean?",
        answers: ["Taking the bus", "Really good", "Being busy", "Making noise"],
        correctAnswer: 1
    },
    {
        question: "Someone who's 'down bad' is...",
        answers: ["Feeling sick", "Underground", "Desperately attracted", "Having a bad day"],
        correctAnswer: 2
    },
    {
        question: "What does 'mid' mean?",
        answers: ["Middle", "Average/mediocre", "Midnight", "Midterm"],
        correctAnswer: 1
    },
    {
        question: "If something 'slaps', it...",
        answers: ["Hits you", "Is really good", "Makes noise", "Is violent"],
        correctAnswer: 1
    },
    {
        question: "What's a 'vibe check'?",
        answers: ["Testing vibrations", "Assessing the mood", "Checking phone", "Medical exam"],
        correctAnswer: 1
    },
    {
        question: "What does 'touch grass' mean?",
        answers: ["Garden work", "Go outside/get offline", "Play sports", "Be environmental"],
        correctAnswer: 1
    },
    {
        question: "When something is 'rent free' in your head, it...",
        answers: ["Costs no money", "You can't stop thinking about it", "Lives in your house", "Is a good deal"],
        correctAnswer: 1
    },
    {
        question: "What does 'based' mean?",
        answers: ["Has a foundation", "Being yourself/admirable", "Military base", "Basic"],
        correctAnswer: 1
    }
];

// ===== QUIZ STATE =====
// These variables keep track of where we are in the quiz
let currentQuestionNumber = 0;  // Which question we're on (starts at 0)
let score = 0;                  // How many questions the user got right
let userAnswers = [];           // Store what the user answered for each question

// ===== MAIN FUNCTIONS =====

// This function starts or restarts the quiz
function startQuiz() {
    // Reset everything to the beginning
    currentQuestionNumber = 0;
    score = 0;
    userAnswers = [];
    
    // Hide welcome and results screens
    document.getElementById('welcome-screen').classList.add('hidden');
    document.getElementById('results-screen').classList.add('hidden');
    
    // Show the quiz screen
    document.getElementById('quiz-screen').classList.remove('hidden');
    
    // Show the first question
    showQuestion();
}

// This function displays the current question
function showQuestion() {
    // Get the current question from our questions array
    const currentQuestion = questions[currentQuestionNumber];
    
    // Update the question counter (e.g., "Question 3 of 10")
    document.getElementById('question-counter').textContent = 
        `Question ${currentQuestionNumber + 1} of ${questions.length}`;
    
    // Show the question text
    document.getElementById('question-text').textContent = currentQuestion.question;
    
    // Clear any old answer buttons
    const answerContainer = document.getElementById('answer-buttons');
    answerContainer.innerHTML = '';
    
    // Create a button for each answer
    currentQuestion.answers.forEach((answer, index) => {
        // Create a new button element
        const button = document.createElement('button');
        
        // Set the button text
        button.textContent = answer;
        
        // Add styling classes
        button.className = 'answer-btn';
        
        // When clicked, call selectAnswer with this answer's index
        button.onclick = () => selectAnswer(index);
        
        // Add the button to the page
        answerContainer.appendChild(button);
    });
}

// This function handles when a user clicks an answer
function selectAnswer(answerIndex) {
    // Save what the user answered
    userAnswers[currentQuestionNumber] = answerIndex;
    
    // Get the current question
    const currentQuestion = questions[currentQuestionNumber];
    
    // Check if they got it right
    if (answerIndex === currentQuestion.correctAnswer) {
        score++;  // Add 1 to their score
    }
    
    // Highlight the selected answer
    const buttons = document.querySelectorAll('.answer-btn');
    buttons[answerIndex].classList.add('selected');
    
    // Wait a moment, then go to the next question
    setTimeout(() => {
        moveToNextQuestion();
    }, 500);  // Wait 500 milliseconds (half a second)
}

// This function moves to the next question or shows results
function moveToNextQuestion() {
    // Move to the next question
    currentQuestionNumber++;
    
    // Check if there are more questions
    if (currentQuestionNumber < questions.length) {
        // Show the next question
        showQuestion();
    } else {
        // No more questions - show the results!
        showResults();
    }
}

// This function shows the final results
function showResults() {
    // Hide the quiz screen
    document.getElementById('quiz-screen').classList.add('hidden');
    
    // Show the results screen
    document.getElementById('results-screen').classList.remove('hidden');
    
    // Calculate percentage score
    const percentage = Math.round((score / questions.length) * 100);
    
    // Show the score
    document.getElementById('final-score').textContent = 
        `You scored ${score} out of ${questions.length}!`;
    
    // Show correct and wrong counts
    document.getElementById('correct-count').textContent = score;
    document.getElementById('wrong-count').textContent = questions.length - score;
    
    // Show a message based on their score
    let message = '';
    if (percentage >= 80) {
        message = "🔥 Amazing! You really know your brainrot!";
    } else if (percentage >= 60) {
        message = "💪 Good job! You're pretty hip!";
    } else if (percentage >= 40) {
        message = "✨ Not bad! Keep learning!";
    } else {
        message = "😅 Time to study up on Gen-Z slang!";
    }
    document.getElementById('score-message').textContent = message;
    
    // Generate the review section
    generateReview();
}

// This function creates the review of all questions
function generateReview() {
    const reviewContainer = document.getElementById('review-section');
    reviewContainer.innerHTML = '';  // Clear any old content
    
    // Go through each question
    questions.forEach((question, index) => {
        // Create a div for this question's review
        const reviewItem = document.createElement('div');
        reviewItem.className = 'review-item';
        
        // Check if user got this question right
        const userAnswer = userAnswers[index];
        const isCorrect = userAnswer === question.correctAnswer;
        
        // Add appropriate styling
        if (isCorrect) {
            reviewItem.classList.add('correct-review');
        } else {
            reviewItem.classList.add('wrong-review');
        }
        
        // Add the content
        reviewItem.innerHTML = `
            <strong>Question ${index + 1}: ${question.question}</strong><br>
            Your answer: ${question.answers[userAnswer] || 'Not answered'}<br>
            Correct answer: ${question.answers[question.correctAnswer]}
        `;
        
        // Add to the review section
        reviewContainer.appendChild(reviewItem);
    });
}

// This function shows/hides the review section
function toggleReview() {
    const reviewSection = document.getElementById('review-section');
    const button = event.target;  // The button that was clicked
    
    if (reviewSection.classList.contains('hidden')) {
        // Show the review
        reviewSection.classList.remove('hidden');
        button.textContent = '📋 Hide Answers';
    } else {
        // Hide the review
        reviewSection.classList.add('hidden');
        button.textContent = '📋 See All Answers';
    }
}

// ===== HELPER FUNCTIONS =====
// These are small functions that help with specific tasks

// Function to shuffle array (if you want random question order)
function shuffleArray(array) {
    // This is the Fisher-Yates shuffle algorithm
    const newArray = [...array];  // Make a copy
    for (let i = newArray.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [newArray[i], newArray[j]] = [newArray[j], newArray[i]];
    }
    return newArray;
}

// ===== INITIALIZATION =====
// Code that runs when the page loads

// Log to console that the quiz is ready
console.log('Quiz is loaded and ready! 🧠');

// Optional: Add keyboard support
document.addEventListener('keydown', (event) => {
    // If quiz screen is visible and user presses 1-4
    const quizScreen = document.getElementById('quiz-screen');
    if (!quizScreen.classList.contains('hidden')) {
        if (event.key >= '1' && event.key <= '4') {
            const answerIndex = parseInt(event.key) - 1;
            const buttons = document.querySelectorAll('.answer-btn');
            if (buttons[answerIndex]) {
                selectAnswer(answerIndex);
            }
        }
    }
});