From 5c3bd9b3802e2001a7e77baf2911386135a03839 Mon Sep 17 00:00:00 2001 From: notoraptor Date: Wed, 14 Aug 2019 12:22:22 -0400 Subject: [Web] Integrated new maps on the web interface - Fixed bug with incorrect dislodged unit on pure map - [python] Make sure dummy powers are registered only for standard maps. - Hardcoded supply centers into SVG files. - Removed supply centers CSS classes. - Update positions for units and dislodged units on all maps. - Converted SVGs to React. - Removed "sym" classes and hardcode related styles into symbol definitions. - Reordered map list (standard at top, then other ones in alphabetical order) - Displayed + button for all maps and disable it for maps without variants. - Minified generated code when converting SVG files to React. - [web] Added ability to hide/display map abbreviations. --- diplomacy/web/src/gui/maps/common/convoy.js | 103 ++++++++++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 diplomacy/web/src/gui/maps/common/convoy.js (limited to 'diplomacy/web/src/gui/maps/common/convoy.js') diff --git a/diplomacy/web/src/gui/maps/common/convoy.js b/diplomacy/web/src/gui/maps/common/convoy.js new file mode 100644 index 0000000..c966161 --- /dev/null +++ b/diplomacy/web/src/gui/maps/common/convoy.js @@ -0,0 +1,103 @@ +// ============================================================================== +// Copyright (C) 2019 - Philip Paquette, Steven Bocco +// +// This program is free software: you can redistribute it and/or modify it under +// the terms of the GNU Affero General Public License as published by the Free +// Software Foundation, either version 3 of the License, or (at your option) any +// later version. +// +// This program is distributed in the hope that it will be useful, but WITHOUT +// ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS +// FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more +// details. +// +// You should have received a copy of the GNU Affero General Public License along +// with this program. If not, see . +// ============================================================================== +import React from "react"; +import {ARMY, centerSymbolAroundUnit, coloredStrokeWidth, getUnitCenter} from "./common"; +import {EquilateralTriangle} from "./equilateralTriangle"; +import PropTypes from "prop-types"; + +export class Convoy extends React.Component { + render() { + const Coordinates = this.props.coordinates; + const SymbolSizes = this.props.symbolSizes; + const Colors = this.props.colors; + const loc = this.props.loc; + const src_loc = this.props.srcLoc; + const dest_loc = this.props.dstLoc; + + const symbol = 'ConvoyTriangle'; + let [symbol_loc_x, symbol_loc_y] = centerSymbolAroundUnit(Coordinates, SymbolSizes, src_loc, false, symbol); + const symbol_height = parseFloat(SymbolSizes[symbol].height); + const symbol_width = parseFloat(SymbolSizes[symbol].width); + const triangle = new EquilateralTriangle( + parseFloat(symbol_loc_x) + symbol_width / 2, + parseFloat(symbol_loc_y), + parseFloat(symbol_loc_x) + symbol_width, + parseFloat(symbol_loc_y) + symbol_height, + parseFloat(symbol_loc_x), + parseFloat(symbol_loc_y) + symbol_height + ); + symbol_loc_y = '' + (parseFloat(symbol_loc_y) - symbol_height / 6); + const [loc_x, loc_y] = getUnitCenter(Coordinates, SymbolSizes, loc, false); + const [src_loc_x, src_loc_y] = getUnitCenter(Coordinates, SymbolSizes, src_loc, false); + let [dest_loc_x, dest_loc_y] = getUnitCenter(Coordinates, SymbolSizes, dest_loc, false); + + const [src_loc_x_1, src_loc_y_1] = triangle.intersection(loc_x, loc_y); + const [src_loc_x_2, src_loc_y_2] = triangle.intersection(dest_loc_x, dest_loc_y); + + const dest_delta_x = dest_loc_x - src_loc_x; + const dest_delta_y = dest_loc_y - src_loc_y; + const dest_vector_length = Math.sqrt(dest_delta_x * dest_delta_x + dest_delta_y * dest_delta_y); + const delta_dec = parseFloat(SymbolSizes[ARMY].width) / 2 + 2 * coloredStrokeWidth(SymbolSizes); + dest_loc_x = '' + Math.round((parseFloat(src_loc_x) + (dest_vector_length - delta_dec) / dest_vector_length * dest_delta_x) * 100.) / 100.; + dest_loc_y = '' + Math.round((parseFloat(src_loc_y) + (dest_vector_length - delta_dec) / dest_vector_length * dest_delta_y) * 100.) / 100.; + + return ( + + + + + + + + ); + } +} + +Convoy.propTypes = { + loc: PropTypes.string.isRequired, + srcLoc: PropTypes.string.isRequired, + dstLoc: PropTypes.string.isRequired, + powerName: PropTypes.string.isRequired, + coordinates: PropTypes.object.isRequired, + symbolSizes: PropTypes.object.isRequired, + colors: PropTypes.object.isRequired +}; -- cgit v1.2.3