242 lines
		
	
	
		
			8.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			242 lines
		
	
	
		
			8.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
function create_cell(content = "") {
 | 
						|
    let cell = document.createElement("td");
 | 
						|
    cell.innerHTML = content;
 | 
						|
    return cell;
 | 
						|
}
 | 
						|
 | 
						|
function autoconvert_datetime(str) {
 | 
						|
    // preprocess time fields in filter string
 | 
						|
    const dateTimeRE = /([0-9]{4}-[0-1][0-9]-[0-3][0-9] [0-2][0-9]:[0-5][0-9]:[0-5][0-9])/;
 | 
						|
    let filterParts = str.split(dateTimeRE);
 | 
						|
 | 
						|
    // First, process full datetime entries
 | 
						|
    // datetime values will be at the odd indices
 | 
						|
    for (let i = 1; i < filterParts.length; i += 2) {
 | 
						|
        filterParts[i] = human_readable_to_unix_time(filterParts[i]);
 | 
						|
    }
 | 
						|
 | 
						|
    // join the surrounding and converted parts
 | 
						|
    let filter = filterParts.join("");
 | 
						|
 | 
						|
    // Now, process the only date parts
 | 
						|
    const dateRE = /([0-9]{4}-[0-1][0-9]-[0-3][0-9])/;
 | 
						|
    filterParts = filter.split(dateRE);
 | 
						|
 | 
						|
    for (let i = 1; i < filterParts.length; i += 2) {
 | 
						|
        filterParts[i] = human_readable_to_unix_time(filterParts[i] + " 00:00:00");
 | 
						|
    }
 | 
						|
 | 
						|
    filter = filterParts.join("");
 | 
						|
 | 
						|
    return filter;
 | 
						|
}
 | 
						|
 | 
						|
function count_selected() {
 | 
						|
    let n = 0;
 | 
						|
    document.getElementsByName("game_select").forEach((chk) => {
 | 
						|
       if (chk.checked) {
 | 
						|
           n++;
 | 
						|
       }
 | 
						|
    });
 | 
						|
 | 
						|
    document.getElementById("selected_n").innerText = n.toString();
 | 
						|
}
 | 
						|
 | 
						|
function fetch_results() {
 | 
						|
 | 
						|
    let filterF = document.getElementById("filter");
 | 
						|
    let orderbyF = document.getElementById("orderby");
 | 
						|
    let groupsF = document.getElementById("groups");
 | 
						|
    let best_onlyChk = document.getElementById("best_only");
 | 
						|
    let records_nS = document.getElementById("records_n");
 | 
						|
 | 
						|
    let filter = autoconvert_datetime(filterF.value.trim());
 | 
						|
 | 
						|
    // ----------
 | 
						|
 | 
						|
    let req = {
 | 
						|
        action: "get_results_by_gameid",
 | 
						|
        gameid: GAMEID,
 | 
						|
        filter: filter.trim(),
 | 
						|
        orderby: orderbyF.value.trim(),
 | 
						|
        groups: groupsF.value.trim(),
 | 
						|
        best_only: best_onlyChk.checked ? "true" : "false"
 | 
						|
    };
 | 
						|
 | 
						|
    request(req).then(resp => {
 | 
						|
        let rd = document.getElementById("results_display");
 | 
						|
 | 
						|
        let results = JSON.parse(resp);
 | 
						|
        let empty_resp = results.length === 0;
 | 
						|
        rd.innerHTML = empty_resp ? "Nincs találat." : "";
 | 
						|
        if (empty_resp) {
 | 
						|
            return;
 | 
						|
        }
 | 
						|
 | 
						|
        records_nS.innerText = results.length;
 | 
						|
 | 
						|
        results.forEach((record) => {
 | 
						|
            let row = document.createElement("tr");
 | 
						|
 | 
						|
            // is the game concluded
 | 
						|
            let concluded = record["state"] === "concluded";
 | 
						|
 | 
						|
            let percentage = "";
 | 
						|
            let start_timestamp = unix_time_to_human_readable(record["start_time"]);
 | 
						|
            let end_timestamp = "";
 | 
						|
 | 
						|
            // replace some fields if game was concluded
 | 
						|
            if (concluded) {
 | 
						|
                // percentage
 | 
						|
                let summary = record["summary"];
 | 
						|
                let r = Math.floor((summary["correct_answer_n"] / summary["challenge_n"]) * 100);
 | 
						|
                percentage = `${r}%`;
 | 
						|
 | 
						|
                // finish timestamp
 | 
						|
                end_timestamp = unix_time_to_human_readable(record["end_time"]);
 | 
						|
            }
 | 
						|
 | 
						|
            // create cells
 | 
						|
            let selectChk = document.createElement("input");
 | 
						|
            selectChk.type = "checkbox";
 | 
						|
            selectChk.name = "game_select";
 | 
						|
            selectChk.record = record;
 | 
						|
            selectChk.addEventListener("input", () => {
 | 
						|
               count_selected();
 | 
						|
            });
 | 
						|
 | 
						|
            let selection_cell = create_cell();
 | 
						|
            selection_cell.append(selectChk);
 | 
						|
 | 
						|
            let id_cell = create_cell(record["_id"]);
 | 
						|
 | 
						|
            let inspect_link = `<a href="testground.php?testid=${record["_id"]}&view_only=true" target="_blank">🔎</a>`
 | 
						|
            let inspect_cell = create_cell(inspect_link);
 | 
						|
            let name_cell = create_cell(record.nickname)
 | 
						|
            let percentage_cell = create_cell(percentage)
 | 
						|
            let start_timestamp_cell = create_cell(start_timestamp);
 | 
						|
            let end_timestamp_cell = create_cell(end_timestamp);
 | 
						|
 | 
						|
            row.append(selection_cell, id_cell, inspect_cell, name_cell, percentage_cell, start_timestamp_cell, end_timestamp_cell);
 | 
						|
 | 
						|
            // save record data into the row object
 | 
						|
            row.record = record;
 | 
						|
 | 
						|
            // append row
 | 
						|
            rd.appendChild(row);
 | 
						|
        });
 | 
						|
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
function get_selected_ids() {
 | 
						|
    let testids = [];
 | 
						|
    let game_selectChks = document.getElementsByName("game_select");
 | 
						|
    game_selectChks.forEach((chk) => {
 | 
						|
        if (chk.checked) {
 | 
						|
            testids.push(chk.record["_id"]);
 | 
						|
        }
 | 
						|
    });
 | 
						|
    return testids;
 | 
						|
}
 | 
						|
 | 
						|
function generate_report() {
 | 
						|
    let testids = get_selected_ids();
 | 
						|
 | 
						|
    let req = {
 | 
						|
        action: "generate_detailed_stats",
 | 
						|
        gameid: GAMEID,
 | 
						|
        testids: JSON.stringify(testids)
 | 
						|
    };
 | 
						|
 | 
						|
    request(req).then((resp) => {
 | 
						|
        let stats = JSON.parse(resp);
 | 
						|
        let statsTab = window.open("report.html", "_blank");
 | 
						|
 | 
						|
        statsTab.addEventListener("load", () => {
 | 
						|
            let report_display = statsTab.document.getElementById("report_display");
 | 
						|
            report_display.innerHTML = "";
 | 
						|
 | 
						|
            let ch_n = 0;
 | 
						|
            stats.forEach((task) => {
 | 
						|
                let task_box = document.createElement("section");
 | 
						|
                task_box.classList.add("task");
 | 
						|
                task_box.style.width = "100%";
 | 
						|
 | 
						|
                let seq_num = document.createElement("section");
 | 
						|
                seq_num.classList.add("seq-num");
 | 
						|
                seq_num.innerText = ++ch_n;
 | 
						|
                task_box.append(seq_num);
 | 
						|
 | 
						|
                let img_url = task["image_url"];
 | 
						|
                if (img_url !== "") {
 | 
						|
                    let fig = document.createElement("img");
 | 
						|
                    fig.src = `interface.php?action=get_image&gameid=${GAMEID}&img_url=${task["image_url"]}`;
 | 
						|
                    fig.classList.add("question-image");
 | 
						|
                    task_box.append(fig);
 | 
						|
                }
 | 
						|
 | 
						|
                let question = document.createElement("span");
 | 
						|
                question.classList.add("question");
 | 
						|
                question.innerHTML = preprocess_inserts(task["question"]);
 | 
						|
                let answer_container = document.createElement("section");
 | 
						|
                answer_container.classList.add("answer-container");
 | 
						|
                task_box.append(question, answer_container);
 | 
						|
 | 
						|
                let n = task["answer_count"];
 | 
						|
                for (let i = 0; i < n; i++) {
 | 
						|
                    let answer = task["answers"][i];
 | 
						|
                    let correct_answer = answer === task["correct_answer"];
 | 
						|
 | 
						|
                    let answer_section = document.createElement("section");
 | 
						|
                    answer_section.classList.add("answer");
 | 
						|
 | 
						|
                    let progress_bar_container = document.createElement("section");
 | 
						|
                    progress_bar_container.classList.add("pb-container")
 | 
						|
                    let progress_bar_indicator = document.createElement("section");
 | 
						|
                    progress_bar_indicator.classList.add("pb-indicator")
 | 
						|
 | 
						|
                    let percentage = task["answer_ratio"][i] * 100;
 | 
						|
                    progress_bar_indicator.style.width = `${percentage}%`;
 | 
						|
                    progress_bar_indicator.innerText = Math.round(percentage * 100.0) / 100.0 + "%";
 | 
						|
                    progress_bar_indicator.setAttribute("correct", correct_answer ? "true" : "false");
 | 
						|
 | 
						|
                    progress_bar_container.append(progress_bar_indicator);
 | 
						|
 | 
						|
                    let answer_text = document.createElement("span");
 | 
						|
                    answer_text.classList.add("answer");
 | 
						|
                    answer_text.innerHTML = preprocess_inserts(answer);
 | 
						|
                    answer_text.setAttribute("correct", correct_answer ? "true" : "false");
 | 
						|
 | 
						|
                    answer_section.append(progress_bar_container, answer_text);
 | 
						|
 | 
						|
                    answer_container.append(answer_section);
 | 
						|
                }
 | 
						|
 | 
						|
                report_display.append(task_box);
 | 
						|
            });
 | 
						|
 | 
						|
            statsTab.MathJax.typeset();
 | 
						|
        });
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
function toggle_test_selection() {
 | 
						|
    let game_selectChks = document.getElementsByName("game_select");
 | 
						|
    game_selectChks.forEach((chk) => {
 | 
						|
        chk.checked = !chk.checked;
 | 
						|
    });
 | 
						|
    count_selected();
 | 
						|
}
 | 
						|
 | 
						|
function delete_tests() {
 | 
						|
    if (confirm("Biztosan törölni kívánja a kijelölt eredményeket?")) {
 | 
						|
        let req = {
 | 
						|
            action: "delete_tests",
 | 
						|
            ids: get_selected_ids().join(",")
 | 
						|
        };
 | 
						|
        request(req).then(resp => {
 | 
						|
            fetch_results(); // refresh results
 | 
						|
        });
 | 
						|
    }
 | 
						|
} |