diff --git a/contribs/gmf/src/controllers/AbstractAppController.js b/contribs/gmf/src/controllers/AbstractAppController.js index 01870de73f69..ce23ec7b02b8 100644 --- a/contribs/gmf/src/controllers/AbstractAppController.js +++ b/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_(); diff --git a/contribs/gmf/src/index.js b/contribs/gmf/src/index.js index 0df2b7aa8f99..1430a622d851 100644 --- a/contribs/gmf/src/index.js +++ b/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', diff --git a/contribs/gmf/src/layertree/TreeManager.js b/contribs/gmf/src/layertree/TreeManager.js index 6f574deec0c0..a6ab98f073be 100644 --- a/contribs/gmf/src/layertree/TreeManager.js +++ b/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) { diff --git a/contribs/gmf/src/permalink/Permalink.js b/contribs/gmf/src/permalink/Permalink.js index 41e51f9ca026..367410739d61 100644 --- a/contribs/gmf/src/permalink/Permalink.js +++ b/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.} 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. + */ +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. @@ -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} */ + 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} */ + const object = {}; + object[gmfBase.PermalinkParam.BG_LAYER_OPACITY] = `${opacity * 100}`; + this.ngeoStateManager_.updateState(object); + } + ); + } }; diff --git a/contribs/gmf/src/query/window.scss b/contribs/gmf/src/query/window.scss index 354fb48c39e5..4352c59e8a6e 100644 --- a/contribs/gmf/src/query/window.scss +++ b/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 { diff --git a/contribs/gmf/src/query/windowComponent.html b/contribs/gmf/src/query/windowComponent.html index 34798247d5bf..d99fcd089d8b 100644 --- a/contribs/gmf/src/query/windowComponent.html +++ b/contribs/gmf/src/query/windowComponent.html @@ -34,7 +34,7 @@ ng-animate-swap="ctrl.animate" class="slide-animation gmf-animatable"> -
+

{{ctrl.source.label | translate}}

diff --git a/contribs/gmf/src/query/windowComponent.js b/contribs/gmf/src/query/windowComponent.js index 12d8a1228490..f3e9261f24d7 100644 --- a/contribs/gmf/src/query/windowComponent.js +++ b/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 }); } }; diff --git a/contribs/gmf/src/theme/Manager.js b/contribs/gmf/src/theme/Manager.js index 24879c107bbe..7067f675c3f1 100644 --- a/contribs/gmf/src/theme/Manager.js +++ b/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) { diff --git a/src/statemanager/Service.js b/src/statemanager/Service.js index b3968ceda12e..5094fcd5900d 100644 --- a/src/statemanager/Service.js +++ b/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]; };