/**
|
* @module olcs.OverlaySynchronizer
|
*/
|
import olcsSynchronizedOverlay from './SynchronizedOverlay.js';
|
import {getUid} from './util.js';
|
|
class OverlaySynchronizer {
|
/**
|
* @param {!ol.Map} map
|
* @param {!Cesium.Scene} scene
|
* @constructor
|
* @template T
|
* @api
|
*/
|
constructor(map, scene) {
|
/**
|
* @type {!ol.Map}
|
* @protected
|
*/
|
this.map = map;
|
|
/**
|
* @type {ol.Collection.<ol.Overlay>}
|
* @private
|
*/
|
this.overlays_ = this.map.getOverlays();
|
|
/**
|
* @type {!Cesium.Scene}
|
* @protected
|
*/
|
this.scene = scene;
|
|
/**
|
* @private
|
* @type {!Element}
|
*/
|
this.overlayContainerStopEvent_ = document.createElement('DIV');
|
this.overlayContainerStopEvent_.className = 'ol-overlaycontainer-stopevent';
|
const overlayEvents = ['click', 'dblclick', 'mousedown', 'touchstart', 'MSPointerDown', 'pointerdown', 'mousewheel', 'wheel'];
|
overlayEvents.forEach((event) => {
|
this.overlayContainerStopEvent_.addEventListener(event, evt => evt.stopPropagation());
|
});
|
this.scene.canvas.parentElement.appendChild(this.overlayContainerStopEvent_);
|
|
/**
|
* @private
|
* @type {!Element}
|
*/
|
this.overlayContainer_ = document.createElement('DIV');
|
this.overlayContainer_.className = 'ol-overlaycontainer';
|
this.scene.canvas.parentElement.appendChild(this.overlayContainer_);
|
|
|
/**
|
* @type {!Object<?,olcs.SynchronizedOverlay>}
|
* @private
|
*/
|
this.overlayMap_ = {};
|
}
|
|
/**
|
* Get the element that serves as a container for overlays that don't allow
|
* event propagation. Elements added to this container won't let mousedown and
|
* touchstart events through to the map, so clicks and gestures on an overlay
|
* don't trigger any {@link ol.MapBrowserEvent}.
|
* @return {!Element} The map's overlay container that stops events.
|
*/
|
getOverlayContainerStopEvent() {
|
return this.overlayContainerStopEvent_;
|
}
|
|
/**
|
* Get the element that serves as a container for overlays.
|
* @return {!Element} The map's overlay container.
|
*/
|
getOverlayContainer() {
|
return this.overlayContainer_;
|
}
|
|
/**
|
* Destroy all and perform complete synchronization of the overlays.
|
* @api
|
*/
|
synchronize() {
|
this.destroyAll();
|
this.addOverlays();
|
this.overlays_.on('add', this.addOverlayFromEvent_.bind(this));
|
this.overlays_.on('remove', this.removeOverlayFromEvent_.bind(this));
|
}
|
|
/**
|
* @param {ol.Collection.Event} event
|
* @private
|
*/
|
addOverlayFromEvent_(event) {
|
const overlay = /** @type {ol.Overlay} */ (event.element);
|
this.addOverlay(overlay);
|
}
|
|
/**
|
* @api
|
*/
|
addOverlays() {
|
this.overlays_.forEach((overlay) => { this.addOverlay(overlay); });
|
}
|
|
/**
|
* @param {ol.Overlay} overlay
|
* @api
|
*/
|
addOverlay(overlay) {
|
if (!overlay) {
|
return;
|
}
|
const cesiumOverlay = new olcsSynchronizedOverlay({
|
scene: this.scene,
|
synchronizer: this,
|
parent: overlay
|
});
|
|
const overlayId = getUid(overlay).toString();
|
this.overlayMap_[overlayId] = cesiumOverlay;
|
}
|
|
/**
|
* @param {ol.Collection.Event} event
|
* @private
|
*/
|
removeOverlayFromEvent_(event) {
|
const removedOverlay = /** @type {ol.Overlay} */ (event.element);
|
this.removeOverlay(removedOverlay);
|
}
|
|
/**
|
* Removes an overlay from the scene
|
* @param {ol.Overlay} overlay
|
* @api
|
*/
|
removeOverlay(overlay) {
|
const overlayId = getUid(overlay).toString();
|
const csOverlay = this.overlayMap_[overlayId];
|
if (csOverlay) {
|
csOverlay.destroy();
|
delete this.overlayMap_[overlayId];
|
}
|
}
|
|
/**
|
* Destroys all the created Cesium objects.
|
* @protected
|
*/
|
destroyAll() {
|
Object.keys(this.overlayMap_).forEach((key) => {
|
const overlay = this.overlayMap_[key];
|
overlay.destroy();
|
delete this.overlayMap_[key];
|
});
|
}
|
}
|
|
|
export default OverlaySynchronizer;
|