nakarte

commit 542a1adf30f38bb018b88a4aa0eb9ad634a7079e
parent 55464203747e48d37b97aa2c8992f300fbb563dc
Author: Sergey Orlov <wladimirych@gmail.com>
Date:   Fri,  1 May 2020 22:45:23 +0200

panoramas: move "close button" from mapillary to common lib #379

Diffstat:
A
src/lib/leaflet.control.panoramas/lib/common/index.js
 | 
15
+++++++++++++++
M
src/lib/leaflet.control.panoramas/lib/mapillary/index.js
 | 
17
+++++++----------

2 files changed, 22 insertions(+), 10 deletions(-)
diff --git a/src/lib/leaflet.control.panoramas/lib/common/index.js b/src/lib/leaflet.control.panoramas/lib/common/index.js
@@ -0,0 +1,15 @@
+import L from 'leaflet';
+import './style.css';
+
+const CloseButtonMixin = {
+    createCloseButton: function(container) {
+        this.closeButton = L.DomUtil.create('div', 'photo-viewer-button-close', container);
+        L.DomEvent.on(this.closeButton, 'click', this.onCloseClick, this);
+    },
+
+    onCloseClick: function() {
+        this.fire('closeclick');
+    },
+};
+
+export {CloseButtonMixin};
diff --git a/src/lib/leaflet.control.panoramas/lib/mapillary/index.js b/src/lib/leaflet.control.panoramas/lib/mapillary/index.js
@@ -3,7 +3,7 @@ import {MapillaryCoverage} from './mapillary-coverage-layer';
 import {fetch} from '~/lib/xhr-promise';
 import config from '~/config';
 import './style.css';
-import '../common/style.css';
+import {CloseButtonMixin} from '../common';
 
 function getCoverageLayer(options) {
     return new MapillaryCoverage(options);
@@ -35,6 +35,8 @@ function formatDateTime(ts) {
 }
 
 const Viewer = L.Evented.extend({
+        includes: [CloseButtonMixin],
+
         initialize: function(mapillary, container) {
             const id = `container-${L.stamp(container)}`;
             container.id = id;
@@ -47,8 +49,7 @@ const Viewer = L.Evented.extend({
             viewer.on('nodechanged', this.onNodeChanged.bind(this));
             viewer.on('bearingchanged', this.onBearingChanged.bind(this));
             this.dateLabel = L.DomUtil.create('div', 'mapillary-viewer-date-overlay', container);
-            this.closeButton = L.DomUtil.create('div', 'photo-viewer-button-close', container);
-            L.DomEvent.on(this.closeButton, 'click', this.onCloseClick, this);
+            this.createCloseButton(container);
             this._bearing = 0;
             this._zoom = 0;
             this._center = [0, 0];
@@ -69,7 +70,7 @@ const Viewer = L.Evented.extend({
                 return;
             }
             this._node = node;
-            this.fireChangeEvenet();
+            this.fireChangeEvent();
             this.dateLabel.innerHTML = formatDateTime(node.capturedAt);
         },
 
@@ -86,14 +87,10 @@ const Viewer = L.Evented.extend({
                 return;
             }
             this._bearing = bearing;
-            this.fireChangeEvenet();
-        },
-
-        onCloseClick: function() {
-            this.fire('closeclick');
+            this.fireChangeEvent();
         },
 
-        fireChangeEvenet: function() {
+        fireChangeEvent: function() {
             if (this._node) {
                 const latlon = this._node.originalLatLon;
                 this.fire('change', {