|
|
@ -32,6 +32,8 @@ |
|
|
|
href="#" |
|
|
|
@click=" |
|
|
|
projects = []; |
|
|
|
isLocalActive = true; |
|
|
|
isRemoteActive = false; |
|
|
|
searchLocal(); |
|
|
|
" |
|
|
|
v-bind:class="computedLocalTabClassNames()" |
|
|
@ -49,6 +51,8 @@ |
|
|
|
v-bind:class="computedRemoteTabClassNames()" |
|
|
|
@click=" |
|
|
|
projects = []; |
|
|
|
isRemoteActive = true; |
|
|
|
isLocalActive = false; |
|
|
|
searchAll(); |
|
|
|
" |
|
|
|
> |
|
|
@ -72,22 +76,29 @@ |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
<div v-else> |
|
|
|
<button v-if="!searchBox && !isMarkerSet" class="m-4 px-4 py-2"> |
|
|
|
<button v-if="!searchBox && !isNewMarkerSet" class="m-4 px-4 py-2"> |
|
|
|
Choose Location Below for Nearby Search |
|
|
|
</button> |
|
|
|
<button |
|
|
|
v-if="!searchBox && isMarkerSet" |
|
|
|
v-if="isNewMarkerSet" |
|
|
|
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500" |
|
|
|
@click="storeSearchBox" |
|
|
|
> |
|
|
|
Save Location for Nearby Search |
|
|
|
Store This Location for Nearby Search |
|
|
|
</button> |
|
|
|
<button |
|
|
|
v-if="searchBox" |
|
|
|
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500" |
|
|
|
@click="forgetSearchBox" |
|
|
|
> |
|
|
|
Delete Location for Nearby Search |
|
|
|
Delete Stored Location |
|
|
|
</button> |
|
|
|
<button |
|
|
|
v-if="isNewMarkerSet" |
|
|
|
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500" |
|
|
|
@click="resetLatLong" |
|
|
|
> |
|
|
|
Reset Marker |
|
|
|
</button> |
|
|
|
<button |
|
|
|
class="ml-2 px-4 py-2 rounded-md bg-blue-200 text-blue-500" |
|
|
@ -107,7 +118,7 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Results List --> |
|
|
|
<InfiniteScroll @reached-bottom="loadMoreData"> |
|
|
|
<InfiniteScroll @reached-bottom="loadMoreData" v-if="!isChoosingSearchBox"> |
|
|
|
<ul> |
|
|
|
<li |
|
|
|
class="border-b border-slate-300" |
|
|
@ -140,7 +151,10 @@ |
|
|
|
</ul> |
|
|
|
</InfiniteScroll> |
|
|
|
|
|
|
|
<div v-if="isChoosingSearchBox" style="height: 600px; width: 800px"> |
|
|
|
<div |
|
|
|
v-if="isLocalActive && isChoosingSearchBox" |
|
|
|
style="height: 600px; width: 800px" |
|
|
|
> |
|
|
|
<l-map |
|
|
|
ref="map" |
|
|
|
:center="[localCenterLat, localCenterLong]" |
|
|
@ -153,12 +167,12 @@ |
|
|
|
name="OpenStreetMap" |
|
|
|
/> |
|
|
|
<l-marker |
|
|
|
v-if="isMarkerSet" |
|
|
|
v-if="isNewMarkerSet" |
|
|
|
:lat-lng="[localCenterLat, localCenterLong]" |
|
|
|
@click="resetLatLong()" |
|
|
|
@click="isNewMarkerSet = false" |
|
|
|
/> |
|
|
|
<l-rectangle |
|
|
|
v-if="isMarkerSet" |
|
|
|
v-if="isNewMarkerSet" |
|
|
|
:bounds="[ |
|
|
|
[localCenterLat - localLatDiff, localCenterLong - localLongDiff], |
|
|
|
[localCenterLat + localLatDiff, localCenterLong + localLongDiff], |
|
|
@ -184,7 +198,7 @@ import { |
|
|
|
|
|
|
|
import { accountsDB, db } from "@/db"; |
|
|
|
import { Contact } from "@/db/tables/contacts"; |
|
|
|
import { BoundingBox, MASTER_SETTINGS_KEY } from "@/db/tables/settings"; |
|
|
|
import { BoundingBox, MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings"; |
|
|
|
import { accessToken } from "@/libs/crypto"; |
|
|
|
import { didInfo, ProjectData } from "@/libs/endorserServer"; |
|
|
|
import AlertMessage from "@/components/AlertMessage"; |
|
|
@ -220,7 +234,7 @@ export default class DiscoverView extends Vue { |
|
|
|
isChoosingSearchBox = false; |
|
|
|
isLocalActive = true; |
|
|
|
isRemoteActive = false; |
|
|
|
isMarkerSet = false; |
|
|
|
isNewMarkerSet = false; |
|
|
|
localCenterLat = 0; |
|
|
|
localCenterLong = 0; |
|
|
|
localLatDiff = DEFAULT_LAT_LONG_DIFF; |
|
|
@ -228,7 +242,7 @@ export default class DiscoverView extends Vue { |
|
|
|
localCount = 0; |
|
|
|
localZoom = DEFAULT_ZOOM; |
|
|
|
remoteCount = 0; |
|
|
|
searchBox: BoundingBox | null = null; |
|
|
|
searchBox: { name: string; bbox: BoundingBox } | null = null; |
|
|
|
isLoading = false; |
|
|
|
|
|
|
|
// make this function available to the Vue template |
|
|
@ -239,8 +253,9 @@ export default class DiscoverView extends Vue { |
|
|
|
const settings = await db.settings.get(MASTER_SETTINGS_KEY); |
|
|
|
this.activeDid = settings?.activeDid || ""; |
|
|
|
this.apiServer = settings?.apiServer || ""; |
|
|
|
this.searchBox = settings?.searchBoxes?.[0]; |
|
|
|
this.searchBox = settings?.searchBoxes?.[0] || null; |
|
|
|
this.resetLatLong(); |
|
|
|
|
|
|
|
this.allContacts = await db.contacts.toArray(); |
|
|
|
|
|
|
|
await accountsDB.open(); |
|
|
@ -279,9 +294,6 @@ export default class DiscoverView extends Vue { |
|
|
|
queryParams = queryParams + `&beforeId=${beforeId}`; |
|
|
|
} |
|
|
|
|
|
|
|
this.isRemoteActive = true; |
|
|
|
this.isLocalActive = false; |
|
|
|
|
|
|
|
try { |
|
|
|
this.isLoading = true; |
|
|
|
const response = await fetch( |
|
|
@ -336,14 +348,19 @@ export default class DiscoverView extends Vue { |
|
|
|
} |
|
|
|
|
|
|
|
public async searchLocal(beforeId?: string) { |
|
|
|
if (!this.searchBox) { |
|
|
|
this.projects = []; |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
const claimContents = |
|
|
|
"claimContents=" + encodeURIComponent(this.searchTerms); |
|
|
|
let queryParams = [ |
|
|
|
claimContents, |
|
|
|
"minLocLat=40.901000", |
|
|
|
"maxLocLat=40.904000", |
|
|
|
"westLocLon=-111.914000", |
|
|
|
"eastLocLon=-111.909000", |
|
|
|
"minLocLat=" + this.searchBox.bbox.minLat, |
|
|
|
"maxLocLat=" + this.searchBox.bbox.maxLat, |
|
|
|
"westLocLon=" + this.searchBox.bbox.westLong, |
|
|
|
"eastLocLon=" + this.searchBox.bbox.eastLong, |
|
|
|
].join("&"); |
|
|
|
|
|
|
|
if (beforeId) { |
|
|
@ -352,8 +369,6 @@ export default class DiscoverView extends Vue { |
|
|
|
|
|
|
|
try { |
|
|
|
this.isLoading = true; |
|
|
|
this.isLocalActive = true; |
|
|
|
this.isRemoteActive = false; |
|
|
|
const response = await fetch( |
|
|
|
this.apiServer + "/api/v2/report/plansByLocation?" + queryParams, |
|
|
|
{ |
|
|
@ -438,7 +453,7 @@ export default class DiscoverView extends Vue { |
|
|
|
} |
|
|
|
|
|
|
|
setMapPoint(event) { |
|
|
|
if (this.isMarkerSet) { |
|
|
|
if (this.isNewMarkerSet) { |
|
|
|
this.localLatDiff = Math.abs(event.latlng.lat - this.localCenterLat); |
|
|
|
this.localLongDiff = Math.abs(event.latlng.lng - this.localCenterLong); |
|
|
|
} else { |
|
|
@ -457,48 +472,43 @@ export default class DiscoverView extends Vue { |
|
|
|
} |
|
|
|
this.localLatDiff = latDiff; |
|
|
|
this.localLongDiff = longDiff; |
|
|
|
this.isMarkerSet = true; |
|
|
|
this.isNewMarkerSet = true; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
public resetLatLong() { |
|
|
|
if (this.searchBox) { |
|
|
|
this.localCenterLat = (this.searchBox.maxLat + this.searchBox.minLat) / 2; |
|
|
|
this.localCenterLong = |
|
|
|
(this.searchBox.eastLong + this.searchBox.westLong) / 2; |
|
|
|
this.localLatDiff = (this.searchBox.maxLat - this.searchBox.minLat) / 2; |
|
|
|
this.localLongDiff = |
|
|
|
(this.searchBox.eastLong - this.searchBox.westLong) / 2; |
|
|
|
if (this.searchBox?.bbox) { |
|
|
|
const bbox = this.searchBox.bbox; |
|
|
|
this.localCenterLat = (bbox.maxLat + bbox.minLat) / 2; |
|
|
|
this.localCenterLong = (bbox.eastLong + bbox.westLong) / 2; |
|
|
|
this.localLatDiff = (bbox.maxLat - bbox.minLat) / 2; |
|
|
|
this.localLongDiff = (bbox.eastLong - bbox.westLong) / 2; |
|
|
|
this.localZoom = WORLD_ZOOM; |
|
|
|
this.isNewMarkerSet = true; |
|
|
|
} else { |
|
|
|
this.isNewMarkerSet = false; |
|
|
|
} |
|
|
|
// otherwise, don't change their viewport |
|
|
|
this.isMarkerSet = false; |
|
|
|
} |
|
|
|
|
|
|
|
public async storeSearchBox() { |
|
|
|
if (this.localCenterLong || this.localCenterLat) { |
|
|
|
try { |
|
|
|
const newSearchBox = { |
|
|
|
name: "Local", |
|
|
|
bbox: { |
|
|
|
eastLong: this.localCenterLong + this.localLongDiff, |
|
|
|
maxLat: this.localCenterLat + this.localLatDiff, |
|
|
|
minLat: this.localCenterLat - this.localLatDiff, |
|
|
|
westLong: this.localCenterLong - this.localLongDiff, |
|
|
|
}, |
|
|
|
}; |
|
|
|
await db.open(); |
|
|
|
db.settings.update(MASTER_SETTINGS_KEY, { |
|
|
|
searchBoxes: [ |
|
|
|
{ |
|
|
|
name: "Local", |
|
|
|
bbox: { |
|
|
|
eastLong: this.localCenterLong + this.localLongDiff, |
|
|
|
maxLat: this.localCenterLat + this.localLatDiff, |
|
|
|
minLat: this.localCenterLat - this.localLatDiff, |
|
|
|
westLong: this.localCenterLong - this.localLongDiff, |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
searchBoxes: [newSearchBox], |
|
|
|
}); |
|
|
|
this.searchBox = { |
|
|
|
eastLong: this.localCenterLong + this.localLongDiff, |
|
|
|
maxLat: this.localCenterLat + this.localLatDiff, |
|
|
|
minLat: this.localCenterLat - this.localLatDiff, |
|
|
|
westLong: this.localCenterLong - this.localLongDiff, |
|
|
|
}; |
|
|
|
this.localZoom = WORLD_ZOOM; |
|
|
|
this.searchBox = newSearchBox; |
|
|
|
this.isChoosingSearchBox = false; |
|
|
|
this.searchLocal(); |
|
|
|
} catch (err) { |
|
|
|
this.$notify( |
|
|
|
{ |
|
|
@ -539,6 +549,9 @@ export default class DiscoverView extends Vue { |
|
|
|
this.localLatDiff = DEFAULT_LAT_LONG_DIFF; |
|
|
|
this.localLongDiff = DEFAULT_LAT_LONG_DIFF; |
|
|
|
this.localZoom = DEFAULT_ZOOM; |
|
|
|
this.isChoosingSearchBox = false; |
|
|
|
this.isNewMarkerSet = false; |
|
|
|
this.searchLocal(); |
|
|
|
} catch (err) { |
|
|
|
this.$notify( |
|
|
|
{ |
|
|
|