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/convert_svg_maps_to_react.sh | 5 + diplomacy/web/src/gui/components/fancyBox.js | 4 +- diplomacy/web/src/gui/forms/join_form.jsx | 4 +- diplomacy/web/src/gui/maps/ancmed/SvgAncMed.css | 19 + diplomacy/web/src/gui/maps/ancmed/SvgAncMed.js | 20 + .../web/src/gui/maps/ancmed/SvgAncMedMetadata.js | 21 + diplomacy/web/src/gui/maps/common/build.js | 57 + diplomacy/web/src/gui/maps/common/common.js | 83 ++ diplomacy/web/src/gui/maps/common/convoy.js | 103 ++ diplomacy/web/src/gui/maps/common/disband.js | 47 + .../web/src/gui/maps/common/equilateralTriangle.js | 122 ++ diplomacy/web/src/gui/maps/common/hold.js | 47 + diplomacy/web/src/gui/maps/common/move.js | 67 + diplomacy/web/src/gui/maps/common/supportHold.js | 72 ++ diplomacy/web/src/gui/maps/common/supportMove.js | 61 + diplomacy/web/src/gui/maps/common/unit.js | 50 + diplomacy/web/src/gui/maps/modern/SvgModern.css | 19 + diplomacy/web/src/gui/maps/modern/SvgModern.js | 20 + .../web/src/gui/maps/modern/SvgModernMetadata.js | 21 + diplomacy/web/src/gui/maps/pure/SvgPure.css | 19 + diplomacy/web/src/gui/maps/pure/SvgPure.js | 20 + diplomacy/web/src/gui/maps/pure/SvgPureMetadata.js | 21 + .../web/src/gui/maps/standard/SvgStandard.css | 125 +- diplomacy/web/src/gui/maps/standard/SvgStandard.js | 761 +----------- .../web/src/gui/maps/standard/SvgStandardExtra.js | 1279 -------------------- .../src/gui/maps/standard/SvgStandardMetadata.js | 21 + diplomacy/web/src/gui/maps/standard/build.js | 53 - diplomacy/web/src/gui/maps/standard/common.js | 75 -- diplomacy/web/src/gui/maps/standard/convoy.js | 98 -- diplomacy/web/src/gui/maps/standard/disband.js | 51 - diplomacy/web/src/gui/maps/standard/hold.js | 45 - diplomacy/web/src/gui/maps/standard/move.js | 69 -- .../web/src/gui/maps/standard/supplyCenter.js | 40 - diplomacy/web/src/gui/maps/standard/supportHold.js | 73 -- diplomacy/web/src/gui/maps/standard/supportMove.js | 57 - diplomacy/web/src/gui/maps/standard/unit.js | 45 - diplomacy/web/src/gui/pages/content_connection.jsx | 2 + diplomacy/web/src/gui/pages/content_game.jsx | 140 ++- diplomacy/web/src/gui/pages/content_games.jsx | 2 +- diplomacy/web/src/gui/utils/inline_game_view.jsx | 9 +- diplomacy/web/src/gui/utils/map_data.js | 24 +- .../wizards/gameCreation/gameCreationWizard.css | 31 + .../gui/wizards/gameCreation/gameCreationWizard.js | 1 + .../web/src/gui/wizards/gameCreation/mapList.js | 6 + .../src/gui/wizards/gameCreation/panelChooseMap.js | 9 +- .../gui/wizards/gameCreation/panelChoosePlayers.js | 50 +- .../gui/wizards/gameCreation/panelChoosePower.js | 50 +- diplomacy/web/src/index.css | 28 +- diplomacy/web/svg_to_react.py | 640 ++++++++-- 49 files changed, 1731 insertions(+), 2955 deletions(-) create mode 100755 diplomacy/web/convert_svg_maps_to_react.sh create mode 100644 diplomacy/web/src/gui/maps/ancmed/SvgAncMed.css create mode 100644 diplomacy/web/src/gui/maps/ancmed/SvgAncMed.js create mode 100644 diplomacy/web/src/gui/maps/ancmed/SvgAncMedMetadata.js create mode 100644 diplomacy/web/src/gui/maps/common/build.js create mode 100644 diplomacy/web/src/gui/maps/common/common.js create mode 100644 diplomacy/web/src/gui/maps/common/convoy.js create mode 100644 diplomacy/web/src/gui/maps/common/disband.js create mode 100644 diplomacy/web/src/gui/maps/common/equilateralTriangle.js create mode 100644 diplomacy/web/src/gui/maps/common/hold.js create mode 100644 diplomacy/web/src/gui/maps/common/move.js create mode 100644 diplomacy/web/src/gui/maps/common/supportHold.js create mode 100644 diplomacy/web/src/gui/maps/common/supportMove.js create mode 100644 diplomacy/web/src/gui/maps/common/unit.js create mode 100644 diplomacy/web/src/gui/maps/modern/SvgModern.css create mode 100644 diplomacy/web/src/gui/maps/modern/SvgModern.js create mode 100644 diplomacy/web/src/gui/maps/modern/SvgModernMetadata.js create mode 100644 diplomacy/web/src/gui/maps/pure/SvgPure.css create mode 100644 diplomacy/web/src/gui/maps/pure/SvgPure.js create mode 100644 diplomacy/web/src/gui/maps/pure/SvgPureMetadata.js delete mode 100644 diplomacy/web/src/gui/maps/standard/SvgStandardExtra.js create mode 100644 diplomacy/web/src/gui/maps/standard/SvgStandardMetadata.js delete mode 100644 diplomacy/web/src/gui/maps/standard/build.js delete mode 100644 diplomacy/web/src/gui/maps/standard/common.js delete mode 100644 diplomacy/web/src/gui/maps/standard/convoy.js delete mode 100644 diplomacy/web/src/gui/maps/standard/disband.js delete mode 100644 diplomacy/web/src/gui/maps/standard/hold.js delete mode 100644 diplomacy/web/src/gui/maps/standard/move.js delete mode 100644 diplomacy/web/src/gui/maps/standard/supplyCenter.js delete mode 100644 diplomacy/web/src/gui/maps/standard/supportHold.js delete mode 100644 diplomacy/web/src/gui/maps/standard/supportMove.js delete mode 100644 diplomacy/web/src/gui/maps/standard/unit.js create mode 100644 diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.css (limited to 'diplomacy/web') diff --git a/diplomacy/web/convert_svg_maps_to_react.sh b/diplomacy/web/convert_svg_maps_to_react.sh new file mode 100755 index 0000000..9d6c1d4 --- /dev/null +++ b/diplomacy/web/convert_svg_maps_to_react.sh @@ -0,0 +1,5 @@ +#!/usr/bin/env bash +python svg_to_react.py --input src/diplomacy/maps/svg/standard.svg --output src/gui/maps/standard/ --name SvgStandard +python svg_to_react.py --input src/diplomacy/maps/svg/ancmed.svg --output src/gui/maps/ancmed/ --name SvgAncMed +python svg_to_react.py --input src/diplomacy/maps/svg/modern.svg --output src/gui/maps/modern/ --name SvgModern +python svg_to_react.py --input src/diplomacy/maps/svg/pure.svg --output src/gui/maps/pure/ --name SvgPure diff --git a/diplomacy/web/src/gui/components/fancyBox.js b/diplomacy/web/src/gui/components/fancyBox.js index 1e8c07c..e3ceac8 100644 --- a/diplomacy/web/src/gui/components/fancyBox.js +++ b/diplomacy/web/src/gui/components/fancyBox.js @@ -31,8 +31,8 @@ export class FancyBox extends React.Component { + ); } else { @@ -43,7 +46,7 @@ export class PanelChooseMap extends React.Component { const defaultVariant = variants[0]; mapEntries.push(
-
+
-
- {(() => { - const choice = []; - for (let i = 0; i < this.props.nbPowers; ++i) { - choice.push( - - ); - } - return choice; - })()} +
+
+
+ {(() => { + const choice = []; + for (let i = 0; i < this.props.nbPowers; ++i) { + choice.push( + + ); + } + return choice; + })()} +
+
-
- +
+
+ +
); diff --git a/diplomacy/web/src/gui/wizards/gameCreation/panelChoosePower.js b/diplomacy/web/src/gui/wizards/gameCreation/panelChoosePower.js index 1463805..8258acd 100644 --- a/diplomacy/web/src/gui/wizards/gameCreation/panelChoosePower.js +++ b/diplomacy/web/src/gui/wizards/gameCreation/panelChoosePower.js @@ -41,29 +41,35 @@ export class PanelChoosePower extends React.Component {
-
- {(() => { - const choice = []; - for (let i = 0; i < this.props.powers.length; ++i) { - choice.push( - - ); - } - return choice; - })()} +
+
+
+ {(() => { + const choice = []; + for (let i = 0; i < this.props.powers.length; ++i) { + choice.push( + + ); + } + return choice; + })()} +
+
-
- +
+
+ +
); diff --git a/diplomacy/web/src/index.css b/diplomacy/web/src/index.css index 77b5512..664dbb7 100644 --- a/diplomacy/web/src/index.css +++ b/diplomacy/web/src/index.css @@ -246,16 +246,6 @@ span.power-name { content: ', '; } -.fancy-wrapper { - position: fixed; - left: 0; - top: 0; - width: 100%; - height: 100%; - padding-top: 10%; - background-color: rgba(100, 100, 110, 0.5); -} - .fancy-box { border: 1px solid silver; position: relative; @@ -267,12 +257,7 @@ span.power-name { border-bottom: 1px solid silver; } -.fancy-box .fancy-button { -} - .fancy-box .fancy-content { - padding-top: 10px; - padding-bottom: 10px; background-color: white; } @@ -436,20 +421,13 @@ button.collapsed .roll { display: none; } -.panel-choose-map .map-list { - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: 0; - overflow: auto; - border: 1px solid gray; -} - .inline { white-space: nowrap; } +.visibilityHidden { + visibility: hidden; +} /** Page login. **/ /** Page games. **/ diff --git a/diplomacy/web/svg_to_react.py b/diplomacy/web/svg_to_react.py index 12a68b6..dafe4d3 100644 --- a/diplomacy/web/svg_to_react.py +++ b/diplomacy/web/svg_to_react.py @@ -19,11 +19,122 @@ """ import argparse import os -import sys +import re from xml.dom import minidom, Node import ujson as json +LICENSE_TEXT = """/** +============================================================================== +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 . +============================================================================== +**/""" + +TAG_ORDERDRAWING = 'jdipNS:ORDERDRAWING' +TAG_POWERCOLORS = 'jdipNS:POWERCOLORS' +TAG_POWERCOLOR = 'jdipNS:POWERCOLOR' +TAG_SYMBOLSIZE = 'jdipNS:SYMBOLSIZE' +TAG_PROVINCE_DATA = 'jdipNS:PROVINCE_DATA' +TAG_PROVINCE = 'jdipNS:PROVINCE' +TAG_UNIT = 'jdipNS:UNIT' +TAG_DISLODGED_UNIT = 'jdipNS:DISLODGED_UNIT' +TAG_SUPPLY_CENTER = 'jdipNS:SUPPLY_CENTER' + +SELECTOR_REGEX = re.compile(r'([\r\n][ \t]*)([^{\r\n]+){') +LINES_REGEX = re.compile(r'[\r\n]+') +SPACES_REGEX = re.compile(r'[\t ]+') +STRING_REGEX = re.compile(r'[`\'"] {0,1}\+ {0,1}[`\'"]') + + +def prepend_css_selectors(prefix, css_text): + """ Prepend all CSS selector with given prefix (e.g. ID selector) followed by a space. + :param prefix: prefix to prepend + :param css_text: CSS text to parse + :rtype: str + """ + def repl(match): + return '%s%s %s{' % (match.group(1), prefix, match.group(2)) + + return SELECTOR_REGEX.sub(repl, css_text) + + +class ExtractedData: + """ Helper class to store extra data collected while parsing SVG file. Properties: + - name: class name of parsed SVG component + - extra: data parsed from invalid tags found in SVG content + - style_lines: string lines parsed from