ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: ccm:48024506e0c2b5199bed81d90dfba26cb7f4a027
Branches Tags
ccm:trunk
...
compare: ccm:trunk
Branches Tags
ccm:trunk

3 Commits
48024506e0 ... trunk

Author SHA1 Message Date
Catalin Constantin Mititiuc
10f68a82e9 Add all weapon-type platoon examples 2025-08-28 11:53:30 -07:00
Catalin Constantin Mititiuc
8fa7958ba0 Complete military symbols and add a map 2025-08-28 10:45:28 -07:00
Catalin Constantin Mititiuc
f98df324ac WIP: toggle grid line vis 2025-07-25 15:04:01 -07:00
13 changed files with 1586 additions and 20 deletions
Expand all files Collapse all files

4
public/assets/css/map.css
View File

@@ -238,6 +238,10 @@ pattern use {
--y-step: calc((3 / 2) * var(--circumradius)); --y-step: calc((3 / 2) * var(--circumradius));
} }
g.start-locations {
display: none;
}
g[data-y], g.start-locations > g { g[data-y], g.start-locations > g {
--translateX: 0; --translateX: 0;
transform: translate(var(--translateX), calc(var(--y-step) * var(--i))); transform: translate(var(--translateX), calc(var(--y-step) * var(--i)));

99
public/assets/images/counters.svg
View File

@@ -1,6 +1,5 @@
<?xml version="1.0" standalone="no"?> <?xml version="1.0" standalone="no"?>
<svg viewBox="-6 -6 12 24" <svg viewBox="-6 -6 12 24" xmlns="http://www.w3.org/2000/svg">
xmlns="http://www.w3.org/2000/svg">
<defs> <defs>
<circle id="counter-base" style="r: inherit;" cx="0" cy="0" /> <circle id="counter-base" style="r: inherit;" cx="0" cy="0" />
@@ -34,18 +33,27 @@
</g> </g>
<g id="semi-auto"> <g id="semi-auto">
<line x1="-2" y1="0" x2="2" y2="0"/>
<line x1="-2" y1="1" x2="2" y2="1"/> <line x1="-2" y1="1" x2="2" y2="1"/>
<line x1="-2" y1="2" x2="2" y2="2"/>
</g> </g>
<g id="auto"> <g id="auto">
<line x1="-2" y1="0" x2="2" y2="0"/> <line x1="-2" y1="-0.5" x2="2" y2="-0.5"/>
<line x1="-2" y1="1" x2="2" y2="1"/> <line x1="-2" y1="0.5" x2="2" y2="0.5"/>
<line x1="-2" y1="2" x2="2" y2="2"/> <line x1="-2" y1="1.5" x2="2" y2="1.5"/>
</g> </g>
<g id="laser"> <g id="laser">
<polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 0,5"/> <polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2 -3,2.5 3,3.5 0,4 0,5"/>
</g>
<g id="nonlethalhand">
<line x1="-2" y1="-4.25" x2="2" y2="-4.25"/>
<line x1="0" y1="-4.25" x2="0" y2="5"/>
</g>
<g id="lethalhand" style="r: inherit;">
<line x1="0" y1="-5" x2="0" y2="5"/>
</g> </g>
</defs> </defs>
@@ -95,6 +103,16 @@
</g> </g>
</g> </g>
<g id="laserriflegl" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<circle cy="-2" r="1"/>
<use href="#semi-auto"/>
<use href="#laser"/>
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
</g>
</g>
<g id="gyrojetrifle" style="r: inherit;" class="weapon-symbol"> <g id="gyrojetrifle" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
@@ -145,28 +163,67 @@
<!--Hand-to-Hand Weapons--> <!--Hand-to-Hand Weapons-->
<g id="nonlethalhand" style="r: inherit;" class="weapon-symbol"> <g id="fist" style="r: inherit;">
<use style="r: inherit;" href="#counter-base"/>
</g>
<g id="blackjack" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="-2" y1="-4.25" x2="2" y2="-4.25"/> <use style="r: inherit;" href="#nonlethalhand"/>
<line x1="0" y1="-4.25" x2="0" y2="5"/>
</g> </g>
</g> </g>
<g id="lethalhand" style="r: inherit;" class="weapon-symbol"> <g id="stunstick" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none; stroke-linejoin: bevel">
<line x1="0" y1="-5" x2="0" y2="5"/> <use style="r: inherit;" href="#nonlethalhand"/>
<polyline points="-1.5,-2.5 1.5,-2.5 -1.5,0.5 1.5,0.5"/>
</g> </g>
</g> </g>
<g id="bayonetknife" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<use style="r: inherit;" href="#lethalhand"/>
</g>
</g>
<g id="club" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<use style="r: inherit;" href="#lethalhand"/>
</g>
</g>
<g id="neuralwhip" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<use style="r: inherit;" href="#lethalhand"/>
</g>
</g>
<g id="sword" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<use style="r: inherit;" href="#lethalhand"/>
</g>
</g>
<g id="vibroblade" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
<use style="r: inherit;" href="#lethalhand"/>
</g>
</g>
<!--Area-Effect Weapons--> <!--Area-Effect Weapons-->
<g id="srm" style="r: inherit;" class="weapon-symbol"> <g id="srm" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="0" y1="-4.75" x2="0" y2="5"/> <line x1="0" y1="-4.75" x2="0" y2="5"/>
<line x1="-2" y1="0.5" x2="2" y2="0.5"/>
<path d="M -2,4.75 V -2.5 C -2,-5.5 2,-5.5 2,-2.5 V 4.75"/> <path d="M -2,4.75 V -2.5 C -2,-5.5 2,-5.5 2,-2.5 V 4.75"/>
</g> </g>
</g> </g>
@@ -230,7 +287,8 @@
<g id="satchelcharge" style="r: inherit;" class="weapon-symbol"> <g id="satchelcharge" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<rect x="-1" y="-3.25" width="2" height="2" /> <line x1="-1" y1="-3.25" x2="1" y2="-1.25"/>
<line x1="1" y1="-3.25" x2="-1" y2="-1.25"/>
<line x1="0" y1="-5" x2="0" y2="5"/> <line x1="0" y1="-5" x2="0" y2="5"/>
</g> </g>
</g> </g>
@@ -245,7 +303,7 @@
<g id="hflamer" style="r: inherit;" class="weapon-symbol"> <g id="hflamer" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="-2" y1="1" x2="2" y2="1"/> <use href="#auto" />
<path d="M -1,5 V -3.5 c 0,-1.5 2,-1.5 2,0"/> <path d="M -1,5 V -3.5 c 0,-1.5 2,-1.5 2,0"/>
</g> </g>
</g> </g>
@@ -253,7 +311,6 @@
<g id="inferno" style="r: inherit;" class="weapon-symbol"> <g id="inferno" style="r: inherit;" class="weapon-symbol">
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="-2" y1="0.5" x2="2" y2="0.5"/>
<path d="M -1,5 V -2.5 c 0,-1.5 2,-1.5 2,0"/> <path d="M -1,5 V -2.5 c 0,-1.5 2,-1.5 2,0"/>
<path d="M -2,4.75 V -2.5 C -2,-5.5 2,-5.5 2,-2.5 V 4.75"/> <path d="M -2,4.75 V -2.5 C -2,-5.5 2,-5.5 2,-2.5 V 4.75"/>
</g> </g>
@@ -295,9 +352,10 @@
<use style="r: inherit;" href="#counter-base"/> <use style="r: inherit;" href="#counter-base"/>
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="-2" y1="4.5" x2="2" y2="4.5"/> <line x1="-2" y1="4.5" x2="2" y2="4.5"/>
<line x1="-2" y1="1" x2="2" y2="1"/> <polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1
<polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 0,4.5"/> 0,2 -3,2.5 3,3.5 0,4 0,4.5"/>
<polyline points="-2,-3.5 0,-5 2,-3.5"/> <polyline points="-2,-3.5 0,-5 2,-3.5"/>
</g> </g>
</g> </g>
@@ -306,7 +364,8 @@
<g style="stroke: white; stroke-width: 0.5px; fill: none;"> <g style="stroke: white; stroke-width: 0.5px; fill: none;">
<line x1="-2" y1="4.5" x2="2" y2="4.5"/> <line x1="-2" y1="4.5" x2="2" y2="4.5"/>
<use href="#auto"/> <use href="#auto"/>
<polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 0,4.5"/> <polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1
0,2 -3,2.5 3,3.5 0,4 0,4.5"/>
<polyline points="-2,-3.5 0,-5 2,-3.5"/> <polyline points="-2,-3.5 0,-5 2,-3.5"/>
</g> </g>
</g> </g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 21 KiB

224
public/assets/images/flamer-platoon-map.svg Normal file
View File

@@ -0,0 +1,224 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hflamer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autogl"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hflamer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autogl"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hflamer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autogl"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hflamer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#lmg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#lmg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

225
public/assets/images/machine-gun-platoon-map.svg Normal file
View File

@@ -0,0 +1,225 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autopistol"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autopistol"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autopistol"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autopistol"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hmg"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hmg"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

282
public/assets/images/map5.svg Normal file
View File

@@ -0,0 +1,282 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#pistol"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#rifle"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserpistol"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserriflegl"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#gyrojetrifle"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autopistol"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smggl"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#fist"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blackjack"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#stunstick"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#club"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#neuralwhip"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#bayonetknife"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#sword"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="8">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#vibroblade"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsrm"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#law"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#grenade"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#gl"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#autogl"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#lrrifle"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="8">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#satchelcharge"/>
<use class="troop-number" href="counters.svg#number-8"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="9">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#flamer"/>
<use class="troop-number" href="counters.svg#number-9"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="10">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hflamer"/>
<use class="troop-number" href="counters.svg#number-10"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="11">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#inferno"/>
<use class="troop-number" href="counters.svg#number-11"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
<g data-edge="north" data-y="5">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#lmg"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hmg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#splaser"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsplaser"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mpppc"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-5"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

224
public/assets/images/portable-laser-platoon-map.svg Normal file
View File

@@ -0,0 +1,224 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserriflegl"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#splaser"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserriflegl"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#splaser"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserriflegl"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#splaser"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsplaser"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#laserrifle"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#blazer"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsplaser"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.7 KiB

224
public/assets/images/rifle-platoon-map.svg Normal file
View File

@@ -0,0 +1,224 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#riflegl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#mmg"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

224
public/assets/images/srm-platoon-map.svg Normal file
View File

@@ -0,0 +1,224 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
<defs>
<g id="mapsheet" class="mapsheet"></g>
</defs>
<g class="gameboard">
<g class="grid">
<g class="mapsheets"></g>
</g>
<g style="display: unset;" class="start-locations" data-attacker-name="liao" data-defender-name="davion">
<g data-edge="north" data-y="1">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smggl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-1"/>
</g>
</g>
</g>
<g data-edge="north" data-y="2">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smggl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-2"/>
</g>
</g>
</g>
<g data-edge="north" data-y="3">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smggl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#srm"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-3"/>
</g>
</g>
</g>
<g data-edge="north" data-y="4">
<g data-x="1">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smggl"/>
<use class="troop-number" href="counters.svg#number-1"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="2">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-2"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="3">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsrm"/>
<use class="troop-number" href="counters.svg#number-3"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="4">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsrm"/>
<use class="troop-number" href="counters.svg#number-4"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="5">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#smg"/>
<use class="troop-number" href="counters.svg#number-5"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="6">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsrm"/>
<use class="troop-number" href="counters.svg#number-6"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
<g data-x="7">
<g class="counter" data-allegiance="attacker" data-number="1">
<use class="primary-weapon" href="counters.svg#hsrm"/>
<use class="troop-number" href="counters.svg#number-7"/>
<use class="squad-number" href="counters.svg#number-4"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

7
public/index.html
View File

@@ -119,6 +119,13 @@
</label> </label>
</div> </div>
<div class="opt-toggle">
<input type="checkbox" id="toggle-grid-line-vis" checked />
<label for="toggle-grid-line-vis" title="Toggle grid line visibility">
<span class="off">1</span><span class="on">0</span>
</label>
</div>
<div class="opt-toggle"> <div class="opt-toggle">
<input type="checkbox" id="toggle-grid-vis" checked /> <input type="checkbox" id="toggle-grid-vis" checked />
<label for="toggle-grid-vis" title="Toggle grid visibility"> <label for="toggle-grid-vis" title="Toggle grid visibility">

6
src/index.js
View File

@@ -277,6 +277,12 @@ document.querySelector('#toggle-grid-vis').addEventListener('change', function (
svg.querySelector('#dots').style.display = this.checked ? 'inline' : 'none'; svg.querySelector('#dots').style.display = this.checked ? 'inline' : 'none';
}); });
document.querySelector('#toggle-grid-line-vis').addEventListener('change', function () {
const doc = document.querySelector('object').contentDocument;
const currentOp = parseFloat(doc.styleSheets[1].cssRules[4].style.opacity);
doc.styleSheets[1].cssRules[4].style.opacity = currentOp > 0 ? 0 : 0.5;
});
document.querySelectorAll('.view-squad').forEach(b => b.addEventListener('click', e => { document.querySelectorAll('.view-squad').forEach(b => b.addEventListener('click', e => {
const currentSquad = b.closest('.records-header').querySelector('.squad-number text'); const currentSquad = b.closest('.records-header').querySelector('.squad-number text');
const currentSquadContainer = b.closest('[id$="-record"]').querySelector(`.records > .squad-${currentSquad.textContent}`); const currentSquadContainer = b.closest('[id$="-record"]').querySelector(`.records > .squad-${currentSquad.textContent}`);

54
src/modules/record_sheet.js
View File

@@ -68,6 +68,12 @@ const weapons = {
shortRange: '1-17', shortRange: '1-17',
longRange: '18-105' longRange: '18-105'
}, },
laserriflegl: {
name: 'Laser Rifle w/GL',
damage: '5L',
shortRange: '1-17',
longRange: '18-105'
},
gyrojetrifle: { gyrojetrifle: {
name: 'Gyrojet Rifle', name: 'Gyrojet Rifle',
damage: '6L', damage: '6L',
@@ -164,6 +170,54 @@ const weapons = {
shortRange: 'Special', shortRange: 'Special',
longRange: 'Special' longRange: 'Special'
}, },
fist: {
name: 'Fist',
damage: '(curr. MP/2)B',
shortRange: 'Adj.',
longRange: '-'
},
blackjack: {
name: 'Blackjack',
damage: '5B',
shortRange: 'Adjacent',
longRange: '-'
},
stunstick: {
name: 'Stun Stick',
damage: '8B',
shortRange: 'Adjacent',
longRange: '-'
},
neuralwhip: {
name: 'Neural Whip',
damage: '8B, 3L',
shortRange: 'Adjacent',
longRange: '-'
},
sword: {
name: 'Sword',
damage: '4L',
shortRange: 'Adjacent',
longRange: '-'
},
vibroblade: {
name: 'Vibro-Blade',
damage: '5L',
shortRange: 'Adjacent',
longRange: '-'
},
bayonetknife: {
name: 'Bayonet/Knife',
damage: '3L',
shortRange: 'Adjacent',
longRange: '-'
},
club: {
name: 'Club',
damage: '4B, 1L',
shortRange: 'Adjacent',
longRange: '-'
},
} }
function createIcon(number) { function createIcon(number) {

3
src/modules/scenario.js
View File

@@ -102,6 +102,9 @@ export async function build(svg, request) {
if (scenarioBuildings) if (scenarioBuildings)
svg.querySelector('.gameboard .buildings').replaceWith(svg.ownerDocument.importNode(scenarioBuildings, true)); svg.querySelector('.gameboard .buildings').replaceWith(svg.ownerDocument.importNode(scenarioBuildings, true));
if (startLocs)
grid.after(svg.ownerDocument.importNode(startLocs, true));
await loadScript(scenario, svg, 'radial') await loadScript(scenario, svg, 'radial')
return loadScript(scenario, svg, 'map'); return loadScript(scenario, svg, 'map');
} }

30
src/modules/scenarios.js
View File

@@ -2,6 +2,12 @@ import sideShow from './assets/images/scenario-side_show.svg';
import dragonHunting from './assets/images/scenario-dragon_hunting.svg'; import dragonHunting from './assets/images/scenario-dragon_hunting.svg';
import raceAgainstTime from './assets/images/scenario-race_against_time.svg'; import raceAgainstTime from './assets/images/scenario-race_against_time.svg';
import map4 from './assets/images/map4.svg'; import map4 from './assets/images/map4.svg';
import map5 from './assets/images/map5.svg';
import riflePlatoonMap from './assets/images/rifle-platoon-map.svg';
import machineGunPlatoonMap from './assets/images/machine-gun-platoon-map.svg';
import portableLaserPlatoonMap from './assets/images/portable-laser-platoon-map.svg';
import flamerPlatoonMap from './assets/images/flamer-platoon-map.svg';
import srmPlatoonMap from './assets/images/srm-platoon-map.svg';
import blankMap from './assets/images/blank-map.svg'; import blankMap from './assets/images/blank-map.svg';
export const scenarios = { export const scenarios = {
@@ -21,6 +27,30 @@ export const scenarios = {
hashed: map4, hashed: map4,
title: 'Test map' title: 'Test map'
}, },
'map5': {
hashed: map5,
title: 'Weapon symbols'
},
'riflePlatoonMap': {
hashed: riflePlatoonMap,
title: 'Rifle Platoon'
},
'machineGunPlatoonMap': {
hashed: machineGunPlatoonMap,
title: 'Machine Gun Platoon'
},
'portableLaserPlatoonMap': {
hashed: portableLaserPlatoonMap,
title: 'Portable Laser Platoon'
},
'flamerPlatoonMap': {
hashed: flamerPlatoonMap,
title: 'Flamer Platoon'
},
'srmPlatoonMap': {
hashed: srmPlatoonMap,
title: 'SRM Platoon'
},
'blank-map': { 'blank-map': {
hashed: blankMap, hashed: blankMap,
title: 'Blank map' title: 'Blank map'