From 9bc380c81d8e5067de9faea08beb17e603520148 Mon Sep 17 00:00:00 2001
From: log101
Date: Wed, 17 Jul 2024 13:36:56 +0300
Subject: [PATCH] feat: manage permissons
---
src/components/WebComponentWrapper.astro | 6 ++-
src/components/locked-content-lit.ts | 67 +++++++++++++++++-------
2 files changed, 53 insertions(+), 20 deletions(-)
diff --git a/src/components/WebComponentWrapper.astro b/src/components/WebComponentWrapper.astro
index f4c0a72..016ada2 100644
--- a/src/components/WebComponentWrapper.astro
+++ b/src/components/WebComponentWrapper.astro
@@ -113,8 +113,10 @@ const { contentId = "", imageUrl = "#", location = "" } = Astro.props;
targetPos={location}
id="locked-content">
-->
-
+
diff --git a/src/components/locked-content-lit.ts b/src/components/locked-content-lit.ts
index 7f33071..5ec34b2 100644
--- a/src/components/locked-content-lit.ts
+++ b/src/components/locked-content-lit.ts
@@ -12,20 +12,21 @@ export class LockedContent extends LitElement {
// Constants
geolocationOptions = {
enableHighAccuracy: true,
- timeout: 5000,
+ timeout: 15000,
maximumAge: 0,
};
- // Styling
+ // Tailwind and custom styles
static styles: CSSResultGroup | undefined = [
unsafeCSS(globalStyles),
unsafeCSS(lockedContentStyles),
];
- // Static properties
- @property() readonly imageId?: string;
- @property() readonly imageURL?: string;
- @property({ type: Object })
+ // Static properties, no accessor attribute disables detecting changes
+ // as these are readonly attriubtes there is no need to attach setters
+ @property({ noAccessor: true }) readonly imageId?: string;
+ @property({ noAccessor: true }) readonly imageURL?: string;
+ @property({ type: Object, noAccessor: true })
readonly targetPosition?: LatLngTuple;
// Reactive state
@@ -34,12 +35,14 @@ export class LockedContent extends LitElement {
@state()
protected _unlocked = false;
@state()
- protected _targetProximity?: number;
+ protected _targetProximity?: string;
@state()
protected _watchId?: number;
// This callback will be fired when geolocation info is available
successCallback(position: GeolocationPosition) {
+ if (!this._hasGeolocationPermission) this._hasGeolocationPermission = true;
+
const pos = {
lat: position.coords.latitude,
lng: position.coords.longitude,
@@ -54,13 +57,13 @@ export class LockedContent extends LitElement {
const betweenMeters = currentLatLng.distanceTo(targetLatLng);
if (betweenMeters > 1000) {
- // this.changeDescription(`${(betweenMeters / 1000).toFixed()} KM`);
+ this._targetProximity = `${(betweenMeters / 1000).toFixed()} KM`;
} else if (betweenMeters > 100) {
- // this.changeDescription(`${betweenMeters.toFixed(0)} M`);
+ this._targetProximity = `${betweenMeters.toFixed(0)} M`;
} else {
if (this._watchId) {
navigator.geolocation.clearWatch(this._watchId);
- // this.unlockContent();
+ this._unlocked = true;
}
}
}
@@ -119,6 +122,7 @@ export class LockedContent extends LitElement {
Ne kadar yaklaştığını görmek için aşağıdaki butona bas.