MKK_KozVezVal/js/mkkkvv.js

const MINIMUM_NEEDLE_LENGTH = 3;

function fetch_name_and_group(needle) {
    let ret = {
        needle: "",
        group: ""
    };
    let group_regex = /(\[[a-záéíóöúü]+\]$)/gi;
    let group_extracted = needle.match(group_regex);
    if (group_extracted != null) {
        ret["group"] = group_extracted[0].substring(1, group_extracted[0].length - 1);
        ret["needle"] = needle.substring(0, needle.length - group_extracted[0].length - 1).trim();
    } else {
        ret["needle"] = needle;
    }
    return ret;
}

let ELECTOR_ID;

// keresés indítása a nevek között
function search_in_names() {
    let hintbox = document.getElementById("hintbox");
    let needle = document.getElementById("nameinput").value;

    if (needle.trim().length < MINIMUM_NEEDLE_LENGTH) {
        hintbox.innerHTML = "";
        collapse("hintzone");
        collapse("submitbtn");
        stop_submit_caption_generator();
        o("nameinput").setAttribute("validity", "");
        return;
    }

    // csoport és név szétválasztása
    let request_data = {};
    request_data["data"] = fetch_name_and_group(needle);
    request_data["action"] = "search";
    request_data["elector_id"] = ELECTOR_ID;

    request(request_data).then(resp => {
        hintbox.innerHTML = "";
        let hits = JSON.parse(resp);
        hits.forEach((val) => {
            if (needle.length < 3) {
                return;
            }

            let hit = document.createElement("span");
            hit.classList.add("hit");
            hit.addEventListener("click", () => {
                let group_id = val["duplicate"] ? ` [${val["group"]}]` : "";
                fill_name_input(`${val["name"]}${group_id}`);
                collapse("hintzone");
                ninput.setAttribute("validity", "ok");
                expand("submitbtn");
                start_submit_caption_generator();
            });

            let name_node = document.createElement("span");
            name_node.classList.add("name");

            let hp = val["hitpos"];
            let name = val["name"];

            if (hp > 0) {
                let name_begin = name.slice(0, hp);
                name_node.appendChild(document.createTextNode(name_begin));
            }

            let hl = document.createElement("span");
            hl.classList.add("highlight");
            hl.innerText = name.slice(hp, hp + needle.length);
            name_node.appendChild(hl);

            if (hp + needle.length < name.length) {
                let name_end = name.slice(hp + needle.length, name.length);
                name_node.appendChild(document.createTextNode(name_end));
            }

            hit.appendChild(name_node);

            let group = val["group"];
            if (group.length > 0) {
                let group_node = document.createElement("span");
                group_node.innerHTML = ` ${print_from_group(group)}`;
                group_node.classList.add("group");
                hit.appendChild(group_node);
            }

            hintbox.appendChild(hit);
        });

        // doboz megjelenítése, ha szükséges
        hits.length > 0 ? expand("hintzone") : collapse("hintzone");

        // szövegmező színezése
        let validity = "";
        let ninput = document.getElementById("nameinput");
        if (ninput.value.length > MINIMUM_NEEDLE_LENGTH) {
            if (hits.length === 0) {
                validity = "bad";
                collapse("submitbtn");
                stop_submit_caption_generator();
            } else if (hits.length === 1 && hits[0]["exact_match"]) {
                validity = "ok";
                collapse("hintzone");
                expand("submitbtn");
                start_submit_caption_generator();
            } else {
                expand("hintzone");
                collapse("submitbtn");
                stop_submit_caption_generator();
            }
        }
        ninput.setAttribute("validity", validity);
    });
}

// csoport kiírása ("...az Azúrból" -- no reference of course :D), ha megkapja a szervertől
function print_from_group(group) {
    group = group.trim();
    if (group === "") {
        return "";
    }

    let vowels = /[aáeéiíoóöőuúüű]/i; // magánhangzók regexe
    let highpitched_vowels = /[eéiíöőüű]/i; // magas hangrendű maánhangzók regexe

    // első betű megvizsgálása a névelő kiválasztásához
    let b = group.charAt(0);
    let article = (vowels.exec(b) != null) ? "az" : "a";

    // hátulról az első magánhangzó keresése
    let g_rev = group.split("").reverse().join("");
    let last_vowel = g_rev.match(vowels)[0];

    // megvizsgáljuk, hogy az utolsó betű volt-e a megtalált magánhangzó
    let last_letter = g_rev.charAt(0).toLowerCase();
    if (last_letter === last_vowel.charAt(0).toLowerCase()) {
        if (last_letter === "a") {
            last_letter = "á";
        } else if (last_letter === "e") {
            last_letter = "é";
        }

        // utolsó betű kicserélése
        group = group.substring(0, group.length - 1) + last_letter;
    }

    // utolsó magánhangzó hangrendjének vizsgálata és rag kiválasztása
    let suffix = highpitched_vowels.test(last_vowel) ? "ből" : "ból";

    return `${article} <i>${group}${suffix}</i>`;
}

// szöveggel kitölti a nevet
function fill_name_input(str) {
    document.getElementById("nameinput").value = str;
}

const ARROWS = [/*"&rarr;",*/ "&Rarr;", "&rarrtl;", "&map;", "&rarrlp;", "&rrarr;",
    /*"&Rightarrow;",*/ "&Rrightarrow;", "&zigrarr;"];

const SUBMIT_CAPTION_PREFIX = "Mehet! ";

function generate_new_caption() {
    document.getElementById("submitbtn").innerHTML = SUBMIT_CAPTION_PREFIX +
        ARROWS[Math.floor(Math.random() * (ARROWS.length))];
}

CAPTION_TIMER = -1;

function start_submit_caption_generator() {
    if (CAPTION_TIMER === -1) {
        generate_new_caption();
        CAPTION_TIMER = setInterval(() => {
            generate_new_caption();
        }, 1000);
    }
}

function stop_submit_caption_generator() {
    if (CAPTION_TIMER !== -1) {
        clearInterval(CAPTION_TIMER);
        CAPTION_TIMER = -1;
    }
}

function submit_name() {
    stop_submit_caption_generator();
    let submitbtn = document.getElementById("submitbtn");
    submitbtn.innerText = "Már megy is!...";

    needle = document.getElementById("nameinput").value;

    // csoport és név szétválasztása
    let request_data = {};
    request_data["data"] = fetch_name_and_group(needle);
    request_data["action"] = "submit";
    request_data["elector_id"] = ELECTOR_ID;

    request(request_data).then(resp_str => {
        let resp = JSON.parse(resp_str);
        console.log(resp);
        if (resp["successful"]) {
            hide("mainbox");
            show("thankbox");
            o("elector_index").innerText = `${resp["index"]}.`;
        } else {
            submitbtn.innerText = "Hiba, próbáld meg újra!";
        }
    });
}

function login() {
    let id_str = document.getElementById("idinput").value;

    if (id_str.trim().length === 0) {
        return;
    }

    if (login.login_in_progress === undefined) {
        login.login_in_progress = true;
    } else if (login.login_in_progress) {
        return;
    }

    let request_data = {
        action: "login",
        data: {
            elector_id: id_str
        }
    }

    let loginbtn = document.getElementById("loginbtn");
    loginbtn.innerText = "Türelem...";

    request(request_data).then(resp_str => {
            let resp = JSON.parse(resp_str);
            if (resp["valid"]) {
                ELECTOR_ID = id_str; // így nem kell süti...
                loginbtn.innerText = "Sikeres! :)";
                hide("loginbox");
                if (resp["open"]) {
                    if (resp["results_public"]) { // eredmények publikálva vannak
                        show("resultbox");
                        load_results();
                    } else if (resp["open_for_submit"] && !resp["used"]) { // nem publikusak az eredmények, lehet szavazni és még nem szavazott
                        show("mainbox");
                    } else if (resp["open_for_submit"] && resp["used"]) { // nem publikusak az eredmények, lehet szavazni és de már szavazott
                        show("infobox");
                        o("infoheader").innerText = "Már szavaztál. Az eredmények még nem elérhetők, de mi is kíváncsian várjuk őket! :)";
                    } else { // nem publikusak az eredmények, nem lehet szavazni
                        show("infobox");
                        o("infoheader").innerText = "Még vagy már nem lehet szavazatot leadni!";
                    }
                } else {
                    show("infobox");
                    o("infoheader").innerText = "A szavazófelület még vagy már nem elérhető, nézz vissza később!";
                }
            } else {
                loginbtn.innerText = "Megpróbálom újra!";
            }
            login.login_in_progress = false;
        }
    )
    ;
}

function load_results() {
    let request_data = {
        action: "results",
        elector_id: ELECTOR_ID,
        data: {
            mobile: MOBILE
        }
    }

    request(request_data).then(resp_str => {
        let resbox = document.getElementById("resultbox");
        let resp = JSON.parse(resp_str);
        if (resp["available"]) {
            let pie_plot_url = resp["plot_url"];
            let details = resp["details"];
            let headline = `<h2>Eredmények</h2>`
            resbox.innerHTML = headline + `<img alt="Betöltés..." src="media/spinner.svg" style="width: 40%;">`;

            // grafikon betöltése
            let load_pie_req = new XMLHttpRequest();
            load_pie_req.addEventListener("load", () => {
                let str = headline + load_pie_req.response;
                str += `<section id="full_records"><h3>Teljes összesítés:</h3>`
                let total_count = 0;
                for (let i = 0; i < details.length; i++) {
                    let rec = details[i];
                    total_count += rec["count"];
                    let percent = (rec["ratio"] * 100).toFixed(1);
                    str += `<b>${i+1}.</b> ${rec["name"]} (${percent}%, ${rec["count"]} szavazat)<br>`;
                }
                str += "<br>";
                str += `...összesen <b>${total_count}</b> szavazat alapján! Gratulálunk! :)</section>`
                resbox.innerHTML = str;

                o("full_records").style.animationDelay = o("datagroup0").style.animationDelay;
            });
            load_pie_req.open("GET", pie_plot_url);
            load_pie_req.send();

        } else {
            //resbox.innerHTML = `<h3>Még nem elérhetők az eredmények, de mi is kíváncsian várjuk! :)</h3>`
        }
    })
}

// #003f5c
// #444e86
// #955196
// #dd5182
// #ff6e54
// #ffa600

// #003f5c
// #424d83
// #8e5092
// #d24f81
// #fa6756
// #f89a17