37676-vm/wp-content/plugins/bro-quiz/bro-quiz.php

<?php
/**
 * Plugin Name: Bro Quiz
 * Description: Find out what kind of Bro you are!
 * Version: 1.0.0
 * Author: Real Bro
 */

if (!defined('ABSPATH')) exit;

add_shortcode('bro_quiz', 'bro_render_quiz');
function bro_render_quiz() {
    ob_start();
    ?>
    <div id="bro-quiz-container" style="background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(10px); border: 2px solid #FFBF00; padding: 30px; border-radius: 20px; color: #fff; max-width: 600px; margin: 20px auto; text-align: center;">
        <div id="quiz-intro">
            <h2 style="color: #FFBF00; text-transform: uppercase;">The Ultimate Bro Quiz</h2>
            <p>Determine your true beer destiny. Are you a Stout Sentinel or a Lager Legend?</p>
            <button onclick="startBroQuiz()" style="background: #FFBF00; color: #000; border: none; padding: 15px 30px; border-radius: 50px; font-weight: bold; cursor: pointer; text-transform: uppercase; margin-top: 20px;">Start Quiz</button>
        </div>
        <div id="quiz-content" style="display: none;">
            <h3 id="quiz-question" style="margin-bottom: 20px;"></h3>
            <div id="quiz-options" style="display: flex; flex-direction: column; gap: 10px;"></div>
        </div>
        <div id="quiz-result" style="display: none;">
            <h2 style="color: #FFBF00;">Your Result:</h2>
            <h1 id="result-title" style="font-size: 3rem; margin: 10px 0;"></h1>
            <p id="result-desc"></p>
            <div style="display: flex; gap: 10px; justify-content: center; margin-top: 20px;">
                <button onclick="location.reload()" style="background: transparent; color: #FFBF00; border: 2px solid #FFBF00; padding: 10px 20px; border-radius: 50px; cursor: pointer;">Take it again</button>
                <a href="/" style="background: #FFBF00; color: #000; border: none; padding: 10px 20px; border-radius: 50px; cursor: pointer; text-decoration: none; font-weight: bold; font-size: 14px; line-height: 20px;">Back to Home</a>
            </div>
        </div>
    </div>

    <script>
        const questions = [
            {
                q: "It's Friday night, 8 PM. Where are you?",
                a: [
                    { t: "At the bar with a cold lager.", s: "lager" },
                    { t: "Hosting a basement rager.", s: "party" },
                    { t: "Sipping an artisanal IPA.", s: "ipa" },
                    { t: "In the gym, getting those gains.", s: "protein" }
                ]
            },
            {
                q: "Favorite pizza topping?",
                a: [
                    { t: "Double Meat.", s: "protein" },
                    { t: "Whatever is left in the box.", s: "party" },
                    { t: "Plain Cheese, keep it classic.", s: "lager" },
                    { t: "Goat cheese and arugula.", s: "ipa" }
                ]
            },
            {
                q: "Your go-to music volume?",
                a: [
                    { t: "11. My neighbors should hear it.", s: "party" },
                    { t: "Moderate, enough for conversation.", s: "lager" },
                    { t: "I prefer podcasts about hops.", s: "ipa" },
                    { t: "Heavy metal for the PRs.", s: "protein" }
                ]
            }
        ];

        let currentQ = 0;
        let scores = { lager: 0, party: 0, ipa: 0, protein: 0 };

        function startBroQuiz() {
            document.getElementById('quiz-intro').style.display = 'none';
            document.getElementById('quiz-content').style.display = 'block';
            showQuestion();
        }

        function showQuestion() {
            const q = questions[currentQ];
            document.getElementById('quiz-question').innerText = q.q;
            const optionsDiv = document.getElementById('quiz-options');
            optionsDiv.innerHTML = '';
            q.a.forEach(opt => {
                const btn = document.createElement('button');
                btn.innerText = opt.t;
                btn.style.cssText = "background: rgba(255,191,0,0.1); color: #fff; border: 1px solid #FFBF00; padding: 12px; border-radius: 10px; cursor: pointer; transition: 0.3s; text-align: left;";
                btn.onmouseover = () => btn.style.background = "rgba(255,191,0,0.3)";
                btn.onmouseout = () => btn.style.background = "rgba(255,191,0,0.1)";
                btn.onclick = () => selectOption(opt.s);
                optionsDiv.appendChild(btn);
            });
        }

        function selectOption(s) {
            scores[s]++;
            currentQ++;
            if (currentQ < questions.length) {
                showQuestion();
            } else {
                showResult();
            }
        }

        function showResult() {
            document.getElementById('quiz-content').style.display = 'none';
            document.getElementById('quiz-result').style.display = 'block';
            
            let maxScore = 0;
            let result = 'lager';
            for (const [key, value] of Object.entries(scores)) {
                if (value > maxScore) {
                    maxScore = value;
                    result = key;
                }
            }

            const resultsMap = {
                lager: { t: "The Lager Legend", d: "You're a classic bro. Dependable, chill, and always down for a good time without the drama." },
                party: { t: "The Party Animal", d: "You don't just go to the party, you ARE the party. Keep those speakers loud and the beer flowing." },
                ipa: { t: "The IPA Intellectual", d: "You appreciate the finer notes of hops and life. A bit sophisticated, but still one of the boys." },
                protein: { t: "The Iron Bro", d: "Weights before dates. You're dedicated to the grind, but you know how to celebrate a PR properly." }
            };

            document.getElementById('result-title').innerText = resultsMap[result].t;
            document.getElementById('result-desc').innerText = resultsMap[result].d;
        }
    </script>
    <?php
    return ob_get_clean();
}