Merge remote-tracking branch 'origin/2.3' into 2.4

contribs/gmf/src/controllers/AbstractAppController.js

@@ -232,7 +232,7 @@ export function AbstractAppController(config, map, $scope, $injector) {
 
     if (evt.type !== 'ready') {
       const themeName = this.permalink_.defaultThemeNameFromFunctionalities();
-      this.gmfThemeManager.updateCurrentTheme(themeName, previousThemeName);
+      this.gmfThemeManager.updateCurrentTheme(themeName, previousThemeName, true);
     }
     this.setDefaultBackground_(null);
     this.updateHasEditableLayers_();

contribs/gmf/src/index.js

@@ -25,6 +25,7 @@ export const COORDINATES_LAYER_NAME = 'gmfCoordinatesLayerName';
  */
 export const PermalinkParam = {
   BG_LAYER: 'baselayer_ref',
+  BG_LAYER_OPACITY: 'baselayer_opacity',
   EXTERNAL_DATASOURCES_NAMES: 'eds_n',
   EXTERNAL_DATASOURCES_URLS: 'eds_u',
   FEATURES: 'rl_features',

contribs/gmf/src/layertree/TreeManager.js

@@ -178,7 +178,7 @@ LayertreeTreeManager.prototype.setFirstLevelGroups = function(firstLevelGroups)
  *     group.
  * @param {boolean=} opt_add if true, force to use the 'add' mode this time.
  * @param {boolean=} opt_silent if true notifyCantAddGroups_ is not called.
- * @return{boolean} True if the group has been added. False otherwise.
+ * @return {boolean} True if the group has been added. False otherwise.
  */
 LayertreeTreeManager.prototype.addFirstLevelGroups = function(firstLevelGroups,
   opt_add, opt_silent) {

contribs/gmf/src/permalink/Permalink.js

@@ -528,7 +528,8 @@ export function PermalinkService(
       this.ngeoBackgroundLayerMgr_,
       'change',
       this.handleBackgroundLayerManagerChange_,
-      this);
+      this
+    );
   }
 
   // visibility
@@ -843,7 +844,6 @@ PermalinkService.prototype.setMap = function(map) {
       this.registerMap_(map, null);
     }
   }
-
 };
 
 
@@ -940,8 +940,7 @@ PermalinkService.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.<!import("ol/layer/Base.js").default>} layers Array of background layer objects.
  * @return {?import("ol/layer/Base.js").default} Background layer.
  */
@@ -958,6 +957,16 @@ PermalinkService.prototype.getBackgroundLayer = function(layers) {
 };
 
 
+/**
+ * Get the background layer opacity to use to initialize the map from the state manager.
+ * @return {number} Opacity.
+ */
+PermalinkService.prototype.getBackgroundLayerOpacity = function() {
+  const opacity_ = this.ngeoStateManager_.getInitialNumberValue(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.
@@ -978,6 +987,31 @@ PermalinkService.prototype.handleBackgroundLayerManagerChange_ = function() {
   const object = {};
   object[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[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[PermalinkParam.BG_LAYER_OPACITY] = `${opacity * 100}`;
+        this.ngeoStateManager_.updateState(object);
+      }
+    );
+  }
 };
 
 

contribs/gmf/src/query/window.scss

@@ -62,7 +62,6 @@ div.ngeo-displaywindow {
       flex-direction: column;
       width: 100%;
       height: 100%;
-      padding: $app-margin;
       text-align: left;
       white-space: nowrap;
       overflow: hidden;
@@ -76,6 +75,14 @@ div.ngeo-displaywindow {
       .content-template-container {
         overflow: auto;
       }
+      .header {
+        padding: $app-margin $app-margin 0 $app-margin;
+      }
+      .details {
+        padding: 0 $app-margin $app-margin $app-margin;
+        // small margin so that the scrollbar and the window resize are not in conflict.
+        margin-right: $half-app-margin;
+      }
     }
   }
   .animation-container-detailed {

contribs/gmf/src/query/windowComponent.html

@@ -34,7 +34,7 @@
         ng-animate-swap="ctrl.animate"
         class="slide-animation gmf-animatable">
 
-        <div class="header">
+        <div class="header ui-draggable-handle">
           <p
             class="title"
             >{{ctrl.source.label | translate}}</p>

contribs/gmf/src/query/windowComponent.js

@@ -301,14 +301,15 @@ QueryWindowController.prototype.$onInit = function() {
   }
   highlightFeaturesOverlay.setStyle(highlightFeatureStyle);
 
+  const windowContainer = this.element_.find('.gmf-displayquerywindow .windowcontainer');
   if (this.desktop) {
-    this.element_.find('.gmf-displayquerywindow .windowcontainer').draggable({
-      'cancel': 'input,textarea,button,select,option,tr',
-      'containment': this.draggableContainment
+    windowContainer.draggable({
+      handle: '.header',
+      containment: this.draggableContainment
     });
-    this.element_.find('.gmf-displayquerywindow .windowcontainer').resizable({
-      'minHeight': 240,
-      'minWidth': 240
+    windowContainer.resizable({
+      minHeight: 240,
+      minWidth: 240
     });
   }
 };

contribs/gmf/src/theme/Manager.js

@@ -119,15 +119,16 @@ ThemeManagerService.prototype.isLoading = function() {
 /**
  * @param {string} themeName wanted theme name.
  * @param {string} fallbackThemeName fallback theme name.
+ * @param {boolean=} opt_silent if true notifyCantAddGroups_ is not called.
  * @export
  */
-ThemeManagerService.prototype.updateCurrentTheme = function(themeName, fallbackThemeName) {
+ThemeManagerService.prototype.updateCurrentTheme = function(themeName, fallbackThemeName, opt_silent) {
   this.gmfThemes_.getThemesObject().then((themes) => {
     if (!themeName && this.modeFlush) {
       // In flush mode load current theme private groups
       const fallbackTheme = findThemeByName(themes, fallbackThemeName);
       if (fallbackTheme) {
-        this.gmfTreeManager_.addFirstLevelGroups(fallbackTheme.children, false, false);
+        this.gmfTreeManager_.addFirstLevelGroups(fallbackTheme.children, false, opt_silent);
       }
     }
     if (themeName) {

src/statemanager/Service.js

@@ -117,11 +117,7 @@ StatemanagerService.prototype.getInitialValue = function(key) {
  * @return {string|undefined} State value.
  */
 StatemanagerService.prototype.getInitialStringValue = function(key) {
-  const value = this.initialState[key];
-  if (value === undefined) {
-    return undefined;
-  }
-  return value;
+  return this.initialState[key];
 };