diff --git a/css/60_photos.css b/css/60_photos.css index 44b80781c..25617bbe8 100644 --- a/css/60_photos.css +++ b/css/60_photos.css @@ -195,27 +195,21 @@ /* Streetside viewer */ -#ms .domRenderer .TagSymbol { - font-size: 10px; - background-color: rgba(0,0,0,0.4); - padding: 0 4px; - border-radius: 4px; - top: -25px; -} -#ms .domRenderer .Attribution { - /* we will roll our own to avoid async update issues like #4526 */ - display: none; -} - .ms-wrapper .photo-attribution a:active, .ms-wrapper .photo-attribution a:hover { color: #35af6d; } -.ms-wrapper .mapillary-js-dom { - z-index: 9; +.pnlm-compass { + width: 26px; + height: 26px; + left: 4px; + top: 60px; + background-size: contain; + background-repeat: no-repeat no-repeat; } + /* Mapillary viewer */ #mly .domRenderer .TagSymbol { font-size: 10px; @@ -238,6 +232,7 @@ z-index: 9; } + /* OpenStreetCam viewer */ .osc-wrapper { position: relative; diff --git a/modules/services/streetside.js b/modules/services/streetside.js index ac4ba25ef..ed4fa8342 100644 --- a/modules/services/streetside.js +++ b/modules/services/streetside.js @@ -3,8 +3,9 @@ import _forEach from 'lodash-es/forEach'; import _map from 'lodash-es/map'; import _union from 'lodash-es/union'; -import { range as d3_range } from 'd3-array'; import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { range as d3_range } from 'd3-array'; +import { timer as d3_timer } from 'd3-timer'; import { select as d3_select, @@ -312,12 +313,21 @@ export default { _pannellumViewer = window.pannellum.viewer('viewer-streetside', options); _pannellumViewer - .on('mouseup', updateRotation) - .on('touchend', updateRotation); - - function updateRotation() { - dispatch.call('viewerChanged'); - } + .on('mousedown', function() { + d3_select(window).on('mousemove.pannellum', function() { + dispatch.call('viewerChanged'); + }); + }) + .on('mouseup', function() { + d3_select(window).on('mousemove.pannellum', null); + // continue dispatching events for a few seconds, in case viewer has inertia. + var t = d3_timer(function(elapsed) { + dispatch.call('viewerChanged'); + if (elapsed > 2000) { + t.stop(); + } + }); + }); }, @@ -483,6 +493,7 @@ export default { showFullscreenCtrl: false, autoLoad: true, compass: true, + yaw: d.ca, type: 'cubemap', cubeMap: [ imgUrlPrefix + imgLocIdxArr[0] + imgUrlSuffix,