Everything should update in place, and will (hopefully) not break of the front end gets bad data or no data.
This commit is contained in:
parent
fcad6b49a8
commit
87771622cb
33
tunictracker/empty_spoiler.json
Normal file
33
tunictracker/empty_spoiler.json
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
{
|
||||||
|
"Debug": {
|
||||||
|
"Name": "",
|
||||||
|
"Seed": "",
|
||||||
|
"SpoilerSeed": "",
|
||||||
|
"Archipelago": false,
|
||||||
|
"Randomized": false,
|
||||||
|
"HexQuest": false,
|
||||||
|
"EntranceRando": false,
|
||||||
|
"FixedShops": false
|
||||||
|
},
|
||||||
|
"Totals": {
|
||||||
|
"Entrances": { "Total": 0, "Undiscovered": 0 },
|
||||||
|
"Checks": { "Total": 0, "Undiscovered": 0 }
|
||||||
|
},
|
||||||
|
"Current": {
|
||||||
|
"Scene": "No Scene",
|
||||||
|
"Respawn": "",
|
||||||
|
"Dath": "",
|
||||||
|
"HasLaurels": false,
|
||||||
|
"HasDath": false
|
||||||
|
},
|
||||||
|
"Scenes": {
|
||||||
|
"No Scene": {
|
||||||
|
"Totals": {
|
||||||
|
"Entrances": { "Total": 0, "Undiscovered": 0 },
|
||||||
|
"Checks": { "Total": 0, "Undiscovered": 0 }
|
||||||
|
},
|
||||||
|
"Checks": {},
|
||||||
|
"Entrances": {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,182 +1,216 @@
|
|||||||
window.onload = () => {
|
window.onload = () => {
|
||||||
let overview = {
|
//
|
||||||
checks: document.getElementById("overview_checks"),
|
let overview = document.getElementById("overview");
|
||||||
entrances: document.getElementById("overview_entrances"),
|
let summary_list = overview.querySelector(".summary-list");
|
||||||
summary: document.getElementById("summary"),
|
let breakdown_list = overview.querySelector(".breakdown-list");
|
||||||
};
|
let breakdown_current = document.getElementById("breakdown-current");
|
||||||
let current_scene = {
|
|
||||||
name: document.getElementById("current_scene_text"),
|
|
||||||
checks: {
|
|
||||||
title: document.getElementById("current_scene_checks_title"),
|
|
||||||
list: document.getElementById("current_scene_checks_list"),
|
|
||||||
},
|
|
||||||
entrances: {
|
|
||||||
title: document.getElementById("current_scene_entrances_title"),
|
|
||||||
list: document.getElementById("current_scene_entrances_list"),
|
|
||||||
mapped: document.getElementById("current_scene_entrances_mapped"),
|
|
||||||
},
|
|
||||||
};
|
|
||||||
let line_elem = document
|
|
||||||
.getElementById("current_scene_checks_list")
|
|
||||||
.firstElementChild.cloneNode(true);
|
|
||||||
let mapped_line_elem = document
|
|
||||||
.getElementById("current_scene_entrances_mapped")
|
|
||||||
.firstElementChild.cloneNode(true);
|
|
||||||
let summary_element = document
|
|
||||||
.getElementById("summary")
|
|
||||||
.firstElementChild.cloneNode(true);
|
|
||||||
summary_element.classList.forEach((class_name) => {
|
|
||||||
if (class_name == "bg-green-900") {
|
|
||||||
summary_element.classList.remove(class_name);
|
|
||||||
} else if (class_name == "bg-yellow-900") {
|
|
||||||
summary_element.classList.remove(class_name);
|
|
||||||
} else if (class_name == "bg-blue-900") {
|
|
||||||
summary_element.classList.remove(class_name);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
const refresh_interval = setInterval(
|
const refresh_interval = setInterval(
|
||||||
refresh_elements,
|
refresh_elements,
|
||||||
500,
|
500,
|
||||||
overview,
|
overview,
|
||||||
current_scene,
|
summary_list,
|
||||||
line_elem,
|
breakdown_list,
|
||||||
mapped_line_elem,
|
breakdown_current
|
||||||
summary_element
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
async function refresh_elements(
|
async function refresh_elements(
|
||||||
overview,
|
overview,
|
||||||
current_scene,
|
summary_list,
|
||||||
line_elem,
|
breakdown_list,
|
||||||
mapped_line_elem,
|
breakdown_current
|
||||||
summary_element
|
|
||||||
) {
|
) {
|
||||||
fetch("http://localhost:8000/spoiler")
|
fetch("http://localhost:8000/spoiler")
|
||||||
.then((response) => response.json())
|
.then((response) => response.json())
|
||||||
.then((data) => {
|
.then(
|
||||||
const response_object = JSON.parse(JSON.stringify(data));
|
(data) => {
|
||||||
const overview_checks_undiscovered =
|
// Attempt to receive response JSON.
|
||||||
response_object.Totals.Checks.Undiscovered;
|
const response_object = JSON.parse(JSON.stringify(data));
|
||||||
const overview_checks_total = response_object.Totals.Checks.Total;
|
|
||||||
const overview_entrances_undiscovered =
|
// Parse out data from the back-end into variables.
|
||||||
response_object.Totals.Entrances.Undiscovered;
|
const overview_checks_undiscovered =
|
||||||
const overview_entrances_total = response_object.Totals.Entrances.Total;
|
response_object.Totals.Checks.Undiscovered;
|
||||||
const current_scene_name = response_object.Current.Scene;
|
const overview_checks_total = response_object.Totals.Checks.Total;
|
||||||
const current_scene_checks_undiscovered =
|
const overview_entrances_undiscovered =
|
||||||
response_object.Scenes[current_scene_name].Totals.Checks.Undiscovered;
|
response_object.Totals.Entrances.Undiscovered;
|
||||||
const current_scene_checks_total =
|
const overview_entrances_total = response_object.Totals.Entrances.Total;
|
||||||
response_object.Scenes[current_scene_name].Totals.Checks.Total;
|
const current_scene_name = response_object.Current.Scene;
|
||||||
const current_scene_entrances_undiscovered =
|
const all_scenes = response_object.Scenes;
|
||||||
response_object.Scenes[current_scene_name].Totals.Entrances
|
let new_breakdown_list = overview
|
||||||
.Undiscovered;
|
.querySelector(".breakdown-list")
|
||||||
const current_scene_entrances_total =
|
.cloneNode(true);
|
||||||
response_object.Scenes[current_scene_name].Totals.Entrances.Total;
|
let new_summary_list = overview
|
||||||
const current_scene_checks_list =
|
.querySelector(".summary-list")
|
||||||
response_object.Scenes[current_scene_name].Checks;
|
.cloneNode(true);
|
||||||
const current_scene_entrances_list =
|
new_breakdown_list.innerHTML = "";
|
||||||
response_object.Scenes[current_scene_name].Entrances;
|
new_summary_list.firstElementChild.innerHTML = "";
|
||||||
const all_scenes = response_object.Scenes;
|
|
||||||
overview.checks.textContent = `Checks: ${overview_checks_undiscovered}/${overview_checks_total}`;
|
// Refresh elements with new data from the back end.
|
||||||
overview.entrances.textContent = `Entrances: ${overview_entrances_undiscovered}/${overview_entrances_total}`;
|
|
||||||
current_scene.name.textContent = current_scene_name;
|
// Clone all the needed elements for updating.
|
||||||
current_scene.checks.title.textContent = `Checks: ${current_scene_checks_undiscovered}/${current_scene_checks_total}`;
|
let overview_checks_title = overview.querySelector(".overview-checks");
|
||||||
current_scene.entrances.title.textContent = `Entrances: ${current_scene_entrances_undiscovered}/${current_scene_entrances_total}`;
|
let overview_entrances_title = overview.querySelector(
|
||||||
current_scene.checks.list.innerHTML = "";
|
".overview-entrances"
|
||||||
current_scene.entrances.list.innerHTML = "";
|
);
|
||||||
current_scene.entrances.mapped.innerHTML = "";
|
let summary_block =
|
||||||
overview.summary.innerHTML = "";
|
summary_list.firstElementChild.firstElementChild.cloneNode(true);
|
||||||
Object.keys(current_scene_checks_list).forEach((check) => {
|
let breakdown_block = breakdown_list.firstElementChild.cloneNode(true);
|
||||||
if (!current_scene_checks_list[check]) {
|
breakdown_block.classList.remove("hidden");
|
||||||
line_elem.textContent = `❌ ${check}`;
|
|
||||||
current_scene.checks.list.appendChild(line_elem.cloneNode(true));
|
// Set content to updated data.
|
||||||
}
|
overview_checks_title.textContent = `Checks: ${overview_checks_undiscovered}/${overview_checks_total}`;
|
||||||
});
|
overview_entrances_title.textContent = `Entrances: ${overview_entrances_undiscovered}/${overview_entrances_total}`;
|
||||||
Object.keys(current_scene_entrances_list).forEach((entrances) => {
|
|
||||||
if (current_scene_entrances_list[entrances] == "") {
|
// Create new lists with updated data.
|
||||||
line_elem.textContent = `❌ ${entrances}`;
|
Object.keys(all_scenes).forEach((scene) => {
|
||||||
current_scene.entrances.list.appendChild(line_elem.cloneNode(true));
|
// Create variables for element pointers.
|
||||||
} else {
|
summary_block =
|
||||||
mapped_line_elem.textContent = `✔️ ${entrances} -> ${current_scene_entrances_list[entrances]}`;
|
summary_list.firstElementChild.firstElementChild.cloneNode(true);
|
||||||
current_scene.entrances.mapped.appendChild(
|
summary_block.classList.remove("hidden");
|
||||||
mapped_line_elem.cloneNode(true)
|
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.classList.remove("hidden");
|
||||||
|
let breakdown_block_title = breakdown_block.querySelector(
|
||||||
|
".breakdown-block-title"
|
||||||
);
|
);
|
||||||
}
|
let breakdown_block_checks_title = breakdown_block.querySelector(
|
||||||
});
|
".breakdown-block-checks-title"
|
||||||
let scene_div = document.createElement("div");
|
);
|
||||||
let checks_div = document.createElement("div");
|
let new_breakdown_block_checks_list = breakdown_block
|
||||||
let entrances_div = document.createElement("div");
|
.querySelector(".breakdown-block-checks-list")
|
||||||
let scene_checks_undiscovered = 0;
|
.cloneNode(true);
|
||||||
let scene_checks_total = 0;
|
let breakdown_block_checks_list_item = breakdown_block
|
||||||
let scene_entrances_undiscovered = 0;
|
.querySelector(".breakdown-block-checks-list")
|
||||||
let scene_entrances_total = 0;
|
.firstElementChild.cloneNode(true);
|
||||||
Object.keys(all_scenes).forEach((scene) => {
|
breakdown_block_checks_list_item.classList.remove("hidden");
|
||||||
summary_element.innerHTML = "";
|
let breakdown_block_entrances_title = breakdown_block.querySelector(
|
||||||
scene_div.textContent = scene;
|
".breakdown-block-entrances-title"
|
||||||
scene_checks_undiscovered =
|
);
|
||||||
all_scenes[scene]["Totals"]["Checks"]["Undiscovered"];
|
let new_breakdown_block_entrances_list = breakdown_block
|
||||||
scene_checks_total = all_scenes[scene]["Totals"]["Checks"]["Total"];
|
.querySelector(".breakdown-block-entrances-list")
|
||||||
scene_entrances_undiscovered =
|
.cloneNode(true);
|
||||||
all_scenes[scene]["Totals"]["Entrances"]["Undiscovered"];
|
let breakdown_block_entrances_list_item = breakdown_block
|
||||||
scene_entrances_total =
|
.querySelector(".breakdown-block-entrances-list")
|
||||||
all_scenes[scene]["Totals"]["Entrances"]["Total"];
|
.firstElementChild.cloneNode(true);
|
||||||
if (scene_entrances_total <= 0) {
|
breakdown_block_entrances_list_item.classList.remove("hidden");
|
||||||
return;
|
let new_breakdown_block_mapped_list = breakdown_block
|
||||||
}
|
.querySelector(".breakdown-block-mapped-list")
|
||||||
if (scene == current_scene.name.textContent) {
|
.cloneNode(true);
|
||||||
return;
|
let breakdown_block_mapped_list_item = breakdown_block
|
||||||
}
|
.querySelector(".breakdown-block-mapped-list")
|
||||||
checks_div.textContent = `Checks: ${scene_checks_undiscovered}/${scene_checks_total}`;
|
.firstElementChild.cloneNode(true);
|
||||||
entrances_div.textContent = `Entrances: ${scene_entrances_undiscovered}/${scene_entrances_total}`;
|
breakdown_block_mapped_list_item.classList.remove("hidden");
|
||||||
if (scene_checks_undiscovered > 0 && scene_entrances_undiscovered > 0) {
|
|
||||||
if (scene_entrances_undiscovered == scene_entrances_total) {
|
// Create variables for commonly used values.
|
||||||
summary_element.classList.add("bg-red-900");
|
let scene_checks_undiscovered =
|
||||||
summary_element.classList.remove(
|
all_scenes[scene].Totals.Checks.Undiscovered;
|
||||||
"bg-green-900",
|
let scene_checks_total = all_scenes[scene].Totals.Checks.Total;
|
||||||
"bg-yellow-900",
|
let scene_entrances_undiscovered =
|
||||||
"bg-blue-900"
|
all_scenes[scene].Totals.Entrances.Undiscovered;
|
||||||
);
|
let scene_entrances_total = all_scenes[scene].Totals.Entrances.Total;
|
||||||
} else {
|
|
||||||
summary_element.classList.add("bg-green-900");
|
// Set textContent.
|
||||||
summary_element.classList.remove(
|
summary_title.textContent = scene;
|
||||||
"bg-blue-900",
|
summary_checks.textContent = `Checks: ${scene_checks_undiscovered}/${scene_checks_total}`;
|
||||||
"bg-yellow-900",
|
summary_entrances.textContent = `Entrances: ${scene_entrances_undiscovered}/${scene_entrances_total}`;
|
||||||
"bg-red-900"
|
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}`;
|
||||||
|
|
||||||
|
// Create checks, entrances, and mapped entrances lists.
|
||||||
|
Object.keys(all_scenes[scene].Checks).forEach((check) => {
|
||||||
|
if (!all_scenes[scene].Checks[check]) {
|
||||||
|
breakdown_block_checks_list_item.textContent = `❌ ${check}`;
|
||||||
|
new_breakdown_block_checks_list.appendChild(
|
||||||
|
breakdown_block_checks_list_item.cloneNode(true)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
Object.keys(all_scenes[scene].Entrances).forEach((entrances) => {
|
||||||
|
if (all_scenes[scene].Entrances[entrances] == "") {
|
||||||
|
breakdown_block_entrances_list_item.textContent = `❌ ${entrances}`;
|
||||||
|
new_breakdown_block_entrances_list.appendChild(
|
||||||
|
breakdown_block_entrances_list_item.cloneNode(true)
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
breakdown_block_mapped_list_item.textContent = `✔️ ${entrances} -> ${all_scenes[scene].Entrances[entrances]}`;
|
||||||
|
new_breakdown_block_mapped_list.appendChild(
|
||||||
|
breakdown_block_mapped_list_item.cloneNode(true)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Apply color coding to summary block
|
||||||
|
summary_block.classList.remove(
|
||||||
|
"bg-green-900",
|
||||||
|
"bg-yellow-900",
|
||||||
|
"bg-blue-900",
|
||||||
|
"bg-red-900"
|
||||||
|
);
|
||||||
|
if (
|
||||||
|
scene_checks_undiscovered > 0 &&
|
||||||
|
scene_entrances_undiscovered > 0
|
||||||
|
) {
|
||||||
|
if (scene_entrances_undiscovered == scene_entrances_total) {
|
||||||
|
summary_block.classList.add("bg-red-900");
|
||||||
|
} else {
|
||||||
|
summary_block.classList.add("bg-green-900");
|
||||||
|
}
|
||||||
|
} else if (scene_checks_undiscovered > 0) {
|
||||||
|
summary_block.classList.add("bg-yellow-900");
|
||||||
|
} else if (scene_entrances_undiscovered > 0) {
|
||||||
|
summary_block.classList.add("bg-blue-900");
|
||||||
}
|
}
|
||||||
} else if (scene_checks_undiscovered > 0) {
|
|
||||||
summary_element.classList.add("bg-yellow-900");
|
// Replace lists
|
||||||
summary_element.classList.remove(
|
breakdown_block
|
||||||
"bg-blue-900",
|
.querySelector(".breakdown-block-checks-list")
|
||||||
"bg-green-900",
|
.replaceWith(new_breakdown_block_checks_list);
|
||||||
"bg-red-900"
|
breakdown_block
|
||||||
|
.querySelector(".breakdown-block-entrances-list")
|
||||||
|
.replaceWith(new_breakdown_block_entrances_list);
|
||||||
|
breakdown_block
|
||||||
|
.querySelector(".breakdown-block-mapped-list")
|
||||||
|
.replaceWith(new_breakdown_block_mapped_list);
|
||||||
|
|
||||||
|
// Append relevant elements to lists.
|
||||||
|
if (scene == current_scene_name) {
|
||||||
|
summary_block.classList.add("hidden");
|
||||||
|
breakdown_current.firstElementChild.replaceWith(
|
||||||
|
breakdown_block.cloneNode(true)
|
||||||
|
);
|
||||||
|
breakdown_block.classList.add("hidden");
|
||||||
|
} else if (
|
||||||
|
scene_checks_undiscovered <= 0 &&
|
||||||
|
scene_entrances_undiscovered <= 0
|
||||||
|
) {
|
||||||
|
summary_block.classList.add("hidden");
|
||||||
|
breakdown_block.classList.add("hidden");
|
||||||
|
}
|
||||||
|
new_summary_list.firstElementChild.appendChild(
|
||||||
|
summary_block.cloneNode(true)
|
||||||
);
|
);
|
||||||
} else if (scene_entrances_undiscovered > 0) {
|
new_breakdown_list.appendChild(breakdown_block.cloneNode(true));
|
||||||
summary_element.classList.add("bg-blue-900");
|
});
|
||||||
summary_element.classList.remove(
|
|
||||||
"bg-green-900",
|
// Replace with new data.
|
||||||
"bg-yellow-900",
|
summary_list.replaceWith(new_summary_list.cloneNode(true));
|
||||||
"bg-red-900"
|
breakdown_list.replaceWith(new_breakdown_list.cloneNode(true));
|
||||||
);
|
document
|
||||||
} else {
|
.getElementById("breakdown-current")
|
||||||
summary_element.classList.remove(
|
.replaceWith(breakdown_current.cloneNode(true));
|
||||||
"bg-green-900",
|
},
|
||||||
"bg-yellow-900",
|
(error) => {
|
||||||
"bg-blue-900",
|
return error;
|
||||||
"bg-red-900"
|
}
|
||||||
);
|
);
|
||||||
}
|
|
||||||
summary_element.appendChild(scene_div.cloneNode(true));
|
|
||||||
summary_element.appendChild(checks_div.cloneNode(true));
|
|
||||||
summary_element.appendChild(entrances_div.cloneNode(true));
|
|
||||||
overview.summary.appendChild(summary_element.cloneNode(true));
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Outdated funcion to log the data gathered from the backend.
|
||||||
function log_elements() {
|
function log_elements() {
|
||||||
console.log(overview.checks.textContent);
|
console.log(overview.checks.textContent);
|
||||||
console.log(overview.entrances.textContent);
|
console.log(overview.entrances.textContent);
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<title>Tunic Tracker Redux</title>
|
<title>Tunic Tracker Redux</title>
|
||||||
|
<meta name="description" content="Tunic Transition Tracker">
|
||||||
|
<meta name="keywords" content="HTML, CSS, JavaScript">
|
||||||
<meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
|
<meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
@ -9,11 +11,10 @@
|
|||||||
{% load static tailwind_tags %}
|
{% load static tailwind_tags %}
|
||||||
{% tailwind_css %}
|
{% tailwind_css %}
|
||||||
{% load static %}
|
{% load static %}
|
||||||
<script src="{% static 'tracker/assets/refresh.js' %}"></script>
|
<script src="{% static "tracker/assets/refresh.js" %}"></script>
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-[#242424]">
|
<body class="bg-[#242424]">
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
{% endblock content %}
|
||||||
{% endblock %}
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
60
tunictracker/tracker/templates/tracker/breakdown/block.html
Normal file
60
tunictracker/tracker/templates/tracker/breakdown/block.html
Normal file
@ -0,0 +1,60 @@
|
|||||||
|
<div class="p-4 flex flex-col max-w-full rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark {{ extra_classes }}">
|
||||||
|
<div class="flex text-lg breakdown-block-title">{{ scene_title }}</div>
|
||||||
|
<div class="flex flex-col md:flex-row justify-center md:space-x-4">
|
||||||
|
<div class="flex flex-col basis-1/2 overflow-hidden">
|
||||||
|
<div class="my-2 flex flex-col space-y-2">
|
||||||
|
<div class="text-md breakdown-block-checks-title">
|
||||||
|
Checks: {{ scene_data.Totals.Checks.Undiscovered }}/{{ scene_data.Totals.Checks.Total }}
|
||||||
|
</div>
|
||||||
|
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
||||||
|
</div>
|
||||||
|
<div class="pb-4 flex flex-col space-y-2 overflow-x-scroll breakdown-block-checks-list">
|
||||||
|
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden">
|
||||||
|
</ul>
|
||||||
|
{% for check_name, check in scene_data.Checks.items %}
|
||||||
|
{% if not check %}
|
||||||
|
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1">
|
||||||
|
❌ {{ check_name }}
|
||||||
|
</ul>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col basis-1/2 overflow-hidden">
|
||||||
|
<div class="my-2 flex flex-col space-y-2">
|
||||||
|
<div class="text-md breakdown-block-entrances-title">
|
||||||
|
Entrances: {{ scene_data.Totals.Entrances.Undiscovered }}/{{ scene_data.Totals.Entrances.Total }}
|
||||||
|
</div>
|
||||||
|
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
||||||
|
</div>
|
||||||
|
<div class="pb-4 flex flex-col space-y-2 overflow-x-scroll breakdown-block-entrances-list">
|
||||||
|
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden">
|
||||||
|
</ul>
|
||||||
|
{% for entrance_origin, entrance_destination in scene_data.Entrances.items %}
|
||||||
|
{% if entrance_destination == "" %}
|
||||||
|
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1">
|
||||||
|
❌ {{ entrance_origin }}
|
||||||
|
</ul>
|
||||||
|
{% else %}
|
||||||
|
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden">
|
||||||
|
❌ {{ entrance_origin }}
|
||||||
|
</ul>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="overflow-x-scroll">
|
||||||
|
<div class="flex flex-col space-y-2 mx-auto min-w-max breakdown-block-mapped-list">
|
||||||
|
<ul class="bg-bluelight rounded-md px-1 hidden">
|
||||||
|
</ul>
|
||||||
|
{% for entrance_origin, entrance_destination in scene_data.Entrances.items %}
|
||||||
|
{% if entrance_destination %}
|
||||||
|
<ul class="bg-bluelight rounded-md px-1">
|
||||||
|
✔️ {{ entrance_origin }} -> {{ entrance_destination }}
|
||||||
|
</ul>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -1,134 +1,80 @@
|
|||||||
{% extends 'index.html' %}
|
{% extends "index.html" %}
|
||||||
{% load static %}
|
{% load static %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="container monospace">
|
<div class="container monospace">
|
||||||
<div class="m-4 ring-4 rounded-md text-[#eee] bg-bluelight-translucent-dark ring-bluelight-dark">
|
<div class="m-4 ring-4 rounded-md text-[#eee] bg-bluelight-translucent-dark ring-bluelight-dark">
|
||||||
{% if debug != '' %}
|
{% if debug != '' %}
|
||||||
<div class="p-4 flex flex-col space-y-4">
|
<div class="p-4 flex flex-col space-y-4">
|
||||||
<div class="flex pt-4 text-2xl mx-2">
|
<div class="flex pt-4 text-2xl mx-2">
|
||||||
<span class="relative inline-block align-middle h-8 w-8"><img src="{% static 'tracker/images/neofox_flag_trans_256.png' %}" alt="A trans pride fox emoji." /></span>
|
<span class="relative inline-block align-middle h-8 w-8">
|
||||||
Tunic Transition Tracker
|
<img src="{% static 'tracker/images/neofox_flag_trans_256.png' %}"
|
||||||
</div>
|
alt="A trans pride fox emoji."
|
||||||
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
width=""
|
||||||
<div class="p-4 flex flex-col max-w-full space-y-2 md:space-y-4 text-md rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
height="" />
|
||||||
<div class="text-lg">Overview</div>
|
</span>
|
||||||
<div class="flex flex-col md:flex-row md:space-x-4 space-y-2 md:space-y-0">
|
Tunic Transition Tracker
|
||||||
<div class="flex basis-1/2" id="overview_checks">Checks: {{ totals.Checks.Undiscovered }}/{{ totals.Checks.Total }}</div>
|
|
||||||
<div class="flex basis-1/2" id="overview_entrances">Entrances: {{ totals.Entrances.Undiscovered }}/{{ totals.Entrances.Total }}</div>
|
|
||||||
</div>
|
|
||||||
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
|
||||||
<details class="group p-2 flex flex-col space-y-4 rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
|
||||||
<summary class="text-lg">Breakdown</summary>
|
|
||||||
<div class="grid gap-4 md:grid-cols-3 grid-flow-row" id="summary">
|
|
||||||
{% for scene, scene_totals in totals.items %}
|
|
||||||
{% if scene == current_scene %}
|
|
||||||
<div class="p-2 flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 hidden">
|
|
||||||
<div>{{ scene }}:</div>
|
|
||||||
<div>Checks: {{ scene_totals.Checks.Undiscovered }}/{{ scene_totals.Checks.Total }}</div>
|
|
||||||
<div>Entrances: {{ scene_totals.Entrances.Undiscovered }}/{{ scene_totals.Entrances.Total }}</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% elif scene != 'Entrances' and scene != 'Checks' %}
|
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
||||||
{% if scene_totals.Checks.Undiscovered > 0 and scene_totals.Entrances.Undiscovered > 0 %}
|
<div class="p-4 flex flex-col max-w-full space-y-4 md:space-y-4 text-md rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark"
|
||||||
{% if scene_totals.Entrances.Undiscovered == scene_totals.Entrances.Total %}
|
id="overview">
|
||||||
<div class="p-2 flex flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 bg-red-900">
|
<div class="text-lg">Overview</div>
|
||||||
<div>{{ scene }}:</div>
|
<div class="flex flex-col md:flex-row md:space-x-4 space-y-2 md:space-y-0">
|
||||||
<div>Checks: {{ scene_totals.Checks.Undiscovered }}/{{ scene_totals.Checks.Total }}</div>
|
<div class="flex basis-1/2 overview-checks">Checks: {{ totals.Checks.Undiscovered }}/{{ totals.Checks.Total }}</div>
|
||||||
<div>Entrances: {{ scene_totals.Entrances.Undiscovered }}/{{ scene_totals.Entrances.Total }}</div>
|
<div class="flex basis-1/2 overview-entrances">
|
||||||
|
Entrances: {{ totals.Entrances.Undiscovered }}/{{ totals.Entrances.Total }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
||||||
<div class="p-2 flex flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 bg-green-900">
|
<details class="group flex flex-col rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
||||||
<div>{{ scene }}:</div>
|
<summary class="justify-start p-2 text-lg">Summary</summary>
|
||||||
<div>Checks: {{ scene_totals.Checks.Undiscovered }}/{{ scene_totals.Checks.Total }}</div>
|
<div class="p-4 summary-list">{% include "tracker/summary/list.html" %}</div>
|
||||||
<div>Entrances: {{ scene_totals.Entrances.Undiscovered }}/{{ scene_totals.Entrances.Total }}</div>
|
</details>
|
||||||
</div>
|
<details class="group flex flex-col rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
||||||
{% elif scene_totals.Checks.Undiscovered > 0 %}
|
<summary class="justify-start p-2 text-lg">Breakdown</summary>
|
||||||
<div class="p-2 flex flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 bg-yellow-900">
|
<div class="p-4 flex flex-col space-y-4 breakdown-list">
|
||||||
<div>{{ scene }}:</div>
|
{% include "tracker/breakdown/block.html" with extra_classes="hidden" %}
|
||||||
<div>Checks: {{ scene_totals.Checks.Undiscovered }}/{{ scene_totals.Checks.Total }}</div>
|
{% for scene_title, scene_data in scenes.items %}
|
||||||
<div>Entrances: {{ scene_totals.Entrances.Undiscovered }}/{{ scene_totals.Entrances.Total }}</div>
|
{% include "tracker/breakdown/block.html" %}
|
||||||
</div>
|
{% endfor %}
|
||||||
{% elif scene_totals.Entrances.Undiscovered > 0 %}
|
</div>
|
||||||
<div class="p-2 flex flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 bg-blue-900">
|
</details>
|
||||||
<div>{{ scene }}:</div>
|
</div>
|
||||||
<div>Checks: {{ scene_totals.Checks.Undiscovered }}/{{ scene_totals.Checks.Total }}</div>
|
<div id="breakdown-current">
|
||||||
<div>Entrances: {{ scene_totals.Entrances.Undiscovered }}/{{ scene_totals.Entrances.Total }}</div>
|
{% include "tracker/breakdown/block.html" with scene_title=current_scene.title scene_data=current_scene.data %}
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
<details class="group flex max-w-full rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
||||||
{% endif %}
|
<summary class="justify-start p-2">Tracker Debug</summary>
|
||||||
{% endfor %}
|
<div class="p-2 pl-4 pr-4 flex flex-col space-y-2">
|
||||||
</div>
|
<div>
|
||||||
</details>
|
<ul>
|
||||||
</div>
|
Name: {{ debug.Name }}
|
||||||
<div class="p-4 flex flex-col max-w-full rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
</ul>
|
||||||
<div class="flex text-lg" id="current_scene_text">{{ current_scene }}</div>
|
<ul>
|
||||||
<div class="flex flex-col md:flex-row justify-center md:space-x-4">
|
Seed: {{ debug.Seed }}
|
||||||
<div class="flex flex-col basis-1/2 overflow-hidden">
|
</ul>
|
||||||
<div class="my-2 flex flex-col space-y-2">
|
<ul>
|
||||||
<div class="text-md" id="current_scene_checks_title">Checks: {{ scene_data.Totals.Checks.Undiscovered }}/{{ scene_data.Totals.Checks.Total }}</div>
|
Spoiler Seed: {{ debug.SpoilerSeed }}
|
||||||
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
</ul>
|
||||||
|
<ul>
|
||||||
|
Archipelago: {{ debug.Archipelago }}
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
Randomized: {{ debug.Randomized }}
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
Hex Quest: {{ debug.HexQuest }}
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
Entrance Randomizer: {{ debug.EntranceRando }}
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
Fixed Shops: {{ debug.FixedShops }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</details>
|
||||||
</div>
|
</div>
|
||||||
<div class="pb-4 flex flex-col space-y-2 overflow-x-scroll" id="current_scene_checks_list">
|
{% else %}
|
||||||
{% if scene_data.Totals.Checks.Total > 0 %}
|
<div id="no_data" />{% endif %}</div>
|
||||||
{% for check_name, check in scene_data.Checks.items %}
|
|
||||||
{% if not check.Check %}
|
|
||||||
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1">❌ {{ check_name }}</ul>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
{% else %}
|
|
||||||
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden"></ul>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col basis-1/2 overflow-hidden">
|
|
||||||
<div class="my-2 flex flex-col space-y-2">
|
|
||||||
<div class="text-md" id="current_scene_entrances_title">Entrances: {{ scene_data.Totals.Entrances.Undiscovered }}/{{ scene_data.Totals.Entrances.Total }}</div>
|
|
||||||
<hr class="border-2 border-bluelight-translucent-dark rounded-md" />
|
|
||||||
</div>
|
|
||||||
<div class="pb-4 flex flex-col space-y-2 overflow-x-scroll" id="current_scene_entrances_list">
|
|
||||||
{% if scene_data.Totals.Entrances.Total > 0 %}
|
|
||||||
{% for entrance_origin, entrance_destination in scene_data.Entrances.items %}
|
|
||||||
{% if not entrance_destination.Entrance != '' %}
|
|
||||||
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1">❌ {{ entrance_origin }}</ul>
|
|
||||||
{% else %}
|
|
||||||
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden">❌ {{ entrance_origin }}</ul>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
{% else %}
|
|
||||||
<ul class="min-w-max bg-bluelight-translucent rounded-md px-1 hidden"></ul>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="overflow-x-scroll">
|
|
||||||
<div class="flex flex-col space-y-2 mx-auto min-w-max" id="current_scene_entrances_mapped">
|
|
||||||
{% for entrance_origin, entrance_destination in scene_data.Entrances.items %}
|
|
||||||
{% if entrance_destination.Entrance %}
|
|
||||||
<ul class="bg-bluelight rounded-md px-1">✔️ {{ entrance_origin }} -> {{ entrance_destination.Entrance }}</ul>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<details class="group flex max-w-full rounded-md ring-4 bg-bluelight-translucent ring-bluelight-dark">
|
|
||||||
<summary class="justify-start p-2">Tracker Debug</summary>
|
|
||||||
<div class="p-2 pl-4 pr-4 flex flex-col space-y-2">
|
|
||||||
<div>
|
|
||||||
<ul>Name: {{ debug.Name }}</ul>
|
|
||||||
<ul>Seed: {{ debug.Seed }}</ul>
|
|
||||||
<ul>Spoiler Seed: {{ debug.SpoilerSeed }}</ul>
|
|
||||||
<ul>Archipelago: {{ debug.Archipelago }}</ul>
|
|
||||||
<ul>Randomized: {{ debug.Randomized }}</ul>
|
|
||||||
<ul>Hex Quest: {{ debug.HexQuest }}</ul>
|
|
||||||
<ul>Entrance Randomizer: {{ debug.EntranceRando }}</ul>
|
|
||||||
<ul>Fixed Shops: {{ debug.FixedShops }}</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
</div>
|
|
||||||
{% else %}
|
|
||||||
<div id="no_data" />
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
{% endblock content %}
|
||||||
{% endblock %}
|
|
||||||
|
|||||||
@ -0,0 +1,9 @@
|
|||||||
|
<div class="p-2 flex flex-col rounded-md ring-4 ring-bluelight-dark bg-opacity-50 {{ extra_classes }}">
|
||||||
|
<div class="summary-title">{{ scene }}:</div>
|
||||||
|
<div class="summary-checks">
|
||||||
|
Checks: {{ scene_data.Totals.Checks.Undiscovered }}/{{ scene_data.Totals.Checks.Total }}
|
||||||
|
</div>
|
||||||
|
<div class="summary-entrances">
|
||||||
|
Entrances: {{ scene_data.Totals.Entrances.Undiscovered }}/{{ scene_data.Totals.Entrances.Total }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
20
tunictracker/tracker/templates/tracker/summary/list.html
Normal file
20
tunictracker/tracker/templates/tracker/summary/list.html
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
<div class="grid gap-4 md:grid-cols-3 grid-flow-row">
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="hidden" %}
|
||||||
|
{% for scene, scene_data in scenes.items %}
|
||||||
|
{% if scene == current_scene.title %}
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="hidden" %}
|
||||||
|
{% elif scene != "Entrances" and scene != "Checks" %}
|
||||||
|
{% if scene_data.Totals.Checks.Undiscovered > 0 and scene_data.Totals.Entrances.Undiscovered > 0 %}
|
||||||
|
{% if scene_data.Totals.Entrances.Undiscovered == scene_data.Totals.Entrances.Total %}
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="bg-red-900" %}
|
||||||
|
{% else %}
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="bg-green-900" %}
|
||||||
|
{% endif %}
|
||||||
|
{% elif scene_data.Totals.Checks.Undiscovered > 0 %}
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="bg-yellow-900" %}
|
||||||
|
{% elif scene_data.Totals.Entrances.Undiscovered > 0 %}
|
||||||
|
{% include "tracker/summary/block.html" with extra_classes="bg-blue-900" %}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
@ -13,58 +13,32 @@ def index(request):
|
|||||||
try:
|
try:
|
||||||
request_data = requests.get('http://localhost:8000/spoiler').text
|
request_data = requests.get('http://localhost:8000/spoiler').text
|
||||||
except:
|
except:
|
||||||
context = {
|
with open('empty_spoiler.json', 'r') as t:
|
||||||
"debug": "",
|
try:
|
||||||
"totals": "",
|
tracker_output = loads(t.read())
|
||||||
"scene": "",
|
except:
|
||||||
"scene_data": ""
|
return
|
||||||
}
|
try:
|
||||||
template = loader.get_template("tracker/index.html")
|
tracker_output = loads(request_data)
|
||||||
return HttpResponse(template.render(context, request))
|
except:
|
||||||
tracker_output = loads(request_data)
|
with open('empty_spoiler.json', 'r') as t:
|
||||||
# with open('spoiler.json', 'r') as t:
|
try:
|
||||||
# tracker_output = loads(t.read())
|
tracker_output = loads(t.read())
|
||||||
|
except:
|
||||||
|
return
|
||||||
tracker_debug = tracker_output["Debug"]
|
tracker_debug = tracker_output["Debug"]
|
||||||
tracker_totals = tracker_output["Totals"]
|
tracker_totals = tracker_output["Totals"]
|
||||||
tracker_current_scene = tracker_output["Current"]["Scene"]
|
tracker_current_scene = tracker_output["Current"]["Scene"]
|
||||||
tracker_current_scene_data = tracker_output["Scenes"][tracker_current_scene]
|
tracker_current_scane_data = tracker_output["Scenes"][tracker_current_scene]
|
||||||
|
tracker_scenes = tracker_output["Scenes"]
|
||||||
template = loader.get_template("tracker/index.html")
|
template = loader.get_template("tracker/index.html")
|
||||||
for i in tracker_output["Scenes"]:
|
|
||||||
checks_total = tracker_output["Scenes"][i]["Totals"]["Checks"]["Total"]
|
|
||||||
checks_undiscovered = tracker_output["Scenes"][i]["Totals"]["Checks"]["Undiscovered"]
|
|
||||||
entrances_total = tracker_output["Scenes"][i]["Totals"]["Entrances"]["Total"]
|
|
||||||
entrances_undiscovered = tracker_output["Scenes"][i]["Totals"]["Entrances"]["Undiscovered"]
|
|
||||||
temp_data = {
|
|
||||||
"Checks": {
|
|
||||||
"Total": checks_total,
|
|
||||||
"Undiscovered": checks_undiscovered
|
|
||||||
},
|
|
||||||
"Entrances": {
|
|
||||||
"Total": entrances_total,
|
|
||||||
"Undiscovered": entrances_undiscovered
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tracker_totals[i] = temp_data
|
|
||||||
temp_tracker_checks = tracker_current_scene_data["Checks"]
|
|
||||||
for i, check in enumerate(temp_tracker_checks.keys()):
|
|
||||||
temp_data = {
|
|
||||||
"Check": temp_tracker_checks[check],
|
|
||||||
"CheckNum": floor(int(i) % 3)
|
|
||||||
}
|
|
||||||
temp_tracker_checks[check] = temp_data
|
|
||||||
tracker_current_scene_data["Checks"] = temp_tracker_checks
|
|
||||||
temp_tracker_entrances = tracker_current_scene_data["Entrances"]
|
|
||||||
for i, entrance in enumerate(temp_tracker_entrances.keys()):
|
|
||||||
temp_data = {
|
|
||||||
"Entrance": temp_tracker_entrances[entrance],
|
|
||||||
"EntranceNum": floor(int(i) % 3)
|
|
||||||
}
|
|
||||||
temp_tracker_entrances[entrance] = temp_data
|
|
||||||
tracker_current_scene_data["Entrances"] = temp_tracker_entrances
|
|
||||||
context = {
|
context = {
|
||||||
"debug": tracker_debug,
|
"debug": tracker_debug,
|
||||||
"totals": tracker_totals,
|
"totals": tracker_totals,
|
||||||
"current_scene": tracker_current_scene,
|
"scenes": tracker_scenes,
|
||||||
"scene_data": tracker_current_scene_data
|
"current_scene": {
|
||||||
|
"title": tracker_current_scene,
|
||||||
|
"data": tracker_current_scane_data
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return HttpResponse(template.render(context, request))
|
return HttpResponse(template.render(context, request))
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user