From 4febdc04a2441dbe56e29da3db9c4040964a8b71 Mon Sep 17 00:00:00 2001 From: Trent Larson <trent@trentlarson.com> Date: Mon, 30 Dec 2024 13:51:42 -0700 Subject: [PATCH] show results for project map grouping when clicked --- src/views/DiscoverView.vue | 35 ++++++++++++++++++++++++++--------- 1 file changed, 26 insertions(+), 9 deletions(-) diff --git a/src/views/DiscoverView.vue b/src/views/DiscoverView.vue index 4d0bd9774..ba718f1ee 100644 --- a/src/views/DiscoverView.vue +++ b/src/views/DiscoverView.vue @@ -44,6 +44,7 @@ isMappedActive = false; isRemoteActive = false; isSearchVisible = true; + tempSearchBox = null; searchLocal(); " v-bind:class="computedLocalTabStyleClassNames()" @@ -59,7 +60,6 @@ --> </a> </li> - <!-- <li> <a href="#" @@ -69,13 +69,14 @@ isMappedActive = true; isRemoteActive = false; isSearchVisible = false; + searchTerms = ''; + tempSearchBox = null; " v-bind:class="computedMappedTabStyleClassNames()" > Mapped </a> </li> - --> <li> <a href="#" @@ -85,6 +86,7 @@ isMappedActive = false; isRemoteActive = true; isSearchVisible = true; + tempSearchBox = null; searchAll(); " v-bind:class="computedRemoteTabStyleClassNames()" @@ -115,7 +117,7 @@ </div> </div> - <div v-if="isMappedActive"> + <div v-if="isMappedActive && !tempSearchBox"> <div class="mt-4 h-96 w-5/6 mx-auto"> <l-map ref="projectMap" @@ -250,6 +252,7 @@ export default class DiscoverView extends Vue { markers: { [key: string]: L.Marker } = {}; remoteCount = -1; searchBox: { name: string; bbox: BoundingBox } | null = null; + tempSearchBox: BoundingBox | null = null; zoomedSoDoNotMove = false; // make this function available to the Vue template @@ -384,7 +387,11 @@ export default class DiscoverView extends Vue { public async searchLocal(beforeId?: string) { this.resetCounts(); - if (!this.searchBox) { + const searchBox = + (this.isMappedActive && this.tempSearchBox) || + (this.isLocalActive && this.searchBox?.bbox); + + if (!searchBox) { this.projects = []; return; } @@ -399,10 +406,10 @@ export default class DiscoverView extends Vue { let queryParams = [ claimContents, - "minLocLat=" + this.searchBox.bbox.minLat, - "maxLocLat=" + this.searchBox.bbox.maxLat, - "westLocLon=" + this.searchBox.bbox.westLong, - "eastLocLon=" + this.searchBox.bbox.eastLong, + "minLocLat=" + searchBox.minLat, + "maxLocLat=" + searchBox.maxLat, + "westLocLon=" + searchBox.westLong, + "eastLocLon=" + searchBox.eastLong, ].join("&"); if (beforeId) { @@ -483,7 +490,7 @@ export default class DiscoverView extends Vue { if (this.isLocalActive) { this.searchLocal(latestProject["rowid"]); } else if (this.isMappedActive) { - // don't do anything since mapped items only show a limited number + this.searchLocal(latestProject["rowid"]); } else if (this.isRemoteActive) { this.searchAll(latestProject["rowid"]); } @@ -544,11 +551,21 @@ export default class DiscoverView extends Vue { }); const marker = L.marker([pinLat, pinLon], { icon: numberIcon }); marker.addTo(targetMap); + marker.on("click", () => { + this.tempSearchBox = { + minLat: tile.minFoundLat, + maxLat: tile.maxFoundLat, + westLong: tile.minFoundLon, + eastLong: tile.maxFoundLon, + }; + this.searchLocal(); + }); this.markers[ "" + tile.indexLat + "X" + tile.indexLon + "*" + tile.recordCount ] = marker; } } + await this.searchLocal(); } else { throw { message: "Got an error loading projects on the map.",