Moved holy cross codes to their own div, fixed "hide completed areas" checkbox.
This commit is contained in:
parent
a8e9c19afb
commit
28e3da069f
@ -20,22 +20,11 @@ window.onload = () => {
|
||||
);
|
||||
};
|
||||
|
||||
function banana(event) {
|
||||
show_breakdown(event.dataset.scene);
|
||||
}
|
||||
|
||||
function show_breakdown(scene) {
|
||||
console.log(scene);
|
||||
function open_breakdown(event) {
|
||||
let scene = event.dataset.scene;
|
||||
Array.from(document.getElementById("breakdown-list").children).forEach(
|
||||
(breakdown) => {
|
||||
if (breakdown.id == `${scene}-breakdown`) {
|
||||
console.log(
|
||||
`${
|
||||
document
|
||||
.getElementById("breakdown-current")
|
||||
.querySelector(".breakdown-block-title").textContent
|
||||
}, ${scene}`
|
||||
);
|
||||
if (
|
||||
!(
|
||||
document
|
||||
@ -52,6 +41,28 @@ function show_breakdown(scene) {
|
||||
);
|
||||
}
|
||||
|
||||
function hide_empty_summaries() {
|
||||
let summary_divs =
|
||||
document.getElementById("summary-list").firstElementChild.children;
|
||||
Array.from(summary_divs).forEach((summary) => {
|
||||
let checks_undiscovered =
|
||||
summary.querySelector(".summary-checks").dataset.checksUndiscovered;
|
||||
let entrances_undiscovered =
|
||||
summary.querySelector(".summary-entrances").dataset.entrancesUndiscovered;
|
||||
if (
|
||||
!(
|
||||
summary.querySelector(".summary-title").textContent == "Posterity" ||
|
||||
summary.querySelector(".summary-title").textContent == "Resurrection"
|
||||
) &&
|
||||
(checks_undiscovered <= 0 &&
|
||||
entrances_undiscovered <= 0)
|
||||
) {
|
||||
console.log(`${checks_undiscovered} and ${entrances_undiscovered}`)
|
||||
summary.classList.toggle("hidden");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function notices_ur_debug() {
|
||||
document.getElementById("debug-block").classList.toggle("hidden");
|
||||
}
|
||||
@ -140,18 +151,14 @@ async function refresh_elements(cross_codes) {
|
||||
let summary_block = document
|
||||
.getElementById("summary-list")
|
||||
.firstElementChild.firstElementChild.cloneNode(true);
|
||||
summary_block.id = "";
|
||||
let breakdown_block = document
|
||||
.getElementById("breakdown-list")
|
||||
.firstElementChild.cloneNode(true);
|
||||
breakdown_block.id = "";
|
||||
let cross_codes_block = document
|
||||
.getElementById("breakdown-list")
|
||||
.firstElementChild.querySelector(".codes-block")
|
||||
.cloneNode(true);
|
||||
breakdown_block.classList.remove("hidden");
|
||||
let debug_item = document
|
||||
.getElementById("debug-block")
|
||||
.querySelector(".debug-list")
|
||||
.firstElementChild.cloneNode(true);
|
||||
debug_item.classList.remove("hidden");
|
||||
let new_breakdown_list = document
|
||||
@ -162,6 +169,7 @@ async function refresh_elements(cross_codes) {
|
||||
.cloneNode(true);
|
||||
let new_debug_block = document
|
||||
.getElementById("debug-block")
|
||||
.querySelector(".debug-list")
|
||||
.cloneNode(true);
|
||||
let current_open_breakdown = "";
|
||||
Array.from(new_breakdown_list.children).forEach((scene) => {
|
||||
@ -222,22 +230,10 @@ async function refresh_elements(cross_codes) {
|
||||
.querySelector(".breakdown-block-mapped-list")
|
||||
.firstElementChild.cloneNode(true);
|
||||
|
||||
cross_codes_block = document
|
||||
.getElementById("breakdown-list")
|
||||
.firstElementChild.querySelector(".codes-block")
|
||||
.cloneNode(true);
|
||||
let new_cross_codes_block_list = cross_codes_block
|
||||
.querySelector(".codes-list")
|
||||
.cloneNode(true);
|
||||
let cross_codes_block_list_item = cross_codes_block
|
||||
.querySelector(".codes-list")
|
||||
.firstElementChild.cloneNode(true);
|
||||
|
||||
// Clear out current list content.
|
||||
new_breakdown_block_checks_list.innerHTML = "";
|
||||
new_breakdown_block_entrances_list.innerHTML = "";
|
||||
new_breakdown_block_mapped_list.innerHTML = "";
|
||||
new_cross_codes_block_list.innerHTML = "";
|
||||
new_breakdown_block_checks_list.appendChild(
|
||||
breakdown_block_checks_list_item.cloneNode(true)
|
||||
);
|
||||
@ -263,7 +259,12 @@ async function refresh_elements(cross_codes) {
|
||||
// Set textContent.
|
||||
summary_title.textContent = scene;
|
||||
summary_checks.textContent = `Checks: ${scene_checks_undiscovered}/${scene_checks_total}`;
|
||||
summary_checks.dataset.checksUndiscovered = scene_checks_undiscovered;
|
||||
summary_checks.dataset.checksTotal = scene_checks_undiscovered;
|
||||
summary_entrances.textContent = `Entrances: ${scene_entrances_undiscovered}/${scene_entrances_total}`;
|
||||
summary_entrances.dataset.entrancesUndiscovered =
|
||||
scene_entrances_undiscovered;
|
||||
summary_entrances.dataset.entrancesTotal = scene_entrances_total;
|
||||
breakdown_block_title.textContent = scene;
|
||||
breakdown_block_checks_title.textContent = `Checks: ${all_scenes[scene].Totals.Checks.Undiscovered}/${all_scenes[scene].Totals.Checks.Total}`;
|
||||
breakdown_block_entrances_title.textContent = `Entrances: ${all_scenes[scene].Totals.Entrances.Undiscovered}/${all_scenes[scene].Totals.Entrances.Total}`;
|
||||
@ -288,71 +289,11 @@ async function refresh_elements(cross_codes) {
|
||||
breakdown_block_mapped_list_item.id = `${entrances}-mapped`;
|
||||
breakdown_block_mapped_list_item.dataset.scene =
|
||||
all_scenes[scene].Entrances[entrances].Scene;
|
||||
// breakdown_block_mapped_list_item.onclick = () => {
|
||||
// show_breakdown(all_scenes[scene].Entrances[entrances].Scene);
|
||||
// };
|
||||
new_breakdown_block_mapped_list.appendChild(
|
||||
breakdown_block_mapped_list_item.cloneNode(true)
|
||||
);
|
||||
}
|
||||
});
|
||||
Object.keys(default_cross_codes).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = default_cross_codes[code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
Object.keys(global_cross_codes).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = global_cross_codes[code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
if (cross_codes_entered.Global[code]) {
|
||||
cross_codes_block_list_item.classList.add("hidden");
|
||||
} else {
|
||||
cross_codes_block_list_item.classList.remove("hidden");
|
||||
}
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
if (scene_has_codes) {
|
||||
Object.keys(cross_codes[scene]).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = cross_codes[scene][code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
if (cross_codes_entered[scene][code]) {
|
||||
cross_codes_block_list_item.classList.add("hidden");
|
||||
} else {
|
||||
cross_codes_block_list_item.classList.remove("hidden");
|
||||
}
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
// Apply color coding to summary block
|
||||
summary_block.firstElementChild.classList.remove(
|
||||
@ -422,17 +363,10 @@ async function refresh_elements(cross_codes) {
|
||||
breakdown_block
|
||||
.querySelector(".breakdown-block-mapped-list")
|
||||
.replaceWith(new_breakdown_block_mapped_list);
|
||||
breakdown_block.querySelector(".codes-block").classList.add("hidden");
|
||||
breakdown_block
|
||||
.querySelector(".codes-list")
|
||||
.replaceWith(new_cross_codes_block_list);
|
||||
|
||||
breakdown_block.id = `${
|
||||
breakdown_block.querySelector(".breakdown-block-title").textContent
|
||||
}-breakdown`;
|
||||
summary_block.id = `${
|
||||
summary_block.querySelector(".summary-title").textContent
|
||||
}-summary`;
|
||||
breakdown_block.classList.add("hidden");
|
||||
|
||||
// Append relevant elements to lists.
|
||||
@ -442,29 +376,103 @@ async function refresh_elements(cross_codes) {
|
||||
if (scene == current_scene_name) {
|
||||
summary_block.classList.add("hidden");
|
||||
breakdown_block.classList.remove("hidden");
|
||||
breakdown_block
|
||||
.querySelector(".codes-block")
|
||||
.classList.remove("hidden");
|
||||
document
|
||||
.getElementById("breakdown-current")
|
||||
.firstElementChild.replaceWith(breakdown_block.cloneNode(true));
|
||||
breakdown_block.classList.add("hidden");
|
||||
breakdown_block
|
||||
.querySelector(".codes-block")
|
||||
.classList.add("hidden");
|
||||
} else if (
|
||||
scene_checks_undiscovered <= 0 &&
|
||||
scene_entrances_total <= 0
|
||||
) {
|
||||
summary_block.classList.add("hidden");
|
||||
}
|
||||
if (document.getElementById("hideDone").checked) {
|
||||
if (
|
||||
scene_checks_undiscovered <= 0 &&
|
||||
scene_entrances_undiscovered <= 0
|
||||
) {
|
||||
summary_block.classList.add("hidden");
|
||||
}
|
||||
}
|
||||
summary_block.dataset.scene = scene;
|
||||
new_summary_list.firstElementChild.appendChild(
|
||||
summary_block.cloneNode(true)
|
||||
);
|
||||
new_breakdown_list.appendChild(breakdown_block.cloneNode(true));
|
||||
});
|
||||
let new_cross_codes_block_list = document
|
||||
.getElementById("codes-list")
|
||||
.cloneNode(true);
|
||||
let cross_codes_block_list_item = document
|
||||
.getElementById("codes-list")
|
||||
.firstElementChild.cloneNode(true);
|
||||
new_cross_codes_block_list.innerHTML = "";
|
||||
|
||||
Object.keys(default_cross_codes).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = default_cross_codes[code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
Object.keys(global_cross_codes).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = global_cross_codes[code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
if (cross_codes_entered.Global[code]) {
|
||||
cross_codes_block_list_item.classList.add("hidden");
|
||||
} else {
|
||||
cross_codes_block_list_item.classList.remove("hidden");
|
||||
}
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
if (!(typeof cross_codes[current_scene_name] === "undefined")) {
|
||||
Object.keys(cross_codes[current_scene_name]).forEach((code) => {
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-title"
|
||||
).textContent = code;
|
||||
cross_codes_block_list_item.querySelector(
|
||||
".codes-list-item-code"
|
||||
).textContent = cross_codes[current_scene_name][code]
|
||||
.replace(/U/g, "⬆️")
|
||||
.replace(/R/g, "➡️")
|
||||
.replace(/D/g, "⬇️")
|
||||
.replace(/L/g, "⬅️");
|
||||
if (cross_codes_entered[current_scene_name][code]) {
|
||||
cross_codes_block_list_item.classList.add("hidden");
|
||||
} else {
|
||||
cross_codes_block_list_item.classList.remove("hidden");
|
||||
}
|
||||
new_cross_codes_block_list.appendChild(
|
||||
cross_codes_block_list_item.cloneNode(true)
|
||||
);
|
||||
});
|
||||
}
|
||||
document
|
||||
.getElementById("codes-list")
|
||||
.replaceWith(new_cross_codes_block_list);
|
||||
|
||||
Object.keys(debug_info).forEach((item) => {
|
||||
debug_item.textContent = `${item}: ${debug_info[item]}`;
|
||||
debug_item.querySelector(
|
||||
".debug-item"
|
||||
).textContent = `${item}: ${debug_info[item]}`;
|
||||
new_debug_block.appendChild(debug_item.cloneNode(true));
|
||||
});
|
||||
|
||||
@ -477,13 +485,8 @@ async function refresh_elements(cross_codes) {
|
||||
.replaceWith(new_breakdown_list.cloneNode(true));
|
||||
document
|
||||
.getElementById("debug-block")
|
||||
.querySelector(".debug-list")
|
||||
.replaceWith(new_debug_block.cloneNode(true));
|
||||
|
||||
Object.keys(all_scenes).forEach((scene) => {
|
||||
document.getElementById(`${scene}-summary`).onclick = () => {
|
||||
show_breakdown(scene);
|
||||
};
|
||||
});
|
||||
},
|
||||
(error) => {
|
||||
document.getElementById("status-block").classList.remove("hidden");
|
||||
|
||||
@ -50,13 +50,13 @@
|
||||
<div class="p-1 flex flex-col space-y-2 mx-auto min-w-max breakdown-block-mapped-list">
|
||||
<button type="button"
|
||||
class="py-0.5 text-start bg-gradient-to-br from-bluelight-translucent-dark to-trans-pride-cyan-translucent rounded-md px-1 text-sm hidden"
|
||||
onclick="banana(this)"></button>
|
||||
onclick="open_breakdown(this)"></button>
|
||||
{% for entrance_origin, entrance_destination in scene_data.Entrances.items %}
|
||||
{% if entrance_destination %}
|
||||
<button type="button"
|
||||
class="py-0.5 text-start bg-gradient-to-br from-bluelight-translucent-dark to-trans-pride-cyan-translucent rounded-md px-1 text-sm shadow-sm shadow-[#242424]"
|
||||
id="{{ entrance_origin }}-mapped"
|
||||
onclick="banana(this)"
|
||||
onclick="open_breakdown(this)"
|
||||
data-scene="{{ entrance_destination.Scene }}">
|
||||
✔️ {{ entrance_origin }} -> {{ entrance_destination.Door }}
|
||||
</button>
|
||||
@ -64,7 +64,6 @@
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "tracker/codes/index.html" %}
|
||||
</div>
|
||||
<hr class="px-2 border-2 border-bluelight-translucent-dark rounded-xl" />
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
<details class="py-2 px-2 mt-2 flex flex-col space-y-4 max-w-full text-holy-cross text-base [text-shadow:_1px_1px_4px_rgb(0_0_0_/_100%)] rounded-xl bg-gradient-to-br from-[#ffe28530] to-[#ffffff30] drop-shadow-[0px_0px_4px_rgba(255,255,255,1)] justify-start {% if current_scene.title != scene_title %}hidden{% endif %} codes-block">
|
||||
<details class="py-2 px-2 mt-2 flex flex-col space-y-4 max-w-full text-holy-cross text-base [text-shadow:_1px_1px_4px_rgb(0_0_0_/_100%)] rounded-xl bg-gradient-to-br from-[#ffe28530] to-[#ffffff30] drop-shadow-[0px_0px_4px_rgba(255,255,255,1)] justify-start">
|
||||
<summary>Holy Cross Codes</summary>
|
||||
<hr class="border-2 border-holy-cross opacity-30 rounded-xl" />
|
||||
<div class="flex flex-col space-y-2 max-h-96 rounded-xl overflow-y-scroll">
|
||||
<ul class="grid grid-flow-row md:grid-cols-3 xl:grid-cols-5 gap-2 rounded-xl codes-list">
|
||||
<div class="grid grid-flow-row md:grid-cols-3 xl:grid-cols-5 gap-2 rounded-xl" id="codes-list">
|
||||
{% for name, code in default_codes.items %}
|
||||
{% include "tracker/codes/block.html" with is_entered=False %}
|
||||
{% endfor %}
|
||||
@ -17,6 +17,6 @@
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
@ -53,13 +53,14 @@
|
||||
<div id="breakdown-current">
|
||||
{% include "tracker/breakdown/block.html" with scene_title=current_scene.title scene_data=current_scene.data %}
|
||||
</div>
|
||||
{% include "tracker/codes/index.html" %}
|
||||
</div>
|
||||
<details class="py-2 px-4 flex flex-col space-y-2 max-w-full text-md rounded-lg bg-gradient-to-br from-bluelight-background-light to-bluelight-background">
|
||||
<summary class="justify-start">Settings</summary>
|
||||
{% include "tracker/settings/index.html" %}
|
||||
{% include "tracker/address/index.html" %}
|
||||
<div class="p-2 m-auto justify-center align-middle flex flex-row space-x-2">
|
||||
<input onclick="[].forEach.call(document.getElementsByClassName('from-highlight-empty-light'), x => x.classList[document.getElementById('hideDone').checked ? 'add' : 'remove']('hidden'))"
|
||||
<input onclick="hide_empty_summaries()"
|
||||
type="checkbox"
|
||||
id="hideDone"
|
||||
class="p-2 my-auto rounded-md bg-white bg-opacity-10 shadow-sm shadow-[#242424]" />
|
||||
@ -85,17 +86,16 @@
|
||||
<div class="p-2 flex flex-col space-y-2 max-w-full rounded-lg bg-white bg-opacity-10 shadow-lg shadow-bluelight-background-dark hidden"
|
||||
id="debug-block">
|
||||
<div class="px-2 text-lg">Tracker Debug</div>
|
||||
<div class="grid grid-flow-row md:grid-cols-2 xl:grid-cols-3 gap-2 space-y-2 max-w-full break-words"
|
||||
id="debug-block">
|
||||
<div class="max-h-full hidden">
|
||||
<ul class="px-2">
|
||||
<div class="grid grid-flow-row md:grid-cols-2 xl:grid-cols-3 gap-2 space-y-2 max-w-full break-words debug-list">
|
||||
<div class="max-h-full align-bottom flex flex-col-reverse hidden">
|
||||
<hr class="mt-1 border-2 border-[#24242480] rounded-xl" />
|
||||
<ul class="px-2 break-all sm:break-word debug-item">
|
||||
</ul>
|
||||
<hr class="mt-2 border-2 border-bluelight-dark rounded-xl" />
|
||||
</div>
|
||||
{% for name, value in debug.items %}
|
||||
<div class="max-h-full align-bottom flex flex-col-reverse">
|
||||
<hr class="mt-1 border-2 border-[#24242480] rounded-xl" />
|
||||
<ul class="px-2">
|
||||
<ul class="px-2 break-all sm:break-word debug-item">
|
||||
{{ name }}: {{ value }}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -1,12 +1,17 @@
|
||||
<button type="button"
|
||||
class="rounded-xl {{ is_hidden }}"
|
||||
id="{{ scene }}-summary">
|
||||
onclick="open_breakdown(this)"
|
||||
data-scene="{{ scene }}">
|
||||
<div class="p-2 *:mr-auto *:justify-start *:text-left min-h-full flex flex-col rounded-lg bg-gradient-to-tl shadow-sm shadow-[#242424] {{ extra_classes }}">
|
||||
<div class="summary-title">{{ scene }}:</div>
|
||||
<div class="summary-checks">
|
||||
<div class="summary-checks"
|
||||
data-checks-undiscovered="{{ scene_data.Totals.Checks.Undiscovered }}"
|
||||
data-checks-total="{{ scene_data.Totals.Checks.Total }}">
|
||||
Checks: {{ scene_data.Totals.Checks.Undiscovered }}/{{ scene_data.Totals.Checks.Total }}
|
||||
</div>
|
||||
<div class="summary-entrances">
|
||||
<div class="summary-entrances"
|
||||
data-entrances-undiscovered="{{ scene_data.Totals.Entrances.Undiscovered }}"
|
||||
data-entrances-total="{{ scene_data.Totals.Entrances.Total }}">
|
||||
Entrances: {{ scene_data.Totals.Entrances.Undiscovered }}/{{ scene_data.Totals.Entrances.Total }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user