From c401835eaf6fa93c13775f6edde340b8f533cdd1 Mon Sep 17 00:00:00 2001 From: sphericle <86196223+sphericle@users.noreply.github.com> Date: Wed, 2 Apr 2025 19:01:08 -0400 Subject: [PATCH 1/5] move dropdown into statsviewer class, write sort function --- .../static/js/modules/statsviewer.js | 23 ++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js index 4041da583..e13527af3 100644 --- a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js +++ b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js @@ -65,11 +65,11 @@ export class StatsViewer extends FilteredPaginator { }); } - let demonSortingModeDropdown = new Dropdown( + this.demonSortingModeDropdown = new Dropdown( document.getElementById("demon-sorting-mode-dropdown") ); - demonSortingModeDropdown.addEventListener((selected) => { + this.demonSortingModeDropdown.addEventListener((selected) => { window.localStorage.setItem("demon_sorting_mode", selected); if (selected === "Alphabetical") { @@ -87,7 +87,7 @@ export class StatsViewer extends FilteredPaginator { } }); - demonSortingModeDropdown.select( + this.demonSortingModeDropdown.select( localStorage.getItem("demon_sorting_mode") ?? "Alphabetical", true ); // default to alphabetical @@ -202,6 +202,23 @@ export function formatInto(parent, childs) { } } +export function sortDemons(sortOption, data) { + if (sortOption === "Alphabetical") { + data.sort((r1, r2) => + r1.demon?.name.localeCompare(r2.demon?.name) || + // for nation unbeaten section + r1.name.localeCompare(r2.name) + ); + } else if (sortOption === "Position") { + data.sort((r1, r2) => + r1.demon?.position - r2.demon?.position || + // for nation unbeaten section + r1.position - r2.position + ); + } + return data; +} + export class InteractiveWorldMap { constructor() { this.wrapper = document.getElementById("world-map-wrapper"); From 2b571be6cfa1d5f33906172af2610fd30a920749 Mon Sep 17 00:00:00 2001 From: sphericle <86196223+sphericle@users.noreply.github.com> Date: Wed, 2 Apr 2025 21:19:10 -0400 Subject: [PATCH 2/5] ok its mostly done i think --- .../static/js/modules/statsviewer.js | 40 +++++++----- .../static/js/statsviewer/individual.js | 20 ++++-- .../static/js/statsviewer/nation.js | 62 +++++++++++++++---- 3 files changed, 88 insertions(+), 34 deletions(-) diff --git a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js index e13527af3..a5a7ee382 100644 --- a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js +++ b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js @@ -182,6 +182,29 @@ export class StatsViewer extends FilteredPaginator { return element; } + + /** + * Sort demons by the selected sorting option + * @param {string} sortOption - The sorting option ("Alphabetical" or "Position") + * @param data - Demon data to sort + * @returns Sorted data + */ + sortStatsViewerRow(sortOption, data) { + if (sortOption === "Alphabetical") { + data.sort((r1, r2) => + r1.demon?.name.localeCompare(r2.demon?.name) || + // for nation unbeaten section + r1.name.localeCompare(r2.name) + ); + } else if (sortOption === "Position") { + data.sort((r1, r2) => + r1.demon?.position - r2.demon?.position || + // for nation unbeaten section + r1.position - r2.position + ); + } + return data; + } } export function formatInto(parent, childs) { @@ -202,23 +225,6 @@ export function formatInto(parent, childs) { } } -export function sortDemons(sortOption, data) { - if (sortOption === "Alphabetical") { - data.sort((r1, r2) => - r1.demon?.name.localeCompare(r2.demon?.name) || - // for nation unbeaten section - r1.name.localeCompare(r2.name) - ); - } else if (sortOption === "Position") { - data.sort((r1, r2) => - r1.demon?.position - r2.demon?.position || - // for nation unbeaten section - r1.position - r2.position - ); - } - return data; -} - export class InteractiveWorldMap { constructor() { this.wrapper = document.getElementById("world-map-wrapper"); diff --git a/pointercrate-demonlist-pages/static/js/statsviewer/individual.js b/pointercrate-demonlist-pages/static/js/statsviewer/individual.js index 8716c479c..f1d103081 100644 --- a/pointercrate-demonlist-pages/static/js/statsviewer/individual.js +++ b/pointercrate-demonlist-pages/static/js/statsviewer/individual.js @@ -25,9 +25,11 @@ class IndividualStatsViewer extends StatsViewer { this.setName(playerData.name, playerData.nationality); - this.formatDemonsInto(this._created, playerData.created); - this.formatDemonsInto(this._published, playerData.published); - this.formatDemonsInto(this._verified, playerData.verified); + const selectedSort = this.demonSortingModeDropdown.selected + + this.formatDemonsInto(this._created, this.sortStatsViewerRow(selectedSort, playerData.created)); + this.formatDemonsInto(this._published, this.sortStatsViewerRow(selectedSort, playerData.published)); + this.formatDemonsInto(this._verified, this.sortStatsViewerRow(selectedSort, playerData.verified)); let beaten = playerData.records.filter((record) => record.progress === 100); @@ -80,10 +82,16 @@ class IndividualStatsViewer extends StatsViewer { this.setHardest(hardest.name === "None" ? undefined : hardest); let non100Records = playerData.records - .filter((record) => record.progress !== 100) - .sort((r1, r2) => r1.progress - r2.progress); + .filter((record) => record.progress !== 100); + + this.formatRecordsInto(this._progress, this.sortStatsViewerRow(selectedSort, non100Records)); - this.formatRecordsInto(this._progress, non100Records); + this.demonSortingModeDropdown.addEventListener((selected) => { + this.formatDemonsInto(this._created, this.sortStatsViewerRow(selected, playerData.created)) + this.formatDemonsInto(this._published, this.sortStatsViewerRow(selected, playerData.published)) + this.formatDemonsInto(this._verified, this.sortStatsViewerRow(selected, playerData.verified)) + this.formatRecordsInto(this._progress, this.sortStatsViewerRow(selected, non100Records)) + }); } formatDemonsInto(element, demons) { diff --git a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js index 3f57c110f..4460a1a10 100644 --- a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js +++ b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js @@ -23,6 +23,8 @@ class NationStatsViewer extends StatsViewer { let nationData = response.data.data; + let selectedSort = this.demonSortingModeDropdown.selected; + this.setName(nationData.nation, nationData); let beaten = []; @@ -39,8 +41,10 @@ class NationStatsViewer extends StatsViewer { record.players.forEach(players.add, players); if (record.progress !== 100) { - if (!nationData.verified.some((d) => d.id === record.id)) + if (!nationData.verified.some((d) => d.id === record.id)) { + console.log('hi') progress.push(record); + } } else { beaten.push(record); @@ -105,23 +109,18 @@ class NationStatsViewer extends StatsViewer { .map((record) => this.formatDemonFromRecord(record, true)) ); - nationData.unbeaten.sort((r1, r2) => r1.name.localeCompare(r2.name)); - progress.sort((r1, r2) => r2.progress - r1.progress); - nationData.created.sort((r1, r2) => - r1.demon.name.localeCompare(r2.demon.name) - ); formatInto( this._unbeaten, - nationData.unbeaten.map((demon) => this.formatDemon(demon)) + this.sortStatsViewerRow(selectedSort, nationData.unbeaten).map((demon) => this.formatDemon(demon)) ); formatInto( this._progress, - progress.map((record) => this.formatDemonFromRecord(record)) + this.sortStatsViewerRow(selectedSort, progress).map((record) => this.formatDemonFromRecord(record)) ); formatInto( this._created, - nationData.created.map((creation) => { + this.sortStatsViewerRow(selectedSort, nationData.created).map((creation) => { return this.makeTooltip( this.formatDemon(creation.demon), "(Co)created by " + @@ -135,7 +134,7 @@ class NationStatsViewer extends StatsViewer { ); formatInto( this._verified, - nationData.verified.map((verification) => { + this.sortStatsViewerRow(selectedSort, nationData.verified).map((verification) => { return this.makeTooltip( this.formatDemon(verification.demon), "Verified by: ", @@ -145,7 +144,7 @@ class NationStatsViewer extends StatsViewer { ); formatInto( this._published, - nationData.published.map((publication) => { + this.sortStatsViewerRow(selectedSort, nationData.published).map((publication) => { return this.makeTooltip( this.formatDemon(publication.demon), "Published by: ", @@ -153,6 +152,47 @@ class NationStatsViewer extends StatsViewer { ); }) ); + + this.demonSortingModeDropdown.addEventListener((selected) => { + console.log(nationData) + if (nationData.created.length > 0) { + formatInto(this._created, this.sortStatsViewerRow(selected, nationData.created).map((creation) => { + return this.makeTooltip( + this.formatDemon(creation.demon), + "(Co)created by " + + creation.players.length + + " player" + + (creation.players.length === 1 ? "" : "s") + + " in this country: ", + creation.players.join(", ") + ); + })); + } + + if (nationData.published.length > 0) { + formatInto(this._published, this.sortStatsViewerRow(selected, nationData.published).map((publication) => { + return this.makeTooltip( + this.formatDemon(publication.demon), + "Published by: ", + publication.players.join(", ") + ); + })); + } + if (nationData.verified.length > 0) { + formatInto(this._verified, this.sortStatsViewerRow(selected, nationData.verified).map((verification) => { + return this.makeTooltip( + this.formatDemon(verification.demon), + "Verified by: ", + verification.players.join(", ") + ); + })); + } + if (progress.length > 0) + formatInto(this._progress, this.sortStatsViewerRow(selected, progress).map((record) => this.formatDemonFromRecord(record))); + + if (nationData.unbeaten.length > 0) + formatInto(this._unbeaten, this.sortStatsViewerRow(selected, nationData.unbeaten).map((demon) => this.formatDemon(demon))); + }); } makeTooltip(hoverElement, title, content) { From 0dd02f9dfb42973f54b80b024619d0673a24d5dd Mon Sep 17 00:00:00 2001 From: sphericle <86196223+sphericle@users.noreply.github.com> Date: Thu, 3 Apr 2025 08:20:02 -0400 Subject: [PATCH 3/5] =?UTF-8?q?i=20forgot=20to=20remove=20this=20?= =?UTF-8?q?=F0=9F=98=AD=F0=9F=98=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pointercrate-demonlist-pages/static/js/statsviewer/nation.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js index 4460a1a10..0765700a7 100644 --- a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js +++ b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js @@ -41,10 +41,8 @@ class NationStatsViewer extends StatsViewer { record.players.forEach(players.add, players); if (record.progress !== 100) { - if (!nationData.verified.some((d) => d.id === record.id)) { - console.log('hi') + if (!nationData.verified.some((d) => d.id === record.id)) progress.push(record); - } } else { beaten.push(record); From 99b391826f3679b50a480b2535fbf0e5eb88a535 Mon Sep 17 00:00:00 2001 From: sphericle <86196223+sphericle@users.noreply.github.com> Date: Thu, 8 May 2025 18:41:09 -0400 Subject: [PATCH 4/5] this should work now... --- .../static/js/modules/statsviewer.js | 26 ++++++++++++------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js index a5a7ee382..1e86d4bd1 100644 --- a/pointercrate-demonlist-pages/static/js/modules/statsviewer.js +++ b/pointercrate-demonlist-pages/static/js/modules/statsviewer.js @@ -191,17 +191,23 @@ export class StatsViewer extends FilteredPaginator { */ sortStatsViewerRow(sortOption, data) { if (sortOption === "Alphabetical") { - data.sort((r1, r2) => - r1.demon?.name.localeCompare(r2.demon?.name) || - // for nation unbeaten section - r1.name.localeCompare(r2.name) - ); + data.sort((r1, r2) => { + if (r1.demon) { + return r1.demon.name.localeCompare(r2.demon.name) + } else { + // nation unbeaten section does not have "demon" key + return r1.name.localeCompare(r2.name) + } + }); } else if (sortOption === "Position") { - data.sort((r1, r2) => - r1.demon?.position - r2.demon?.position || - // for nation unbeaten section - r1.position - r2.position - ); + data.sort((r1, r2) => { + if (r1.demon) { + return r1.demon.position - r2.demon.position + } else { + // nation unbeaten section does not have "demon" key + return r1.position - r2.position + } + }); } return data; } From 64b3743112423177f0d02dd7dc4e2492548a5df5 Mon Sep 17 00:00:00 2001 From: sphericle <86196223+sphericle@users.noreply.github.com> Date: Thu, 8 May 2025 18:46:50 -0400 Subject: [PATCH 5/5] remove this too --- pointercrate-demonlist-pages/static/js/statsviewer/nation.js | 1 - 1 file changed, 1 deletion(-) diff --git a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js index 0765700a7..634b9c471 100644 --- a/pointercrate-demonlist-pages/static/js/statsviewer/nation.js +++ b/pointercrate-demonlist-pages/static/js/statsviewer/nation.js @@ -152,7 +152,6 @@ class NationStatsViewer extends StatsViewer { ); this.demonSortingModeDropdown.addEventListener((selected) => { - console.log(nationData) if (nationData.created.length > 0) { formatInto(this._created, this.sortStatsViewerRow(selected, nationData.created).map((creation) => { return this.makeTooltip(