diff options
Diffstat (limited to 'src/components/app/sidebars/topology')
8 files changed, 46 insertions, 9 deletions
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> )} |