first import attempts

src/constants/api.js

@@ -2,4 +2,6 @@ export const SERVER = 'http://alpha-map.vault48.org';
 export const API = {
   COMPOSE: `${SERVER}/engine/composerOrchid.php`,
   GET_GUEST: `${SERVER}/engine/auth.php`,
+  CHECK_TOKEN: `${SERVER}/engine/auth.php`,
+  GET_MAP: `${SERVER}/engine/auth.php`,
 };

src/containers/App.jsx

@@ -6,9 +6,10 @@ import { Fills } from '$components/Fills';
 import { DEFAULT_LOGO } from '$constants/logos';
 import { UserLocation } from '$components/UserLocation';
 import { DEFAULT_USER } from '$constants/auth';
-import { getGuestToken, checkUserToken } from '$utils/api';
+import { getGuestToken, checkUserToken, getStoredMap } from '$utils/api';
 import { storeData, getData } from '$utils/storage';
 import { UserPanel } from '$components/panels/UserPanel';
+import { getPath } from '$utils/history';
 
 export class App extends React.Component {
   state = {
@@ -25,8 +26,14 @@ export class App extends React.Component {
 
   componentDidMount() {
     this.authInit();
+    this.mapInit();
   }
 
+  mapInit = () => {
+    const path = getPath();
+    if (path) getStoredMap({ name: path, callback: this.editor.setData });
+  };
+
   setMode = mode => {
     this.setState({ mode });
   };

src/modules/Editor.js

@@ -6,6 +6,8 @@ import { Router } from '$modules/Router';
 import { Shotter } from '$modules/Shotter';
 import { DEFAULT_LOGO } from '$constants/logos';
 
+import { parseStickerAngle, parseStickerStyle } from '$utils/import';
+
 export class Editor {
   constructor({
     container,
@@ -165,4 +167,19 @@ export class Editor {
     this.setLogo(logo);
     this.changeMode(MODES.NONE);
   }
+
+  setData = ({ route, stickers, format = 'old' }) => {
+    if (route) {
+      this.poly.setPoints(route);
+    }
+
+    if (stickers) {
+      stickers.map(({ latlng, ang: angle, style }) => this.stickers.createSticker({
+        latlng,
+        angle: parseStickerAngle({ angle, format }),
+        sticker: parseStickerStyle({ style, format }),
+      }));
+    }
+    this.map.map.fitBounds(this.poly.poly.getBounds());
+  }
 }

src/modules/Poly.js

@@ -124,6 +124,11 @@ export class Poly {
     this.lockMapClicks(true);
   };
 
+  setPoints = latlngs => {
+    if (!latlngs || latlngs.length <= 1) return;
+    this.poly.setLatLngs(latlngs);
+  };
+
   pushPoints = latlngs => {
     const { map } = this;
     const simplified = simplify({ map, latlngs });

src/modules/Sticker.js

@@ -7,9 +7,9 @@ import stickers from '$sprites/stickers.svg';
 
 export class Sticker {
   constructor({
-    latlng, deleteSticker, map, lockMapClicks, sticker
+    latlng, deleteSticker, map, lockMapClicks, sticker, angle = 2.2
   }) {
-    this.angle = 2.2;
+    this.angle = angle;
     this.isDragging = false;
     this.map = map;
 
@@ -39,7 +39,7 @@ export class Sticker {
 
     this.sticker = marker(latlng, { icon: mark });
 
-    this.setAngle(this.angle);
+    this.setAngle(angle);
 
     this.stickerImage.addEventListener('mousedown', this.onDragStart);
     this.stickerImage.addEventListener('mouseup', this.onDragStop);

src/modules/Stickers.js

@@ -19,9 +19,10 @@ export class Stickers {
   //   this.createSticker({ latlng });
   // };
 
-  createSticker = ({ latlng, sticker }) => {
+  createSticker = ({ latlng, sticker, angle = 2.2 }) => {
     const marker = new Sticker({
       latlng,
+      angle,
       deleteSticker: this.deleteStickerByReference,
       map: this.map,
       lockMapClicks: this.lockMapClicks,

src/utils/api.js

@@ -7,7 +7,7 @@ const report = console.warn;
 export const checkUserToken = ({
   callback, fallback, id, token
 }) => (
-  axios.get(API.GET_GUEST, {
+  axios.get(API.CHECK_TOKEN, {
     params: { action: 'check_token', id, token }
   })
     .then(result => (result && result.data))
@@ -31,3 +31,13 @@ export const getMergedImage = ({ placement, callback }) => (
     .then(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)
+)

src/utils/history.js

@@ -0,0 +1,2 @@
+export const getPath = () => (window.location && window.location.pathname &&
+  window.location.pathname.replace(/^\//, ''));

src/utils/import.js

@@ -0,0 +1,7 @@
+/*
+  functions to parse old maps data
+ */
+
+export const parseStickerAngle = ({ angle, format }) => parseFloat((format === 'old' ? angle - 3.14 : angle));
+
+export const parseStickerStyle = ({ style, format }) => (format === 'old' ? 'green' : style);