From 8b21bd9bfb8b788770dec2ccb628f6f79cbc56b6 Mon Sep 17 00:00:00 2001
From: Sundog
Date: Mon, 24 Jun 2024 12:19:46 -0400
Subject: [PATCH] adds distance to marker estimation, resizes nearby (within 20
meters) marker to be 48px instead of 20px
---
src/webserver/play/index.php | 32 ++++++++++++++++++++++++++------
1 file changed, 26 insertions(+), 6 deletions(-)
diff --git a/src/webserver/play/index.php b/src/webserver/play/index.php
index e69bbfa..5f088a3 100644
--- a/src/webserver/play/index.php
+++ b/src/webserver/play/index.php
@@ -34,7 +34,6 @@
z-index: 99999999;
}
#debug-view {
- display: none;
position: absolute;
top: 50%;
left: 0;
@@ -49,6 +48,10 @@
width: 100%;
top: 0;
left: 0;
+ }
+ .big-marker {
+ width: 48px !important;
+ height: 48px !important;
}
@@ -61,9 +64,12 @@
var globalPosition = new THREE.Vector3();
var globalRotation = new THREE.Quaternion();
- var globalMap = L.map('map-view').setView([34.695068, -84.482468], globalZoom);
+ var globalMap = L.map('map-view').setView([34.68825, -84.47705], globalZoom);
+
+ var globalMarkers = [];
var currentView = "map";
+ var autocenter = true;
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 22,
@@ -73,7 +79,7 @@
// generic monster svg icon for now
var monsterIcon = L.icon({
iconUrl: 'monster.svg',
- iconSize: [48, 48]
+ iconSize: [20, 20]
});
function toggleView() {
@@ -106,10 +112,24 @@ AFRAME.registerComponent('camera-logger', {
navigator.geolocation.getCurrentPosition((position) => {
worldPos.x = position.coords.latitude;
worldPos.z = position.coords.longitude;
- globalMap.panTo([position.coords.latitude, position.coords.longitude]);
+ if (autocenter) { globalMap.panTo([position.coords.latitude, position.coords.longitude]); }
+ var currentPosition = L.latLng({ lat: position.coords.latitude, lng: position.coords.longitude});
+ globalMarkers.forEach((marker) => {
+ var markerPosition = marker._latlng;
+ var currentDistance = globalMap.distance(currentPosition, markerPosition);
+ if (currentDistance < 20) {
+ L.DomUtil.addClass(marker._icon, 'big-marker');
+ L.DomUtil.removeClass(marker._icon, 'small-marker');
+ } else {
+ L.DomUtil.removeClass(marker._icon, 'big-marker');
+ L.DomUtil.addClass(marker._icon, 'small-marker');
+ }
+ });
+
document.querySelector('#debug-view').innerHTML = "Time: " + this.data.seconds
- + "
Camera Position: (" + worldPos.x.toFixed(6) + ", " + worldPos.y.toFixed(2) + ", " + worldPos.z.toFixed(6) + "
";
+ + "
Camera Position: (" + worldPos.x.toFixed(6) + ", " + worldPos.y.toFixed(2) + ", " + worldPos.z.toFixed(6) + "
"
+ + "Distance to marker[0]: " + globalMap.distance(currentPosition, globalMarkers[0]._latlng).toFixed(1) + " meters
";
});
},
@@ -144,7 +164,7 @@ AFRAME.registerComponent('camera-logger', {
;">