summaryrefslogtreecommitdiff
path: root/src/components/app/map/layers/HoverLayerComponent.js
diff options
context:
space:
mode:
authorGeorgios Andreadis <g.andreadis@student.tudelft.nl>2017-10-04 22:49:07 +0200
committerGeorgios Andreadis <g.andreadis@student.tudelft.nl>2017-10-04 22:49:25 +0200
commit751a9ef3a12c952fe179f256d854d0c4aa37e28e (patch)
tree241fc22c592a277526e73cc70ea0f95d5a8a7b29 /src/components/app/map/layers/HoverLayerComponent.js
parent9257d89ec2e22b65ffecc7dc7cf67b7a74c34d60 (diff)
Apply prettier to codebase
Diffstat (limited to 'src/components/app/map/layers/HoverLayerComponent.js')
-rw-r--r--src/components/app/map/layers/HoverLayerComponent.js128
1 files changed, 75 insertions, 53 deletions
diff --git a/src/components/app/map/layers/HoverLayerComponent.js b/src/components/app/map/layers/HoverLayerComponent.js
index aa2e8313..c39532f1 100644
--- a/src/components/app/map/layers/HoverLayerComponent.js
+++ b/src/components/app/map/layers/HoverLayerComponent.js
@@ -1,63 +1,85 @@
import PropTypes from "prop-types";
-import React from 'react';
-import {Layer} from "react-konva";
+import React from "react";
+import { Layer } from "react-konva";
import HoverTile from "../elements/HoverTile";
-import {TILE_SIZE_IN_PIXELS} from "../MapConstants";
+import { TILE_SIZE_IN_PIXELS } from "../MapConstants";
class HoverLayerComponent extends React.Component {
- static propTypes = {
- mouseX: PropTypes.number.isRequired,
- mouseY: PropTypes.number.isRequired,
- mapPosition: PropTypes.object.isRequired,
- mapScale: PropTypes.number.isRequired,
- isEnabled: PropTypes.func.isRequired,
- onClick: PropTypes.func.isRequired,
- };
-
- state = {
- positionX: -1,
- positionY: -1,
- validity: false,
- };
-
- componentDidUpdate() {
- if (!this.props.isEnabled()) {
- return;
- }
-
- const positionX = Math.floor((this.props.mouseX - this.props.mapPosition.x) / (this.props.mapScale * TILE_SIZE_IN_PIXELS));
- const positionY = Math.floor((this.props.mouseY - this.props.mapPosition.y) / (this.props.mapScale * TILE_SIZE_IN_PIXELS));
-
- if (positionX !== this.state.positionX || positionY !== this.state.positionY) {
- this.setState({positionX, positionY, validity: this.props.isValid(positionX, positionY)});
- }
+ static propTypes = {
+ mouseX: PropTypes.number.isRequired,
+ mouseY: PropTypes.number.isRequired,
+ mapPosition: PropTypes.object.isRequired,
+ mapScale: PropTypes.number.isRequired,
+ isEnabled: PropTypes.func.isRequired,
+ onClick: PropTypes.func.isRequired
+ };
+
+ state = {
+ positionX: -1,
+ positionY: -1,
+ validity: false
+ };
+
+ componentDidUpdate() {
+ if (!this.props.isEnabled()) {
+ return;
}
- render() {
- if (!this.props.isEnabled()) {
- return <Layer/>;
- }
-
- const pixelX = this.props.mapScale * this.state.positionX * TILE_SIZE_IN_PIXELS + this.props.mapPosition.x;
- const pixelY = this.props.mapScale * this.state.positionY * TILE_SIZE_IN_PIXELS + this.props.mapPosition.y;
-
- return (
- <Layer opacity={0.6}>
- <HoverTile
- pixelX={pixelX}
- pixelY={pixelY}
- scale={this.props.mapScale}
- isValid={this.state.validity}
- onClick={() => this.state.validity ?
- this.props.onClick(this.state.positionX, this.state.positionY) : undefined}
- />
- {this.props.children ?
- React.cloneElement(this.props.children, {pixelX, pixelY, scale: this.props.mapScale}) :
- undefined
- }
- </Layer>
- );
+ const positionX = Math.floor(
+ (this.props.mouseX - this.props.mapPosition.x) /
+ (this.props.mapScale * TILE_SIZE_IN_PIXELS)
+ );
+ const positionY = Math.floor(
+ (this.props.mouseY - this.props.mapPosition.y) /
+ (this.props.mapScale * TILE_SIZE_IN_PIXELS)
+ );
+
+ if (
+ positionX !== this.state.positionX ||
+ positionY !== this.state.positionY
+ ) {
+ this.setState({
+ positionX,
+ positionY,
+ validity: this.props.isValid(positionX, positionY)
+ });
}
+ }
+
+ render() {
+ if (!this.props.isEnabled()) {
+ return <Layer />;
+ }
+
+ const pixelX =
+ this.props.mapScale * this.state.positionX * TILE_SIZE_IN_PIXELS +
+ this.props.mapPosition.x;
+ const pixelY =
+ this.props.mapScale * this.state.positionY * TILE_SIZE_IN_PIXELS +
+ this.props.mapPosition.y;
+
+ return (
+ <Layer opacity={0.6}>
+ <HoverTile
+ pixelX={pixelX}
+ pixelY={pixelY}
+ scale={this.props.mapScale}
+ isValid={this.state.validity}
+ onClick={() =>
+ this.state.validity
+ ? this.props.onClick(this.state.positionX, this.state.positionY)
+ : undefined}
+ />
+ {this.props.children
+ ? React.cloneElement(this.props.children, {
+ pixelX,
+ pixelY,
+ scale: this.props.mapScale
+ })
+ : undefined}
+ </Layer>
+ );
+ }
}
export default HoverLayerComponent;