erant map - checkpoint, fix future problems in exp
This commit is contained in:
parent
a8b376e369
commit
50b731341a
|
@ -1,4 +1,4 @@
|
|||
export type checkPoint = {
|
||||
export type CheckPoint = {
|
||||
$id: string
|
||||
CPAfter: string
|
||||
CPAnswerID: string
|
||||
|
@ -12,7 +12,7 @@ export type checkPoint = {
|
|||
CPType: 'CHECKBOX' | 'TEXT' | 'INFO' | 'RADIO' | 'NUMBER'
|
||||
}
|
||||
|
||||
export type expirience = {
|
||||
export type Experience = {
|
||||
ExpApproved: boolean
|
||||
ExpCpsID: string[]
|
||||
ExpCategory?: string
|
||||
|
@ -27,5 +27,5 @@ export type expirience = {
|
|||
ExpTestingCode: string
|
||||
ExpURL: string
|
||||
UserID: string
|
||||
checkPoint: Array<checkPoint>
|
||||
checkPoint: Array<CheckPoint>
|
||||
}
|
||||
|
|
|
@ -1,11 +1,13 @@
|
|||
<script>
|
||||
<script lang="ts">
|
||||
import { Marker } from '@beyonk/svelte-mapbox'
|
||||
import { Tooltip } from 'flowbite-svelte'
|
||||
import { createEventDispatcher, getContext } from 'svelte'
|
||||
const dispatch = createEventDispatcher()
|
||||
|
||||
export let lat = 0
|
||||
export let lng = 0
|
||||
export let user = { lat: 0, lng: 0 }
|
||||
export let popup: string | null = null
|
||||
|
||||
export let round = (1 / 110.574 / 1000) * 12 //cca 12m nutno pozměnit!!!!!!!!!! tento komentář nemazat
|
||||
let Mlat = [lat - round, lat + round]
|
||||
|
@ -16,6 +18,7 @@
|
|||
</script>
|
||||
|
||||
<Marker popup={false} {lat} {lng}>
|
||||
<button on:click>
|
||||
<svg width="28" height="27" viewBox="0 0 112 108" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M64.488 103.367L89.7283 62.4464C106.409 35.4037 86.9542 0.547852 55.1801 0.547852C22.7617 0.547852 3.42399 36.6756 21.4041 63.6502L48.0703 103.656C52.0131 109.571 60.7561 109.417 64.488 103.367Z"
|
||||
|
@ -45,4 +48,8 @@
|
|||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</button>
|
||||
{#if popup}
|
||||
<Tooltip class="absolute">{popup}</Tooltip>
|
||||
{/if}
|
||||
</Marker>
|
||||
|
|
|
@ -2,6 +2,8 @@ import { databases } from '$lib/appwrite'
|
|||
import { Query } from 'appwrite'
|
||||
import database from 'svelte-appwrite-client/src/lib/database'
|
||||
import { getLocationDataFromLatAndLong } from '../locations'
|
||||
import { writable } from 'svelte/store'
|
||||
import { Experience } from '$lib/TStypes/experiences'
|
||||
|
||||
export const load = async (pathName: string, previewQuestionsCount?: number, preview?: Function) => {
|
||||
const checkPoints = []
|
||||
|
@ -44,14 +46,31 @@ export const answer = async (checkPointId: string, answer: any) => {
|
|||
|
||||
export const getExpiriences = async () => {
|
||||
const expiriences = (await databases.listDocuments('63cef30d6da945dd4250', '63cef4bd210fdf2e5888', [Query.equal('ExpApproved', true)])).documents
|
||||
let items: Array<{ location: string; name: string; link: string }> = []
|
||||
let items = []
|
||||
for (const expirience of expiriences) {
|
||||
items.push({
|
||||
location: (await getLocationDataFromLatAndLong(expirience.ExpLocation[0], expirience.ExpLocation[1])).city,
|
||||
name: expirience.ExpName,
|
||||
link: `${expirience.ExpURL}`,
|
||||
city: (await getLocationDataFromLatAndLong(expirience.ExpLocation[0], expirience.ExpLocation[1])).city,
|
||||
...expirience,
|
||||
})
|
||||
}
|
||||
|
||||
return items
|
||||
}
|
||||
|
||||
export const getExpiriencesAsStore = () => {
|
||||
const store = writable([])
|
||||
const loading = writable<boolean>(true)
|
||||
databases.listDocuments('63cef30d6da945dd4250', '63cef4bd210fdf2e5888', [Query.equal('ExpApproved', true)]).then(async ({ documents }) => {
|
||||
let items: Array<any> = []
|
||||
for (const expirience of documents) {
|
||||
items.push({
|
||||
city: (await getLocationDataFromLatAndLong(expirience.ExpLocation[0], expirience.ExpLocation[1])).city,
|
||||
...expirience,
|
||||
})
|
||||
}
|
||||
loading.set(false)
|
||||
store.set(items)
|
||||
})
|
||||
|
||||
return [store, loading] as const
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
<div class="options">
|
||||
{#each items as item}
|
||||
<CompartmentItem on:click={() => navigate(`${item.link}`)} price={item.price} location={item.location} name={item.name} image={item.image} />
|
||||
<CompartmentItem on:click={() => navigate(`${item.ExpURL}`)} price={item.price} location={item.location} name={item.ExpName} image={item.image} />
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -2,6 +2,9 @@
|
|||
import NavigationBarLayout from '$lib/components/Layouts/NavigationBarLayout.svelte'
|
||||
import Erantmap from '$lib/components/Map/Erantmap.svelte'
|
||||
import LocationRequest from '$lib/components/Map/LocationRequest.svelte'
|
||||
import Marker from '$lib/components/Map/Marker.svelte'
|
||||
import { navigate } from '$lib/router'
|
||||
import { getExpiriencesAsStore } from '$lib/utils/database/game'
|
||||
import { onMount } from 'svelte'
|
||||
|
||||
let user: { lat: number; lng: number } = { lat: 0, lng: 0 }
|
||||
|
@ -14,28 +17,19 @@
|
|||
granted = true
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
if ('permissions' in navigator) {
|
||||
navigator.permissions.query({ name: 'geolocation' }).then((permissionStatus) => {
|
||||
if (permissionStatus.state === 'granted') {
|
||||
navigator.geolocation.getCurrentPosition(
|
||||
(position) => {
|
||||
handleLocationGranted(position)
|
||||
},
|
||||
(error) => {
|
||||
console.log(error)
|
||||
},
|
||||
)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
navigator.geolocation.getCurrentPosition(handleLocationGranted)
|
||||
|
||||
$: [experiences] = getExpiriencesAsStore()
|
||||
</script>
|
||||
|
||||
<NavigationBarLayout>
|
||||
{#if granted}
|
||||
<!-- Conditionally center on current location if granted is true. -->
|
||||
<Erantmap class="w-full h-full" center={{ lng: user.lng, lat: user.lat }} bind:user />
|
||||
<Erantmap class="w-full h-full" center={{ lng: user.lng, lat: user.lat }} bind:user>
|
||||
{#each $experiences as experience}
|
||||
<Marker popup={experience.ExpName} on:click={() => navigate(`/${experience.ExpURL}`)} lat={experience.ExpLocation[0]} lng={experience.ExpLocation[1]} {user} />
|
||||
{/each}
|
||||
</Erantmap>
|
||||
{:else}
|
||||
<!--If not granted, the LocationRequest component is displayed and when it is granted center map. -->
|
||||
<LocationRequest on:locationGranted={() => (granted = true)} />
|
||||
|
|
Loading…
Reference in New Issue