From 912e1b96bfa7d6c022d854fa744f719b49ca98d0 Mon Sep 17 00:00:00 2001
From: Georgios Andreadis <info@gandreadis.com>
Date: Tue, 21 Jul 2020 15:33:37 +0200
Subject: Add first plotting attempts for portfolios

---
 .../src/components/app/map/elements/Backdrop.js    | 10 +------
 .../src/components/app/map/elements/RackFillBar.js | 35 +++++-----------------
 .../components/app/map/elements/TilePlusIcon.js    |  8 ++---
 .../src/components/app/map/elements/WallSegment.js |  9 +-----
 4 files changed, 11 insertions(+), 51 deletions(-)

(limited to 'frontend/src/components/app/map/elements')

diff --git a/frontend/src/components/app/map/elements/Backdrop.js b/frontend/src/components/app/map/elements/Backdrop.js
index 556d6a7b..8ccfe584 100644
--- a/frontend/src/components/app/map/elements/Backdrop.js
+++ b/frontend/src/components/app/map/elements/Backdrop.js
@@ -3,14 +3,6 @@ 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}
-    />
-)
+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/frontend/src/components/app/map/elements/RackFillBar.js b/frontend/src/components/app/map/elements/RackFillBar.js
index 6e56e059..8c573a6f 100644
--- a/frontend/src/components/app/map/elements/RackFillBar.js
+++ b/frontend/src/components/app/map/elements/RackFillBar.js
@@ -21,27 +21,14 @@ const RackFillBar = ({ positionX, positionY, type, fillFraction }) => {
     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
+        (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
+        (positionY + 1) * TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS - halfOfObjectBorderWidth - fractionHeight
 
     return (
         <Group>
@@ -50,22 +37,14 @@ const RackFillBar = ({ positionX, positionY, type, fillFraction }) => {
                 y={startY}
                 width={width}
                 height={fullHeight}
-                fill={
-                    type === 'space'
-                        ? RACK_SPACE_BAR_BACKGROUND_COLOR
-                        : RACK_ENERGY_BAR_BACKGROUND_COLOR
-                }
+                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
-                }
+                fill={type === 'space' ? RACK_SPACE_BAR_FILL_COLOR : RACK_ENERGY_BAR_FILL_COLOR}
             />
             <ImageComponent
                 src={'/img/topology/rack-' + type + '-icon.png'}
diff --git a/frontend/src/components/app/map/elements/TilePlusIcon.js b/frontend/src/components/app/map/elements/TilePlusIcon.js
index dd6e0beb..be3a00a8 100644
--- a/frontend/src/components/app/map/elements/TilePlusIcon.js
+++ b/frontend/src/components/app/map/elements/TilePlusIcon.js
@@ -10,16 +10,12 @@ const TilePlusIcon = ({ pixelX, pixelY, mapScale }) => {
             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,
+            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,
+            pixelX + TILE_SIZE_IN_PIXELS * mapScale - TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
             pixelY + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
         ],
     ]
diff --git a/frontend/src/components/app/map/elements/WallSegment.js b/frontend/src/components/app/map/elements/WallSegment.js
index d1ba6157..8aa2aebf 100644
--- a/frontend/src/components/app/map/elements/WallSegment.js
+++ b/frontend/src/components/app/map/elements/WallSegment.js
@@ -22,14 +22,7 @@ const WallSegment = ({ wallSegment }) => {
         ]
     }
 
-    return (
-        <Line
-            points={points}
-            lineCap="round"
-            stroke={WALL_COLOR}
-            strokeWidth={WALL_WIDTH_IN_PIXELS}
-        />
-    )
+    return <Line points={points} lineCap="round" stroke={WALL_COLOR} strokeWidth={WALL_WIDTH_IN_PIXELS} />
 }
 
 WallSegment.propTypes = {
-- 
cgit v1.2.3