const countryCode = new URLSearchParams(window.location.search).get("code");
const languageList = document.getElementById("language-list");
const currencyList = document.getElementById("currency-list");
const phonePrefixList = document.getElementById("phone-prefix-list");
fetch("https://countries.trevorblades.com/", {
    "method": "POST",
    "body": JSON.stringify(
        {
            query: "", // Fill in Query here
            "operationName": "country",
            "variables": { "code": countryCode }
        }),
    headers: { "Content-Type": "application/json" }
}).then(response => response.json()).then(({ data }) => {
    /*
        Use the information from the response to insert the following text into the page:
          - Name of the country
          - Capital of the country
          - Flag of the country as unicode emoji
    */

    for (const language of data.country.languages) {
        const newListItem = document.createElement("li");
        newListItem.innerText = language.name;
        languageList.append(newListItem);
    }
    for (const currency of data.country.currencies) {
        const newListItem = document.createElement("li");
        newListItem.innerHTML = `<a href="/currency.html?currency=${currency}">${currency}</a>`;
        currencyList.append(newListItem);
    }
    for (const phonePrefix of data.country.phones) {
        const newListItem = document.createElement("li");
        newListItem.innerText = `+${phonePrefix}`;
        phonePrefixList.append(newListItem);
    }
});