Cloud_Computing_II/frontend/index.js

const languages = [
    {
        "language": "Afrikaans",
        "code": "af"
    },
    {
        "language": "Albanian",
        "code": "sq"
    },
    {
        "language": "Amharic",
        "code": "am"
    },
    {
        "language": "Arabic",
        "code": "ar"
    },
    {
        "language": "Armenian",
        "code": "hy"
    },
    {
        "language": "Assamese",
        "code": "as"
    },
    {
        "language": "Azerbaijani (Latin)",
        "code": "az"
    },
    {
        "language": "Bangla",
        "code": "bn"
    },
    {
        "language": "Bashkir",
        "code": "ba"
    },
    {
        "language": "Basque",
        "code": "eu"
    },
    {
        "language": "Bosnian (Latin)",
        "code": "bs"
    },
    {
        "language": "Bulgarian",
        "code": "bg"
    },
    {
        "language": "Cantonese (Traditional)",
        "code": "yue"
    },
    {
        "language": "Catalan",
        "code": "ca"
    },
    {
        "language": "Chinese (Literary)",
        "code": "lzh"
    },
    {
        "language": "Chinese Simplified",
        "code": "zh-Hans"
    },
    {
        "language": "Chinese Traditional",
        "code": "zh-Hant"
    },
    {
        "language": "Croatian",
        "code": "hr"
    },
    {
        "language": "Czech",
        "code": "cs"
    },
    {
        "language": "Danish",
        "code": "da"
    },
    {
        "language": "Dari",
        "code": "prs"
    },
    {
        "language": "Divehi",
        "code": "dv"
    },
    {
        "language": "Dutch",
        "code": "nl"
    },
    {
        "language": "English",
        "code": "en"
    },
    {
        "language": "Estonian",
        "code": "et"
    },
    {
        "language": "Faroese",
        "code": "fo"
    },
    {
        "language": "Fijian",
        "code": "fj"
    },
    {
        "language": "Filipino",
        "code": "fil"
    },
    {
        "language": "Finnish",
        "code": "fi"
    },
    {
        "language": "French",
        "code": "fr"
    },
    {
        "language": "French (Canada)",
        "code": "fr-ca"
    },
    {
        "language": "Galician",
        "code": "gl"
    },
    {
        "language": "Georgian",
        "code": "ka"
    },
    {
        "language": "German",
        "code": "de"
    },
    {
        "language": "Greek",
        "code": "el"
    },
    {
        "language": "Gujarati",
        "code": "gu"
    },
    {
        "language": "Haitian Creole",
        "code": "ht"
    },
    {
        "language": "Hebrew",
        "code": "he"
    },
    {
        "language": "Hindi",
        "code": "hi"
    },
    {
        "language": "Hmong Daw (Latin)",
        "code": "mww"
    },
    {
        "language": "Hungarian",
        "code": "hu"
    },
    {
        "language": "Icelandic",
        "code": "is"
    },
    {
        "language": "Indonesian",
        "code": "id"
    },
    {
        "language": "Inuinnaqtun",
        "code": "ikt"
    },
    {
        "language": "Inuktitut",
        "code": "iu"
    },
    {
        "language": "Inuktitut (Latin)",
        "code": "iu-Latn"
    },
    {
        "language": "Irish",
        "code": "ga"
    },
    {
        "language": "Italian",
        "code": "it"
    },
    {
        "language": "Japanese",
        "code": "ja"
    },
    {
        "language": "Kannada",
        "code": "kn"
    },
    {
        "language": "Kazakh",
        "code": "kk"
    },
    {
        "language": "Khmer",
        "code": "km"
    },
    {
        "language": "Klingon",
        "code": "tlh-Latn"
    },
    {
        "language": "Klingon (plqaD)",
        "code": "tlh-Piqd"
    },
    {
        "language": "Korean",
        "code": "ko"
    },
    {
        "language": "Kurdish (Central)",
        "code": "ku"
    },
    {
        "language": "Kurdish (Northern)",
        "code": "kmr"
    },
    {
        "language": "Kyrgyz (Cyrillic)",
        "code": "ky"
    },
    {
        "language": "Lao",
        "code": "lo"
    },
    {
        "language": "Latvian",
        "code": "lv"
    },
    {
        "language": "Lithuanian",
        "code": "lt"
    },
    {
        "language": "Macedonian",
        "code": "mk"
    },
    {
        "language": "Malagasy",
        "code": "mg"
    },
    {
        "language": "Malay (Latin)",
        "code": "ms"
    },
    {
        "language": "Malayalam",
        "code": "ml"
    },
    {
        "language": "Maltese",
        "code": "mt"
    },
    {
        "language": "Maori",
        "code": "mi"
    },
    {
        "language": "Marathi",
        "code": "mr"
    },
    {
        "language": "Mongolian (Cyrillic)",
        "code": "mn-Cyrl"
    },
    {
        "language": "Mongolian (Traditional)",
        "code": "mn-Mong"
    },
    {
        "language": "Myanmar",
        "code": "my"
    },
    {
        "language": "Nepali",
        "code": "ne"
    },
    {
        "language": "Norwegian",
        "code": "nb"
    },
    {
        "language": "Odia",
        "code": "or"
    },
    {
        "language": "Pashto",
        "code": "ps"
    },
    {
        "language": "Persian",
        "code": "fa"
    },
    {
        "language": "Polish",
        "code": "pl"
    },
    {
        "language": "Portuguese (Brazil)",
        "code": "pt"
    },
    {
        "language": "Portuguese (Portugal)",
        "code": "pt-pt"
    },
    {
        "language": "Punjabi",
        "code": "pa"
    },
    {
        "language": "Queretaro Otomi",
        "code": "otq"
    },
    {
        "language": "Romanian",
        "code": "ro"
    },
    {
        "language": "Russian",
        "code": "ru"
    },
    {
        "language": "Samoan (Latin)",
        "code": "sm"
    },
    {
        "language": "Serbian (Cyrillic)",
        "code": "sr-Cyrl"
    },
    {
        "language": "Serbian (Latin)",
        "code": "sr-Latn"
    },
    {
        "language": "Slovak",
        "code": "sk"
    },
    {
        "language": "Slovenian",
        "code": "sl"
    },
    {
        "language": "Somali (Arabic)",
        "code": "so"
    },
    {
        "language": "Spanish",
        "code": "es"
    },
    {
        "language": "Swahili (Latin)",
        "code": "sw"
    },
    {
        "language": "Swedish",
        "code": "sv"
    },
    {
        "language": "Tahitian",
        "code": "ty"
    },
    {
        "language": "Tamil",
        "code": "ta"
    },
    {
        "language": "Tatar (Latin)",
        "code": "tt"
    },
    {
        "language": "Telugu",
        "code": "te"
    },
    {
        "language": "Thai",
        "code": "th"
    },
    {
        "language": "Tibetan",
        "code": "bo"
    },
    {
        "language": "Tigrinya",
        "code": "ti"
    },
    {
        "language": "Tongan",
        "code": "to"
    },
    {
        "language": "Turkish",
        "code": "tr"
    },
    {
        "language": "Turkmen (Latin)",
        "code": "tk"
    },
    {
        "language": "Ukrainian",
        "code": "uk"
    },
    {
        "language": "Upper Sorbian",
        "code": "hsb"
    },
    {
        "language": "Urdu",
        "code": "ur"
    },
    {
        "language": "Uyghur (Arabic)",
        "code": "ug"
    },
    {
        "language": "Uzbek (Latin",
        "code": "uz"
    },
    {
        "language": "Vietnamese",
        "code": "vi"
    },
    {
        "language": "Welsh",
        "code": "cy"
    },
    {
        "language": "Yucatec Maya",
        "code": "yua"
    },
    {
        "language": "Zulu",
        "code": "zu"
    }
];


function fillDropDowns() {
    var dropdown1 = document.getElementById("requested_text_language");
    var dropdown2 = document.getElementById("received_text_language");

    for (var i = 0; i < languages.length; i++) {
        var option = document.createElement("option");
        option.text = languages[i].language;
        option.value = languages[i].code;
        dropdown1.add(option);

        var option = document.createElement("option");
        option.text = languages[i].language;
        option.value = languages[i].code;
        dropdown2.add(option);

        if(languages[i].code == "de") {
            dropdown1.value = "de"
        }

        if(languages[i].code == "en") {
            dropdown2.value = "en"
        }
    }
}

function translate() {
    var requestedText = document.getElementById("requested_text").value

    var data = {
        "requested_text": requestedText,
        "language_from": document.getElementById("requested_text_language").value,
        "language_to": document.getElementById("received_text_language").value
      }


      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {
             document.getElementById("received_text").value = JSON.parse(xhttp.responseText).response_text
          }
      };
      xhttp.open("POST", "http://127.0.0.1:5000/translate", true);
      xhttp.setRequestHeader("Content-Type", "application/json");
      xhttp.send(JSON.stringify(data)); 
}