diff --git a/src/components/LockedContent/domUtils.ts b/src/components/LockedContent/domUtils.ts index 3372f9e..edf8f96 100644 --- a/src/components/LockedContent/domUtils.ts +++ b/src/components/LockedContent/domUtils.ts @@ -30,6 +30,12 @@ function removeElement(elemId: string) { else console.error("Element could not be found!"); } +function addAttribute(elemId: string, attribute: string, value: string) { + const elem = document.getElementById(elemId); + if (elem) elem.setAttribute(attribute, value); + else console.error("Element could not be found!"); +} + function revealContent() { incrementUnlockCounter(document.URL.slice(-12)); removeClasses("content", "blur-2xl"); @@ -43,4 +49,5 @@ export { toggleClass, updateText, revealContent, + addAttribute, }; diff --git a/src/components/LockedContent/geolocation.ts b/src/components/LockedContent/geolocation.ts index 48f2dcb..f956477 100644 --- a/src/components/LockedContent/geolocation.ts +++ b/src/components/LockedContent/geolocation.ts @@ -1,6 +1,7 @@ import Toastify from "toastify-js"; import L, { type LatLngTuple } from "leaflet"; import { + addAttribute, addClasses, removeClasses, removeElement, @@ -72,6 +73,13 @@ function errorCallback(err: GeolocationPositionError) { case GeolocationPositionError.PERMISSION_DENIED: errorMessage = "Konum izni alınamadı, lütfen tarayıcınızın ve cihazınızın gizlilik ayarlarını kontrol edin."; + updateText( + "locked-content-description", + "Konum izleme izni alınamadı. \nİçeriği görüntüleyebilmek için konum bilginiz gerekiyor." + ); + addAttribute("current-location-control", "disabled", "true"); + addClasses("current-location-control", "disabled-button"); + removeElement("location-permission-button"); break; case GeolocationPositionError.POSITION_UNAVAILABLE: errorMessage = diff --git a/src/scripts/initMap.ts b/src/scripts/initMap.ts index d5a3c6f..584b41b 100644 --- a/src/scripts/initMap.ts +++ b/src/scripts/initMap.ts @@ -57,6 +57,8 @@ const CurrentLocation = L.Control.extend({ locationButton.type = "button"; + locationButton.id = "current-location-control"; + locationButton.addEventListener("click", () => { if (currentLocationMarker) { map.setView(currentLocationMarker.getLatLng(), 12); @@ -90,7 +92,7 @@ const GoToTargetLocation = L.Control.extend({ locationButton.classList.add("custom-map-control-button"); locationButton.addEventListener("click", () => { - if (TARGET_LOCATION) map.setView(TARGET_LOCATION, 18); + if (TARGET_LOCATION) map.setView(TARGET_LOCATION, 12); }); return locationButton; diff --git a/src/styles/locked-page.css b/src/styles/locked-page.css index 82030ce..0ed2a30 100644 --- a/src/styles/locked-page.css +++ b/src/styles/locked-page.css @@ -14,3 +14,12 @@ .custom-map-control-button:hover { background: rgb(235, 235, 235); } + +.disabled-button { + opacity: 0.5; + cursor: not-allowed; +} + +.disabled-button:hover { + background-color: #fff; +}