script.js

// Global variables
let currentAnswer

// Function to generate the API token
async function generateToken () {
    const url = 'https://opentdb.com/api_token.php?command=request';

    try {
        const response = await fetch(url);
        if (!response.ok) {
            throw new Error('HTTP error! status: ${response.status}');
        }
        const data = await response.json();

        // Extracting token
        const tokenlocation = data.token;

        console.log('Token:', tokenlocation);

        return tokenlocation;
    } catch (error) {
        console.error('Error fetching token:', error);
    }
}

// Handle API response codes
function responseCodes(responseCode) {
    console.log('Response Code:', responseCode)

    if (responseCode == 0) {
        console.log('Returned results successfully.')
    } else if (responseCode == 1) {
        console.log('Could not return results. The API doesnt have enough questions for your query. (Ex. Asking for 50 Questions in a Category that only has 20.)')
    } else if (responseCode == 2) {
        console.log('Contains an invalid parameter. Arguements passed in arent valid. (Ex. Amount = Five)')
    } else if (responseCode == 3) {
        console.log('Session Token does not exist.')
    } else if (responseCode == 4) {
        console.log('Session Token has returned all possible questions for the specified query. Resetting the Token is necessary.')
    } else if (responseCode == 5) {
        console.log('Too many requests have occurred. Each IP can only access the API once every 5 seconds.')
    }
}

var token = generateToken();

// Reset API Token
function resetToken() {
    token.then(async function tokenResetSubFunction(token) {
        document.getElementById("question").innerHTML = "Question:"
        document.getElementById("answer").innerHTML = "Answer:"
        document.getElementById("category").innerHTML = "Category:"

        const url = 'https://opentdb.com/api_token.php?command=reset&token=' + token;
        
        try {
            const response = await fetch(url);
            if (!response.ok) {
                throw new Error('HTTP error! status: ${response.status}');
            }
            const data = await response.json();

            // Extracting Result
            const resetResult = data.response_code;

            responseCodes(resetResult);

        } catch (error) {
            console.error('Error resetting token:', error);
        }
    });
}

let cooldownInterval = "null"

// Cooldown
function startCooldown(seconds) {
    const timer = document.getElementById("timer");
    let remaining = seconds;
    timer.textContent = `Cooldown: ${remaining}s`;

    // Clear any existing interval
    if (cooldownInterval) clearInterval(cooldownInterval);

    cooldownInterval = setInterval(() => {
        remaining--;
        if (remaining > 0) {
            timer.textContent = `Cooldown: ${remaining}s`;
        } else {
            timer.textContent = ""
            clearInterval(cooldownInterval);
        }
    }, 1000);
}

let isOnCooldown = false;

// QnA Retrieving
function retrieveQuestion() {
    token.then(async function retrieveSubFunction(token) {

        // Check if cooldown requirement is right
        if (isOnCooldown) {
            console.log('Please wait for cooldown to finish');
            const errorID = document.getElementById("error");

            errorID.style.display = "block";
        } else {
            const errorID = document.getElementById("error");
            errorID.style.display = "none";

            // Start Cooldown
            isOnCooldown = true;

            const url = 'https://opentdb.com/api.php?amount=1&type=multiple&token=' + token;

            try {
                const response = await fetch(url);
                if (!response) {
                    throw new Error('HTTP error! status: ${response.status}');
                }
                const data = await response.json();

                // Extracting question and answer
                const result = data.results[0];

                const question = result.question;
                const answer = result.correct_answer;
                const category = result.category;
                currentAnswer = answer;

                console.log(question);
                console.log(answer);
                console.log(category)

                const questionID = document.getElementById("question");
                const answerID = document.getElementById("answer");
                const categoryID = document.getElementById("category");

                questionID.innerHTML = `Question: ${question}`;
                answerID.innerHTML = `Answer: ???`;
                categoryID.innerHTML = `Category: ${category}`;

            } catch (error) {
                console.error('Error retrieving QnA:', error)
            }

            // Start 5 second cooldown
            startCooldown(5);
            setTimeout(() => {
                isOnCooldown = false;
                console.log('Cooldown finished. Fetching can now take place again.');
            }, 5000); // 5000ms/5s
        }
    });
}

function showAnswer() {
    const answerID = document.getElementById("answer");
    answerID.innerHTML = `Answer: ${currentAnswer}`;
}