mode = 'PLAY';
allData = {};
total = 0;
unseenTotal = 0;
probList = [];
nameList = [];
k = 12;
extra = 3;
artDict = {};
totalCorrect = 0;
totalSeen = 0;
wordsLeft = k + extra;
imagesLeft = k;
maxRounds = 20;
whichGuesser = 'counterspell'
un = false
online = false
firstPrint = false
flag = true
page = 1

document.location.search.split('&').forEach((pair) => {
    let v = pair.split('=');
    if (v[0] === '?whichguesser') {
        whichGuesser = v[1]
    } else if (v[0] === 'un') {
        un = v[1]
    } else if (v[0] === 'digital') {
        online = v[1]
    } else if (v[0] === 'original') {
        firstPrint = v[1]
    }
})

let firstFetch = fetch('jsons/' + whichGuesser + page + '.json');
fetchToResponse(firstFetch);

function putIntoMapAndFetch(data) {
    putIntoMap(data.data);
    if (data.has_more) {
        page += 1
        window.setTimeout(() => fetchToResponse(fetch('jsons/' + whichGuesser + page + '.json')));
    } else {
        for (const [key, value] of Object.entries(allData)) {
            nameList.push(key);
            probList.push(value.length + (probList.length === 0 ? 0 : probList[probList.length - 1]));
            unseenTotal = total;
        }
        window.console.log(allData)
        window.console.log(total)
        window.console.log(probList)
        window.console.log(nameList)
        if (whichGuesser === 'counterspell') {
            document.getElementById('guess-type').innerText = "Counterspell Guesser"
        } else if (whichGuesser === 'beast') {
            document.getElementById('guess-type').innerText = "Finding Fantastic Beasts"
        } else if (whichGuesser === 'terror') {
            document.getElementById('guess-type').innerText = "I'm a Terror-able Guesser"
        } else if (whichGuesser === 'wrath') {
            document.getElementById('guess-type').innerText = "I'll Clean Sweep"
        } else if (whichGuesser === 'burn') {
            document.getElementById('guess-type').innerText = "Match With Hot Singles"
        }
        setUpNewGame();
    }
}

function getKSamples() {
    let usedCounters = new Set();
    let currentTotal = unseenTotal;
    let samples = {}
    let i = 0
    while (i < k) {
        let rand = Math.floor(Math.random() * currentTotal);
        let count = 0;
        for (const [key, value] of Object.entries(allData)) {
            if (usedCounters.has(key)) {
                continue
            } else if (count >= rand) {
                usedCounters.add(key);
                currentTotal -= value.length
                unseenTotal--
                let randIndex = Math.floor(Math.random() * value.length);
                let arts = allData[key].splice(randIndex, 1);
                samples[arts[0].artImg] = [key, arts[0].normalImg];
                i++
                break;
            } else {
                count += value.length;
            }
        }
    }
    for (const key of usedCounters) {
        if (allData[key].length === 0) {
            delete allData[key];
        }

    }
    let count = 0;
    while (count < extra) {
        let rand = Math.floor(Math.random() * total);
        for (let j = 0; j < nameList.length; j++) {
            if (j >= rand) {
                if (usedCounters.has(nameList[j])) {
                    break;
                }
                usedCounters.add(nameList[j]);
                count += 1;
                break;
            }
        }
    }
    return [samples, usedCounters];
}

function fetchToResponse(fetch) {
    return fetch.then(response => response.json())
        .then(json => {
            putIntoMapAndFetch(json);
        });
}

function determineIfSkip(card) {
    if (!un) {
        if (card.set_type === "funny") {
            return true
        }
    }
    if (!online) {
        if (card.digital) {
            return true
        }
    }
    if (firstPrint) {
        if (card.reprint === true || (card.frame_effects && (card.frame_effects.includes("showcase")))) {
            return true
        }
    }
    // reskinned card names show in art crop
    if (card.flavor_name) {
        return true
    }
    // don't include racist cards
    return card.content_warning
}

function putIntoMap(data) {
    for (let i = 0; i < data.length; i++) {
        let card = data[i];
        if (determineIfSkip(card)) {
            continue
        }
        let name = card.name;
        // remove slashes from adventure cards
        if (card.card_faces) {
            name = card.card_faces[0].name
        }
        let normalImg = '';
        if (card.image_uris.normal) {
            normalImg = card.image_uris.normal;
        } else if (card.image_uris.large) {
            normalImg = card.image_uris.large;
        } else if (card.image_uris.small) {
            normalImg = card.image_uris.small;
        } else {
            continue
        }
        let artImg = '';
        if (card.image_uris.art_crop) {
            artImg = card.image_uris.art_crop;
        } else {
            continue
        }
        total += 1
        if (!allData[name]) {
            allData[name] = [{artImg: artImg, normalImg: normalImg}];
        } else {
            allData[name].push({artImg: artImg, normalImg: normalImg});
        }
    }
}

function shuffleArray(array) {
    for (let i = array.length - 1; i > 0; i--) {
        let j = Math.floor(Math.random() * (i + 1));
        let temp = array[i];
        array[i] = array[j];
        array[j] = temp;
    }
}

function setUpNewGame() {
    wordsLeft = k + extra;
    imagesLeft = k;
    let currentRound = totalSeen / k
    if (currentRound + 1 === maxRounds) {
        document.getElementById('round-number').innerText = "Final Round"
    } else {
        document.getElementById('round-number').innerText = "Round " + (1 + currentRound)
    }

    setWordsLeft()
    // select new cards
    let sampledData = getKSamples();
    artDict = sampledData[0];
    let randomImages = Object.keys(artDict);
    shuffleArray(randomImages);
    let namesList = Array.from(sampledData[1]).sort();
    // fill in the new cards and names
    for (let cardIndex = 1; cardIndex <= k; cardIndex++) {
        let currCard = document.getElementById('card-' + cardIndex);
        currCard.classList.remove('incorrect');
        currCard.dataset.name = '';
        currCard.dataset.url = randomImages[cardIndex - 1];
        currCard.style.backgroundImage = "url('" + currCard.dataset.url + "')"

    }
    const nameBank = document.querySelector('.names-bank');
    for (nameIndex = 1; nameIndex <= k + extra; nameIndex++) {
        currName = document.getElementById('name-' + nameIndex);
        // window.console.log(currName)
        currName.innerText = namesList[nameIndex - 1];
        nameBank.appendChild(currName);
    }
}

function checkAnswers() {
    let score = k;
    // show the correct full cards
    for (cardIndex = 1; cardIndex <= k; cardIndex++) {
        currCard = document.getElementById('card-' + cardIndex);
        let incorrect = true;
        if (currCard.dataset.name) {
            let guess = document.getElementById(currCard.dataset.name).innerText;
            // window.console.log(artDict[currCard.dataset.url][0], guess);
            incorrect = (artDict[currCard.dataset.url][0] !== guess);
            // decide if their guess was correct
        }
        if (incorrect) currCard.classList.add('incorrect')
        // tally some kind of score
        if (incorrect) score--;
        // show the correct card
        currCard.style.backgroundImage = "url('" + artDict[currCard.dataset.url][1] + "')"
    }
    totalSeen += k;
    totalCorrect += score;
    document.getElementById('score-amount').innerText = score + '/' + k;
    document.getElementById('score-percent').innerText = Math.round(totalCorrect * 100 / totalSeen);
    document.getElementById('score-amount-total').innerText = totalCorrect + '/' + totalSeen;
}

function toggleMode() {

    event.preventDefault()
    if (mode === 'PLAY') {
        mode = 'ANSWER';
        document.querySelector('.play-page').classList.add('answer-page');
        window.console.log(totalSeen)
        if (totalSeen / k === maxRounds - 1) {
            document.getElementById('submit').style.display = "none";
        } else {
            document.getElementById('submit').value = 'Next Round';
        }
        checkAnswers();
    } else {
        mode = 'PLAY';
        document.querySelector('.play-page').classList.remove('answer-page');
        document.getElementById('submit').value = 'Submit';
        setUpNewGame();
    }
}

function allowDrop(ev, id) {
    ev.preventDefault();
}

function drag(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
    let nameEl = document.querySelector('.selected');
    if (nameEl) nameEl.classList.remove('selected')
}

function drop(ev, id) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    dropOnCard(id, data);
}

function returnDrop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    returnToNameBank(data)
}

function returnToNameBank(name) {
    document.querySelector('.names-bank').appendChild(document.getElementById(name));
    let prevContainer = document.querySelector('[data-name=' + name + ']');
    if (prevContainer) {
        prevContainer.dataset.name = '';
        wordsLeft += 1
        imagesLeft += 1
        setWordsLeft()
    }
}

function selectName(ev) {
    if (ev.target.parentNode.classList.contains('names-bank')) {
        let nameEl = document.querySelector('.selected');
        if (nameEl) nameEl.classList.remove('selected');
        ev.target.classList.add('selected');
    } else {
        returnToNameBank(ev.target.id)
    }
}

function dropSelected(ev, id) {
    ev.preventDefault();
    let nameEl = document.querySelector('.selected');
    window.console.log('drop selected', nameEl)
    if (!nameEl) return;
    nameEl.classList.remove('selected')
    dropOnCard(id, nameEl.id);
}

function dropOnCard(id, data) {
    let target = document.getElementById('card-' + id);
    target.appendChild(document.getElementById(data));
    // if this already has a name, remove that name
    if (target.dataset.name) {
        returnToNameBank(target.dataset.name)
    }
    // remove name data from a previous card if there is one
    let prevContainer = document.querySelector('[data-name=' + data + ']');
    if (prevContainer) {
        prevContainer.dataset.name = '';
    } else {
        wordsLeft -= 1
        imagesLeft -= 1
        setWordsLeft()
    }
    target.dataset.name = data;
}

function setWordsLeft() {
    document.getElementById('words-left').innerText = "Unused Card Names: " + wordsLeft + "/Images: " + imagesLeft
}