HelloQuiz with Google AI

Adds Google Search and AI buttons to HelloQuiz.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         HelloQuiz with Google AI
// @namespace    http://tampermonkey.net/
// @version      1.4
// @match        https://helloquiz.app/quiz/*
// @description  Adds Google Search and AI buttons to HelloQuiz.
// @grant        none
// @license MIT
// ==/UserScript==

(function() {
    'use strict';

    const userLang = navigator.language || navigator.userLanguage;
    const isChinese = userLang.startsWith('zh');
    const QUERY_PREFIX = isChinese ? "介绍" : "Tell me about ";

    const style = document.createElement('style');
    style.textContent = `
        #custom-google-btn {
            background: var(--bg);
            cursor: pointer;
            color: var(--text);
            border-style: solid;
            border-width: 1px;
            border-color: var(--text);
            border-radius: 10px;
            padding: 5px;
            margin: 0 5px;
            font-size: .7em !important;
            width: calc(20% - 10px);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            transition: all .2s ease-in-out;
            box-sizing: border-box;
            vertical-align: middle;
        }
        #custom-google-btn:hover {
            background: var(--hl);
            color: var(--bg);
            border-color: var(--hl);
        }
        #custom-google-btn svg {
            width: 1.2em;
            height: 1.2em;
        }
        .generic-quiz-module__m31QtG__controlButtonsMap button {
            width: calc(20% - 10px) !important;
        }
    `;
    document.head.appendChild(style);

    const btn = document.createElement('button');
    btn.id = 'custom-google-btn';
    btn.title = 'p';
    btn.innerHTML = `
        <svg viewBox="0 0 24 24">
            <path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"/>
            <path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/>
            <path fill="#FBBC05" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l3.66-2.84z"/>
            <path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"/>
        </svg>
    `;

    btn.addEventListener('click', (e) => {
        e.preventDefault();
        e.stopPropagation();
        const target = document.querySelector('.quiz-module__HPadfW__content h2');
        if (target) {
            const text = target.innerText.trim();
            window.open(`https://www.google.com/search?q=${encodeURIComponent(QUERY_PREFIX + text)}`, '_blank');
        }
    });

    const observer = new MutationObserver(() => {
        const container = document.querySelector('.generic-quiz-module__m31QtG__controlButtonsMap');
        if (container && !document.getElementById('custom-google-btn')) {
            container.appendChild(btn);
        }
    });

    observer.observe(document.body, { childList: true, subtree: true });
})();