From e3e209ff656136e0c2cbd33f41a03867c380e96e Mon Sep 17 00:00:00 2001 From: muerwre Date: Wed, 29 Aug 2018 14:43:21 +0700 Subject: [PATCH] enabling / disabling editor from url --- src/containers/App.jsx | 41 ++++++++++++++++++++++++++++-------- src/modules/Editor.js | 8 +++++++ src/utils/api.js | 47 +++++++++++++++++------------------------- src/utils/history.js | 10 +++++++++ webpack.config.js | 2 +- 5 files changed, 70 insertions(+), 38 deletions(-) diff --git a/src/containers/App.jsx b/src/containers/App.jsx index a8d84ce..2a5ee04 100644 --- a/src/containers/App.jsx +++ b/src/containers/App.jsx @@ -9,7 +9,7 @@ import { DEFAULT_USER } from '$constants/auth'; import { getGuestToken, checkUserToken, getStoredMap } from '$utils/api'; import { storeData, getData } from '$utils/storage'; import { UserPanel } from '$components/panels/UserPanel'; -import { getPath } from '$utils/history'; +import { getUrlData, replacePath } from '$utils/history'; export class App extends React.Component { state = { @@ -26,12 +26,34 @@ export class App extends React.Component { componentDidMount() { this.authInit(); - this.mapInit(); } mapInit = () => { - const path = getPath(); - if (path) getStoredMap({ name: path, callback: this.setDataOnLoad }); + const { path, mode } = getUrlData(); + + if (path) { + getStoredMap({ name: path }) + .then(this.setDataOnLoad) + .then(() => { + if (mode && mode === 'edit') { + this.editor.startEditing(); + } else { + this.editor.stopEditing(); + } + }) + .catch(this.hideLoader); + } else { + // this.hideLoader(); + this.startEmptyEditor(); + } + }; + + startEmptyEditor = () => { + const { user } = this.state; + if (!user || !user.random_url) return; + + replacePath(`/${user.random_url}/edit`); + this.hideLoader(); }; setDataOnLoad = data => { @@ -80,17 +102,18 @@ export class App extends React.Component { const user = this.getUserData(); const { id, token } = (user || {}); - const fallback = () => getGuestToken({ callback: this.setUser }); if (id && token) { checkUserToken({ - callback: this.setUser, - fallback, id, token - }); + }) + .then(this.setUser) + .then(this.mapInit); } else { - getGuestToken({ callback: fallback }); + getGuestToken() + .then(this.setUser) + .then(this.mapInit); } }; diff --git a/src/modules/Editor.js b/src/modules/Editor.js index 8102341..bd5d49d 100644 --- a/src/modules/Editor.js +++ b/src/modules/Editor.js @@ -181,5 +181,13 @@ export class Editor { })); } this.map.map.fitBounds(this.poly.poly.getBounds()); + }; + + startEditing = () => { + this.poly.poly.enableEdit(); + }; + + stopEditing = () => { + this.poly.poly.disableEdit(); } } diff --git a/src/utils/api.js b/src/utils/api.js index f2349da..76d9786 100644 --- a/src/utils/api.js +++ b/src/utils/api.js @@ -4,25 +4,19 @@ import { API } from '$constants/api'; const report = console.warn; -export const checkUserToken = ({ - callback, fallback, id, token -}) => ( - axios.get(API.CHECK_TOKEN, { - params: { action: 'check_token', id, token } - }) - .then(result => (result && result.data)) - .then(data => ({ ...data, id, token })) - .then(callback) - .catch(fallback) -); -export const getGuestToken = ({ callback }) => ( - axios.get(API.GET_GUEST, { - params: { action: 'gen_guest_token' } - }) - .then(result => (result && result.data)) - .then(callback) - .catch(report) -); +export const checkUserToken = ({ id, token }) => axios.get(API.CHECK_TOKEN, { + params: { + id, + token, + action: 'check_token', + } +}).then(result => (result && result.data && { ...result.data, id, token })) + +export const getGuestToken = () => axios.get(API.GET_GUEST, { + params: { + action: 'gen_guest_token' + } +}).then(result => (result && result.data)); export const getMergedImage = ({ placement, callback }) => ( axios.get(API.COMPOSE, { @@ -32,12 +26,9 @@ export const getMergedImage = ({ placement, callback }) => ( .catch(report) ); -export const getStoredMap = ({ name, callback }) => ( - axios.get(API.GET_MAP, { - params: { name, action: 'load' } - }) - .then(result => (result && result.data &&result.data.data)) - .then(data => ({ ...data })) - .then(callback) - .catch(report) -) +export const getStoredMap = ({ name }) => axios.get(API.GET_MAP, { + params: { + name, + action: 'load' + } +}).then(result => (result && result.data && result.data.data)); diff --git a/src/utils/history.js b/src/utils/history.js index 161d2a2..b18d42b 100644 --- a/src/utils/history.js +++ b/src/utils/history.js @@ -1,2 +1,12 @@ export const getPath = () => (window.location && window.location.pathname && window.location.pathname.replace(/^\//, '')); + +export const replacePath = url => window.history.replaceState(url, 'Редактирование маршрута', url); + +export const getUrlData = () => { + const url = getPath(); + + const [path, mode] = url.split('/'); + + return { path, mode }; +}; diff --git a/webpack.config.js b/webpack.config.js index 1f0a38f..d236671 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -105,10 +105,10 @@ module.exports = () => { resolve, plugins, entry: { - // loader: './src/loader.js', app: './src/index.js', }, output: { + publicPath: '/', filename: '[name].bundle.[githash].js', }, optimization: {