Skip to content

Commit d9836bd

Browse files
feat(scene): create a scene rotation mode with a tool button
1 parent 354cf94 commit d9836bd

File tree

3 files changed

+28
-4
lines changed

3 files changed

+28
-4
lines changed

src/components/ToolsMenu/ToolsMenu.js

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,18 @@ import PropTypes from 'prop-types';
88
import { Link } from 'react-router-dom';
99
import classNames from 'classnames';
1010
import { withStyles, Button, Tooltip } from '@material-ui/core';
11-
import { OpenWith, TouchApp, PanTool, AddCircle } from '@material-ui/icons';
11+
import {
12+
OpenWith,
13+
TouchApp,
14+
PanTool,
15+
AddCircle,
16+
RotateLeft
17+
} from '@material-ui/icons';
1218

1319
import {
1420
MODE_COMPONENT_SELECTING,
15-
MODE_COMPONENT_PLACING
21+
MODE_COMPONENT_PLACING,
22+
MODE_SCENE_ROTATE
1623
} from '../../constants';
1724
import ToolsMenuStyles from './ToolsMenu.style';
1825
import { ComponentCreateMenu } from '../';
@@ -53,6 +60,7 @@ class ToolsMenu extends Component {
5360
const previewPath = `${basePath}/${sceneSlug !== 'scene' ? sceneSlug : ''}`;
5461
const selectingPath = `${basePath}/${sceneSlug}/${MODE_COMPONENT_SELECTING}`;
5562
const placingPath = `${basePath}/${sceneSlug}/${MODE_COMPONENT_PLACING}`;
63+
const rotatePath = `${basePath}/${sceneSlug}/${MODE_SCENE_ROTATE}`;
5664

5765
if (!sceneSlug || sceneSlug === 'scene') {
5866
return null;
@@ -72,7 +80,7 @@ class ToolsMenu extends Component {
7280
<OpenWith />
7381
</Button>
7482
</Tooltip>
75-
<Tooltip title="Select components for editing" placement="right-start">
83+
<Tooltip title="Select components for editing" placement="right">
7684
<Button
7785
className={classNames(classes.button, classes.link)}
7886
variant="fab"
@@ -99,6 +107,21 @@ class ToolsMenu extends Component {
99107
<PanTool />
100108
</Button>
101109
</Tooltip>
110+
<Tooltip
111+
title="Set the rotation of this scene's sky image."
112+
placement="right"
113+
>
114+
<Button
115+
className={classNames(classes.button, classes.link)}
116+
variant="fab"
117+
component={Link}
118+
disabled={location === rotatePath}
119+
color="primary"
120+
to={rotatePath}
121+
>
122+
<RotateLeft />
123+
</Button>
124+
</Tooltip>
102125
<Tooltip title="Create a new component" placement="right">
103126
<Button
104127
className={classes.button}
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`<ToolsMenu /> Matches its snapshot 1`] = `"<div class=\\"ToolsMenu-wrapper-3\\"><a tabindex=\\"-1\\" class=\\"MuiButtonBase-root-28 MuiButtonBase-disabled-29 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 MuiButton-disabled-22 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3l5-5zm-9 3h-4v3H7l5 5 5-5h-3v-3z\\"></path></g></svg></span></a><a tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test/mode-component-selecting\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M9 11.24V7.5C9 6.12 10.12 5 11.5 5S14 6.12 14 7.5v3.74c1.21-.81 2-2.18 2-3.74C16 5.01 13.99 3 11.5 3S7 5.01 7 7.5c0 1.56.79 2.93 2 3.74zm9.84 4.63l-4.54-2.26c-.17-.07-.35-.11-.54-.11H13v-6c0-.83-.67-1.5-1.5-1.5S10 6.67 10 7.5v10.74l-3.43-.72c-.08-.01-.15-.03-.24-.03-.31 0-.59.13-.79.33l-.79.8 4.94 4.94c.27.27.65.44 1.06.44h6.79c.75 0 1.33-.55 1.44-1.28l.75-5.27c.01-.07.02-.14.02-.2 0-.62-.38-1.16-.91-1.38z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></a><a tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test/mode-component-placing\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M23 5.5V20c0 2.2-1.8 4-4 4h-7.3c-1.08 0-2.1-.43-2.85-1.19L1 14.83s1.26-1.23 1.3-1.25c.22-.19.49-.29.79-.29.22 0 .42.06.6.16.04.01 4.31 2.46 4.31 2.46V4c0-.83.67-1.5 1.5-1.5S11 3.17 11 4v7h1V1.5c0-.83.67-1.5 1.5-1.5S15 .67 15 1.5V11h1V2.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5V11h1V5.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></a><button tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1\\" type=\\"button\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></button></div>"`;
3+
exports[`<ToolsMenu /> Matches its snapshot 1`] = `"<div class=\\"ToolsMenu-wrapper-3\\"><a tabindex=\\"-1\\" class=\\"MuiButtonBase-root-28 MuiButtonBase-disabled-29 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 MuiButton-disabled-22 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3l5-5zm-9 3h-4v3H7l5 5 5-5h-3v-3z\\"></path></g></svg></span></a><a tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test/mode-component-selecting\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M9 11.24V7.5C9 6.12 10.12 5 11.5 5S14 6.12 14 7.5v3.74c1.21-.81 2-2.18 2-3.74C16 5.01 13.99 3 11.5 3S7 5.01 7 7.5c0 1.56.79 2.93 2 3.74zm9.84 4.63l-4.54-2.26c-.17-.07-.35-.11-.54-.11H13v-6c0-.83-.67-1.5-1.5-1.5S10 6.67 10 7.5v10.74l-3.43-.72c-.08-.01-.15-.03-.24-.03-.31 0-.59.13-.79.33l-.79.8 4.94 4.94c.27.27.65.44 1.06.44h6.79c.75 0 1.33-.55 1.44-1.28l.75-5.27c.01-.07.02-.14.02-.2 0-.62-.38-1.16-.91-1.38z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></a><a tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test/mode-component-placing\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M23 5.5V20c0 2.2-1.8 4-4 4h-7.3c-1.08 0-2.1-.43-2.85-1.19L1 14.83s1.26-1.23 1.3-1.25c.22-.19.49-.29.79-.29.22 0 .42.06.6.16.04.01 4.31 2.46 4.31 2.46V4c0-.83.67-1.5 1.5-1.5S11 3.17 11 4v7h1V1.5c0-.83.67-1.5 1.5-1.5S15 .67 15 1.5V11h1V2.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5V11h1V5.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></a><a tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1 ToolsMenu-link-2\\" role=\\"button\\" href=\\"/experience/vreditor/test/test/mode-scene-rotate\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M7.11 8.53L5.7 7.11C4.8 8.27 4.24 9.61 4.07 11h2.02c.14-.87.49-1.72 1.02-2.47zM6.09 13H4.07c.17 1.39.72 2.73 1.62 3.89l1.41-1.42c-.52-.75-.87-1.59-1.01-2.47zm1.01 5.32c1.16.9 2.51 1.44 3.9 1.61V17.9c-.87-.15-1.71-.49-2.46-1.03L7.1 18.32zM13 4.07V1L8.45 5.55 13 10V6.09c2.84.48 5 2.94 5 5.91s-2.16 5.43-5 5.91v2.02c3.95-.49 7-3.85 7-7.93s-3.05-7.44-7-7.93z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></a><button tabindex=\\"0\\" class=\\"MuiButtonBase-root-28 MuiButton-root-12 MuiButton-raised-18 MuiButton-fab-23 MuiButton-raisedPrimary-19 ToolsMenu-button-1\\" type=\\"button\\"><span class=\\"MuiButton-label-13\\"><svg class=\\"MuiSvgIcon-root-31\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\"><g><path d=\\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z\\"></path></g></svg></span><span class=\\"MuiTouchRipple-root-37\\"></span></button></div>"`;

src/constants/modes.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,6 @@
55

66
export const MODE_SCENE_CREATE = 'mode-scene-create';
77
export const MODE_SCENE_EDIT = 'mode-scene-edit';
8+
export const MODE_SCENE_ROTATE = 'mode-scene-rotate';
89
export const MODE_COMPONENT_SELECTING = 'mode-component-selecting';
910
export const MODE_COMPONENT_PLACING = 'mode-component-placing';

0 commit comments

Comments
 (0)