function plusDivs(n) {
    showDivs(slideIndex += n);
}

function showDivs(n) {
    var i;
    var x = document.getElementsByClassName("slide");
    if (n > x.length) {slideIndex = 1}
    if (n < 1) {slideIndex = x.length}
    for (i = 0; i < x.length; i++) {
        x[i].style.display = "none";  
    }
    if (document.getElementById("previewProduct").classList.value.includes("visibilityVisible")) {
        x[slideIndex-1].style.display = "block";
    }
}

function getGumroadData(VarIDD) {
    return new Promise(function (resolve) {
        const xmlhttp = new XMLHttpRequest();
        xmlhttp.onload = function () {
            resolve(xmlhttp.response)
        }
        xmlhttp.open("POST", "/getGumroadData.php");
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send('id=' + VarIDD);
    });
}

async function setProduct(varID) {
    try {
    var remoteCode = await getGumroadData(varID);
    data = JSON.parse(remoteCode);

    data.product.covers.forEach(element => {
        if (element.type == "image") {
            document.getElementById("productImageContainer").innerHTML += "<img class=\"slide\" src=\"" + element.url + "\" style=\"display:none;\">";
        } else if (element.type == "video") {
            document.getElementById("productImageContainer").innerHTML += "<video class=\"slide\" src=\"" + element.url + "\" controls=\"show\" style=\"display:none;\">";
        }
    });

    if (data.product.summary != null) {
        document.getElementById("containsSection").innerHTML += "<a class=\"contentSum\">" + data.product.summary + "<br></a>";
    }

    try {
        data.product.attributes.forEach(element => {
            if (element.name != null) {
                document.getElementById("containsSection").innerHTML += "<a class=\"contentTribute\"><g style=\"font-weight: 100;\">" + element.name + "</g>" + element.value + "</a>";
            } else {
                document.getElementById("containsSection").innerHTML += "<a class=\"contentTribute\"><g style=\"font-weight: 100;\"> </g>" + element.value + "</a>";
            }
        });
    } catch (e) {
        document.getElementById("containsSection").innerHTML += "<a class=\"contentTribute\"><g style=\"font-weight: 100;\">No Content Tags</g></a>";
    }

    document.getElementById("productDescription").innerHTML = data.product.description_html + "<br><br>";
    document.getElementById("creatorImg").src = data.product.seller.avatar_url;
    document.getElementById("gotoproduct").href = data.product.long_url;
    document.getElementById("gotoproduct2").href = data.product.long_url;

    if (data.product.long_url.includes("booth.pm")) {
        document.getElementById("gotoproduct").innerHTML = "Get on Booth!";
        document.getElementById("gotoproduct").style = "visibility: unset !important;";

        document.getElementById("gotoproduct2").innerHTML = "Get on Booth!";
        document.getElementById("gotoproduct2").style = "visibility: unset !important;";

        document.getElementById("ratingSection").style = "display: none !important;";
    } else if (data.product.long_url.includes("gumroad.com")) {
        document.getElementById("gotoproduct").innerHTML = "Get on Gumroad!";
        document.getElementById("gotoproduct").style = "visibility: unset !important;";
        
        document.getElementById("gotoproduct2").innerHTML = "Get on Gumroad!";
        document.getElementById("gotoproduct2").style = "visibility: unset !important;";

        document.getElementById("ratingSection").style = "display: flex !important;";
    }

    document.getElementById("productMetaData").style = "display: block !important;";
    document.getElementById("productImageContainer").style = "display: flex !important;";
    document.getElementById("productImageContainerButtons").style = "display: flex !important;";

    document.getElementById("productLoading").style = "display: none !important;";

    if (data.product.currency_code == "eur") {
        document.getElementById("purchasePrice").innerHTML = (data.product.price_cents / 100) + "€";
        document.getElementById("purchasePrice2").innerHTML = (data.product.price_cents / 100) + "€";
    } else {
        document.getElementById("purchasePrice").innerHTML = currency_symbols[data.product.currency_code.toUpperCase()] + (data.product.price_cents / 100);
        document.getElementById("purchasePrice2").innerHTML = currency_symbols[data.product.currency_code.toUpperCase()] + (data.product.price_cents / 100);
    }

    const ex1 = data.product.rating_counts[0], 
        ex2 = data.product.rating_counts[1], 
        ex3 = data.product.rating_counts[2], 
        ex4 = data.product.rating_counts[3], 
        ex5 = data.product.rating_counts[4];

    var tmp1, tmp2, tmp3, tmp4, tmp5, tmpGlobal=ex1+ex2+ex3+ex4+ex5;
    var tmpaddon1, tmpaddon2, tmpaddon3, tmpaddon4, tmpaddon5;

    tmp1 = (100 / tmpGlobal) * ex1;
    tmp2 = (100 / tmpGlobal) * ex2;
    tmp3 = (100 / tmpGlobal) * ex3;
    tmp4 = (100 / tmpGlobal) * ex4;
    tmp5 = (100 / tmpGlobal) * ex5;

    if (tmp1 == 0) tmpaddon1 = "display: none;";
    if (tmp2 == 0) tmpaddon2 = "display: none;";
    if (tmp3 == 0) tmpaddon3 = "display: none;";
    if (tmp4 == 0) tmpaddon4 = "display: none;";
    if (tmp5 == 0) tmpaddon5 = "display: none;"; 

    document.getElementById("g1").innerHTML = "(" + ex1 + ")";
    document.getElementById("g2").innerHTML = "(" + ex2 + ")";
    document.getElementById("g3").innerHTML = "(" + ex3 + ")";
    document.getElementById("g4").innerHTML = "(" + ex4 + ")";
    document.getElementById("g5").innerHTML = "(" + ex5 + ")";

    document.getElementById("progressFiller1").style = "width: " + tmp1 + "%;" + tmpaddon1;
    document.getElementById("progressFiller2").style = "width: " + tmp2 + "%;" + tmpaddon2;
    document.getElementById("progressFiller3").style = "width: " + tmp3 + "%;" + tmpaddon3;
    document.getElementById("progressFiller4").style = "width: " + tmp4 + "%;" + tmpaddon4;
    document.getElementById("progressFiller5").style = "width: " + tmp5 + "%;" + tmpaddon5;
    
    document.getElementById("creatorName").innerHTML = data.product.seller.name;
    document.getElementById("creatorName").href = "?s=" + data.product.seller.name;

    document.getElementsByClassName("slide")[0].style.display = "block";

    } catch (e) {}
    data = null;
    
    document.getElementsByClassName("slide")[0].style.display = "block";
}