diff --git a/tunictracker/tracker/static/tracker/assets/refresh.js b/tunictracker/tracker/static/tracker/assets/refresh.js index de07229..988e3ce 100644 --- a/tunictracker/tracker/static/tracker/assets/refresh.js +++ b/tunictracker/tracker/static/tracker/assets/refresh.js @@ -1,31 +1,18 @@ window.onload = () => { // - let overview = document.getElementById("overview"); - let summary_list = overview.querySelector(".summary-list"); - let breakdown_list = overview.querySelector(".breakdown-list"); - let breakdown_current = document.getElementById("breakdown-current"); - const refresh_interval = setInterval( - refresh_elements, - 500, - overview, - summary_list, - breakdown_list, - breakdown_current - ); + // let overview = document.getElementById("overview"); + // let breakdown_current = document.getElementById("breakdown-current"); + const refresh_interval = setInterval(refresh_elements, 500); }; -async function refresh_elements( - overview, - summary_list, - breakdown_list, - breakdown_current -) { +async function refresh_elements() { fetch("http://localhost:8000/spoiler") .then((response) => response.json()) .then( (data) => { // Attempt to receive response JSON. const response_object = JSON.parse(JSON.stringify(data)); + document.getElementById("status-block").classList.add("hidden") // Parse out data from the back-end into variables. const overview_checks_undiscovered = @@ -36,26 +23,37 @@ async function refresh_elements( const overview_entrances_total = response_object.Totals.Entrances.Total; const current_scene_name = response_object.Current.Scene; const all_scenes = response_object.Scenes; - let new_breakdown_list = overview - .querySelector(".breakdown-list") - .cloneNode(true); - let new_summary_list = overview - .querySelector(".summary-list") - .cloneNode(true); - new_breakdown_list.innerHTML = ""; - new_summary_list.firstElementChild.innerHTML = ""; // Refresh elements with new data from the back end. // Clone all the needed elements for updating. - let overview_checks_title = overview.querySelector(".overview-checks"); - let overview_entrances_title = overview.querySelector( - ".overview-entrances" - ); - let summary_block = - summary_list.firstElementChild.firstElementChild.cloneNode(true); - let breakdown_block = breakdown_list.firstElementChild.cloneNode(true); + let overview_checks_title = document + .getElementById("overview") + .querySelector(".overview-checks"); + let overview_entrances_title = document + .getElementById("overview") + .querySelector(".overview-entrances"); + let summary_block = document + .getElementById("overview") + .querySelector(".summary-list") + .firstElementChild.firstElementChild.cloneNode(true); + let breakdown_block = document + .getElementById("overview") + .querySelector(".breakdown-list") + .firstElementChild.cloneNode(true); breakdown_block.classList.remove("hidden"); + let new_breakdown_list = document + .getElementById("overview") + .querySelector(".breakdown-list") + .cloneNode(true); + let new_summary_list = document + .getElementById("overview") + .querySelector(".summary-list") + .cloneNode(true); + + // Clear out the current lists. + new_breakdown_list.innerHTML = ""; + new_summary_list.firstElementChild.innerHTML = ""; // Set content to updated data. overview_checks_title.textContent = `Checks: ${overview_checks_undiscovered}/${overview_checks_total}`; @@ -64,15 +62,20 @@ async function refresh_elements( // Create new lists with updated data. Object.keys(all_scenes).forEach((scene) => { // Create variables for element pointers. - summary_block = - summary_list.firstElementChild.firstElementChild.cloneNode(true); + summary_block = document + .getElementById("overview") + .querySelector(".summary-list") + .firstElementChild.firstElementChild.cloneNode(true); summary_block.classList.remove("hidden"); let summary_title = summary_block.querySelector(".summary-title"); let summary_checks = summary_block.querySelector(".summary-checks"); let summary_entrances = summary_block.querySelector(".summary-entrances"); - breakdown_block = breakdown_list.firstElementChild.cloneNode(true); + breakdown_block = document + .getElementById("overview") + .querySelector(".breakdown-list") + .firstElementChild.cloneNode(true); breakdown_block.classList.remove("hidden"); let breakdown_block_title = breakdown_block.querySelector( ".breakdown-block-title" @@ -105,6 +108,20 @@ async function refresh_elements( .firstElementChild.cloneNode(true); breakdown_block_mapped_list_item.classList.remove("hidden"); + // Clear out current list content. + new_breakdown_block_checks_list.innerHTML = ""; + new_breakdown_block_entrances_list.innerHTML = ""; + new_breakdown_block_mapped_list.innerHTML = ""; + new_breakdown_block_checks_list.appendChild( + breakdown_block_checks_list_item.cloneNode() + ); + new_breakdown_block_entrances_list.appendChild( + breakdown_block_entrances_list_item.cloneNode() + ); + new_breakdown_block_mapped_list.appendChild( + breakdown_block_mapped_list_item.cloneNode() + ); + // Create variables for commonly used values. let scene_checks_undiscovered = all_scenes[scene].Totals.Checks.Undiscovered; @@ -180,9 +197,9 @@ async function refresh_elements( // Append relevant elements to lists. if (scene == current_scene_name) { summary_block.classList.add("hidden"); - breakdown_current.firstElementChild.replaceWith( - breakdown_block.cloneNode(true) - ); + document + .getElementById("breakdown-current") + .firstElementChild.replaceWith(breakdown_block.cloneNode(true)); breakdown_block.classList.add("hidden"); } else if ( scene_checks_undiscovered <= 0 && @@ -198,13 +215,26 @@ async function refresh_elements( }); // Replace with new data. - summary_list.replaceWith(new_summary_list.cloneNode(true)); - breakdown_list.replaceWith(new_breakdown_list.cloneNode(true)); + // console.log(new_summary_list); + document + .getElementById("overview") + .querySelector(".summary-list") + .replaceWith(new_summary_list.cloneNode(true)); + document + .getElementById("overview") + .querySelector(".breakdown-list") + .replaceWith(new_breakdown_list.cloneNode(true)); document .getElementById("breakdown-current") - .replaceWith(breakdown_current.cloneNode(true)); + .replaceWith( + document.getElementById("breakdown-current").cloneNode(true) + ); + + // Debug + // console.log("We have data."); }, (error) => { + document.getElementById("status-block").classList.remove("hidden") return error; } ); diff --git a/tunictracker/tracker/templates/tracker/index.html b/tunictracker/tracker/templates/tracker/index.html index b56a53f..cca879b 100644 --- a/tunictracker/tracker/templates/tracker/index.html +++ b/tunictracker/tracker/templates/tracker/index.html @@ -15,6 +15,7 @@ Tunic Transition Tracker