Store the background opacity in the permalink

camptocamp · May 22, 2019 · 60c4290 · 60c4290
1 parent 8647445
commit 60c4290
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 4 deletions.
diff --git a/contribs/gmf/src/index.js b/contribs/gmf/src/index.js
@@ -32,6 +32,7 @@ exports.COORDINATES_LAYER_NAME = 'gmfCoordinatesLayerName';
  */
 exports.PermalinkParam = {
   BG_LAYER: 'baselayer_ref',
+  BG_LAYER_OPACITY: 'baselayer_opacity',
   EXTERNAL_DATASOURCES_NAMES: 'eds_n',
   EXTERNAL_DATASOURCES_URLS: 'eds_u',
   FEATURES: 'rl_features',

diff --git a/contribs/gmf/src/permalink/Permalink.js b/contribs/gmf/src/permalink/Permalink.js
@@ -342,7 +342,8 @@ const exports = function($q, $timeout, $rootScope, $injector, ngeoDebounce, gett
       this.ngeoBackgroundLayerMgr_,
       'change',
       this.handleBackgroundLayerManagerChange_,
-      this);
+      this
+    );
   }
 
   // visibility
@@ -661,7 +662,6 @@ exports.prototype.setMap = function(map) {
       this.registerMap_(map, null);
     }
   }
-
 };
 
 
@@ -757,8 +757,7 @@ exports.prototype.unregisterMap_ = function() {
 
 
 /**
- * Get the background layer object to use to initialize the map from the
- * state manager.
+ * Get the background layer object to use to initialize the map from the state manager.
  * @param {!Array.<!ol.layer.Base>} layers Array of background layer objects.
  * @return {?ol.layer.Base} Background layer.
  * @export
@@ -776,6 +775,16 @@ exports.prototype.getBackgroundLayer = function(layers) {
 };
 
 
+/**
+ * Get the background layer opacity to use to initialize the map from the state manager.
+ * @return {number} Opacity.
+ */
+exports.prototype.getBackgroundLayerOpacity = function() {
+  const opacity_ = this.ngeoStateManager_.getInitialNumberValue(gmfBase.PermalinkParam.BG_LAYER_OPACITY);
+  return opacity_ === undefined ? undefined : opacity_ / 100;
+};
+
+
 /**
  * Called when the background layer changes. Update the state using the
  * background layer label, i.e. its name.
@@ -795,6 +804,31 @@ exports.prototype.handleBackgroundLayerManagerChange_ = function() {
   const object = {};
   object[gmfBase.PermalinkParam.BG_LAYER] = layerName;
   this.ngeoStateManager_.updateState(object);
+
+  const backgroundLayer = this.ngeoBackgroundLayerMgr_.getOpacityBgLayer(this.map_);
+  if (backgroundLayer) {
+    const opacity = this.getBackgroundLayerOpacity();
+    if (opacity !== undefined) {
+      backgroundLayer.setOpacity(opacity);
+    } else {
+      const opacity = backgroundLayer.getOpacity();
+      /** @type {Object<string, string>} */
+      const object = {};
+      object[gmfBase.PermalinkParam.BG_LAYER_OPACITY] = `${opacity * 100}`;
+      this.ngeoStateManager_.updateState(object);
+    }
+    olEvents.listen(
+      backgroundLayer,
+      'change:opacity',
+      () => {
+        const opacity = backgroundLayer.getOpacity();
+        /** @type {Object<string, string>} */
+        const object = {};
+        object[gmfBase.PermalinkParam.BG_LAYER_OPACITY] = `${opacity * 100}`;
+        this.ngeoStateManager_.updateState(object);
+      }
+    );
+  }
 };