From a12cc619be19fbaef6397de8a2d018ae155805be Mon Sep 17 00:00:00 2001 From: allyoucanmap Date: Tue, 24 Nov 2020 15:16:04 +0100 Subject: [PATCH] replace require with import and export and update mapstore submodule --- geonode_mapstore_client/client/MapStore2 | 2 +- geonode_mapstore_client/client/js/api.js | 92 +++++------ .../client/js/api/geonode.js | 35 ++--- .../js/components/leaflet/ArcGisMapServer.js | 6 +- .../components/openlayers/ArcGisMapServer.js | 4 +- .../client/js/epics/index.js | 69 ++++---- geonode_mapstore_client/client/js/plugins.js | 148 ++++++++++++------ .../client/js/previewPlugins.js | 79 +++++++--- geonode_mapstore_client/client/package.json | 2 +- .../geonode/js/ms2/utils/ms2_base_plugins.js | 2 +- .../geonode-mapstore-client/_config.html | 5 +- 11 files changed, 251 insertions(+), 193 deletions(-) diff --git a/geonode_mapstore_client/client/MapStore2 b/geonode_mapstore_client/client/MapStore2 index 3cac29f044..f479e14c59 160000 --- a/geonode_mapstore_client/client/MapStore2 +++ b/geonode_mapstore_client/client/MapStore2 @@ -1 +1 @@ -Subproject commit 3cac29f044649a1ab3da576bacdb20951ae6635e +Subproject commit f479e14c597d9451a96d1b1253656844caca7149 diff --git a/geonode_mapstore_client/client/js/api.js b/geonode_mapstore_client/client/js/api.js index 230b2c2cc6..46399274f1 100644 --- a/geonode_mapstore_client/client/js/api.js +++ b/geonode_mapstore_client/client/js/api.js @@ -5,49 +5,25 @@ * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. */ -require('react-widgets/dist/css/react-widgets.css'); -const assign = require("object-assign"); -const ConfigUtils = require('@mapstore/framework/utils/ConfigUtils'); -const LocaleUtils = require('@mapstore/framework/utils/LocaleUtils'); -const LayersUtils = require('@mapstore/framework/utils/LayersUtils'); -LayersUtils.setRegGeoserverRule(/\/[\w- ]*geoserver[\w- ]*\/|\/[\w- ]*gs[\w- ]*\//); -const {keyBy, values} = require('lodash'); -require('react-select/dist/react-select.css'); -/** - * Add custom (overriding) translations with: - * - * ConfigUtils.setConfigProp('translationsPath', ['./MapStore2/web/client/translations', './translations']); - */ -ConfigUtils.setConfigProp('themePrefix', 'msgapi'); -const Persistence = require("@mapstore/framework/api/persistence"); -Persistence.addApi("geonode", require("./api/geonode")); -Persistence.setApi("geonode"); +import assign from "object-assign"; +import keyBy from 'lodash/keyBy'; +import values from 'lodash/values'; +import { setConfigProp } from '@mapstore/framework/utils/ConfigUtils'; +import { getSupportedLocales, setSupportedLocales } from '@mapstore/framework/utils/LocaleUtils'; +import { setRegGeoserverRule } from '@mapstore/framework/utils/LayersUtils'; +import { addApi, setApi } from "@mapstore/framework/api/persistence"; +import geoNodeAPI from "@js/api/geonode"; +import MapStore2JSAPI from '@mapstore/framework/jsapi/MapStore2'; +import 'react-widgets/dist/css/react-widgets.css'; +import 'react-select/dist/react-select.css'; -/** - * Use a custom plugins configuration file with: - * - * ConfigUtils.setLocalConfigurationFile('localConfig.json'); - */ -// ConfigUtils.setLocalConfigurationFile('MapStore2/web/client/localConfig.json'); +setRegGeoserverRule(/\/[\w- ]*geoserver[\w- ]*\/|\/[\w- ]*gs[\w- ]*\//); -/** - * Use a custom application configuration file with: - * - * const appConfig = require('./appConfig'); - * - * Or override the application configuration file with (e.g. only one page with a mapviewer): - * - * const appConfig = assign({}, require('../MapStore2/web/client/product/appConfig'), { - * pages: [{ - * name: "mapviewer", - * path: "/", - * component: require('../MapStore2/web/client/product/pages/MapViewer') - * }] - * }); - */ -// const appConfig = require('../MapStore2/web/client/product/appConfig'); +setConfigProp('themePrefix', 'msgapi'); +addApi("geonode", geoNodeAPI); +setApi("geonode"); const getScriptPath = function() { const scriptEl = document.getElementById('ms2-api'); @@ -61,8 +37,8 @@ const axios = require('@mapstore/framework/libs/ajax'); axios.defaults.xsrfHeaderName = "X-CSRFToken"; axios.defaults.xsrfCookieName = "csrftoken"; -const createMapStore2Api = function(plugins) { - const MapStore2 = require('@mapstore/framework/jsapi/MapStore2').withPlugins(plugins, { +const createMapStore2Api = function(plugins, type) { + const MapStore2 = MapStore2JSAPI.withPlugins(plugins, { theme: { path: getScriptPath() + '/themes' }, @@ -72,7 +48,9 @@ const createMapStore2Api = function(plugins) { // window.MapStore2 = MapStore2; return assign({}, MapStore2, { create: function(container, opts) { if (opts && opts.localConfig) { - Object.keys(opts.localConfig).map(function(c) {ConfigUtils.setConfigProp(c, opts.localConfig[c]); }); + Object.keys(opts.localConfig).map(function(c) {setConfigProp(c, opts.localConfig[c]); }); + // select mapLayout based on type + setConfigProp('mapLayout', opts.localConfig?.mapLayout?.[type]); } return MapStore2.create(container, opts); } @@ -83,23 +61,29 @@ window.initMapstore2Api = function(config, resolve) { // force supported locales to the selected one const setLocale = (localeKey) => { - const supportedLocales = LocaleUtils.getSupportedLocales(); + const supportedLocales = getSupportedLocales(); const locale = supportedLocales[localeKey] ? { [localeKey]: supportedLocales[localeKey] } : { en: supportedLocales.en }; - LocaleUtils.setSupportedLocales(locale); + setSupportedLocales(locale); }; - - require(`./components/${maptype}/ArcGisMapServer`);// eslint-disable-line - if (config === 'preview') { - require.ensure('./previewPlugins', function() { - resolve(createMapStore2Api(require('./previewPlugins')), { setLocale }); - }); - } else { - require.ensure('./plugins', function() { - resolve(createMapStore2Api(require('./plugins')), { setLocale }); + // Note: maptype is provided by the page template + import(`./components/${maptype}/ArcGisMapServer`) // eslint-disable-line + .then(() => { + if (config === 'preview') { + import('./previewPlugins') + .then((mod) => { + const previewPlugins = mod.default; + resolve(createMapStore2Api(previewPlugins, 'preview'), { setLocale }); + }); + } else { + import('./plugins') + .then((mod) => { + const plugins = mod.default; + resolve(createMapStore2Api(plugins, 'viewer'), { setLocale }); + }); + } }); - } }; const createConfigObj = (cfg = []) => keyBy(cfg, (o) => o.name || o); diff --git a/geonode_mapstore_client/client/js/api/geonode.js b/geonode_mapstore_client/client/js/api/geonode.js index 01bfa9ccd1..690f186d57 100644 --- a/geonode_mapstore_client/client/js/api/geonode.js +++ b/geonode_mapstore_client/client/js/api/geonode.js @@ -6,10 +6,9 @@ * LICENSE file in the root directory of this source tree. */ -const Rx = require('rxjs'); -const axios = require('@mapstore/framework/libs/ajax'); -const ConfigUtils = require("@mapstore/framework/utils/ConfigUtils"); - +import Rx from 'rxjs'; +import axios from '@mapstore/framework/libs/ajax'; +import { getConfigProp } from "@mapstore/framework/utils/ConfigUtils"; const createAttributesFromMetadata = ({ name, description }) => { return [{ @@ -35,25 +34,25 @@ const addThumbToAttributes = ({ data }, attributes) => { ]; }; const patchResource = (id, resource) => { - const baseUrl = ConfigUtils.getConfigProp("genode_rest_api") || "./"; + const baseUrl = getConfigProp("genode_rest_api") || "./"; return axios.patch(`${baseUrl}resources/${id}/?full=true`, resource); }; const postResource = (data, metadata, { thumbnail }) => { - const baseUrl = ConfigUtils.getConfigProp("genode_rest_api") || "./"; + const baseUrl = getConfigProp("genode_rest_api") || "./"; const attributes = thumbnail ? addThumbToAttributes(thumbnail, createAttributesFromMetadata(metadata)) : createAttributesFromMetadata(metadata); return axios.post(`${baseUrl}resources/?full=true`, { data, attributes, name: metadata.name }, { timeout: 10000 }); }; const getLayerEditPerimissions = (name) => { - const baseUrl = ConfigUtils.getConfigProp("geonode_url") || "./"; + const baseUrl = getConfigProp("geonode_url") || "./"; return axios.get(`${baseUrl}gs/${name}/edit-check`); }; const getStyleEditPerimissions = (name) => { - const baseUrl = ConfigUtils.getConfigProp("geonode_url") || "./"; + const baseUrl = getConfigProp("geonode_url") || "./"; return axios.get(`${baseUrl}gs/${name}/style-check`); }; const postThumbnail = (endPoint, id, body = {}) => { - const baseUrl = ConfigUtils.getConfigProp("geonode_url") || "./"; + const baseUrl = getConfigProp("geonode_url") || "./"; return axios.post(`${baseUrl}${endPoint}/${id}/thumbnail`, body, { timeout: 10000 }); }; @@ -64,23 +63,23 @@ const postThumbnail = (endPoint, id, body = {}) => { * @param {object} API the API to use * @return and observable that emits the resource */ -const getResource = () => Rx.Observable.empty(); +export const getResource = () => Rx.Observable.empty(); /* * @param {resource} param0 resource content * @return an observable that emits the id of the resource */ -const createResource = ({ data, metadata, linkedResources = {} }) => +export const createResource = ({ data, metadata, linkedResources = {} }) => Rx.Observable.defer(() => postResource(data, metadata, linkedResources)) .pluck('data') - .do((res) => window.location.href = `${ConfigUtils.getConfigProp("geonode_url")}maps/${res.id}/edit`) // eslint-disable-line no-return-assign + .do((res) => window.location.href = `${getConfigProp("geonode_url")}maps/${res.id}/edit`) // eslint-disable-line no-return-assign .filter(() => false); /** * Patch a resource * @param {resource} param0 the resource to update (must contain the id) */ -const updateResource = ({ id, data } = {}) => +export const updateResource = ({ id, data } = {}) => Rx.Observable.defer( () => patchResource(id, { id, data })) .switchMap( @@ -93,22 +92,22 @@ const updateResource = ({ id, data } = {}) => * @param {object} options options * @param {object} API the API to use */ -const deleteResource = () => Rx.Observable.empty(); +export const deleteResource = () => Rx.Observable.empty(); /** * Retrieve layer's edit permission from local gs otherwise are false */ -const layerEditPermissions = (layer) => +export const layerEditPermissions = (layer) => Rx.Observable.defer(() => getLayerEditPerimissions(layer.name)) .pluck("data") .map(({ authorized }) => ({ canEdit: authorized })); -const styleEditPermissions = (layer) => +export const styleEditPermissions = (layer) => Rx.Observable.defer(() => getStyleEditPerimissions(layer.name)) .pluck("data") .map(({ authorized }) => ({ canEdit: authorized })); -const updateThumb = (endPoint, id, body) => +export const updateThumb = (endPoint, id, body) => Rx.Observable.defer(() => postThumbnail(endPoint, id, body)); -module.exports = { +export default { getResource, createResource, updateResource, diff --git a/geonode_mapstore_client/client/js/components/leaflet/ArcGisMapServer.js b/geonode_mapstore_client/client/js/components/leaflet/ArcGisMapServer.js index a296c351c4..974f88a149 100644 --- a/geonode_mapstore_client/client/js/components/leaflet/ArcGisMapServer.js +++ b/geonode_mapstore_client/client/js/components/leaflet/ArcGisMapServer.js @@ -6,10 +6,10 @@ * LICENSE file in the root directory of this source tree. */ -const Layers = require('@mapstore/framework/utils/leaflet/Layers'); -var L = require('leaflet'); +import { registerType } from '@mapstore/framework/utils/leaflet/Layers'; +import L from 'leaflet'; -Layers.registerType('arcgis', (options) => { +registerType('arcgis', (options) => { return L.esri.dynamicMapLayer({ url: options.url, opacity: options.opacity || 1, diff --git a/geonode_mapstore_client/client/js/components/openlayers/ArcGisMapServer.js b/geonode_mapstore_client/client/js/components/openlayers/ArcGisMapServer.js index c1b006b00e..77a5984ef5 100644 --- a/geonode_mapstore_client/client/js/components/openlayers/ArcGisMapServer.js +++ b/geonode_mapstore_client/client/js/components/openlayers/ArcGisMapServer.js @@ -6,12 +6,12 @@ * LICENSE file in the root directory of this source tree. */ -import Layers from '@mapstore/framework/utils/openlayers/Layers'; +import { registerType } from '@mapstore/framework/utils/openlayers/Layers'; import TileLayer from 'ol/layer/Tile'; import TileArcGISRest from 'ol/source/TileArcGISRest'; -Layers.registerType('arcgis', { +registerType('arcgis', { create: (options) => { return new TileLayer({ opacity: options.opacity !== undefined ? options.opacity : 1, diff --git a/geonode_mapstore_client/client/js/epics/index.js b/geonode_mapstore_client/client/js/epics/index.js index 22cd6fc81a..9e9b3e5ec9 100644 --- a/geonode_mapstore_client/client/js/epics/index.js +++ b/geonode_mapstore_client/client/js/epics/index.js @@ -9,42 +9,37 @@ /** * Epics needed to adapt mapstore2 to geonode backend */ -const Rx = require("rxjs"); - -const { SELECT_NODE } = require("@mapstore/framework/actions/layers"); -const { setPermission } = require("@mapstore/framework/actions/featuregrid"); -const { setEditPermissionStyleEditor, INIT_STYLE_SERVICE } = require("@mapstore/framework/actions/styleeditor"); -const { layerEditPermissions, styleEditPermissions, updateThumb } = require("../api/geonode"); -const { getSelectedLayer, layersSelector } = require("@mapstore/framework/selectors/layers"); -const { mapSelector } = require("@mapstore/framework/selectors/map"); -const ConfigUtils = require("@mapstore/framework/utils/ConfigUtils"); - -const { updateMapLayout } = require('@mapstore/framework/actions/maplayout'); -const { TOGGLE_CONTROL, SET_CONTROL_PROPERTY, SET_CONTROL_PROPERTIES } = require('@mapstore/framework/actions/controls'); -const { MAP_CONFIG_LOADED } = require('@mapstore/framework/actions/config'); -const { SIZE_CHANGE, CLOSE_FEATURE_GRID, OPEN_FEATURE_GRID } = require('@mapstore/framework/actions/featuregrid'); -const { CLOSE_IDENTIFY, ERROR_FEATURE_INFO, TOGGLE_MAPINFO_STATE, LOAD_FEATURE_INFO, EXCEPTIONS_FEATURE_INFO, NO_QUERYABLE_LAYER } = require('@mapstore/framework/actions/mapInfo'); -const { SHOW_SETTINGS, HIDE_SETTINGS } = require('@mapstore/framework/actions/layers'); -const { PURGE_MAPINFO_RESULTS } = require('@mapstore/framework/actions/mapInfo'); -const { isMapInfoOpen } = require('@mapstore/framework/selectors/mapInfo'); - -const { isFeatureGridOpen, getDockSize } = require('@mapstore/framework/selectors/featuregrid'); -const { head, get } = require('lodash'); -// const {updateMapLayoutEpic} = require('@mapstore/framework/epics/maplayout'); - -// const {basicError} = require('@mapstore/framework/utils/NotificationUtils'); +import Rx from "rxjs"; + +import { setEditPermissionStyleEditor, INIT_STYLE_SERVICE } from "@mapstore/framework/actions/styleeditor"; +import { layerEditPermissions, styleEditPermissions, updateThumb } from "@js/api/geonode"; +import { getSelectedLayer, layersSelector } from "@mapstore/framework/selectors/layers"; +import { mapSelector } from "@mapstore/framework/selectors/map"; +import { getConfigProp } from "@mapstore/framework/utils/ConfigUtils"; + +import { updateMapLayout } from '@mapstore/framework/actions/maplayout'; +import { TOGGLE_CONTROL, SET_CONTROL_PROPERTY, SET_CONTROL_PROPERTIES } from '@mapstore/framework/actions/controls'; +import { MAP_CONFIG_LOADED } from '@mapstore/framework/actions/config'; +import { SIZE_CHANGE, CLOSE_FEATURE_GRID, OPEN_FEATURE_GRID, setPermission } from '@mapstore/framework/actions/featuregrid'; +import { CLOSE_IDENTIFY, ERROR_FEATURE_INFO, TOGGLE_MAPINFO_STATE, LOAD_FEATURE_INFO, EXCEPTIONS_FEATURE_INFO, PURGE_MAPINFO_RESULTS } from '@mapstore/framework/actions/mapInfo'; +import { SHOW_SETTINGS, HIDE_SETTINGS, SELECT_NODE } from '@mapstore/framework/actions/layers'; +import { isMapInfoOpen } from '@mapstore/framework/selectors/mapInfo'; + +import { isFeatureGridOpen, getDockSize } from '@mapstore/framework/selectors/featuregrid'; +import head from 'lodash/head'; +import get from 'lodash/get'; + /** * We need to include missing epics. The plugins that normally include this epic is not used. */ -const { mapSaveMapResourceEpic } = require("@mapstore/framework/epics/maps"); -const { showCoordinateEditorSelector } = require('@mapstore/framework/selectors/controls'); - +import { mapSaveMapResourceEpic } from "@mapstore/framework/epics/maps"; +import { showCoordinateEditorSelector } from '@mapstore/framework/selectors/controls'; /** * When a user selects a layer, the app checks for layer editing permission. */ -const _setFeatureEditPermission = (action$, { getState } = {}) => - action$.ofType(SELECT_NODE).filter(({ nodeType }) => nodeType === "layer" && !ConfigUtils.getConfigProp("disableCheckEditPermissions")) +export const _setFeatureEditPermission = (action$, { getState } = {}) => + action$.ofType(SELECT_NODE).filter(({ nodeType }) => nodeType === "layer" && !getConfigProp("disableCheckEditPermissions")) .switchMap(() => { const layer = getSelectedLayer(getState() || {}); return layer ? layerEditPermissions(layer) @@ -56,11 +51,11 @@ const _setFeatureEditPermission = (action$, { getState } = {}) => * When a user selects a layer, the app checks for style editing permission. * INIT_STYLE_SERVICE si needed for map editing, it ensures an user has permission to edit style of a specific layer retrieved from catalog */ -const _setStyleEditorPermission = (action$, { getState } = {}) => +export const _setStyleEditorPermission = (action$, { getState } = {}) => action$.ofType(INIT_STYLE_SERVICE, SELECT_NODE) .filter(({ nodeType }) => - nodeType && nodeType === "layer" && !ConfigUtils.getConfigProp("disableCheckEditPermissions") - || !nodeType && !ConfigUtils.getConfigProp("disableCheckEditPermissions")) + nodeType && nodeType === "layer" && !getConfigProp("disableCheckEditPermissions") + || !nodeType && !getConfigProp("disableCheckEditPermissions")) .switchMap((action) => { const layer = getSelectedLayer(getState() || {}); return layer @@ -73,7 +68,7 @@ const _setStyleEditorPermission = (action$, { getState } = {}) => /** * Update geonode thumbnail for layers or maps */ -const _setThumbnail = (action$, { getState } = {}) => +export const _setThumbnail = (action$, { getState } = {}) => action$.ofType("GEONODE:CREATE_MAP_THUMBNAIL", "GEONODE:CREATE_LAYER_THUMBNAIL") .do(() => { try { @@ -133,9 +128,9 @@ const _setThumbnail = (action$, { getState } = {}) => }); }); // Modified to accept map-layout from Config diff less NO_QUERYABLE_LAYERS, SET_CONTROL_PROPERTIES more action$.ofType(PURGE_MAPINFO_RESULTS) -const updateMapLayoutEpic = (action$, store) => +export const updateMapLayoutEpic = (action$, store) => - action$.ofType(MAP_CONFIG_LOADED, SIZE_CHANGE, NO_QUERYABLE_LAYER, SET_CONTROL_PROPERTIES, CLOSE_FEATURE_GRID, OPEN_FEATURE_GRID, CLOSE_IDENTIFY, TOGGLE_MAPINFO_STATE, LOAD_FEATURE_INFO, EXCEPTIONS_FEATURE_INFO, TOGGLE_CONTROL, SET_CONTROL_PROPERTY, SHOW_SETTINGS, HIDE_SETTINGS, ERROR_FEATURE_INFO, PURGE_MAPINFO_RESULTS) + action$.ofType(MAP_CONFIG_LOADED, SIZE_CHANGE, SET_CONTROL_PROPERTIES, CLOSE_FEATURE_GRID, OPEN_FEATURE_GRID, CLOSE_IDENTIFY, TOGGLE_MAPINFO_STATE, LOAD_FEATURE_INFO, EXCEPTIONS_FEATURE_INFO, TOGGLE_CONTROL, SET_CONTROL_PROPERTY, SHOW_SETTINGS, HIDE_SETTINGS, ERROR_FEATURE_INFO, PURGE_MAPINFO_RESULTS) .switchMap(() => { const state = store.getState(); @@ -150,7 +145,7 @@ const updateMapLayoutEpic = (action$, store) => })); } - const mapLayout = ConfigUtils.getConfigProp("mapLayout") || { left: { sm: 300, md: 500, lg: 600 }, right: { md: 658 }, bottom: { sm: 30 } }; + const mapLayout = getConfigProp("mapLayout") || { left: { sm: 300, md: 500, lg: 600 }, right: { md: 658 }, bottom: { sm: 30 } }; if (get(state, "mode") === 'embedded') { const height = { height: 'calc(100% - ' + mapLayout.bottom.sm + 'px)' }; @@ -202,7 +197,7 @@ const updateMapLayoutEpic = (action$, store) => boundingMapRect })); }); -module.exports = { +export default { mapSaveMapResourceEpic, _setFeatureEditPermission, _setThumbnail, diff --git a/geonode_mapstore_client/client/js/plugins.js b/geonode_mapstore_client/client/js/plugins.js index 95422adb6a..b592fb8ec1 100644 --- a/geonode_mapstore_client/client/js/plugins.js +++ b/geonode_mapstore_client/client/js/plugins.js @@ -6,64 +6,114 @@ * LICENSE file in the root directory of this source tree. */ // geonode specific epics -const epics = require("@js/epics"); -const { extendPluginsDefinition } = require("@extend/jsapi/plugins"); +import epics from "@js/epics"; +import { extendPluginsDefinition } from "@extend/jsapi/plugins"; + +import AddGroupPlugin from '@mapstore/framework/plugins/AddGroup'; +import IdentifyPlugin from '@mapstore/framework/plugins/Identify'; +import TOCPlugin from '@mapstore/framework/plugins/TOC'; +import MapPlugin from '@mapstore/framework/plugins/Map'; +import ToolbarPlugin from '@mapstore/framework/plugins/Toolbar'; +import DrawerMenuPlugin from '@mapstore/framework/plugins/DrawerMenu'; +import ZoomAllPlugin from '@mapstore/framework/plugins/ZoomAll'; +import MapLoadingPlugin from '@mapstore/framework/plugins/MapLoading'; +import OmniBarPlugin from '@mapstore/framework/plugins/OmniBar'; +import BackgroundSelectorPlugin from '@mapstore/framework/plugins/BackgroundSelector'; +import FullScreenPlugin from '@mapstore/framework/plugins/FullScreen'; +import ZoomInPlugin from '@mapstore/framework/plugins/ZoomIn'; +import ZoomOutPlugin from '@mapstore/framework/plugins/ZoomOut'; +import ExpanderPlugin from '@mapstore/framework/plugins/Expander'; +import BurgerMenuPlugin from '@mapstore/framework/plugins/BurgerMenu'; +import HistoryPlugin from '@mapstore/framework/plugins/History'; +import ScaleBoxPlugin from '@mapstore/framework/plugins/ScaleBox'; +import MapFooterPlugin from '@mapstore/framework/plugins/MapFooter'; +import PrintPlugin from '@mapstore/framework/plugins/Print'; +import MeasurePlugin from '@mapstore/framework/plugins/Measure'; +import FilterLayerPlugin from '@mapstore/framework/plugins/FilterLayer'; +import TOCItemsSettingsPlugin from '@mapstore/framework/plugins/TOCItemsSettings'; +import WidgetsPlugin from '@mapstore/framework/plugins/Widgets'; +import WidgetsBuilderPlugin from '@mapstore/framework/plugins/WidgetsBuilder'; +import WidgetsTrayPlugin from '@mapstore/framework/plugins/WidgetsTray'; +import NotificationsPlugin from '@mapstore/framework/plugins/Notifications'; +import FeatureEditorPlugin from '@mapstore/framework/plugins/FeatureEditor'; +import QueryPanelPlugin from '@mapstore/framework/plugins/QueryPanel'; +import MetadataExplorerPlugin from '@mapstore/framework/plugins/MetadataExplorer'; +import GridContainerPlugin from '@mapstore/framework/plugins/GridContainer'; +import StyleEditorPlugin from '@mapstore/framework/plugins/StyleEditor'; +import TimelinePlugin from '@mapstore/framework/plugins/Timeline'; +import PlaybackPlugin from '@mapstore/framework/plugins/Playback'; +import MousePositionPlugin from '@mapstore/framework/plugins/MousePosition'; +import SearchPlugin from '@mapstore/framework/plugins/Search'; +import SearchServicesConfigPlugin from '@mapstore/framework/plugins/SearchServicesConfig'; +import SwipePlugin from '@mapstore/framework/plugins/Swipe'; +import LocatePlugin from '@mapstore/framework/plugins/Locate'; + +import SavePlugin from '@js/plugins/Save'; +import SaveAsPlugin from '@js/plugins/SaveAs'; + + +import security from '@mapstore/framework/reducers/security'; +import maps from '@mapstore/framework/reducers/maps'; +import maplayout from '@mapstore/framework/reducers/maplayout'; + +import ReactSwipe from 'react-swipeable-views'; +import SwipeHeader from '@mapstore/framework/components/data/identify/SwipeHeader'; const pluginsDefinition = { plugins: { - AddGroupPlugin: require('@mapstore/framework/plugins/AddGroup').default, - IdentifyPlugin: require('@mapstore/framework/plugins/Identify'), - TOCPlugin: require('@mapstore/framework/plugins/TOC'), - MapPlugin: require('@mapstore/framework/plugins/Map').default, - ToolbarPlugin: require('@mapstore/framework/plugins/Toolbar'), - DrawerMenuPlugin: require('@mapstore/framework/plugins/DrawerMenu'), - ZoomAllPlugin: require('@mapstore/framework/plugins/ZoomAll'), - MapLoadingPlugin: require('@mapstore/framework/plugins/MapLoading'), - OmniBarPlugin: require('@mapstore/framework/plugins/OmniBar'), - BackgroundSelectorPlugin: require('@mapstore/framework/plugins/BackgroundSelector').default, - FullScreenPlugin: require('@mapstore/framework/plugins/FullScreen'), - ZoomInPlugin: require('@mapstore/framework/plugins/ZoomIn'), - ZoomOutPlugin: require('@mapstore/framework/plugins/ZoomOut'), - ExpanderPlugin: require('@mapstore/framework/plugins/Expander'), - BurgerMenuPlugin: require('@mapstore/framework/plugins/BurgerMenu'), - UndoPlugin: require('@mapstore/framework/plugins/History'), - RedoPlugin: require('@mapstore/framework/plugins/History'), - ScaleBoxPlugin: require('@mapstore/framework/plugins/ScaleBox'), - MapFooterPlugin: require('@mapstore/framework/plugins/MapFooter'), - PrintPlugin: require('@mapstore/framework/plugins/Print'), - MeasurePlugin: require('@mapstore/framework/plugins/Measure'), - FilterLayerPlugin: require('@mapstore/framework/plugins/FilterLayer').default, - TOCItemsSettingsPlugin: require('@mapstore/framework/plugins/TOCItemsSettings').default, - WidgetsPlugin: require('@mapstore/framework/plugins/Widgets').default, - WidgetsBuilderPlugin: require('@mapstore/framework/plugins/WidgetsBuilder').default, - WidgetsTrayPlugin: require('@mapstore/framework/plugins/WidgetsTray').default, - NotificationsPlugin: require('@mapstore/framework/plugins/Notifications'), - FeatureEditorPlugin: require('@mapstore/framework/plugins/FeatureEditor').default, - QueryPanelPlugin: require('@mapstore/framework/plugins/QueryPanel'), - SavePlugin: require('@js/plugins/Save').default, - SaveAsPlugin: require('@js/plugins/SaveAs').default, - MetadataExplorerPlugin: require('@mapstore/framework/plugins/MetadataExplorer'), - GridContainerPlugin: require('@mapstore/framework/plugins/GridContainer'), - StyleEditorPlugin: require('@mapstore/framework/plugins/StyleEditor'), - TimelinePlugin: require('@mapstore/framework/plugins/Timeline'), - PlaybackPlugin: require('@mapstore/framework/plugins/Playback'), - MousePositionPlugin: require('@mapstore/framework/plugins/MousePosition'), - SearchPlugin: require('@mapstore/framework/plugins/Search'), - SearchServicesConfigPlugin: require('@mapstore/framework/plugins/SearchServicesConfig'), - SwipePlugin: require('@mapstore/framework/plugins/Swipe').default, - LocatePlugin: require('@mapstore/framework/plugins/Locate').default, + AddGroupPlugin, + IdentifyPlugin, + TOCPlugin, + MapPlugin, + ToolbarPlugin, + DrawerMenuPlugin, + ZoomAllPlugin, + MapLoadingPlugin, + OmniBarPlugin, + BackgroundSelectorPlugin, + FullScreenPlugin, + ZoomInPlugin, + ZoomOutPlugin, + ExpanderPlugin, + BurgerMenuPlugin, + UndoPlugin: HistoryPlugin, + RedoPlugin: HistoryPlugin, + ScaleBoxPlugin, + MapFooterPlugin, + PrintPlugin, + MeasurePlugin, + FilterLayerPlugin, + TOCItemsSettingsPlugin, + WidgetsPlugin, + WidgetsBuilderPlugin, + WidgetsTrayPlugin, + NotificationsPlugin, + FeatureEditorPlugin, + QueryPanelPlugin, + SavePlugin, + SaveAsPlugin, + MetadataExplorerPlugin, + GridContainerPlugin, + StyleEditorPlugin, + TimelinePlugin, + PlaybackPlugin, + MousePositionPlugin, + SearchPlugin, + SearchServicesConfigPlugin, + SwipePlugin, + LocatePlugin, AddReducersAndEpics: { reducers: { - security: require('@mapstore/framework/reducers/security').default, - maps: require('@mapstore/framework/reducers/maps').default, - maplayout: require('@mapstore/framework/reducers/maplayout').default + security, + maps, + maplayout }, epics } }, requires: { - ReactSwipe: require('react-swipeable-views').default, - SwipeHeader: require('@mapstore/framework/components/data/identify/SwipeHeader') + ReactSwipe, + SwipeHeader } }; @@ -71,4 +121,4 @@ const extendedPluginsDefinition = extendPluginsDefinition ? extendPluginsDefinition(pluginsDefinition) : pluginsDefinition; -module.exports = extendedPluginsDefinition; +export default extendedPluginsDefinition; diff --git a/geonode_mapstore_client/client/js/previewPlugins.js b/geonode_mapstore_client/client/js/previewPlugins.js index 13e433880e..05f09679ce 100644 --- a/geonode_mapstore_client/client/js/previewPlugins.js +++ b/geonode_mapstore_client/client/js/previewPlugins.js @@ -5,35 +5,62 @@ * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. */ -const Rx = require("rxjs"); -const {_setThumbnail, updateMapLayoutEpic} = require("@js/epics"); +import Rx from "rxjs"; +import { _setThumbnail, updateMapLayoutEpic } from "@js/epics"; + +import { extendPluginsDefinition } from "@extend/jsapi/previewPlugins"; + +import MapPlugin from '@mapstore/framework/plugins/Map'; +import IdentifyPlugin from '@mapstore/framework/plugins/Identify'; +import ToolbarPlugin from '@mapstore/framework/plugins/Toolbar'; +import ZoomAllPlugin from '@mapstore/framework/plugins/ZoomAll'; +import MapLoadingPlugin from '@mapstore/framework/plugins/MapLoading'; +import OmniBarPlugin from '@mapstore/framework/plugins/OmniBar'; +import BackgroundSelectorPlugin from '@mapstore/framework/plugins/BackgroundSelector'; +import FullScreenPlugin from '@mapstore/framework/plugins/FullScreen'; +import ZoomInPlugin from '@mapstore/framework/plugins/ZoomIn'; +import ZoomOutPlugin from '@mapstore/framework/plugins/ZoomOut'; +import ExpanderPlugin from '@mapstore/framework/plugins/Expander'; +import BurgerMenuPlugin from '@mapstore/framework/plugins/BurgerMenu'; +import ScaleBoxPlugin from '@mapstore/framework/plugins/ScaleBox'; +import MapFooterPlugin from '@mapstore/framework/plugins/MapFooter'; +import PrintPlugin from '@mapstore/framework/plugins/Print'; +import TimelinePlugin from '@mapstore/framework/plugins/Timeline'; +import PlaybackPlugin from '@mapstore/framework/plugins/Playback'; + +import security from '@mapstore/framework/reducers/security'; +import maps from '@mapstore/framework/reducers/maps'; +import maplayout from '@mapstore/framework/reducers/maplayout'; + + +import ReactSwipe from 'react-swipeable-views'; +import SwipeHeader from '@mapstore/framework/components/data/identify/SwipeHeader'; -const { extendPluginsDefinition } = require("@extend/jsapi/previewPlugins"); const pluginsDefinition = { plugins: { - MapPlugin: require('@mapstore/framework/plugins/Map').default, - IdentifyPlugin: require('@mapstore/framework/plugins/Identify'), - ToolbarPlugin: require('@mapstore/framework/plugins/Toolbar'), - ZoomAllPlugin: require('@mapstore/framework/plugins/ZoomAll'), - MapLoadingPlugin: require('@mapstore/framework/plugins/MapLoading'), - OmniBarPlugin: require('@mapstore/framework/plugins/OmniBar'), - BackgroundSelectorPlugin: require('@mapstore/framework/plugins/BackgroundSelector').default, - FullScreenPlugin: require('@mapstore/framework/plugins/FullScreen'), - ZoomInPlugin: require('@mapstore/framework/plugins/ZoomIn'), - ZoomOutPlugin: require('@mapstore/framework/plugins/ZoomOut'), - ExpanderPlugin: require('@mapstore/framework/plugins/Expander'), - BurgerMenuPlugin: require('@mapstore/framework/plugins/BurgerMenu'), - ScaleBoxPlugin: require('@mapstore/framework/plugins/ScaleBox'), - MapFooterPlugin: require('@mapstore/framework/plugins/MapFooter'), - PrintPlugin: require('@mapstore/framework/plugins/Print'), - TimelinePlugin: require('@mapstore/framework/plugins/Timeline'), - PlaybackPlugin: require('@mapstore/framework/plugins/Playback'), + MapPlugin, + IdentifyPlugin, + ToolbarPlugin, + ZoomAllPlugin, + MapLoadingPlugin, + OmniBarPlugin, + BackgroundSelectorPlugin, + FullScreenPlugin, + ZoomInPlugin, + ZoomOutPlugin, + ExpanderPlugin, + BurgerMenuPlugin, + ScaleBoxPlugin, + MapFooterPlugin, + PrintPlugin, + TimelinePlugin, + PlaybackPlugin, AddReducersAndEpics: { reducers: { - security: require('@mapstore/framework/reducers/security').default, - maps: require('@mapstore/framework/reducers/maps').default, - maplayout: require('@mapstore/framework/reducers/maplayout').default + security, + maps, + maplayout }, epics: { _setThumbnail, @@ -43,8 +70,8 @@ const pluginsDefinition = { } }, requires: { - ReactSwipe: require('react-swipeable-views').default, - SwipeHeader: require('@mapstore/framework/components/data/identify/SwipeHeader') + ReactSwipe, + SwipeHeader } }; @@ -52,4 +79,4 @@ const extendedPluginsDefinition = extendPluginsDefinition ? extendPluginsDefinition(pluginsDefinition) : pluginsDefinition; -module.exports = extendedPluginsDefinition; +export default extendedPluginsDefinition; diff --git a/geonode_mapstore_client/client/package.json b/geonode_mapstore_client/client/package.json index f33f49cbff..e7405ac270 100644 --- a/geonode_mapstore_client/client/package.json +++ b/geonode_mapstore_client/client/package.json @@ -26,7 +26,7 @@ "author": "GeoSolutions", "license": "BSD-2-Clause", "devDependencies": { - "@mapstore/project": "git+https://github.com/geosolutions-it/mapstore-project.git#b752ff71f58f73addb164aeb472a9d353ca17c50" + "@mapstore/project": "git+https://github.com/geosolutions-it/mapstore-project.git#30ac4deb06bfd71d5078a3171463eaab3990bd91" }, "dependencies": { "mapstore": "file:MapStore2" diff --git a/geonode_mapstore_client/static/geonode/js/ms2/utils/ms2_base_plugins.js b/geonode_mapstore_client/static/geonode/js/ms2/utils/ms2_base_plugins.js index 74f1b350b2..891326afaa 100644 --- a/geonode_mapstore_client/static/geonode/js/ms2/utils/ms2_base_plugins.js +++ b/geonode_mapstore_client/static/geonode/js/ms2/utils/ms2_base_plugins.js @@ -3,7 +3,7 @@ var MS2_BASE_PLUGINS = { "desktop": [{ "name": "Map", "cfg": { - "tools": ["locate", "measurement", "draw"], + "tools": ["locate", "measurement", "draw", "box"], "mapOptions": { "openlayers": { "attribution": { diff --git a/geonode_mapstore_client/templates/geonode-mapstore-client/_config.html b/geonode_mapstore_client/templates/geonode-mapstore-client/_config.html index 2de8ce26cf..1664117768 100644 --- a/geonode_mapstore_client/templates/geonode-mapstore-client/_config.html +++ b/geonode_mapstore_client/templates/geonode-mapstore-client/_config.html @@ -9,7 +9,10 @@ }, printingEnabled: true, localConfig: { - mapLayout: {left: {sm: 300, md: 500, lg: 600}, right: {md: "41%"}, bottom: {sm: 0}}, + mapLayout: { + preview: {left: {sm: 300, md: 500, lg: 600}, right: {md: "41%"}, bottom: {sm: 0}}, + viewer: {left: {sm: 300, md: 500, lg: 600}, right: {md: 658}, bottom: {sm: 30}} + }, geonode_url: "{{ SITEURL }}", genode_rest_api: "{{ SITEURL }}mapstore/rest/", printUrl: "{{ GEOSERVER_PUBLIC_LOCATION }}pdf/info.json",