diff options
13 files changed, 100 insertions, 15 deletions
diff --git a/src/actions/topology/building.js b/src/actions/topology/building.js index 5aef2932..c6381a07 100644 --- a/src/actions/topology/building.js +++ b/src/actions/topology/building.js @@ -7,6 +7,8 @@ export const FINISH_NEW_ROOM_CONSTRUCTION = "FINISH_NEW_ROOM_CONSTRUCTION"; export const CANCEL_NEW_ROOM_CONSTRUCTION = "CANCEL_NEW_ROOM_CONSTRUCTION"; export const CANCEL_NEW_ROOM_CONSTRUCTION_SUCCEEDED = "CANCEL_NEW_ROOM_CONSTRUCTION_SUCCEEDED"; +export const START_ROOM_EDIT = "START_ROOM_EDIT"; +export const FINISH_ROOM_EDIT = "FINISH_ROOM_EDIT"; export const ADD_TILE = "ADD_TILE"; export const DELETE_TILE = "DELETE_TILE"; @@ -64,6 +66,22 @@ export function cancelNewRoomConstructionSucceeded() { }; } +export function startRoomEdit() { + return (dispatch, getState) => { + const { interactionLevel } = getState(); + dispatch({ + type: START_ROOM_EDIT, + roomId: interactionLevel.roomId + }); + }; +} + +export function finishRoomEdit() { + return { + type: FINISH_ROOM_EDIT + }; +} + export function toggleTileAtLocation(positionX, positionY) { return (dispatch, getState) => { const { objects, construction } = getState(); diff --git a/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js b/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js index a559c8dd..7b049642 100644 --- a/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js +++ b/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js @@ -8,7 +8,7 @@ const NewRoomConstructionComponent = ({ }) => { if (currentRoomInConstruction === -1) { return ( - <div className="btn btn-primary btn-block" onClick={onStart}> + <div className="btn btn-outline-primary btn-block" onClick={onStart}> <span className="fa fa-plus mr-2" /> Construct a new room </div> diff --git a/src/components/app/sidebars/topology/machine/DeleteMachineComponent.js b/src/components/app/sidebars/topology/machine/DeleteMachineComponent.js index 8da39b30..d8774bf9 100644 --- a/src/components/app/sidebars/topology/machine/DeleteMachineComponent.js +++ b/src/components/app/sidebars/topology/machine/DeleteMachineComponent.js @@ -1,7 +1,7 @@ import React from "react"; const DeleteMachineComponent = ({ onClick }) => ( - <div className="btn btn-danger btn-block" onClick={onClick}> + <div className="btn btn-outline-danger btn-block" onClick={onClick}> <span className="fa fa-trash mr-2" /> Delete this machine </div> diff --git a/src/components/app/sidebars/topology/machine/UnitAddComponent.js b/src/components/app/sidebars/topology/machine/UnitAddComponent.js index d0082a72..0c903228 100644 --- a/src/components/app/sidebars/topology/machine/UnitAddComponent.js +++ b/src/components/app/sidebars/topology/machine/UnitAddComponent.js @@ -29,9 +29,10 @@ class UnitAddComponent extends React.Component { </select> <button type="submit" - className="btn btn-primary" + className="btn btn-outline-primary" onClick={() => - this.props.onAdd(parseInt(this.unitSelect.value, 10))} + this.props.onAdd(parseInt(this.unitSelect.value, 10)) + } > <span className="fa fa-plus mr-2" /> Add diff --git a/src/components/app/sidebars/topology/rack/DeleteRackComponent.js b/src/components/app/sidebars/topology/rack/DeleteRackComponent.js index f0bad0ed..d8aa7634 100644 --- a/src/components/app/sidebars/topology/rack/DeleteRackComponent.js +++ b/src/components/app/sidebars/topology/rack/DeleteRackComponent.js @@ -1,7 +1,7 @@ import React from "react"; const DeleteRackComponent = ({ onClick }) => ( - <div className="btn btn-danger btn-block" onClick={onClick}> + <div className="btn btn-outline-danger btn-block" onClick={onClick}> <span className="fa fa-trash mr-2" /> Delete this rack </div> diff --git a/src/components/app/sidebars/topology/room/DeleteRoomComponent.js b/src/components/app/sidebars/topology/room/DeleteRoomComponent.js index 5df484b5..3e3b3b36 100644 --- a/src/components/app/sidebars/topology/room/DeleteRoomComponent.js +++ b/src/components/app/sidebars/topology/room/DeleteRoomComponent.js @@ -1,7 +1,7 @@ import React from "react"; const DeleteRoomComponent = ({ onClick }) => ( - <div className="btn btn-danger btn-block" onClick={onClick}> + <div className="btn btn-outline-danger btn-block" onClick={onClick}> <span className="fa fa-trash mr-2" /> Delete this room </div> diff --git a/src/components/app/sidebars/topology/room/EditRoomComponent.js b/src/components/app/sidebars/topology/room/EditRoomComponent.js new file mode 100644 index 00000000..c3b9f0ad --- /dev/null +++ b/src/components/app/sidebars/topology/room/EditRoomComponent.js @@ -0,0 +1,27 @@ +import classNames from "classnames"; +import React from "react"; + +const EditRoomComponent = ({ + onEdit, + onFinish, + isEditing, + isInRackConstructionMode +}) => + isEditing ? ( + <div className="btn btn-info btn-block" onClick={onFinish}> + <span className="fa fa-check mr-2" /> + Finish editing room + </div> + ) : ( + <div + className={classNames("btn btn-outline-info btn-block", { + disabled: isInRackConstructionMode + })} + onClick={() => (isInRackConstructionMode ? undefined : onEdit())} + > + <span className="fa fa-pencil mr-2" /> + Edit the tiles of this room + </div> + ); + +export default EditRoomComponent; diff --git a/src/components/app/sidebars/topology/room/RackConstructionComponent.js b/src/components/app/sidebars/topology/room/RackConstructionComponent.js index 0982e403..06b8a2aa 100644 --- a/src/components/app/sidebars/topology/room/RackConstructionComponent.js +++ b/src/components/app/sidebars/topology/room/RackConstructionComponent.js @@ -1,9 +1,11 @@ +import classNames from "classnames"; import React from "react"; const RackConstructionComponent = ({ - inRackConstructionMode, onStart, - onStop + onStop, + inRackConstructionMode, + isEditingRoom }) => { if (inRackConstructionMode) { return ( @@ -15,7 +17,12 @@ const RackConstructionComponent = ({ } return ( - <div className="btn btn-primary btn-block" onClick={onStart}> + <div + className={classNames("btn btn-outline-primary btn-block", { + disabled: isEditingRoom + })} + onClick={() => (isEditingRoom ? undefined : onStart())} + > <span className="fa fa-plus mr-2" /> Start rack construction </div> diff --git a/src/components/app/sidebars/topology/room/RoomSidebarComponent.js b/src/components/app/sidebars/topology/room/RoomSidebarComponent.js index 727c3f43..275f9624 100644 --- a/src/components/app/sidebars/topology/room/RoomSidebarComponent.js +++ b/src/components/app/sidebars/topology/room/RoomSidebarComponent.js @@ -3,6 +3,7 @@ import LoadBarContainer from "../../../../../containers/app/sidebars/elements/Lo import LoadChartContainer from "../../../../../containers/app/sidebars/elements/LoadChartContainer"; import BackToBuildingContainer from "../../../../../containers/app/sidebars/topology/room/BackToBuildingContainer"; import DeleteRoomContainer from "../../../../../containers/app/sidebars/topology/room/DeleteRoomContainer"; +import EditRoomContainer from "../../../../../containers/app/sidebars/topology/room/EditRoomContainer"; import RackConstructionContainer from "../../../../../containers/app/sidebars/topology/room/RackConstructionContainer"; import RoomNameContainer from "../../../../../containers/app/sidebars/topology/room/RoomNameContainer"; import RoomTypeContainer from "../../../../../containers/app/sidebars/topology/room/RoomTypeContainer"; @@ -26,6 +27,7 @@ const RoomSidebarComponent = ({ roomId, roomType, inSimulation }) => { ) : ( <div> {allowedObjects} + <EditRoomContainer /> <DeleteRoomContainer /> </div> )} diff --git a/src/containers/app/map/layers/RoomHoverLayer.js b/src/containers/app/map/layers/RoomHoverLayer.js index 910d47fb..020102bf 100644 --- a/src/containers/app/map/layers/RoomHoverLayer.js +++ b/src/containers/app/map/layers/RoomHoverLayer.js @@ -13,10 +13,6 @@ const mapStateToProps = state => { mapScale: state.map.scale, isEnabled: () => state.construction.currentRoomInConstruction !== -1, isValid: (x, y) => { - if (state.interactionLevel.mode !== "BUILDING") { - return false; - } - const newRoom = Object.assign( {}, state.objects.room[state.construction.currentRoomInConstruction] diff --git a/src/containers/app/sidebars/topology/room/EditRoomContainer.js b/src/containers/app/sidebars/topology/room/EditRoomContainer.js new file mode 100644 index 00000000..81052f54 --- /dev/null +++ b/src/containers/app/sidebars/topology/room/EditRoomContainer.js @@ -0,0 +1,26 @@ +import { connect } from "react-redux"; +import { + finishRoomEdit, + startRoomEdit +} from "../../../../../actions/topology/building"; +import EditRoomComponent from "../../../../../components/app/sidebars/topology/room/EditRoomComponent"; + +const mapStateToProps = state => { + return { + isEditing: state.construction.currentRoomInConstruction !== -1, + isInRackConstructionMode: state.construction.inRackConstructionMode + }; +}; + +const mapDispatchToProps = dispatch => { + return { + onEdit: () => dispatch(startRoomEdit()), + onFinish: () => dispatch(finishRoomEdit()) + }; +}; + +const EditRoomContainer = connect(mapStateToProps, mapDispatchToProps)( + EditRoomComponent +); + +export default EditRoomContainer; diff --git a/src/containers/app/sidebars/topology/room/RackConstructionContainer.js b/src/containers/app/sidebars/topology/room/RackConstructionContainer.js index 0fc22b09..c784d3ae 100644 --- a/src/containers/app/sidebars/topology/room/RackConstructionContainer.js +++ b/src/containers/app/sidebars/topology/room/RackConstructionContainer.js @@ -7,7 +7,8 @@ import RackConstructionComponent from "../../../../../components/app/sidebars/to const mapStateToProps = state => { return { - inRackConstructionMode: state.construction.inRackConstructionMode + inRackConstructionMode: state.construction.inRackConstructionMode, + isEditingRoom: state.construction.currentRoomInConstruction !== -1 }; }; diff --git a/src/reducers/construction-mode.js b/src/reducers/construction-mode.js index f58684e6..b5e6e781 100644 --- a/src/reducers/construction-mode.js +++ b/src/reducers/construction-mode.js @@ -4,9 +4,12 @@ import { GO_DOWN_ONE_INTERACTION_LEVEL } from "../actions/interaction-level"; import { CANCEL_NEW_ROOM_CONSTRUCTION_SUCCEEDED, FINISH_NEW_ROOM_CONSTRUCTION, - START_NEW_ROOM_CONSTRUCTION_SUCCEEDED + FINISH_ROOM_EDIT, + START_NEW_ROOM_CONSTRUCTION_SUCCEEDED, + START_ROOM_EDIT } from "../actions/topology/building"; import { + DELETE_ROOM, START_RACK_CONSTRUCTION, STOP_RACK_CONSTRUCTION } from "../actions/topology/room"; @@ -15,9 +18,13 @@ export function currentRoomInConstruction(state = -1, action) { switch (action.type) { case START_NEW_ROOM_CONSTRUCTION_SUCCEEDED: return action.roomId; + case START_ROOM_EDIT: + return action.roomId; case CANCEL_NEW_ROOM_CONSTRUCTION_SUCCEEDED: case FINISH_NEW_ROOM_CONSTRUCTION: case OPEN_EXPERIMENT_SUCCEEDED: + case FINISH_ROOM_EDIT: + case DELETE_ROOM: return -1; default: return state; |