(bugfixes)

backend/routes/auth/social/vk.js

@@ -19,9 +19,7 @@ const fetchUserData = async (req, res) => {
         redirect_uri: `${proto}://${host}/auth/social/vk`,
       }
     }
-  ).catch(err => {
+  ).catch(() => {
-    console.log('[SOCIAL] error:', err);
-
     return res.render('social/vk_error', {
       title: STRINGS.OAUTH.ERROR_TITLE,
       heading: STRINGS.OAUTH.ERROR_HEADING,
@@ -40,9 +38,7 @@ const fetchUserData = async (req, res) => {
         access_token,
       }
     }
-  ).catch(err => {
+  ).catch(() => {
-    console.log('[SOCIAL] error:', err);
-
     return res.render('social/vk_error', {
       title: STRINGS.OAUTH.ERROR_TITLE,
       heading: STRINGS.OAUTH.ERROR_HEADING,

src/components/dialogs/StickersDialog.jsx

@@ -11,17 +11,24 @@ export const StickersDialog = ({ setActiveSticker }: Props) => (
   <div className="helper stickers-helper">
     {
       Object.keys(STICKERS).map(set => (
-        Object.keys(STICKERS[set].layers).map(sticker => (
+        <div>
-          <div
+          <div className="stickers-set-title">{STICKERS[set].title || null}</div>
-            style={{
+          <div className="stickers-grid">
-              backgroundImage: `url(${STICKERS[set].url})`,
+            {
-              backgroundPosition: `${-STICKERS[set].layers[sticker].off * 48}px 50%`,
+              Object.keys(STICKERS[set].layers).map(sticker => (
-            }}
+                <div
-            className="sticker-preview"
+                  style={{
-            key={`${set}-${sticker}`}
+                    backgroundImage: `url(${STICKERS[set].url})`,
-            onClick={() => setActiveSticker({ set, sticker })}
+                    backgroundPosition: `${-STICKERS[set].layers[sticker].off * 48}px 50%`,
-          />
+                  }}
-        ))
+                  className="sticker-preview"
+                  key={`${set}-${sticker}`}
+                  onClick={() => setActiveSticker({ set, sticker })}
+                />
+              ))
+            }
+          </div>
+        </div>
       ))
     }
   </div>

src/components/panels/UserPanel.jsx

@@ -4,7 +4,7 @@ import { GuestButton } from '$components/user/GuestButton';
 import { DEFAULT_USER, ROLES } from '$constants/auth';
 import { UserButton } from '$components/user/UserButton';
 import { UserMenu } from '$components/user/UserMenu';
-import { setUser, userLogout, takeAShot, setDialog } from '$redux/user/actions';
+import { setUser, userLogout, takeAShot, setDialog, gotVkUser } from '$redux/user/actions';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import type { UserType } from '$constants/types';
@@ -19,7 +19,7 @@ type Props = {
   userLogout: Function,
   setUser: Function,
   setDialog: Function,
-  dialog: String,
+  gotVkUser: Function,
 };
 
 export class Component extends React.PureComponent<Props, void> {
@@ -51,7 +51,7 @@ export class Component extends React.PureComponent<Props, void> {
       };
 
       this.setState({ menuOpened: false });
-      this.props.setUser(user);
+      this.props.gotVkUser(user);
     });
   }
 
@@ -119,6 +119,7 @@ const mapDispatchToProps = dispatch => bindActionCreators({
   userLogout,
   takeAShot,
   setDialog,
+  gotVkUser,
 }, dispatch);
 
 export const UserPanel = connect(mapStateToProps, mapDispatchToProps)(Component);

src/components/user/UserButton.jsx

@@ -14,7 +14,9 @@ export const UserButton = ({
   setMenuOpened,
   user: {
     id,
-    userdata: { name, photo }
+    // userdata: { name, photo },
+    photo,
+    name,
   }
 }: Props) => (
   <div className="control-bar user-bar">

src/constants/stickers.js

@@ -14,32 +14,49 @@ export const STICKERS = {
       ikea: { off: 7, title: 'Икея', title_long: 'Парковка ТЦ Мега' },
       bugr: { off: 8, title: 'Бугринка', title_long: 'Та самая коса\n(культовое место Усталых Педалек)' },
       monum: { off: 10, title: 'ГПНТБ', title_long: 'ГПНТБ' },
-      opera: { off: 18, title: 'Оперный', title_long: 'Оперный театр' },
+      opera: { off: 11, title: 'Оперный', title_long: 'Оперный театр' },
       forest: { off: 1, title: 'Лес', title_long: 'Берёзовая роща' },
       road: { off: 2, title: 'Трасса', title_long: 'Дорога' },
-      empty1: { off: 19, title: 'Пусто', title_long: 'Пока что пусто 1' },
+      chicken1: { off: 3, title: 'Курочка', title_long: 'Курочка' },
-      empty2: { off: 19, title: 'Пусто', title_long: 'Пока что пусто 2' },
-      chicken: { off: 3, title: 'Курочка', title_long: 'Курочка' },
       camp: { off: 6, title: 'Палатка', title_long: 'Палаточный лагерь' },
-      burger: { off: 11, title: 'Фастфуд', title_long: 'Двухколёсное ожирение' },
-      beer: { off: 12, title: 'Пивко', title_long: 'В Питере - пить!' },
-      shawarma: { off: 13, title: 'Шаварма', title_long: 'Вкусная шаурма' },
       rocks: { off: 14, title: 'Камни', title_long: 'Кааааммммуушшшки' },
-      swamp: { off: 15, title: 'Болото', title_long: 'Пошла ты,\nтрясина грёбаная!' },
+      crap: { off: 15, title: 'Щет', title_long: 'Полный щет' },
-      skull: { off: 16, title: 'Роджер', title_long: 'Может не надо?' },
+      pancake: { off: 13, title: 'Блинцы', title_long: 'Блинчики' },
-      dump: { off: 17, title: 'Какашка', title_long: 'Нехорошее место' },
+      fastfood: { off: 16, title: 'Фастфуд', title_long: 'Быстрая еда' },
-      empty3: { off: 19, title: 'Пусто', title_long: 'Пока что пусто 1' },
+      beer: { off: 12, title: 'Пивко', title_long: 'Пивко' },
-      empty4: { off: 19, title: 'Пусто', title_long: 'Пока что пусто 2' },
+    }
-      start: { off: 21, title: 'Старт', title_long: 'Старт здесь' },
+  },
+  real: {
+    title: 'Реалистичные',
+    url: require('$sprites/stickers/stickers-base.svg'),
+    size: 72,
+    layers: {
+      chicken: { off: 31, title: 'Курочка', title_long: 'Курочка' },
+      rocks: { off: 32, title: 'Камни', title_long: 'Кааааммммуушшшки' },
+      shawarma: { off: 33, title: 'Шаварма', title_long: 'Вкусная шаурма' },
+      dump: { off: 34, title: 'Какашка', title_long: 'Нехорошее место' },
+      fastfood: { off: 35, title: 'Фастфуд', title_long: 'Быстрая еда' },
+      swamp: { off: 36, title: 'Болото', title_long: 'Пошла ты,\nтрясина грёбаная!' },
+      beer: { off: 37, title: 'Пивко', title_long: 'В Питере - пить!' },
+      skull: { off: 38, title: 'Роджер', title_long: 'Может не надо?' },
+
+    },
+  },
+  pin: {
+    title: 'ПИН-микс',
+    url: require('$sprites/stickers/stickers-base.svg'),
+    size: 72,
+    layers: {
+      start: { off: 21, title: '1', title_long: 'Первая точка' },
       p1: { off: 22, title: '1', title_long: 'Первая точка' },
       p2: { off: 23, title: '2', title_long: 'Вторая точка' },
       p3: { off: 24, title: '3', title_long: 'Третья точка' },
       p4: { off: 25, title: '4', title_long: 'Четвёртая точка' },
       p5: { off: 26, title: '5', title_long: 'Пятая точка' },
       p6: { off: 27, title: '7', title_long: 'Шестая точка' },
-      p7: { off: 28, title: 'Финиш', title_long: 'Финиш здесь' },
+      finish: { off: 28, title: 'Финиш', title_long: 'Финиш здесь' },
-      p8: { off: 29, title: 'Осторожно!', title_long: 'Осторожно!' },
+      danger: { off: 29, title: 'Осторожно!', title_long: 'Осторожно!' },
-      p9: { off: 30, title: 'Вопрос', title_long: 'Что тут?' },
+      question: { off: 30, title: 'Вопрос', title_long: 'Что тут?' },
     }
-  }
+  },
 };

src/redux/user/actions.js

@@ -43,3 +43,6 @@ export const setProvider = provider => ({ type: ACTIONS.SET_PROVIDER, provider }
 export const setDialog = ({ dialog, dialog_active }) => ({ type: ACTIONS.SET_DIALOG, dialog });
 export const locationChanged = location => ({ type: ACTIONS.LOCATION_CHANGED, location });
 export const setReady = ready => ({ type: ACTIONS.SET_READY, ready });
+
+
+export const gotVkUser = user => ({ type: ACTIONS.GOT_VK_USER, user });

src/redux/user/constants.js

@@ -44,4 +44,6 @@ export const ACTIONS = ({
   SET_DIALOG: 'SET_DIALOG',
   LOCATION_CHANGED: 'LOCATION_CHANGED',
   SET_READY: 'SET_READY',
+
+  GOT_VK_USER: 'GOT_VK_USER',
 }: { [key: String]: String });

src/redux/user/sagas.js

@@ -137,7 +137,7 @@ function* mapInitSaga() {
   return true;
 }
 
-function* authChechSaga() {
+function* authCheckSaga() {
   const { id, token } = yield select(getUser);
 
   if (id && token) {
@@ -351,8 +351,14 @@ function* locationChangeSaga({ location }) {
   }
 }
 
+function* gotVkUserSaga({ user }) {
+  const data = yield call(checkUserToken, user);
+
+  yield put(setUser(data));
+}
+
 export function* userSaga() {
-  yield takeLatest(REHYDRATE, authChechSaga);
+  yield takeLatest(REHYDRATE, authCheckSaga);
   yield takeEvery(ACTIONS.SET_MODE, setModeSaga);
 
   yield takeEvery(ACTIONS.START_EDITING, startEditingSaga);
@@ -378,4 +384,6 @@ export function* userSaga() {
 
   yield takeEvery(ACTIONS.SET_PROVIDER, setProviderSaga);
   yield takeLatest(ACTIONS.LOCATION_CHANGED, locationChangeSaga);
+
+  yield takeLatest(ACTIONS.GOT_VK_USER, gotVkUserSaga);
 }

src/styles/colors.less

@@ -14,7 +14,7 @@
 @red_primary: #ff7034;
 @red_secondary: #ff3344;
 
-@panel_radius: 0;
+@panel_radius: 4px;
 @button_radius: 0;
 
 @color_primary: #4597d0;

src/styles/map.less

@@ -9,6 +9,10 @@
   cursor: crosshair;
 }
 
+.leaflet-control-zoom {
+  display: none;
+}
+
 .leaflet-touch .leaflet-bar a {
  border-radius: @panel_radius !important;
 }

src/styles/stickers.less

@@ -103,7 +103,7 @@
 
   &:after {
     content: ' ';
-    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='38' viewBox='0 0 38 38' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 38,20 38,38 20,38' style='fill:%23ff4433;' /%3E%3C/svg%3E") no-repeat;
+    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='38' viewBox='0 0 38 38' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 38,20 38,38 20,38' style='fill:%23ff3344;' /%3E%3C/svg%3E") no-repeat;
     width: 50px;
     height: 50px;
     transform-origin: 0 0;
@@ -138,8 +138,32 @@
 }
 
 .stickers-helper {
-  display: grid;
+  flex-direction: column;
-  grid-template-columns: repeat( auto-fit , minmax(48px, 1fr) );
+  padding-top: 0;
+}
+
+.stickers-grid {
+  // display: grid;
+  // grid-template-columns: repeat( auto-fit , minmax(48px, 1fr) );
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.stickers-set-title {
+  opacity: 0.3;
+  font-size: 0.8em;
+  padding: 10px 0;
+  display: flex;
+  align-items: center;
+  text-transform: uppercase;
+
+  &::after {
+    content: ' ';
+    height: 1px;
+    flex: 1;
+    background-color: #666666;
+    margin-left: 10px;
+  }
 }
 
 .sticker-preview {

src/utils/renderer.js

@@ -167,7 +167,7 @@ const composeStickerArrow = (ctx, x, y, angle) => {
   ctx.translate(x, y);
   ctx.rotate(angle + (Math.PI * 0.75));
   ctx.translate(-x, -y);
-  ctx.fillStyle = 'red';
+  ctx.fillStyle = '#ff3344';
   ctx.beginPath();
   ctx.moveTo(x, y);
   ctx.lineTo(x + 38, y + 20);