sticker panel with ability to choose

This commit is contained in:
muerwre 2018-08-24 17:04:48 +07:00
parent 40a11297c0
commit f2c9cc4abc
10 changed files with 140 additions and 64 deletions

View file

@ -2,14 +2,19 @@ import React from 'react';
import { MODES } from '$constants/modes';
import { RouterHelper } from '$components/router/RouterHelper';
import { StickersHelper } from '$components/stickers/StickersHelper';
export const EditorDialog = ({ mode, routerPoints, editor }) => {
const showDialog = (mode === MODES.ROUTER);
export const EditorDialog = ({ mode, routerPoints, editor, activeSticker }) => {
const showDialog = (
mode === MODES.ROUTER
|| (mode === MODES.STICKERS && !activeSticker)
);
return (
showDialog &&
<div id="control-dialog">
{ mode === MODES.ROUTER && <RouterHelper routerPoints={routerPoints} editor={editor} /> }
{ mode === MODES.STICKERS && <StickersHelper editor={editor} /> }
</div>
);
};

View file

@ -18,7 +18,7 @@ export class EditorPanel extends React.PureComponent {
render() {
const {
mode, routerPoints, editor, totalDistance, estimateTime
mode, routerPoints, editor, totalDistance, estimateTime, activeSticker
} = this.props;
return (
@ -27,6 +27,7 @@ export class EditorPanel extends React.PureComponent {
<EditorDialog
mode={mode}
routerPoints={routerPoints}
activeSticker={activeSticker}
editor={editor}
/>
@ -44,14 +45,14 @@ export class EditorPanel extends React.PureComponent {
<div className="control-dist">
{(totalDistance > 0)
?
<React.Fragment>
{totalDistance} км
<Icon icon="icon-cycle" size={32} />
{
(estimateTime > 0) && (estimateTime > 0) && <span>{toHours(estimateTime)}</span>
}
</React.Fragment>
: <div onClick={() => editor.changeMode(MODES.ROUTER)}>Начнать рисовать</div>
<React.Fragment>
{totalDistance} км
<Icon icon="icon-cycle" size={32} />
{
(estimateTime > 0) && (estimateTime > 0) && <span>{toHours(estimateTime)}</span>
}
</React.Fragment>
: <div onClick={() => editor.changeMode(MODES.ROUTER)}>Начать рисовать</div>
}
</div>