diff --git a/src/components/panels/EditorDialog.jsx b/src/components/panels/EditorDialog.jsx index 0ed18bc..2bcea1b 100644 --- a/src/components/panels/EditorDialog.jsx +++ b/src/components/panels/EditorDialog.jsx @@ -8,11 +8,21 @@ import { LogoDialog } from '$components/logo/LogoDialog'; import { SaveDialog } from '$components/save/SaveDialog'; import { CancelDialog } from '$components/save/CancelDialog'; import type { UserType } from '$constants/types'; -import { setLogo, routerCancel, routerSubmit } from '$redux/user/actions'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; import { editor } from '$modules/Editor'; +import { + setLogo, + routerCancel, + routerSubmit, + setActiveSticker, + clearStickers, + clearPoly, + clearAll, + clearCancel, +} from '$redux/user/actions'; + type Props = { mode: String, routerPoints: Number, @@ -26,6 +36,11 @@ type Props = { setLogo: Function, routerSubmit: Function, routerCancel: Function, + setActiveSticker: Function, + clearStickers: Function, + clearPoly: Function, + clearAll: Function, + clearCancel: Function, } export const Component = (props: Props) => { @@ -46,8 +61,8 @@ export const Component = (props: Props) => { showDialog &&
{ mode === MODES.ROUTER && } - { mode === MODES.STICKERS && } - { mode === MODES.TRASH && } + { mode === MODES.STICKERS && } + { mode === MODES.TRASH && } { mode === MODES.LOGO && } { mode === MODES.SAVE && } { mode === MODES.CONFIRM_CANCEL && } @@ -78,6 +93,11 @@ const mapDispatchToProps = dispatch => bindActionCreators({ routerCancel, routerSubmit, setLogo, + setActiveSticker, + clearStickers, + clearPoly, + clearAll, + clearCancel, }, dispatch); export const EditorDialog = connect( diff --git a/src/components/stickers/StickersDialog.jsx b/src/components/stickers/StickersDialog.jsx index 641b8ae..a59731e 100644 --- a/src/components/stickers/StickersDialog.jsx +++ b/src/components/stickers/StickersDialog.jsx @@ -1,22 +1,23 @@ +// @flow import React from 'react'; import { stickers } from '$constants/stickers'; import sprite from '$sprites/stickers.svg'; -export class StickersDialog extends React.Component { - render() { - return ( -
- { - stickers.map(sticker => ( -
- this.props.editor.setSticker(sticker)}> - - -
- )) - } -
- ); - } -} +type Props = { + setActiveSticker: Function +}; + +export const StickersDialog = ({ setActiveSticker }: Props) => ( +
+ { + stickers.map(sticker => ( +
+ setActiveSticker(sticker)}> + + +
+ )) + } +
+); diff --git a/src/components/trash/TrashDialog.jsx b/src/components/trash/TrashDialog.jsx index 89b6fdc..6360c5b 100644 --- a/src/components/trash/TrashDialog.jsx +++ b/src/components/trash/TrashDialog.jsx @@ -1,48 +1,33 @@ import React from 'react'; -import { MODES } from '$constants/modes'; - -export class TrashDialog extends React.Component { - clearPoly = () => { - this.props.editor.poly.clearAll(); - this.props.editor.changeMode(MODES.NONE); - }; - - clearStickers = () => { - this.props.editor.stickers.clearAll(); - this.props.editor.changeMode(MODES.NONE); - }; - - clearAll = () => { - this.props.editor.clearAll(); - }; - - cancel = () => { - this.props.editor.changeMode(MODES.NONE); - }; - - render() { - return ( -
-
-
Уверены?
-
Мы все удалим
-
-
-
- Стикеры -
-
- Маршрут -
-
- Очистить -
-
- Отмена -
-
-
- ); - } +type Props = { + clearPoly: Function, + clearStickers: Function, + clearAll: Function, + clearCancel: Function, } + +export const TrashDialog = ({ + clearPoly, clearStickers, clearAll, clearCancel +}: Props) => ( +
+
+
Уверены?
+
Мы все удалим
+
+
+
+ Стикеры +
+
+ Маршрут +
+
+ Очистить +
+
+ Отмена +
+
+
+); diff --git a/src/modules/Editor.js b/src/modules/Editor.js index 35a58d6..d6616f0 100644 --- a/src/modules/Editor.js +++ b/src/modules/Editor.js @@ -180,11 +180,6 @@ export class Editor { this.poly.pushPoints(latlngs); }; - // setSticker = sticker => { - // this.activeSticker = sticker; - // this.setActiveSticker(sticker); - // }; - clearSticker = () => { if (this.activeSticker) { this.setActiveSticker(null); diff --git a/src/redux/user/actions.js b/src/redux/user/actions.js index 034b8fb..ad7458c 100644 --- a/src/redux/user/actions.js +++ b/src/redux/user/actions.js @@ -19,3 +19,8 @@ export const stopEditing = () => ({ type: ACTIONS.STOP_EDITING }); export const routerCancel = () => ({ type: ACTIONS.ROUTER_CANCEL }); export const routerSubmit = () => ({ type: ACTIONS.ROUTER_SUBMIT }); + +export const clearPoly = () => ({ type: ACTIONS.CLEAR_POLY }); +export const clearStickers = () => ({ type: ACTIONS.CLEAR_STICKERS }); +export const clearAll = () => ({ type: ACTIONS.CLEAR_ALL }); +export const clearCancel = () => ({ type: ACTIONS.CLEAR_CANCEL }); diff --git a/src/redux/user/constants.js b/src/redux/user/constants.js index db72493..4152501 100644 --- a/src/redux/user/constants.js +++ b/src/redux/user/constants.js @@ -17,4 +17,9 @@ export const ACTIONS = { ROUTER_CANCEL: 'ROUTER_CANCEL', ROUTER_SUBMIT: 'ROUTER_SUBMIT', + + CLEAR_POLY: 'CLEAR_POLY', + CLEAR_STICKERS: 'CLEAR_STICKERS', + CLEAR_ALL: 'CLEAR_ALL', + CLEAR_CANCEL: 'CLEAR_CANCEL', }; diff --git a/src/redux/user/sagas.js b/src/redux/user/sagas.js index 781b53d..5d95587 100644 --- a/src/redux/user/sagas.js +++ b/src/redux/user/sagas.js @@ -141,6 +141,27 @@ function* routerSubmitSaga() { return true; } +function* clearSaga({ type }){ + switch (type) { + case ACTIONS.CLEAR_POLY: + editor.poly.clearAll(); + editor.router.clearAll(); + break; + + case ACTIONS.CLEAR_STICKERS: + editor.stickers.clearAll(); + break; + + case ACTIONS.CLEAR_ALL: + editor.clearAll(); + break; + + default: break; + } + + yield put(setMode(MODES.NONE)); +} + export function* userSaga() { // ASYNCHRONOUS!!! :-) @@ -156,4 +177,11 @@ export function* userSaga() { yield takeEvery(ACTIONS.ROUTER_CANCEL, routerCancelSaga); yield takeEvery(ACTIONS.ROUTER_SUBMIT, routerSubmitSaga); + yield takeEvery([ + ACTIONS.CLEAR_POLY, + ACTIONS.CLEAR_STICKERS, + ACTIONS.CLEAR_ALL, + ACTIONS.CLEAR_CANCEL, + ], clearSaga); + }