From f25e94c71be433aa351f58c76013ad28aa01a40c Mon Sep 17 00:00:00 2001
From: Martin Raifer <martin@raifer.tech>
Date: Mon, 29 Jul 2024 16:15:34 +0200
Subject: [PATCH] update username filter on input change; fix multiple
 names/ids

in panoramax a username can resolve to multiple ids (when the same name is used on multiple servers).
further, the username filter input field can contain more than one username
---
 modules/services/panoramax.js   | 16 +++++++++------
 modules/svg/panoramax_images.js | 35 +++++++++++++++++----------------
 2 files changed, 28 insertions(+), 23 deletions(-)

diff --git a/modules/services/panoramax.js b/modules/services/panoramax.js
index c200bf357..521dcf817 100644
--- a/modules/services/panoramax.js
+++ b/modules/services/panoramax.js
@@ -274,15 +274,19 @@ export default {
         loadTiles('line', tileUrl, lineMinZoom, projection);
     },
 
-    getUserId: async function(username){
-        const requestUrl = userIdUrl.replace('{username}', username);
+    getUserIds: async function(usernames) {
+        const requestUrls = usernames.map(username =>
+            userIdUrl.replace('{username}', username));
 
-        const response = await fetch(requestUrl, { method: 'GET' });
-        if (!response.ok) {
+        const responses = await Promise.all(requestUrls.map(requestUrl =>
+            fetch(requestUrl, { method: 'GET' })));
+        if (responses.some(response => !response.ok)) {
             throw new Error(response.status + ' ' + response.statusText);
         }
-        const data = await response.json();
-        return data.features[0].id;
+        const data = await Promise.all(responses.map(response => response.json()));
+        // in panoramax, a username can have multiple ids, when the same name is
+        // used on different servers
+        return data.flatMap((d, i) => d.features.filter(f => f.name === usernames[i]).map(f => f.id));
     },
 
     getOldestDate: function(){
diff --git a/modules/svg/panoramax_images.js b/modules/svg/panoramax_images.js
index b74c42a74..3e15f2898 100644
--- a/modules/svg/panoramax_images.js
+++ b/modules/svg/panoramax_images.js
@@ -14,7 +14,8 @@ export function svgPanoramaxImages(projection, context, dispatch) {
     let _panoramax;
     let _viewerYaw = 0;
     let _selectedSequence;
-    let _activeId;
+    let _activeUsernameFilter;
+    let _activeIds;
 
     function init() {
         if (svgPanoramaxImages.initialized) return;
@@ -63,18 +64,18 @@ export function svgPanoramaxImages(projection, context, dispatch) {
             });
         }
         if (username && service) {
-            if (!_activeId) {
-                const tempId = await service.getUserId(username);
+            if (_activeUsernameFilter !== username) {
+                const tempIds = await service.getUserIds(username);
 
-                if (!_activeId) {
-                  _activeId = tempId;
-                }
+                _activeUsernameFilter = username;
+                _activeIds = {};
+                tempIds.forEach(id => {
+                    _activeIds[id] = true;
+                })
             }
 
-            let id = _activeId;
-
             images = images.filter(function(image) {
-                return id === image.account_id;
+                return _activeIds[image.account_id];
             });
         }
 
@@ -107,18 +108,18 @@ export function svgPanoramaxImages(projection, context, dispatch) {
             });
         }
         if (username && service) {
-            if (!_activeId) {
-                const tempId = await service.getUserId(username);
+            if (_activeUsernameFilter !== username) {
+                const tempIds = await service.getUserIds(username);
 
-                if (!_activeId) {
-                  _activeId = tempId;
-                }
+                _activeUsernameFilter = username;
+                _activeIds = {};
+                tempIds.forEach(id => {
+                    _activeIds[id] = true;
+                })
             }
 
-            let id = _activeId;
-
             sequences = sequences.filter(function(sequence) {
-                return id === sequence.properties.account_id;
+                return _activeIds[sequence.properties.account_id];
             });
         }