From 6467e9efe39d45d91fa93cf577f3b6a1cfb54b68 Mon Sep 17 00:00:00 2001
From: mattiapezzotti <matpezzo01@gmail.com>
Date: Thu, 13 Jun 2024 17:02:57 +0200
Subject: [PATCH] added draw sequences lines on lower zoom levels

---
 modules/services/panoramax.js   | 17 ++++++++---------
 modules/svg/panoramax_images.js | 28 ++++++++++++++++++++++------
 2 files changed, 30 insertions(+), 15 deletions(-)

diff --git a/modules/services/panoramax.js b/modules/services/panoramax.js
index fb8637dd8..960575716 100644
--- a/modules/services/panoramax.js
+++ b/modules/services/panoramax.js
@@ -23,7 +23,7 @@ const thumbnailDefinition = "thumb";
 const pictureLayer = 'pictures';
 const sequenceLayer = 'sequences';
 
-const minZoom = 15;
+const minZoom = 10;
 const dispatch = d3_dispatch('loadedImages', 'loadedLines', 'viewerChanged');
 const imgZoom = d3_zoom()
     .extent([[0, 0], [320, 240]])
@@ -33,7 +33,6 @@ const pannellumViewerCSS = 'pannellum/pannellum.css';
 const pannellumViewerJS = 'pannellum/pannellum.js';
 const resolution = 1080;
 
-let _activeImage;
 let _cache;
 let _loadViewerPromise;
 let _pannellumViewer;
@@ -231,7 +230,7 @@ export default {
             requests: { loaded: {}, inflight: {} }
         };
 
-        _activeImage = null;
+        _currentScene.currentImage = null;
     },
 
     // Get visible images
@@ -252,7 +251,7 @@ export default {
 
     // Load line in the visible area
     loadLines: function(projection) {
-        loadTiles('line', tileUrl, 15, projection);
+        loadTiles('line', tileUrl, 10, projection);
     },
 
     // Get visible sequences
@@ -283,12 +282,12 @@ export default {
     // Set the currently visible image
     setActiveImage: function(image) {
         if (image) {
-            _activeImage = {
+            _currentScene.currentImage = {
                 id: image.id,
                 sequence_id: image.sequence_id
             };
         } else {
-            _activeImage = null;
+            _currentScene.currentImage = null;
         }
     },
 
@@ -296,8 +295,8 @@ export default {
     setStyles: function(context, hovered) {
         const hoveredImageId = hovered && hovered.id;
         const hoveredSequenceId = hovered && hovered.sequence_id;
-        const selectedSequenceId = _activeImage && _activeImage.sequence_id;
-        const selectedImageId =  _activeImage && _activeImage.id;
+        const selectedSequenceId = _currentScene.currentImage && _currentScene.currentImage.sequence_id;
+        const selectedImageId =  _currentScene.currentImage && _currentScene.currentImage.id;
 
         const markers = context.container().selectAll('.layer-panoramax .viewfield-group');
         const sequences = context.container().selectAll('.layer-panoramax .sequence');
@@ -659,7 +658,7 @@ export default {
         //TODO: maybe this should be here (export?)
         function step(stepBy) {
             return function () {
-                if (!_activeImage) return;
+                if (!_currentScene.currentImage) return;
 
                 let nextId;
                 if(stepBy === 1)
diff --git a/modules/svg/panoramax_images.js b/modules/svg/panoramax_images.js
index ea0ab96cb..87b7f9a59 100644
--- a/modules/svg/panoramax_images.js
+++ b/modules/svg/panoramax_images.js
@@ -7,7 +7,8 @@ import {svgPath, svgPointTransform} from './helpers';
 
 export function svgPanoramaxImages(projection, context, dispatch) {
     const throttledRedraw = _throttle(function () { dispatch.call('change'); }, 1000);
-    const minZoom = 15;
+    const imageMinZoom = 15;
+    const lineMinZoom = 10;
     const viewFieldZoomLevel = 18;
     let layer = d3_select(null);
     let _panoramax;
@@ -26,6 +27,7 @@ export function svgPanoramaxImages(projection, context, dispatch) {
             _panoramax = services.panoramax;
             _panoramax.event
                 .on('viewerChanged', viewerChanged)
+                .on('loadedLines', throttledRedraw)
                 .on('loadedImages', throttledRedraw);
         } else if (!services.panoramax && _panoramax) {
             _panoramax = null;
@@ -269,6 +271,7 @@ export function svgPanoramaxImages(projection, context, dispatch) {
 
 
     function drawImages(selection) {
+        
         const enabled = svgPanoramaxImages.enabled;
         const service = getService();
 
@@ -295,10 +298,22 @@ export function svgPanoramaxImages(projection, context, dispatch) {
             .merge(layer);
 
         if (enabled) {
-            if (service && ~~context.map().zoom() >= minZoom) {
-                editOn();
-                update();
-                service.loadImages(projection);
+            let zoom = ~~context.map().zoom();
+            console.log(zoom)
+            if (service){
+                if(zoom >= imageMinZoom) {
+                    editOn();
+                    update();
+                    service.loadImages(projection);
+                }
+                else if(zoom >= lineMinZoom) {
+                    editOn();
+                    update();
+                    service.loadLines(projection);
+                }
+                else {
+                    editOff();
+                }
             } else {
                 editOff();
             }
@@ -306,6 +321,7 @@ export function svgPanoramaxImages(projection, context, dispatch) {
     }
 
 
+
     drawImages.enabled = function(_) {
         if (!arguments.length) return svgPanoramaxImages.enabled;
         svgPanoramaxImages.enabled = _;
@@ -326,7 +342,7 @@ export function svgPanoramaxImages(projection, context, dispatch) {
     };
 
     drawImages.rendered = function(zoom) {
-      return zoom >= minZoom;
+      return zoom >= lineMinZoom;
     };