feat: saving school location
This commit is contained in:
BIN
public/img/saved/school.png
Normal file
BIN
public/img/saved/school.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.3 KiB |
@ -21,6 +21,7 @@
|
|||||||
let locationAccuracyCircle: HTMLDivElement | undefined = $state();
|
let locationAccuracyCircle: HTMLDivElement | undefined = $state();
|
||||||
let homeMarker: HTMLImageElement | undefined = $state();
|
let homeMarker: HTMLImageElement | undefined = $state();
|
||||||
let workMarker: HTMLImageElement | undefined = $state();
|
let workMarker: HTMLImageElement | undefined = $state();
|
||||||
|
let schoolMarker: HTMLImageElement | undefined = $state();
|
||||||
|
|
||||||
const DEBUG_POINTS = false; // Set to true to show debug points on the map
|
const DEBUG_POINTS = false; // Set to true to show debug points on the map
|
||||||
</script>
|
</script>
|
||||||
@ -100,6 +101,21 @@
|
|||||||
element={homeMarker}
|
element={homeMarker}
|
||||||
/>
|
/>
|
||||||
{/if}
|
{/if}
|
||||||
|
{#if saved.school && map.zoom > 9}
|
||||||
|
<img
|
||||||
|
src="/img/saved/school.png"
|
||||||
|
alt="School Marker"
|
||||||
|
bind:this={schoolMarker}
|
||||||
|
style="width: 32px;"
|
||||||
|
/>
|
||||||
|
<Marker
|
||||||
|
lnglat={{
|
||||||
|
lat: saved.school.lat,
|
||||||
|
lng: saved.school.lon,
|
||||||
|
}}
|
||||||
|
element={schoolMarker}
|
||||||
|
/>
|
||||||
|
{/if}
|
||||||
{#if saved.work && map.zoom > 9}
|
{#if saved.work && map.zoom > 9}
|
||||||
<img
|
<img
|
||||||
src="/img/saved/work.png"
|
src="/img/saved/work.png"
|
||||||
|
|||||||
@ -9,6 +9,7 @@
|
|||||||
MailIcon,
|
MailIcon,
|
||||||
PhoneIcon,
|
PhoneIcon,
|
||||||
RouteIcon,
|
RouteIcon,
|
||||||
|
SchoolIcon,
|
||||||
} from "@lucide/svelte";
|
} from "@lucide/svelte";
|
||||||
import { pin } from "../map.svelte";
|
import { pin } from "../map.svelte";
|
||||||
import SidebarHeader from "./SidebarHeader.svelte";
|
import SidebarHeader from "./SidebarHeader.svelte";
|
||||||
@ -182,6 +183,16 @@
|
|||||||
<HomeIcon />
|
<HomeIcon />
|
||||||
Set as Home
|
Set as Home
|
||||||
</Button>
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
onclick={() => {
|
||||||
|
saved.school = { lat, lon: lng };
|
||||||
|
saveLocations();
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SchoolIcon />
|
||||||
|
Set as School
|
||||||
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
variant="outline"
|
variant="outline"
|
||||||
onclick={() => {
|
onclick={() => {
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { BriefcaseIcon, HomeIcon } from "@lucide/svelte";
|
import { BriefcaseIcon, HomeIcon, SchoolIcon } from "@lucide/svelte";
|
||||||
import { Button } from "../../ui/button";
|
import { Button } from "../../ui/button";
|
||||||
import { fly } from "svelte/transition";
|
import { fly } from "svelte/transition";
|
||||||
import { circInOut } from "svelte/easing";
|
import { circInOut } from "svelte/easing";
|
||||||
@ -19,7 +19,12 @@
|
|||||||
variant="secondary"
|
variant="secondary"
|
||||||
class="flex-1"
|
class="flex-1"
|
||||||
onclick={() => {
|
onclick={() => {
|
||||||
const { lat, lon } = saved.home;
|
const loc = saved.home;
|
||||||
|
if (!loc) {
|
||||||
|
alert("No home location saved.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const { lat, lon } = loc;
|
||||||
if (!lat || !lon) {
|
if (!lat || !lon) {
|
||||||
alert("No home location saved.");
|
alert("No home location saved.");
|
||||||
return;
|
return;
|
||||||
@ -39,7 +44,38 @@
|
|||||||
variant="secondary"
|
variant="secondary"
|
||||||
class="flex-1"
|
class="flex-1"
|
||||||
onclick={() => {
|
onclick={() => {
|
||||||
const { lat, lon } = saved.work;
|
console.log(saved);
|
||||||
|
const loc = saved.school;
|
||||||
|
if (!loc) {
|
||||||
|
alert("No school location saved.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const { lat, lon } = loc;
|
||||||
|
if (!lat || !lon) {
|
||||||
|
alert("No school location saved.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
pin.dropPin(lat, lon);
|
||||||
|
pin.showInfo();
|
||||||
|
map.value?.flyTo({
|
||||||
|
center: [lon, lat],
|
||||||
|
zoom: 19,
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SchoolIcon />
|
||||||
|
School
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
class="flex-1"
|
||||||
|
onclick={() => {
|
||||||
|
const loc = saved.work;
|
||||||
|
if (!loc) {
|
||||||
|
alert("No work location saved.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const { lat, lon } = loc;
|
||||||
if (!lat || !lon) {
|
if (!lat || !lon) {
|
||||||
alert("No work location saved.");
|
alert("No work location saved.");
|
||||||
return;
|
return;
|
||||||
|
|||||||
Reference in New Issue
Block a user