From e82565158fdddc3f0bf85e74aa5ac14c2a50ff60 Mon Sep 17 00:00:00 2001 From: stefano bovio Date: Thu, 20 Jan 2022 11:58:35 +0100 Subject: [PATCH] Implement msForceVisual style metadata property to force the switch to visual mode (#724) --- .../client/js/api/geonode/style/index.js | 51 +++++++++++++++++++ .../client/js/epics/gnresource.js | 23 ++++++--- .../client/js/epics/visualstyleeditor.js | 19 +++++-- .../client/themes/geonode/less/ms-theme.less | 10 ++++ 4 files changed, 92 insertions(+), 11 deletions(-) create mode 100644 geonode_mapstore_client/client/js/api/geonode/style/index.js diff --git a/geonode_mapstore_client/client/js/api/geonode/style/index.js b/geonode_mapstore_client/client/js/api/geonode/style/index.js new file mode 100644 index 0000000000..ef2c995f36 --- /dev/null +++ b/geonode_mapstore_client/client/js/api/geonode/style/index.js @@ -0,0 +1,51 @@ +/* + * Copyright 2022, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import { + getStyleCodeByName, + updateStyle +} from '@mapstore/framework/api/geoserver/Styles'; + +export function getStyleProperties({ baseUrl, styleName }) { + return import('md5').then((mod) => { + const md5 = mod.default; + return getStyleCodeByName({ + baseUrl, + styleName + }) + .then((style) => { + const { + msForceVisual, + ...metadata + } = style?.metadata || {}; + if (!msForceVisual || msForceVisual === '') { + return style; + } + // force use of visual style editor with msForceVisual + // and remove the true value + const updatedMetadata = { + ...metadata, + msForceVisual: '', + msEditorType: 'visual', + msStyleJSON: '', + msMD5Hash: md5(style?.code) + }; + return updateStyle({ + ...style, + baseUrl, + styleName, + metadata: updatedMetadata, + options: { + params: { + raw: true + } + } + }).then(() => ({ ...style, metadata: updatedMetadata })); + }); + }); +} diff --git a/geonode_mapstore_client/client/js/epics/gnresource.js b/geonode_mapstore_client/client/js/epics/gnresource.js index 63cf699720..17a1d62fc9 100644 --- a/geonode_mapstore_client/client/js/epics/gnresource.js +++ b/geonode_mapstore_client/client/js/epics/gnresource.js @@ -61,7 +61,8 @@ import { import { resourceToLayerConfig, ResourceTypes, - toMapStoreMapConfig + toMapStoreMapConfig, + parseStyleName } from '@js/utils/ResourceUtils'; import { canAddResource, @@ -70,7 +71,6 @@ import { } from '@js/selectors/resource'; import { updateAdditionalLayer } from '@mapstore/framework/actions/additionallayers'; import { STYLE_OWNER_NAME } from '@mapstore/framework/utils/StyleEditorUtils'; -import StylesAPI from '@mapstore/framework/api/geoserver/Styles'; import { styleServiceSelector } from '@mapstore/framework/selectors/styleeditor'; import { updateStyleService } from '@mapstore/framework/api/StyleEditor'; import { resizeMap } from '@mapstore/framework/actions/map'; @@ -79,6 +79,7 @@ import { error as errorNotification, success as successNotification } from '@mapstore/framework/actions/notifications'; +import { getStyleProperties } from '@js/api/geonode/style'; const resourceTypes = { [ResourceTypes.DATASET]: { @@ -99,11 +100,21 @@ const resourceTypes = { return [mapConfig, gnLayer, newLayer]; } - return StylesAPI.getStylesInfo({ + return getStyleProperties({ baseUrl: options?.styleService?.baseUrl, - styles: [newLayer.extendedParams.defaultStyle] - }).then((availableStyles) => { - return [mapConfig, gnLayer, { ...newLayer, availableStyles }]; + styleName: parseStyleName(newLayer.extendedParams.defaultStyle) + }).then((updatedStyle) => { + return [ + mapConfig, + gnLayer, + { + ...newLayer, + availableStyles: [{ + ...updatedStyle, + ...newLayer.extendedParams.defaultStyle + }] + } + ]; }); }) ) diff --git a/geonode_mapstore_client/client/js/epics/visualstyleeditor.js b/geonode_mapstore_client/client/js/epics/visualstyleeditor.js index 769c170b1c..13f2c9d41f 100644 --- a/geonode_mapstore_client/client/js/epics/visualstyleeditor.js +++ b/geonode_mapstore_client/client/js/epics/visualstyleeditor.js @@ -21,6 +21,7 @@ import { import { REQUEST_DATASET_AVAILABLE_STYLES } from '@js/actions/visualstyleeditor'; import tinycolor from 'tinycolor2'; import { parseStyleName } from '@js/utils/ResourceUtils'; +import { getStyleProperties } from '@js/api/geonode/style'; /** * @module epics/visualstyleeditor @@ -67,13 +68,21 @@ function getGnStyleQueryParams(style, styleService) { return new Promise(resolve => resolve({ msStyleJSON, msEditorType, code })); } - return StylesAPI.getStyleCodeByName({ + return getStyleProperties({ baseUrl: styleService?.baseUrl, styleName: parseStyleName(style) - }).then(updatedStyle => { - const { metadata = {}, code: updateStyleCode, format, languageVersion } = updatedStyle || {}; - return { msEditorType: metadata?.msEditorType, msStyleJSON: metadata?.msStyleJSON, code: updateStyleCode, format, languageVersion }; - }).catch(() => ({ msEditorType, msStyleJSON, code})); + }) + .then(updatedStyle => { + const { metadata = {}, code: updateStyleCode, format, languageVersion } = updatedStyle || {}; + return { + msEditorType: metadata?.msEditorType, + msStyleJSON: metadata?.msStyleJSON, + code: updateStyleCode, + format, + languageVersion + }; + }) + .catch(() => ({ msEditorType, msStyleJSON, code})); } function getGeoNodeStyles({ layer, styleService }) { diff --git a/geonode_mapstore_client/client/themes/geonode/less/ms-theme.less b/geonode_mapstore_client/client/themes/geonode/less/ms-theme.less index 52cb3a4ad1..d251ad60c7 100644 --- a/geonode_mapstore_client/client/themes/geonode/less/ms-theme.less +++ b/geonode_mapstore_client/client/themes/geonode/less/ms-theme.less @@ -268,3 +268,13 @@ div#mapstore-globalspinner { .ms-side-panel .ms-header { box-shadow: none; } + +// missing close symbol in geocss code editor picker +.ms-inline-widget-container { + .btn.close:before { + content: "X"; + } + .btn.close:hover { + color: #ffffff; + } +}