geosolutions-it · mbarto · Apr 3, 2017 · Apr 3, 2017
diff --git a/web/client/components/share/SharePanel.jsx b/web/client/components/share/SharePanel.jsx
@@ -22,14 +22,14 @@ const ShareEmbed = require('./ShareEmbed');
 const ShareQRCode = require('./ShareQRCode');
 const {Glyphicon} = require('react-bootstrap');
 const Message = require('../../components/I18N/Message');
-const Url = require('url');
 
 let SharePanel = React.createClass({
 
     propTypes: {
         isVisible: React.PropTypes.bool,
         title: React.PropTypes.node,
         shareUrl: React.PropTypes.string,
+        shareEmbeddedUrl: React.PropTypes.string,
         onClose: React.PropTypes.func,
         getCount: React.PropTypes.func,
         closeGlyph: React.PropTypes.string
@@ -44,19 +44,9 @@ let SharePanel = React.createClass({
     render() {
         // ************************ CHANGE URL PARAMATER FOR EMBED CODE ****************************
         /* if the property shareUrl is not defined it takes the url from location.href */
-        let shareUrl = this.props.shareUrl || location.href;
-        /* the sharing url is parsed in order to check the query parameters from the complete url */
-        let urlParsedObj = Url.parse(shareUrl, true);
-        /* if not null, the search attribute will prevale over the query attribute hiding the query
-           one, so is necessary to nullify it */
-        urlParsedObj.search = null;
-        if (urlParsedObj && urlParsedObj.query) {
-            urlParsedObj.query.mode = "embedded";
-        }
-        /* in order to obtain the complete url is necessary to format the obj into a string */
-        let urlformatted = Url.format(urlParsedObj);
-        /* shareEmbeddedUrl is the url used for embedded part */
-        let shareEmbeddedUrl = urlformatted;
+        const shareUrl = this.props.shareUrl || location.href;
+        const shareEmbeddedUrl = this.props.shareEmbeddedUrl || this.props.shareUrl || location.href;
+
         let sharePanel = (
             <Dialog id="share-panel-dialog" className="modal-dialog modal-content share-win">
                 <span role="header">

diff --git a/web/client/containers/MapViewer.jsx b/web/client/containers/MapViewer.jsx
@@ -17,7 +17,7 @@ const PluginsUtils = require('../utils/PluginsUtils');
 
 const PluginsContainer = connect((state) => ({
     pluginsConfig: state.plugins || ConfigUtils.getConfigProp('plugins') || null,
-    mode: (urlQuery.mode || (state.browser && state.browser.mobile ? 'mobile' : 'desktop')),
+    mode: (urlQuery.mode || state.mode || (state.browser && state.browser.mobile ? 'mobile' : 'desktop')),
     pluginsState: state && state.controls || {},
     monitoredState: PluginsUtils.filterState(state, ConfigUtils.getConfigProp('monitorState') || [])
 }))(require('../components/plugins/PluginsContainer'));

diff --git a/web/client/embedded.html b/web/client/embedded.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <title>MapStore 2 HomePage</title>
+        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway" type='text/css'>
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css" />
+        <link rel="stylesheet" href="https://cdn.jslibs.mapstore2.geo-solutions.it/leaflet/0.2.4/leaflet.draw.css" />
+        <link rel="stylesheet" href="dist/themes/default.css" id="theme_stylesheet">
+        <link rel="shortcut icon" type="image/png" href="https://cdn.jslibs.mapstore2.geo-solutions.it/leaflet/favicon.ico" />
+        <script src="https://maps.google.com/maps/api/js?v=3"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.10/proj4.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"></script>
+        <script src="https://cdn.jslibs.mapstore2.geo-solutions.it/leaflet/0.2.4/leaflet.draw.js"></script>
+    </head>
+    <body>
+        <div id="container"></div>
+        <script src="dist/embedded.js"></script>
+    </body>
+</html>
diff --git a/web/client/localConfig.json b/web/client/localConfig.json
@@ -193,9 +193,8 @@
                 "cfg": {
                     "tools": ["locate"]
                 }
-            }, "Help", "DrawerMenu", {
+            }, "DrawerMenu", {
                 "name": "Identify",
-                "showIn": ["Settings"],
                 "cfg": {
                     "style": {
                         "position": "absolute",
@@ -214,6 +213,13 @@
                     },
                     "bodyClass": "mobile-feature-info"
                 }
+            }, {
+                "name": "ZoomAll",
+                "override": {
+                    "Toolbar": {
+                        "alwaysVisible": true
+                    }
+                }
             }, {
                 "name": "Locate",
                 "override": {
@@ -226,11 +232,6 @@
                 "cfg": {
                     "wrap": true
                 }
-            }, "About", {
-                "name": "MousePosition",
-                "cfg": {
-                    "id": "mapstore-mouseposition-mobile"
-                }
             }, {
                 "name": "Search",
                 "cfg": {
@@ -242,14 +243,6 @@
                 "cfg": {
                     "id": "navigationBar"
                 }
-            }, {
-                "name": "Toolbar",
-                "id": "IdentifyBar",
-                "stateSelector": "identify",
-                "cfg": {
-                    "id": "identifyBar"
-                },
-                "isDefault": false
             }, {
                 "name": "MapLoading",
                 "override": {
@@ -258,7 +251,7 @@
                     }
                 }
             },
-            "OmniBar", "BurgerMenu"
+            "OmniBar"
         ],
         "common": [{
             "name": "OmniBar",

diff --git a/web/client/plugins/Share.jsx b/web/client/plugins/Share.jsx
@@ -21,10 +21,20 @@ const assign = require('object-assign');
 const {Glyphicon} = require('react-bootstrap');
 const Message = require('../components/I18N/Message');
 const {toggleControl} = require('../actions/controls');
+const Url = require('url');
+
+
+const getEmbeddedUrl = (url) => {
+    let urlParsedObj = Url.parse(url, true);
+
+    return urlParsedObj.protocol + '//' + urlParsedObj.host + urlParsedObj.path + "embedded.html#/" +
+        urlParsedObj.hash.substring(urlParsedObj.hash.lastIndexOf('/') + 1, urlParsedObj.hash.lastIndexOf('?'));
+};
 
 const Share = connect((state) => ({
     isVisible: state.controls && state.controls.share && state.controls.share.enabled,
-    shareUrl: location.href
+    shareUrl: location.href,
+    shareEmbeddedUrl: getEmbeddedUrl(location.href)
 }), {
     onClose: toggleControl.bind(null, 'share', null)
 })(require('../components/share/SharePanel'));

diff --git a/web/client/product/appConfigEmbedded.js b/web/client/product/appConfigEmbedded.js
@@ -0,0 +1,46 @@
+/**
+ * Copyright 2016, 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.
+ */
+
+module.exports = {
+    pages: [{
+        name: "mapviewer",
+        path: "/:mapId",
+        component: require('./pages/MapViewer')
+    }],
+    pluginsDef: require('./pluginsEmbedded.js'),
+    initialState: {
+        defaultState: {
+            mode: "embedded",
+            mousePosition: {enabled: false},
+            controls: {
+                help: {
+                    enabled: false
+                },
+                print: {
+                    enabled: false
+                },
+                toolbar: {
+                    active: null,
+                    expanded: false
+                },
+                drawer: {
+                    enabled: false,
+                    menu: "1"
+                }
+            },
+            mapInfo: {enabled: true, infoFormat: 'text/html' }
+        },
+        mobile: {
+        }
+    },
+    storeOpts: {
+        persist: {
+            whitelist: ['security']
+        }
+    }
+};
diff --git a/web/client/product/embedded.jsx b/web/client/product/embedded.jsx
@@ -0,0 +1,47 @@
+/**
+ * Copyright 2017, 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.
+ */
+const React = require('react');
+const ReactDOM = require('react-dom');
+const {connect} = require('react-redux');
+const LocaleUtils = require('../utils/LocaleUtils');
+
+const startApp = () => {
+    const StandardApp = require('../components/app/StandardApp');
+
+    const {pages, pluginsDef, initialState, storeOpts} = require('./appConfigEmbedded');
+
+    const StandardRouter = connect((state) => ({
+        locale: state.locale || {},
+        pages
+    }))(require('../components/app/StandardRouter'));
+
+    const appStore = require('../stores/StandardStore').bind(null, initialState, {
+        mode: (state = 'embedded') => state
+    }, {});
+
+    const appConfig = {
+        storeOpts,
+        appStore,
+        pluginsDef,
+        initialActions: [],
+        appComponent: StandardRouter,
+        printingEnabled: true
+    };
+
+    ReactDOM.render(
+        <StandardApp {...appConfig} mode="embedded"/>,
+        document.getElementById('container')
+    );
+};
+
+if (!global.Intl ) {
+    // Ensure Intl is loaded, then call the given callback
+    LocaleUtils.ensureIntl(startApp);
+}else {
+    startApp();
+}
diff --git a/web/client/product/pages/MapViewer.jsx b/web/client/product/pages/MapViewer.jsx
@@ -37,7 +37,7 @@ const MapViewerPage = React.createClass({
         };
     },
     componentWillMount() {
-        if (this.props.params.mapType && this.props.params.mapId && oldLocation !== this.props.location) {
+        if (this.props.params.mapId && oldLocation !== this.props.location) {
             oldLocation = this.props.location;
             if (!ConfigUtils.getDefaults().ignoreMobileCss) {
                 if (this.props.mode === 'mobile') {

diff --git a/web/client/product/pluginsEmbedded.js b/web/client/product/pluginsEmbedded.js
@@ -0,0 +1,27 @@
+/**
+ * Copyright 2016, 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.
+ */
+
+module.exports = {
+    plugins: {
+        IdentifyPlugin: require('../plugins/Identify'),
+        TOCPlugin: require('../plugins/TOC'),
+        BackgroundSwitcherPlugin: require('../plugins/BackgroundSwitcher'),
+        MapPlugin: require('../plugins/Map'),
+        ToolbarPlugin: require('../plugins/Toolbar'),
+        DrawerMenuPlugin: require('../plugins/DrawerMenu'),
+        SearchPlugin: require('../plugins/Search'),
+        LocatePlugin: require('../plugins/Locate'),
+        ZoomAllPlugin: require('../plugins/ZoomAll'),
+        MapLoadingPlugin: require('../plugins/MapLoading'),
+        OmniBarPlugin: require('../plugins/OmniBar')
+    },
+    requires: {
+        ReactSwipe: require('react-swipeable-views').default,
+        SwipeHeader: require('../components/data/identify/SwipeHeader')
+    }
+};
diff --git a/webpack.config.js b/webpack.config.js
@@ -12,7 +12,8 @@ module.exports = {
     entry: assign({
         'webpack-dev-server': 'webpack-dev-server/client?http://0.0.0.0:8081', // WebpackDevServer host and port
         'webpack': 'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors
-        "mapstore2": path.join(__dirname, "web", "client", "product", "app")
+        "mapstore2": path.join(__dirname, "web", "client", "product", "app"),
+        "embedded": path.join(__dirname, "web", "client", "product", "embedded")
     }, themeEntries),
     output: {
       path: path.join(__dirname, "web", "client", "dist"),