From 09a20bc809e98d3649a1246d1bcc53a1bcf6cbd6 Mon Sep 17 00:00:00 2001
From: Quincy Morgan <quincy.morgan@icloud.com>
Date: Tue, 7 Jul 2020 13:52:55 -0400
Subject: [PATCH] Fix issue where panning the bing streetside photo viewer
 wouldn't update the bubble cone in the map

---
 modules/services/streetside.js | 40 +++++++++++++++++-----------------
 modules/svg/streetside.js      |  4 ++--
 2 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/modules/services/streetside.js b/modules/services/streetside.js
index 3c81d218b..04ee1d41a 100644
--- a/modules/services/streetside.js
+++ b/modules/services/streetside.js
@@ -469,26 +469,6 @@ export default {
     options.scenes[sceneID] = _sceneOptions;
 
     _pannellumViewer = window.pannellum.viewer('ideditor-viewer-streetside', options);
-
-    var pointerPrefix = 'PointerEvent' in window ? 'pointer' : 'mouse';
-
-    _pannellumViewer
-      .on(pointerPrefix + 'down', () => {
-        d3_select(window)
-          .on(pointerPrefix + 'move.pannellum', () => { dispatch.call('viewerChanged'); });
-      })
-      .on(pointerPrefix + 'up', () => {
-        d3_select(window)
-          .on(pointerPrefix + 'move.pannellum', null);
-
-        // continue dispatching events for a few seconds, in case viewer has inertia.
-        let t = d3_timer(elapsed => {
-          dispatch.call('viewerChanged');
-          if (elapsed > 2000) {
-            t.stop();
-          }
-        });
-      });
   },
 
 
@@ -498,6 +478,8 @@ export default {
   loadViewer: function(context) {
     let that = this;
 
+    let pointerPrefix = 'PointerEvent' in window ? 'pointer' : 'mouse';
+
     // create ms-wrapper, a photo wrapper class
     let wrap = context.container().select('.photoviewer').selectAll('.ms-wrapper')
       .data([0]);
@@ -513,6 +495,24 @@ export default {
     wrapEnter
       .append('div')
       .attr('id', 'ideditor-viewer-streetside')
+      .on(pointerPrefix + 'down.streetside', () => {
+        d3_select(window)
+          .on(pointerPrefix + 'move.streetside', () => {
+            dispatch.call('viewerChanged');
+          }, true);
+      })
+      .on(pointerPrefix + 'up.streetside pointercancel.streetside', () => {
+        d3_select(window)
+          .on(pointerPrefix + 'move.streetside', null);
+
+        // continue dispatching events for a few seconds, in case viewer has inertia.
+        let t = d3_timer(elapsed => {
+          dispatch.call('viewerChanged');
+          if (elapsed > 2000) {
+            t.stop();
+          }
+        });
+      })
       .append('div')
       .attr('class', 'photo-attribution fillD');
 
diff --git a/modules/svg/streetside.js b/modules/svg/streetside.js
index 023d333e0..5d489e9aa 100644
--- a/modules/svg/streetside.js
+++ b/modules/svg/streetside.js
@@ -30,8 +30,8 @@ export function svgStreetside(projection, context, dispatch) {
         if (services.streetside && !_streetside) {
             _streetside = services.streetside;
             _streetside.event
-                .on('viewerChanged', viewerChanged)
-                .on('loadedBubbles', throttledRedraw);
+                .on('viewerChanged.svgStreetside', viewerChanged)
+                .on('loadedBubbles.svgStreetside', throttledRedraw);
         } else if (!services.streetside && _streetside) {
             _streetside = null;
         }