From 5c7b0e13923c33e8ce2f4dab5ae57f68dbd3d7f7 Mon Sep 17 00:00:00 2001 From: stefano bovio Date: Fri, 19 Jan 2018 16:10:03 +0100 Subject: [PATCH] Fixes #2522 Embed doesn't work anymore (#2538) --- buildConfig.js | 12 ++++++ examples.js | 6 +-- web/client/apiTemplate.html | 40 +++++++++++++++++++ web/client/components/share/ShareApi.jsx | 9 +++-- web/client/components/share/SharePanel.jsx | 5 ++- .../share/__tests__/ShareApi-test.jsx | 36 +++++++++++++++++ web/client/components/share/api-template.raw | 2 +- web/client/components/theme/Theme.jsx | 4 +- web/client/embeddedTemplate.html | 20 ++++++++++ web/client/examples/layertree/index.html | 2 +- web/client/examples/plugins/index.html | 3 +- web/client/jsapi/MapStore2.js | 14 +++++-- web/client/plugins/Share.jsx | 4 +- .../product/components/home/Examples.jsx | 8 ++-- web/client/product/embedded.jsx | 13 ++++-- web/client/reducers/__tests__/version-test.js | 5 +++ web/client/reducers/version.js | 11 ++++- .../selectors/__tests__/version-test.js | 7 +++- web/client/selectors/version.js | 5 ++- web/pom.xml | 38 ++++++++++++++++++ 20 files changed, 215 insertions(+), 29 deletions(-) create mode 100644 web/client/apiTemplate.html create mode 100644 web/client/embeddedTemplate.html diff --git a/buildConfig.js b/buildConfig.js index fc1cedaa9c..9c5be612f0 100644 --- a/buildConfig.js +++ b/buildConfig.js @@ -51,6 +51,18 @@ module.exports = (bundles, themeEntries, paths, extractThemesPlugin, prod, publi chunks: ['mapstore2'], inject: true, hash: true + }), new HtmlWebpackPlugin({ + template: path.join(paths.framework, 'embeddedTemplate.html'), + chunks: ['embedded'], + inject: true, + hash: true, + filename: 'embedded.html' + }), new HtmlWebpackPlugin({ + template: path.join(paths.framework, 'apiTemplate.html'), + chunks: ['ms2-api'], + inject: 'head', + hash: true, + filename: 'api.html' })] : []).concat(prod ? [new ParallelUglifyPlugin({ uglifyJS: { sourceMap: false, diff --git a/examples.js b/examples.js index f5ddce970e..be959b4425 100644 --- a/examples.js +++ b/examples.js @@ -3,14 +3,14 @@ var path = require("path"); module.exports = { mouseposition: path.join(__dirname, "web", "client", "examples", "mouseposition", "app"), scalebar: path.join(__dirname, "web", "client", "examples", "scalebar", "app"), - layertree: path.join(__dirname, "web", "client", "examples", "layertree", "app"), + // layertree: path.join(__dirname, "web", "client", "examples", "layertree", "app"), "3dviewer": path.join(__dirname, "web", "client", "examples", "3dviewer", "app"), - queryform: path.join(__dirname, "web", "client", "examples", "queryform", "app"), + // queryform: path.join(__dirname, "web", "client", "examples", "queryform", "app"), featuregrid: path.join(__dirname, "web", "client", "examples", "featuregrid", "app"), print: path.join(__dirname, "web", "client", "examples", "print", "app"), login: path.join(__dirname, "web", "client", "examples", "login", "app"), plugins: path.join(__dirname, "web", "client", "examples", "plugins", "app"), - rasterstyler: path.join(__dirname, "web", "client", "examples", "rasterstyler", "app"), + // rasterstyler: path.join(__dirname, "web", "client", "examples", "rasterstyler", "app"), api: path.join(__dirname, "web", "client", "examples", "api", "app") // this example is not linked and seems to cause a big slow down with uglyfyplugin. disabled temporary // styler: path.join(__dirname, "web", "client", "examples", "styler", "app") diff --git a/web/client/apiTemplate.html b/web/client/apiTemplate.html new file mode 100644 index 0000000000..1f2a60ec18 --- /dev/null +++ b/web/client/apiTemplate.html @@ -0,0 +1,40 @@ + + + + + + + Page with MapStore 2 API + + + + + + + + + + + +
+ + + diff --git a/web/client/components/share/ShareApi.jsx b/web/client/components/share/ShareApi.jsx index d8f40c37f0..c69d2848c4 100644 --- a/web/client/components/share/ShareApi.jsx +++ b/web/client/components/share/ShareApi.jsx @@ -17,7 +17,8 @@ const CopyToClipboard = require('react-copy-to-clipboard'); const Message = require('../../components/I18N/Message'); const {Glyphicon, Col, Grid, Row, Tooltip, Button} = require('react-bootstrap'); const OverlayTrigger = require('../misc/OverlayTrigger'); - +const {validateVersion} = require('../../selectors/version'); +const {trim} = require('lodash'); // css required require('./share.css'); @@ -29,7 +30,8 @@ const codeApi = require('raw-loader!./api-template.raw'); class ShareApi extends React.Component { static propTypes = { shareUrl: PropTypes.string, - shareConfigUrl: PropTypes.string + shareConfigUrl: PropTypes.string, + version: PropTypes.string }; state = {copied: false}; @@ -38,7 +40,8 @@ class ShareApi extends React.Component { const parsedCode = codeApi .replace('__BASE__URL__', this.props.shareUrl) .replace('__CONFIG__URL__', this.props.shareConfigUrl) - .replace('__ORIGINAL_URL__', location.href); + .replace('__ORIGINAL_URL__', location.href) + .replace('__VERSION__', validateVersion(this.props.version) ? '?' + trim(this.props.version) : ''); const tooltip = ( {this.state.copied ? : } ); diff --git a/web/client/components/share/SharePanel.jsx b/web/client/components/share/SharePanel.jsx index 39131062c7..fffc4d9454 100644 --- a/web/client/components/share/SharePanel.jsx +++ b/web/client/components/share/SharePanel.jsx @@ -50,7 +50,8 @@ class SharePanel extends React.Component { showAPI: PropTypes.bool, onClose: PropTypes.func, getCount: PropTypes.func, - closeGlyph: PropTypes.string + closeGlyph: PropTypes.string, + version: PropTypes.string }; static defaultProps = { @@ -83,7 +84,7 @@ class SharePanel extends React.Component { const social = ; const direct =
; const code = (
- {this.props.showAPI ? : null}
); + {this.props.showAPI ? : null}); const tabs = ( }>{direct} diff --git a/web/client/components/share/__tests__/ShareApi-test.jsx b/web/client/components/share/__tests__/ShareApi-test.jsx index a88cac92f3..e7187fe8f5 100644 --- a/web/client/components/share/__tests__/ShareApi-test.jsx +++ b/web/client/components/share/__tests__/ShareApi-test.jsx @@ -43,4 +43,40 @@ describe("The ShareEmbed component", () => { expect(textareaEmbed.value.indexOf(shareConfigUrl) !== -1).toBe(true); }); + it('add version to API template', () => { + const url = location.href; + const shareConfigUrl = 'configurl'; + const version = '18e36c9e2ce1cbf57648907ec177e02f0118764d'; + const cmpSharePanel = ReactDOM.render(, document.getElementById("container")); + expect(cmpSharePanel).toExist(); + + const textareaEmbed = ReactDOM.findDOMNode(ReactTestUtils.scryRenderedDOMComponentsWithTag(cmpSharePanel, "textarea")[0]); + expect(textareaEmbed).toExist(); + expect(textareaEmbed.value.indexOf('?' + version) !== -1).toBe(true); + }); + + it('add version ${mapstore2.version} to API template', () => { + const url = location.href; + const shareConfigUrl = 'configurl'; + const version = '${mapstore2.version}'; + const cmpSharePanel = ReactDOM.render(, document.getElementById("container")); + expect(cmpSharePanel).toExist(); + + const textareaEmbed = ReactDOM.findDOMNode(ReactTestUtils.scryRenderedDOMComponentsWithTag(cmpSharePanel, "textarea")[0]); + expect(textareaEmbed).toExist(); + expect(textareaEmbed.value.indexOf('?' + version) !== -1).toBe(false); + }); + + it('add no-version to API template', () => { + const url = location.href; + const shareConfigUrl = 'configurl'; + const version = 'no-version'; + const cmpSharePanel = ReactDOM.render(, document.getElementById("container")); + expect(cmpSharePanel).toExist(); + + const textareaEmbed = ReactDOM.findDOMNode(ReactTestUtils.scryRenderedDOMComponentsWithTag(cmpSharePanel, "textarea")[0]); + expect(textareaEmbed).toExist(); + expect(textareaEmbed.value.indexOf('?' + version) !== -1).toBe(false); + }); + }); diff --git a/web/client/components/share/api-template.raw b/web/client/components/share/api-template.raw index 397de9b15b..356d336d0c 100644 --- a/web/client/components/share/api-template.raw +++ b/web/client/components/share/api-template.raw @@ -29,7 +29,7 @@
- + + + + + + +
+ + diff --git a/web/client/examples/layertree/index.html b/web/client/examples/layertree/index.html index c33c23c352..f4afb4c862 100644 --- a/web/client/examples/layertree/index.html +++ b/web/client/examples/layertree/index.html @@ -11,7 +11,7 @@ - + + - +
diff --git a/web/client/jsapi/MapStore2.js b/web/client/jsapi/MapStore2.js index 21c3ef860b..7f24330a94 100644 --- a/web/client/jsapi/MapStore2.js +++ b/web/client/jsapi/MapStore2.js @@ -162,6 +162,10 @@ const MapStore2 = { const options = merge({}, this.defaultOptions || {}, opts); const {initialState, storeOpts} = options; + const {loadVersion} = require('../actions/version'); + const {versionSelector} = require('../selectors/version'); + const {loadAfterThemeSelector} = require('../selectors/config'); + const pages = [{ name: "embedded", path: "/", @@ -173,14 +177,18 @@ const MapStore2 = { const StandardRouter = connect((state) => ({ locale: state.locale || {}, - pages + pages, + version: versionSelector(state), + loadAfterTheme: loadAfterThemeSelector(state) }))(require('../components/app/StandardRouter')); const actionTrigger = generateActionTrigger(options.startAction || "CHANGE_MAP_VIEW"); triggerAction = actionTrigger.trigger; - const appStore = require('../stores/StandardStore').bind(null, initialState || {}, {}, { + const appStore = require('../stores/StandardStore').bind(null, initialState || {}, { + version: require('../reducers/version') + }, { jsAPIEpic: actionTrigger.epic }); - const initialActions = getInitialActions(options); + const initialActions = [...getInitialActions(options), loadVersion]; const appConfig = { storeOpts: assign({}, storeOpts, {notify: true}), appStore, diff --git a/web/client/plugins/Share.jsx b/web/client/plugins/Share.jsx index f5bc1d8e9e..0ab5e20be5 100644 --- a/web/client/plugins/Share.jsx +++ b/web/client/plugins/Share.jsx @@ -16,6 +16,7 @@ const Message = require('../components/I18N/Message'); const {toggleControl} = require('../actions/controls'); const ConfigUtils = require('../utils/ConfigUtils'); const ShareUtils = require('../utils/ShareUtils'); +const {versionSelector} = require('../selectors/version'); /** * Share Plugin allows to share the current URL (location.href) in some different ways. @@ -38,7 +39,8 @@ const Share = connect((state) => ({ isVisible: state.controls && state.controls.share && state.controls.share.enabled, shareUrl: location.href, shareApiUrl: ShareUtils.getApiUrl(location.href), - shareConfigUrl: ShareUtils.getConfigUrl(location.href, ConfigUtils.getConfigProp('geoStoreUrl')) + shareConfigUrl: ShareUtils.getConfigUrl(location.href, ConfigUtils.getConfigProp('geoStoreUrl')), + version: versionSelector(state) }), { onClose: toggleControl.bind(null, 'share', null) })(require('../components/share/SharePanel')); diff --git a/web/client/product/components/home/Examples.jsx b/web/client/product/components/home/Examples.jsx index 10f65b8371..397ea0a223 100644 --- a/web/client/product/components/home/Examples.jsx +++ b/web/client/product/components/home/Examples.jsx @@ -57,7 +57,7 @@ class Examples extends React.Component { - + {/* 900x500
@@ -70,7 +70,7 @@ class Examples extends React.Component {
- + */} 900x500
@@ -99,13 +99,13 @@ class Examples extends React.Component {
- + {/* 900x500
- + */} ); } diff --git a/web/client/product/embedded.jsx b/web/client/product/embedded.jsx index ad9c46595b..99b4df226b 100644 --- a/web/client/product/embedded.jsx +++ b/web/client/product/embedded.jsx @@ -12,23 +12,28 @@ const LocaleUtils = require('../utils/LocaleUtils'); const startApp = () => { const StandardApp = require('../components/app/StandardApp'); - + const {loadVersion} = require('../actions/version'); + const {versionSelector} = require('../selectors/version'); + const {loadAfterThemeSelector} = require('../selectors/config'); const {pages, pluginsDef, initialState, storeOpts} = require('./appConfigEmbedded'); const StandardRouter = connect((state) => ({ locale: state.locale || {}, - pages + pages, + version: versionSelector(state), + loadAfterTheme: loadAfterThemeSelector(state) }))(require('../components/app/StandardRouter')); const appStore = require('../stores/StandardStore').bind(null, initialState, { - mode: (state = 'embedded') => state + mode: (state = 'embedded') => state, + version: require('../reducers/version') }, {}); const appConfig = { storeOpts, appStore, pluginsDef, - initialActions: [], + initialActions: [loadVersion], appComponent: StandardRouter, printingEnabled: true }; diff --git a/web/client/reducers/__tests__/version-test.js b/web/client/reducers/__tests__/version-test.js index a41ed1a1e6..4c5048efda 100644 --- a/web/client/reducers/__tests__/version-test.js +++ b/web/client/reducers/__tests__/version-test.js @@ -15,4 +15,9 @@ describe('Test the version reducer', () => { var state = version({}, {type: 'CHANGE_VERSION', version: 'myVersion'}); expect(state.current).toBe('myVersion'); }); + + it('test error version load', () => { + var state = version({}, {type: 'LOAD_VERSION_ERROR', error: 'error'}); + expect(state.current).toBe('no-version'); + }); }); diff --git a/web/client/reducers/version.js b/web/client/reducers/version.js index 82fec758a0..19fcedc249 100644 --- a/web/client/reducers/version.js +++ b/web/client/reducers/version.js @@ -6,7 +6,7 @@ * LICENSE file in the root directory of this source tree. */ -const { CHANGE_VERSION } = require('../actions/version'); +const { CHANGE_VERSION, LOAD_VERSION_ERROR } = require('../actions/version'); const assign = require('object-assign'); /** @@ -26,7 +26,14 @@ function version(state = null, action) { { current: action.version } - ); + ); + } + case LOAD_VERSION_ERROR: { + return assign({}, state, + { + current: 'no-version' + } + ); } default: return state; diff --git a/web/client/selectors/__tests__/version-test.js b/web/client/selectors/__tests__/version-test.js index 09997de0ff..b18bd49baa 100644 --- a/web/client/selectors/__tests__/version-test.js +++ b/web/client/selectors/__tests__/version-test.js @@ -7,7 +7,7 @@ */ const expect = require('expect'); -const {versionSelector} = require('../version'); +const {versionSelector, validateVersion} = require('../version'); describe('Test version selector', () => { it('test versionSelector default', () => { @@ -20,4 +20,9 @@ describe('Test version selector', () => { expect(version).toExist(); expect(version).toBe(current); }); + it('test validateVersion', () => { + expect(validateVersion('18e36c9e2ce1cbf57648907ec177e02f0118764d')).toBe(true); + expect(validateVersion('${mapstore2.version}')).toBe(false); + expect(validateVersion('no-version')).toBe(false); + }); }); diff --git a/web/client/selectors/version.js b/web/client/selectors/version.js index 8f005cb6ef..9c0c5371f7 100644 --- a/web/client/selectors/version.js +++ b/web/client/selectors/version.js @@ -7,8 +7,9 @@ */ const versionSelector = (state) => state.version && state.version.current || ''; - +const validateVersion = version => version && version.indexOf('${mapstore2.version}') === -1 && version.indexOf('no-version') === -1 ? true : false; module.exports = { - versionSelector + versionSelector, + validateVersion }; diff --git a/web/pom.xml b/web/pom.xml index 171e2c2aa0..fc5c138721 100644 --- a/web/pom.xml +++ b/web/pom.xml @@ -99,6 +99,44 @@ + + only embedded.html + process-classes + + copy-resources + + + ${basedir}/target/mapstore + UTF-8 + + + ${basedir}/client/dist + + embedded.html + + + + + + + only api.html + process-classes + + copy-resources + + + ${basedir}/target/mapstore + UTF-8 + + + ${basedir}/client/dist + + api.html + + + + + html, configuration files and images process-classes