summaryrefslogtreecommitdiff
path: root/src/components/app/map/elements
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/app/map/elements')
-rw-r--r--src/components/app/map/elements/Backdrop.js16
-rw-r--r--src/components/app/map/elements/GrayLayer.js17
-rw-r--r--src/components/app/map/elements/HoverTile.js30
-rw-r--r--src/components/app/map/elements/ImageComponent.js48
-rw-r--r--src/components/app/map/elements/RackFillBar.js89
-rw-r--r--src/components/app/map/elements/RoomTile.js20
-rw-r--r--src/components/app/map/elements/TileObject.js29
-rw-r--r--src/components/app/map/elements/TilePlusIcon.js52
-rw-r--r--src/components/app/map/elements/WallSegment.js39
9 files changed, 0 insertions, 340 deletions
diff --git a/src/components/app/map/elements/Backdrop.js b/src/components/app/map/elements/Backdrop.js
deleted file mode 100644
index 57414463..00000000
--- a/src/components/app/map/elements/Backdrop.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from "react";
-import { Rect } from "react-konva";
-import { BACKDROP_COLOR } from "../../../../util/colors";
-import { MAP_SIZE_IN_PIXELS } from "../MapConstants";
-
-const Backdrop = () => (
- <Rect
- x={0}
- y={0}
- width={MAP_SIZE_IN_PIXELS}
- height={MAP_SIZE_IN_PIXELS}
- fill={BACKDROP_COLOR}
- />
-);
-
-export default Backdrop;
diff --git a/src/components/app/map/elements/GrayLayer.js b/src/components/app/map/elements/GrayLayer.js
deleted file mode 100644
index 28fadd8a..00000000
--- a/src/components/app/map/elements/GrayLayer.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from "react";
-import { Rect } from "react-konva";
-import { GRAYED_OUT_AREA_COLOR } from "../../../../util/colors";
-import { MAP_SIZE_IN_PIXELS } from "../MapConstants";
-
-const GrayLayer = ({ onClick }) => (
- <Rect
- x={0}
- y={0}
- width={MAP_SIZE_IN_PIXELS}
- height={MAP_SIZE_IN_PIXELS}
- fill={GRAYED_OUT_AREA_COLOR}
- onClick={onClick}
- />
-);
-
-export default GrayLayer;
diff --git a/src/components/app/map/elements/HoverTile.js b/src/components/app/map/elements/HoverTile.js
deleted file mode 100644
index 42e6547c..00000000
--- a/src/components/app/map/elements/HoverTile.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { Rect } from "react-konva";
-import {
- ROOM_HOVER_INVALID_COLOR,
- ROOM_HOVER_VALID_COLOR
-} from "../../../../util/colors";
-import { TILE_SIZE_IN_PIXELS } from "../MapConstants";
-
-const HoverTile = ({ pixelX, pixelY, isValid, scale, onClick }) => (
- <Rect
- x={pixelX}
- y={pixelY}
- scaleX={scale}
- scaleY={scale}
- width={TILE_SIZE_IN_PIXELS}
- height={TILE_SIZE_IN_PIXELS}
- fill={isValid ? ROOM_HOVER_VALID_COLOR : ROOM_HOVER_INVALID_COLOR}
- onClick={onClick}
- />
-);
-
-HoverTile.propTypes = {
- pixelX: PropTypes.number.isRequired,
- pixelY: PropTypes.number.isRequired,
- isValid: PropTypes.bool.isRequired,
- onClick: PropTypes.func.isRequired
-};
-
-export default HoverTile;
diff --git a/src/components/app/map/elements/ImageComponent.js b/src/components/app/map/elements/ImageComponent.js
deleted file mode 100644
index cf41ddfe..00000000
--- a/src/components/app/map/elements/ImageComponent.js
+++ /dev/null
@@ -1,48 +0,0 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { Image } from "react-konva";
-
-class ImageComponent extends React.Component {
- static imageCaches = {};
- static propTypes = {
- src: PropTypes.string.isRequired,
- x: PropTypes.number.isRequired,
- y: PropTypes.number.isRequired,
- width: PropTypes.number.isRequired,
- height: PropTypes.number.isRequired,
- opacity: PropTypes.number.isRequired
- };
-
- state = {
- image: null
- };
-
- componentDidMount() {
- if (ImageComponent.imageCaches[this.props.src]) {
- this.setState({ image: ImageComponent.imageCaches[this.props.src] });
- return;
- }
-
- const image = new window.Image();
- image.src = this.props.src;
- image.onload = () => {
- this.setState({ image });
- ImageComponent.imageCaches[this.props.src] = image;
- };
- }
-
- render() {
- return (
- <Image
- image={this.state.image}
- x={this.props.x}
- y={this.props.y}
- width={this.props.width}
- height={this.props.height}
- opacity={this.props.opacity}
- />
- );
- }
-}
-
-export default ImageComponent;
diff --git a/src/components/app/map/elements/RackFillBar.js b/src/components/app/map/elements/RackFillBar.js
deleted file mode 100644
index 43701d97..00000000
--- a/src/components/app/map/elements/RackFillBar.js
+++ /dev/null
@@ -1,89 +0,0 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { Group, Rect } from "react-konva";
-import {
- RACK_ENERGY_BAR_BACKGROUND_COLOR,
- RACK_ENERGY_BAR_FILL_COLOR,
- RACK_SPACE_BAR_BACKGROUND_COLOR,
- RACK_SPACE_BAR_FILL_COLOR
-} from "../../../../util/colors";
-import {
- OBJECT_BORDER_WIDTH_IN_PIXELS,
- OBJECT_MARGIN_IN_PIXELS,
- RACK_FILL_ICON_OPACITY,
- RACK_FILL_ICON_WIDTH,
- TILE_SIZE_IN_PIXELS
-} from "../MapConstants";
-import ImageComponent from "./ImageComponent";
-
-const RackFillBar = ({ positionX, positionY, type, fillFraction }) => {
- const halfOfObjectBorderWidth = OBJECT_BORDER_WIDTH_IN_PIXELS / 2;
- const x =
- positionX * TILE_SIZE_IN_PIXELS +
- OBJECT_MARGIN_IN_PIXELS +
- (type === "space"
- ? halfOfObjectBorderWidth
- : 0.5 * (TILE_SIZE_IN_PIXELS - 2 * OBJECT_MARGIN_IN_PIXELS));
- const startY =
- positionY * TILE_SIZE_IN_PIXELS +
- OBJECT_MARGIN_IN_PIXELS +
- halfOfObjectBorderWidth;
- const width =
- 0.5 * (TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2) -
- halfOfObjectBorderWidth;
- const fullHeight =
- TILE_SIZE_IN_PIXELS -
- OBJECT_MARGIN_IN_PIXELS * 2 -
- OBJECT_BORDER_WIDTH_IN_PIXELS;
-
- const fractionHeight = fillFraction * fullHeight;
- const fractionY =
- (positionY + 1) * TILE_SIZE_IN_PIXELS -
- OBJECT_MARGIN_IN_PIXELS -
- halfOfObjectBorderWidth -
- fractionHeight;
-
- return (
- <Group>
- <Rect
- x={x}
- y={startY}
- width={width}
- height={fullHeight}
- fill={
- type === "space"
- ? RACK_SPACE_BAR_BACKGROUND_COLOR
- : RACK_ENERGY_BAR_BACKGROUND_COLOR
- }
- />
- <Rect
- x={x}
- y={fractionY}
- width={width}
- height={fractionHeight}
- fill={
- type === "space"
- ? RACK_SPACE_BAR_FILL_COLOR
- : RACK_ENERGY_BAR_FILL_COLOR
- }
- />
- <ImageComponent
- src={"/img/topology/rack-" + type + "-icon.png"}
- x={x + width * 0.5 - RACK_FILL_ICON_WIDTH * 0.5}
- y={startY + fullHeight * 0.5 - RACK_FILL_ICON_WIDTH * 0.5}
- width={RACK_FILL_ICON_WIDTH}
- height={RACK_FILL_ICON_WIDTH}
- opacity={RACK_FILL_ICON_OPACITY}
- />
- </Group>
- );
-};
-
-RackFillBar.propTypes = {
- positionX: PropTypes.number.isRequired,
- positionY: PropTypes.number.isRequired,
- type: PropTypes.string.isRequired,
- fillFraction: PropTypes.number.isRequired
-};
-
-export default RackFillBar;
diff --git a/src/components/app/map/elements/RoomTile.js b/src/components/app/map/elements/RoomTile.js
deleted file mode 100644
index 71c3bf15..00000000
--- a/src/components/app/map/elements/RoomTile.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from "react";
-import { Rect } from "react-konva";
-import Shapes from "../../../../shapes/index";
-import { TILE_SIZE_IN_PIXELS } from "../MapConstants";
-
-const RoomTile = ({ tile, color }) => (
- <Rect
- x={tile.positionX * TILE_SIZE_IN_PIXELS}
- y={tile.positionY * TILE_SIZE_IN_PIXELS}
- width={TILE_SIZE_IN_PIXELS}
- height={TILE_SIZE_IN_PIXELS}
- fill={color}
- />
-);
-
-RoomTile.propTypes = {
- tile: Shapes.Tile
-};
-
-export default RoomTile;
diff --git a/src/components/app/map/elements/TileObject.js b/src/components/app/map/elements/TileObject.js
deleted file mode 100644
index c1b631db..00000000
--- a/src/components/app/map/elements/TileObject.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { Rect } from "react-konva";
-import { OBJECT_BORDER_COLOR } from "../../../../util/colors";
-import {
- OBJECT_BORDER_WIDTH_IN_PIXELS,
- OBJECT_MARGIN_IN_PIXELS,
- TILE_SIZE_IN_PIXELS
-} from "../MapConstants";
-
-const TileObject = ({ positionX, positionY, color }) => (
- <Rect
- x={positionX * TILE_SIZE_IN_PIXELS + OBJECT_MARGIN_IN_PIXELS}
- y={positionY * TILE_SIZE_IN_PIXELS + OBJECT_MARGIN_IN_PIXELS}
- width={TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2}
- height={TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2}
- fill={color}
- stroke={OBJECT_BORDER_COLOR}
- strokeWidth={OBJECT_BORDER_WIDTH_IN_PIXELS}
- />
-);
-
-TileObject.propTypes = {
- positionX: PropTypes.number.isRequired,
- positionY: PropTypes.number.isRequired,
- color: PropTypes.string.isRequired
-};
-
-export default TileObject;
diff --git a/src/components/app/map/elements/TilePlusIcon.js b/src/components/app/map/elements/TilePlusIcon.js
deleted file mode 100644
index 06377152..00000000
--- a/src/components/app/map/elements/TilePlusIcon.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { Group, Line } from "react-konva";
-import { TILE_PLUS_COLOR } from "../../../../util/colors";
-import {
- TILE_PLUS_MARGIN_IN_PIXELS,
- TILE_PLUS_WIDTH_IN_PIXELS,
- TILE_SIZE_IN_PIXELS
-} from "../MapConstants";
-
-const TilePlusIcon = ({ pixelX, pixelY, mapScale }) => {
- const linePoints = [
- [
- pixelX + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
- pixelY + TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
- pixelX + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
- pixelY +
- TILE_SIZE_IN_PIXELS * mapScale -
- TILE_PLUS_MARGIN_IN_PIXELS * mapScale
- ],
- [
- pixelX + TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
- pixelY + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
- pixelX +
- TILE_SIZE_IN_PIXELS * mapScale -
- TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
- pixelY + 0.5 * TILE_SIZE_IN_PIXELS * mapScale
- ]
- ];
- return (
- <Group>
- {linePoints.map((points, index) => (
- <Line
- key={index}
- points={points}
- lineCap="round"
- stroke={TILE_PLUS_COLOR}
- strokeWidth={TILE_PLUS_WIDTH_IN_PIXELS * mapScale}
- listening={false}
- />
- ))}
- </Group>
- );
-};
-
-TilePlusIcon.propTypes = {
- pixelX: PropTypes.number,
- pixelY: PropTypes.number,
- mapScale: PropTypes.number
-};
-
-export default TilePlusIcon;
diff --git a/src/components/app/map/elements/WallSegment.js b/src/components/app/map/elements/WallSegment.js
deleted file mode 100644
index c5011656..00000000
--- a/src/components/app/map/elements/WallSegment.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from "react";
-import { Line } from "react-konva";
-import Shapes from "../../../../shapes/index";
-import { WALL_COLOR } from "../../../../util/colors";
-import { TILE_SIZE_IN_PIXELS, WALL_WIDTH_IN_PIXELS } from "../MapConstants";
-
-const WallSegment = ({ wallSegment }) => {
- let points;
- if (wallSegment.isHorizontal) {
- points = [
- wallSegment.startPosX * TILE_SIZE_IN_PIXELS,
- wallSegment.startPosY * TILE_SIZE_IN_PIXELS,
- (wallSegment.startPosX + wallSegment.length) * TILE_SIZE_IN_PIXELS,
- wallSegment.startPosY * TILE_SIZE_IN_PIXELS
- ];
- } else {
- points = [
- wallSegment.startPosX * TILE_SIZE_IN_PIXELS,
- wallSegment.startPosY * TILE_SIZE_IN_PIXELS,
- wallSegment.startPosX * TILE_SIZE_IN_PIXELS,
- (wallSegment.startPosY + wallSegment.length) * TILE_SIZE_IN_PIXELS
- ];
- }
-
- return (
- <Line
- points={points}
- lineCap="round"
- stroke={WALL_COLOR}
- strokeWidth={WALL_WIDTH_IN_PIXELS}
- />
- );
-};
-
-WallSegment.propTypes = {
- wallSegment: Shapes.WallSegment
-};
-
-export default WallSegment;
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-16 22:07:09 +0000