added logic to show results of both operations

This commit is contained in:
Karma Riuk
2025-05-14 22:02:12 +02:00
parent 7dbfd51258
commit 5f6908ba38

View File

@ -5,7 +5,15 @@ const progressBar = document.getElementById("progress-bar");
const progressText = document.getElementById("progress-text"); const progressText = document.getElementById("progress-text");
const statusEl = document.getElementById("status"); const statusEl = document.getElementById("status");
const resultsContainer = document.getElementById("results-container"); const commentResultsContainer = document.querySelector(
".results-container#comment",
);
const refinementResultsContainer = document.querySelector(
".results-container#refinement",
);
const tick = "✅";
const cross = "❌";
let results = {}; let results = {};
@ -47,6 +55,12 @@ document.getElementById("upload-btn").onclick = async () => {
results = json; results = json;
progressContainer.style.display = "none"; progressContainer.style.display = "none";
const resultsContainer =
type === "comment"
? commentResultsContainer
: refinementResultsContainer;
resultsContainer.style.display = "block"; resultsContainer.style.display = "block";
const tbody = resultsContainer.querySelector("table tbody"); const tbody = resultsContainer.querySelector("table tbody");
@ -55,16 +69,27 @@ document.getElementById("upload-btn").onclick = async () => {
Object.entries(results).forEach(([id, info]) => { Object.entries(results).forEach(([id, info]) => {
const row = tbody.insertRow(); // create a new row const row = tbody.insertRow(); // create a new row
const idCell = row.insertCell(); // cell 1: id const idCell = row.insertCell(); // cell 1: id
const commentCell = row.insertCell(); // cell 2: proposed comment
const scoreCell = row.insertCell(); // cell 3: bleu score
idCell.textContent = id; idCell.textContent = id;
if (type == "comment") {
const commentCell = row.insertCell();
const scoreCell = row.insertCell();
commentCell.innerHTML = `<span class='comment-cell'>${info["proposed_comment"]}</span>`; commentCell.innerHTML = `<span class='comment-cell'>${info["proposed_comment"]}</span>`;
scoreCell.textContent = info["max_bleu_score"].toFixed(2); scoreCell.textContent = info["max_bleu_score"].toFixed(2);
} else {
const compiledCell = row.insertCell();
const testedCell = row.insertCell();
compiledCell.textContent =
info["compilation"] || false ? tick : cross;
testedCell.textContent = info["test"] || false ? tick : cross;
}
}); });
}; };
document.getElementById("download-results").onclick = () => { [...document.getElementsByClassName("download-results")].forEach((e) => {
e.onclick = () => {
const dataStr = const dataStr =
"data:text/json;charset=utf-8," + "data:text/json;charset=utf-8," +
encodeURIComponent(JSON.stringify(results)); encodeURIComponent(JSON.stringify(results));
@ -74,7 +99,8 @@ document.getElementById("download-results").onclick = () => {
document.body.appendChild(dlAnchorElem); document.body.appendChild(dlAnchorElem);
dlAnchorElem.click(); dlAnchorElem.click();
document.body.removeChild(dlAnchorElem); document.body.removeChild(dlAnchorElem);
}; };
});
function setProgress(percent) { function setProgress(percent) {
progressBar.value = percent; progressBar.value = percent;