227 lines
		
	
	
		
			7.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			227 lines
		
	
	
		
			7.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
let TEST_DATA = {}
 | 
						|
let INTERVAL_HANDLE = null;
 | 
						|
 | 
						|
function populate_infobox(test_data, view_only) {
 | 
						|
    if (INTERVAL_HANDLE !== null) {
 | 
						|
        clearInterval(INTERVAL_HANDLE);
 | 
						|
    }
 | 
						|
 | 
						|
    let test_concluded = test_data["state"] === "concluded";
 | 
						|
 | 
						|
    let game_nameS = document.getElementById("game_name");
 | 
						|
    let durationS = document.getElementById("duration");
 | 
						|
    let percentageS = document.getElementById("percentage");
 | 
						|
 | 
						|
    let submitBtn = document.getElementById("submit_btn");
 | 
						|
    submitBtn.hidden = view_only;
 | 
						|
 | 
						|
    game_nameS.innerHTML = test_data["gamename"];
 | 
						|
 | 
						|
    if (test_concluded) {
 | 
						|
        let summary = test_data["summary"];
 | 
						|
        let correct_answer_n = summary["correct_answer_n"];
 | 
						|
        let task_n = summary["challenge_n"];
 | 
						|
        let r = Math.ceil((correct_answer_n / task_n) * 100);
 | 
						|
        percentageS.innerHTML = `${r}% (${correct_answer_n}/${task_n})`;
 | 
						|
 | 
						|
        let start_time = unix_time_to_human_readable(test_data["start_time"]);
 | 
						|
        let end_time = unix_time_to_human_readable(test_data["end_time"]);
 | 
						|
        durationS.value = `${start_time} - ${end_time}`;
 | 
						|
 | 
						|
        hide("ongoing-info");
 | 
						|
        show("concluded-info");
 | 
						|
    } else {
 | 
						|
        let timerS = document.getElementById("timer");
 | 
						|
        let time_left_s = Number(test_data["end_limit_time"]) - Number(test_data["current_time"]);
 | 
						|
 | 
						|
        let print_timer = () => {
 | 
						|
            timerS.innerHTML = seconds_to_time(time_left_s);
 | 
						|
        };
 | 
						|
 | 
						|
        if (test_data["time_limited"]) {
 | 
						|
            print_timer()
 | 
						|
 | 
						|
            if (!view_only) {
 | 
						|
                INTERVAL_HANDLE = setInterval(() => {
 | 
						|
                    time_left_s--;
 | 
						|
                    print_timer();
 | 
						|
                    if (time_left_s <= 0) {
 | 
						|
                        populate_all(test_data["_id"], test_data["gameid"], false);
 | 
						|
                        clearInterval(INTERVAL_HANDLE);
 | 
						|
                        INTERVAL_HANDLE = null;
 | 
						|
                    }
 | 
						|
                }, 1000);
 | 
						|
            }
 | 
						|
            show("time-info");
 | 
						|
        } else {
 | 
						|
            hide("time-info");
 | 
						|
        }
 | 
						|
 | 
						|
        // fill further info
 | 
						|
        let further_info_box = document.getElementById("further-info");
 | 
						|
        let further_info = "";
 | 
						|
        if (!test_data["repeatable"]) {
 | 
						|
            further_info += "A teszt <i>nem</i> megismételhető!<br>";
 | 
						|
        }
 | 
						|
        further_info_box.innerHTML = further_info;
 | 
						|
 | 
						|
        show("ongoing-info");
 | 
						|
        hide("concluded-info");
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
function populate_tasks(tasks, concluded, view_only = false, gameid) {
 | 
						|
    let test_display = document.getElementById("test_display");
 | 
						|
    test_display.innerHTML = "";
 | 
						|
 | 
						|
    Task.sequence_number = 0;
 | 
						|
 | 
						|
    tasks.forEach((task) => {
 | 
						|
        let task_element = document.createElement(`${task["type"]}-task`);
 | 
						|
        task_element.uploadAnswerCb = save_answer;
 | 
						|
 | 
						|
        task_element.imgType = task["image_type"];
 | 
						|
        if (task["image_type"] === "url" && task["image_data"] !== "") {
 | 
						|
            task_element.imgData = `interface.php?action=get_image&gameid=${gameid}&img_url=${task["image_data"]}`
 | 
						|
        } else {
 | 
						|
            task_element.imgData = task["image_data"];
 | 
						|
        }
 | 
						|
        task_element.isConcluded = concluded;
 | 
						|
        task_element.isViewOnly = view_only;
 | 
						|
        task_element.fromArray(task);
 | 
						|
        test_display.appendChild(task_element);
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
function populate_all(test_id, gameid, view_only) {
 | 
						|
    let req = {
 | 
						|
        action: "get_test",
 | 
						|
        view_only: view_only,
 | 
						|
        testid: test_id
 | 
						|
    }
 | 
						|
    request(req).then(resp => {
 | 
						|
        TEST_DATA = JSON.parse(resp);
 | 
						|
        let concluded = TEST_DATA["state"] === "concluded";
 | 
						|
        populate_tasks(TEST_DATA["challenges"], concluded, view_only, gameid);
 | 
						|
        populate_infobox(TEST_DATA, view_only);
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
function save_answer(tidx, ans) {
 | 
						|
    let req = {
 | 
						|
        action: "save_answer",
 | 
						|
        testid: TEST_DATA["_id"],
 | 
						|
        task_index: tidx,
 | 
						|
        answer: ans,
 | 
						|
    };
 | 
						|
    request(req);
 | 
						|
}
 | 
						|
 | 
						|
function save_all_answers() {
 | 
						|
    let tasks = document.getElementById("test_display").children;
 | 
						|
    for (let i = 0; i < tasks.length; i++) {
 | 
						|
        tasks[i].uploadAnswer();
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
function submit_test() {
 | 
						|
    // first, save all answers
 | 
						|
    save_all_answers();
 | 
						|
 | 
						|
    // then signal test submission
 | 
						|
    let req = {
 | 
						|
        action: "submit_test",
 | 
						|
        testid: TEST_DATA["_id"]
 | 
						|
    }
 | 
						|
    request(req).then(resp => {
 | 
						|
        populate_all(TEST_DATA["_id"], TEST_DATA["gameid"], false);
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
// ---------
 | 
						|
 | 
						|
// function populate_tasks(tasks, concluded, view_only = false, gameid) {
 | 
						|
//     let test_display = document.getElementById("test_display");
 | 
						|
//     test_display.innerHTML = "";
 | 
						|
//
 | 
						|
//     let task_N = 0;
 | 
						|
//     tasks.forEach((task) => {
 | 
						|
//         let task_N_snapshot = task_N;
 | 
						|
//         let task_box = document.createElement("section");
 | 
						|
//         task_box.classList.add("task");
 | 
						|
//         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);
 | 
						|
//
 | 
						|
//         if (task["image_url"] !== "") {
 | 
						|
//             let qimg = document.createElement("img");
 | 
						|
//             qimg.src = `interface.php?action=get_image&gameid=${gameid}&img_url=${task["image_url"]}`;
 | 
						|
//             qimg.classList.add("question-image")
 | 
						|
//             task_box.insertBefore(qimg, answer_container);
 | 
						|
//         }
 | 
						|
//
 | 
						|
//         let seq_num_section = document.createElement("section");
 | 
						|
//         seq_num_section.innerText = String(task_N + 1) + "."
 | 
						|
//         seq_num_section.classList.add("seq-num");
 | 
						|
//         task_box.append(seq_num_section);
 | 
						|
//
 | 
						|
//         let answer_N = 0;
 | 
						|
//         let player_answer = task["player_answer"];
 | 
						|
//         player_answer = (player_answer !== "") ? Number(player_answer) : -1;
 | 
						|
//         task["answers"].forEach((answer) => {
 | 
						|
//             let answer_section = document.createElement("section");
 | 
						|
//             answer_section.classList.add("answer");
 | 
						|
//             let answer_radio = document.createElement("input");
 | 
						|
//             answer_radio.type = "radio";
 | 
						|
//             answer_radio.id = `${task_N}_${answer_N}`;
 | 
						|
//             answer_radio.name = `task_${task_N}`;
 | 
						|
//             answer_radio.disabled = concluded || view_only;
 | 
						|
//             let answer_N_snapshot = answer_N;
 | 
						|
//             answer_radio.addEventListener("input", () => {
 | 
						|
//                 save_answer(task_N_snapshot, answer_N_snapshot);
 | 
						|
//             });
 | 
						|
//
 | 
						|
//             let answer_text = document.createElement("label");
 | 
						|
//             answer_text.innerHTML = preprocess_inserts(answer);
 | 
						|
//             answer_text.setAttribute("for", answer_radio.id);
 | 
						|
//             if (concluded && (task["correct_answer"] === answer_N)) {
 | 
						|
//                 answer_text.classList.add("correct-answer")
 | 
						|
//
 | 
						|
//                 if (player_answer !== task["correct_answer"]) {
 | 
						|
//                     task_box.classList.add("bad-answer");
 | 
						|
//                 }
 | 
						|
//             }
 | 
						|
//
 | 
						|
//             answer_section.append(answer_radio, answer_text);
 | 
						|
//             answer_container.appendChild(answer_section);
 | 
						|
//
 | 
						|
//             answer_N++;
 | 
						|
//         });
 | 
						|
//         task_N++;
 | 
						|
//
 | 
						|
//         test_display.appendChild(task_box);
 | 
						|
//     });
 | 
						|
//
 | 
						|
//     mark_answers(tasks, view_only);
 | 
						|
//
 | 
						|
//     MathJax.typeset();
 | 
						|
// }
 | 
						|
//
 | 
						|
//
 | 
						|
// function assemble_answer_radio_id(task_N, answer_N) {
 | 
						|
//     return task_N + "_" + answer_N;
 | 
						|
// }
 | 
						|
//
 | 
						|
//
 | 
						|
// function mark_answers(tasks, view_only = false) {
 | 
						|
//     for (let i = 0; i < tasks.length; i++) {
 | 
						|
//         let marked_answerR = document.getElementById(assemble_answer_radio_id(i, tasks[i]["player_answer"]));
 | 
						|
//         if (marked_answerR !== null) {
 | 
						|
//             marked_answerR.checked = true;
 | 
						|
//         }
 | 
						|
//     }
 | 
						|
// }
 |