diff --git a/index.html b/index.html index ecd5f32f..20d2032e 100644 --- a/index.html +++ b/index.html @@ -5374,7 +5374,9 @@ data-tip="Apply a filter" style="padding-block: 0.1em; display: flex; gap: 0.5em; width: 100%" > - Search: + Search: State: @@ -5389,7 +5391,7 @@ - Burgs: 0 + Burgs: 0 of 0 @@ -5466,15 +5468,11 @@ - - - - - Total routes: 0 + Routes: 0 Average length: 0 @@ -5495,11 +5493,14 @@ > + Search: - + River @@ -5520,10 +5521,6 @@ - - - - @@ -5556,6 +5553,9 @@ class="icon-download" > + Search: @@ -5723,15 +5723,17 @@ > - - - - + + Search: + + - - Total: 0 markers + + Markers: 0 of 0 @@ -8567,12 +8569,12 @@ - - - + + + - + diff --git a/modules/ui/burgs-overview.js b/modules/ui/burgs-overview.js index 54abae98..30506c2b 100644 --- a/modules/ui/burgs-overview.js +++ b/modules/ui/burgs-overview.js @@ -64,24 +64,32 @@ function overviewBurgs(settings = {stateId: null, cultureId: null}) { // add line for each burg function burgsOverviewAddLines() { + const searchText = byId("burgsSearch").value.toLowerCase().trim(); const selectedStateId = +byId("burgsFilterState").value; const selectedCultureId = +byId("burgsFilterCulture").value; - const searchText = (byId("burgsSearch").value || "").toLowerCase().trim(); - let filtered = pack.burgs.filter(b => b.i && !b.removed); // all valid burgs - if (selectedStateId !== -1) filtered = filtered.filter(b => b.state === selectedStateId); // filtered by state - if (selectedCultureId !== -1) filtered = filtered.filter(b => b.culture === selectedCultureId); // filtered by culture - - // filter by search text + + const validBurgs = pack.burgs.filter(b => b.i && !b.removed); + let filtered = validBurgs; + if (searchText) { + // filter by search text filtered = filtered.filter(b => { - const name = (b.name || "").toLowerCase(); - const state = (pack.states[b.state]?.name || "").toLowerCase(); + const name = b.name.toLowerCase(); + const state = (pack.states[b.state].name || "").toLowerCase(); const prov = pack.cells.province[b.cell]; - const province = prov ? (pack.provinces[prov]?.name || "").toLowerCase() : ""; - const culture = (pack.cultures[b.culture]?.name || "").toLowerCase(); - return name.includes(searchText) || state.includes(searchText) || province.includes(searchText) || culture.includes(searchText); + const province = prov ? pack.provinces[prov]?.name.toLowerCase() : ""; + const culture = (pack.cultures[b.culture].name || "").toLowerCase(); + return ( + name.includes(searchText) || + state.includes(searchText) || + province.includes(searchText) || + culture.includes(searchText) || + b.group.toLowerCase().includes(searchText) + ); }); } + if (selectedStateId !== -1) filtered = filtered.filter(b => b.state === selectedStateId); // filtered by state + if (selectedCultureId !== -1) filtered = filtered.filter(b => b.culture === selectedCultureId); // filtered by culture body.innerHTML = ""; let lines = ""; @@ -133,7 +141,7 @@ function overviewBurgs(settings = {stateId: null, cultureId: null}) { body.insertAdjacentHTML("beforeend", lines); // update footer - burgsFooterBurgs.innerHTML = filtered.length; + burgsFooterBurgs.innerHTML = `${filtered.length} of ${validBurgs.length}`; burgsFooterPopulation.innerHTML = filtered.length ? si(totalPopulation / filtered.length) : 0; // add listeners diff --git a/modules/ui/markers-overview.js b/modules/ui/markers-overview.js index 0155bf11..dd59d0aa 100644 --- a/modules/ui/markers-overview.js +++ b/modules/ui/markers-overview.js @@ -4,18 +4,19 @@ function overviewMarkers() { closeDialogs("#markersOverview, .stable"); if (!layerIsOn("toggleMarkers")) toggleMarkers(); - const markerGroup = document.getElementById("markers"); - const body = document.getElementById("markersBody"); - const markersInverPin = document.getElementById("markersInverPin"); - const markersInverLock = document.getElementById("markersInverLock"); - const markersFooterNumber = document.getElementById("markersFooterNumber"); - const markersOverviewRefresh = document.getElementById("markersOverviewRefresh"); - const markersAddFromOverview = document.getElementById("markersAddFromOverview"); - const markersGenerationConfig = document.getElementById("markersGenerationConfig"); - const markersRemoveAll = document.getElementById("markersRemoveAll"); - const markersExport = document.getElementById("markersExport"); - const markerTypeInput = document.getElementById("addedMarkerType"); - const markerTypeSelector = document.getElementById("markerTypeSelector"); + const markerGroup = byId("markers"); + const body = byId("markersBody"); + const markersInverPin = byId("markersInverPin"); + const markersInverLock = byId("markersInverLock"); + const markersFooterNumber = byId("markersFooterNumber"); + const markersOverviewRefresh = byId("markersOverviewRefresh"); + const markersAddFromOverview = byId("markersAddFromOverview"); + const markersGenerationConfig = byId("markersGenerationConfig"); + const markersRemoveAll = byId("markersRemoveAll"); + const markersExport = byId("markersExport"); + const markerTypeInput = byId("addedMarkerType"); + const markerTypeSelector = byId("markerTypeSelector"); + const markersSearch = byId("markersSearch"); addLines(); @@ -27,8 +28,6 @@ function overviewMarkers() { position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"} }); - const markersSearch = document.getElementById("markersSearch"); - const listeners = [ listen(body, "click", handleLineClick), listen(markersInverPin, "click", invertPin), @@ -70,18 +69,16 @@ function overviewMarkers() { } function addLines() { - const searchInput = document.getElementById("markersSearch"); - const searchText = (searchInput?.value || "").toLowerCase().trim(); let markers = pack.markers; - - // filter by search text + + const searchText = byId("markersSearch").value.toLowerCase().trim(); if (searchText) { markers = markers.filter(marker => { const type = (marker.type || "").toLowerCase(); return type.includes(searchText); }); } - + const lines = markers .map(({i, type, icon, pinned, lock}) => { return /* html */ ` @@ -107,6 +104,7 @@ function overviewMarkers() { body.innerHTML = lines; markersFooterNumber.innerText = markers.length; + markersFooterTotal.innerText = pack.markers.length; applySorting(markersHeader); } @@ -142,7 +140,7 @@ function overviewMarkers() { } function focusOnMarker(i) { - highlightElement(document.getElementById(`marker${i}`), 2); + highlightElement(byId(`marker${i}`), 2); } function pinMarker(el, i) { @@ -180,7 +178,7 @@ function overviewMarkers() { } function toggleMarkerTypeMenu() { - document.getElementById("markerTypeSelectMenu").classList.toggle("visible"); + byId("markerTypeSelectMenu").classList.toggle("visible"); } function toggleAddMarker() { @@ -197,7 +195,7 @@ function overviewMarkers() { function removeMarker(i) { notes = notes.filter(note => note.id !== `marker${i}`); pack.markers = pack.markers.filter(marker => marker.i !== i); - document.getElementById(`marker${i}`)?.remove(); + byId(`marker${i}`)?.remove(); addLines(); } @@ -215,7 +213,7 @@ function overviewMarkers() { if (lock) return true; const id = `marker${i}`; - document.getElementById(id)?.remove(); + byId(id)?.remove(); notes = notes.filter(note => note.id !== id); return false; }); diff --git a/modules/ui/rivers-overview.js b/modules/ui/rivers-overview.js index d5cb9b36..99732250 100644 --- a/modules/ui/rivers-overview.js +++ b/modules/ui/rivers-overview.js @@ -5,7 +5,7 @@ function overviewRivers() { closeDialogs("#riversOverview, .stable"); if (!layerIsOn("toggleRivers")) toggleRivers(); - const body = document.getElementById("riversBody"); + const body = byId("riversBody"); riversOverviewAddLines(); $("#riversOverview").dialog(); @@ -20,23 +20,22 @@ function overviewRivers() { }); // add listeners - document.getElementById("riversOverviewRefresh").addEventListener("click", riversOverviewAddLines); - document.getElementById("addNewRiver").addEventListener("click", toggleAddRiver); - document.getElementById("riverCreateNew").addEventListener("click", createRiver); - document.getElementById("riversBasinHighlight").addEventListener("click", toggleBasinsHightlight); - document.getElementById("riversExport").addEventListener("click", downloadRiversData); - document.getElementById("riversRemoveAll").addEventListener("click", triggerAllRiversRemove); - document.getElementById("riversSearch").addEventListener("input", riversOverviewAddLines); + byId("riversOverviewRefresh").on("click", riversOverviewAddLines); + byId("addNewRiver").on("click", toggleAddRiver); + byId("riverCreateNew").on("click", createRiver); + byId("riversBasinHighlight").on("click", toggleBasinsHightlight); + byId("riversExport").on("click", downloadRiversData); + byId("riversRemoveAll").on("click", triggerAllRiversRemove); + byId("riversSearch").on("input", riversOverviewAddLines); // add line for each river function riversOverviewAddLines() { body.innerHTML = ""; let lines = ""; const unit = distanceUnitInput.value; - const searchText = (document.getElementById("riversSearch").value || "").toLowerCase().trim(); - let filteredRivers = pack.rivers; - // filter by search text + let filteredRivers = pack.rivers; + const searchText = byId("riversSearch").value.toLowerCase().trim(); if (searchText) { filteredRivers = filteredRivers.filter(r => { const name = (r.name || "").toLowerCase(); @@ -77,22 +76,20 @@ function overviewRivers() { body.insertAdjacentHTML("beforeend", lines); // update footer - riversFooterNumber.innerHTML = filteredRivers.length; - const averageDischarge = rn(d3.mean(filteredRivers.map(r => r.discharge))); + riversFooterNumber.innerHTML = `${filteredRivers.length} of ${pack.rivers.length}`; + const averageDischarge = rn(d3.mean(filteredRivers.map(r => r.discharge))) || 0; riversFooterDischarge.innerHTML = averageDischarge + " m³/s"; - const averageLength = rn(d3.mean(filteredRivers.map(r => r.length))); + const averageLength = rn(d3.mean(filteredRivers.map(r => r.length))) || 0; riversFooterLength.innerHTML = averageLength * distanceScale + " " + unit; - const averageWidth = rn(d3.mean(filteredRivers.map(r => r.width)), 3); + const averageWidth = rn(d3.mean(filteredRivers.map(r => r.width)), 3) || 0; riversFooterWidth.innerHTML = rn(averageWidth * distanceScale, 3) + " " + unit; // add listeners - body.querySelectorAll("div.states").forEach(el => el.addEventListener("mouseenter", ev => riverHighlightOn(ev))); - body.querySelectorAll("div.states").forEach(el => el.addEventListener("mouseleave", ev => riverHighlightOff(ev))); - body.querySelectorAll("div > span.icon-dot-circled").forEach(el => el.addEventListener("click", zoomToRiver)); - body.querySelectorAll("div > span.icon-pencil").forEach(el => el.addEventListener("click", openRiverEditor)); - body - .querySelectorAll("div > span.icon-trash-empty") - .forEach(el => el.addEventListener("click", triggerRiverRemove)); + body.querySelectorAll("div.states").forEach(el => el.on("mouseenter", ev => riverHighlightOn(ev))); + body.querySelectorAll("div.states").forEach(el => el.on("mouseleave", ev => riverHighlightOff(ev))); + body.querySelectorAll("div > span.icon-dot-circled").forEach(el => el.on("click", zoomToRiver)); + body.querySelectorAll("div > span.icon-pencil").forEach(el => el.on("click", openRiverEditor)); + body.querySelectorAll("div > span.icon-trash-empty").forEach(el => el.on("click", triggerRiverRemove)); applySorting(riversHeader); } diff --git a/modules/ui/routes-overview.js b/modules/ui/routes-overview.js index fcb99077..883df3de 100644 --- a/modules/ui/routes-overview.js +++ b/modules/ui/routes-overview.js @@ -25,16 +25,16 @@ function overviewRoutes() { byId("routesExport").on("click", downloadRoutesData); byId("routesLockAll").on("click", toggleLockAll); byId("routesRemoveAll").on("click", triggerAllRoutesRemove); - byId("routesSearch").addEventListener("input", routesOverviewAddLines); + byId("routesSearch").on("input", routesOverviewAddLines); // add line for each route function routesOverviewAddLines() { body.innerHTML = ""; let lines = ""; - const searchText = (byId("routesSearch").value || "").toLowerCase().trim(); + let filteredRoutes = pack.routes; - // filter by search text + const searchText = byId("routesSearch").value.toLowerCase().trim(); if (searchText) { filteredRoutes = filteredRoutes.filter(route => { const name = (route.name || "").toLowerCase(); @@ -70,8 +70,8 @@ function overviewRoutes() { body.insertAdjacentHTML("beforeend", lines); // update footer - routesFooterNumber.innerHTML = filteredRoutes.length; - const averageLength = rn(d3.mean(filteredRoutes.map(r => r.length)) || 0); + routesFooterNumber.innerHTML = `${filteredRoutes.length} of ${pack.routes.length}`; + const averageLength = rn(d3.mean(filteredRoutes.map(r => r.length)) || 0) || 0; routesFooterLength.innerHTML = averageLength * distanceScale + " " + distanceUnitInput.value; // add listeners @@ -79,7 +79,7 @@ function overviewRoutes() { body.querySelectorAll("div.states").forEach(el => el.on("mouseleave", routeHighlightOff)); body.querySelectorAll("div > span.icon-dot-circled").forEach(el => el.on("click", zoomToRoute)); body.querySelectorAll("div > span.icon-pencil").forEach(el => el.on("click", openRouteEditor)); - body.querySelectorAll("div > span.locks").forEach(el => el.addEventListener("click", toggleLockStatus)); + body.querySelectorAll("div > span.locks").forEach(el => el.on("click", toggleLockStatus)); body.querySelectorAll("div > span.icon-trash-empty").forEach(el => el.on("click", triggerRouteRemove)); applySorting(routesHeader); diff --git a/versioning.js b/versioning.js index 855c99bc..6b1f88fd 100644 --- a/versioning.js +++ b/versioning.js @@ -13,7 +13,7 @@ * Example: 1.102.2 -> Major version 1, Minor version 102, Patch version 2 */ -const VERSION = "1.109.2"; +const VERSION = "1.110.0"; if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format or parsing function"); {