Compare commits
No commits in common. "7fd054a72821cad62be4a869e2b0a3e9034543a5" and "402e76ee6e27296b69a603d0d755bba27ce69943" have entirely different histories.
7fd054a728
...
402e76ee6e
@ -19,13 +19,13 @@ RUN apt-get update -qq -y && \
|
||||
mv chromedriver /usr/local/bin/
|
||||
|
||||
WORKDIR /usr/src/app
|
||||
COPY package*.json ./
|
||||
COPY package*.json .
|
||||
|
||||
ENV CHROMEDRIVER_SKIP_DOWNLOAD=true
|
||||
|
||||
RUN npm install --omit=dev
|
||||
RUN npm install chromedriver
|
||||
|
||||
COPY ./* ./
|
||||
COPY . .
|
||||
|
||||
CMD [ "npm", "start" ]
|
||||
|
||||
31
README.md
31
README.md
@ -1,30 +1,22 @@
|
||||
## Live
|
||||
## Build the Docker image
|
||||
|
||||
<a href="http://apps.webdevcat.me/btroops/" target="_blank">Demo</a>
|
||||
docker build -t btroops .
|
||||
|
||||
## Run
|
||||
## Install packages
|
||||
|
||||
1. Build the Docker image
|
||||
./npm install
|
||||
|
||||
docker build -t btroops .
|
||||
## Start the dev server
|
||||
|
||||
2. Install `node` packages
|
||||
./npm run start
|
||||
|
||||
./npm install
|
||||
Visit `localhost:8080` to view.
|
||||
|
||||
3. Start development server
|
||||
|
||||
./npm run start
|
||||
|
||||
4. Visit `localhost:8080` with browser to view app.
|
||||
|
||||
## Integration tests
|
||||
|
||||
### Run
|
||||
## Run integration tests
|
||||
|
||||
./npm run test:integ
|
||||
|
||||
### Debug
|
||||
### Debugging an integration test
|
||||
|
||||
1. Put `debugger` in whatever test you want to debug.
|
||||
|
||||
@ -102,5 +94,6 @@ debug>
|
||||
|
||||
### References
|
||||
|
||||
- [https://nodejs.org/en/learn/getting-started/debugging](https://nodejs.org/en/learn/getting-started/debugging)
|
||||
- [https://nodejs.org/api/debugger.html](https://nodejs.org/api/debugger.html)
|
||||
https://nodejs.org/en/learn/getting-started/debugging
|
||||
|
||||
https://nodejs.org/api/debugger.html
|
||||
|
||||
13
package-lock.json
generated
13
package-lock.json
generated
@ -5,7 +5,7 @@
|
||||
"packages": {
|
||||
"": {
|
||||
"dependencies": {
|
||||
"pan-zoom": "git://git.webdevcat.me/pan-zoom.git#v0.3.0"
|
||||
"pan-zoom": "file:../pan-zoom"
|
||||
},
|
||||
"devDependencies": {
|
||||
"esbuild": "^0.20.2",
|
||||
@ -16,6 +16,13 @@
|
||||
"selenium-webdriver": "^4.19.0"
|
||||
}
|
||||
},
|
||||
"../pan-zoom": {
|
||||
"version": "0.2.0",
|
||||
"devDependencies": {
|
||||
"esbuild": "^0.20.2",
|
||||
"esbuild-server": "^0.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ampproject/remapping": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
|
||||
@ -3819,8 +3826,8 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/pan-zoom": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "git://git.webdevcat.me/pan-zoom.git#79964ead9181d69c5463777fcd2b227a14d30d32"
|
||||
"resolved": "../pan-zoom",
|
||||
"link": true
|
||||
},
|
||||
"node_modules/parent-module": {
|
||||
"version": "1.0.1",
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
{
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"pan-zoom": "file:../pan-zoom"
|
||||
},
|
||||
"devDependencies": {
|
||||
"esbuild": "^0.20.2",
|
||||
"esbuild-server": "^0.3.0",
|
||||
@ -14,8 +17,5 @@
|
||||
"test:integ": "node ./node_modules/.bin/jest --detectOpenHandles --config jest.config.integ.cjs",
|
||||
"test:integ:debug": "NODE_INSPECT_RESUME_ON_START=1 node inspect ./node_modules/jest/bin/jest.js --config jest.config.integ.cjs --runInBand",
|
||||
"test": "jest"
|
||||
},
|
||||
"dependencies": {
|
||||
"pan-zoom": "git://git.webdevcat.me/pan-zoom.git#v0.3.0"
|
||||
}
|
||||
}
|
||||
|
||||
17167
public/assets/images/10-simplex_t03.svg
Normal file
17167
public/assets/images/10-simplex_t03.svg
Normal file
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 1.0 MiB |
17
public/assets/images/assets.inkscape.svg
Normal file
17
public/assets/images/assets.inkscape.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.9 MiB |
1
public/assets/images/contour-lines.svg
Normal file
1
public/assets/images/contour-lines.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.6 MiB |
BIN
public/assets/images/counter-sheet-fallen-mech-template.png
Normal file
BIN
public/assets/images/counter-sheet-fallen-mech-template.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 274 KiB |
BIN
public/assets/images/counter-sheet-mech-template.png
Normal file
BIN
public/assets/images/counter-sheet-mech-template.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 504 KiB |
BIN
public/assets/images/counter-sheet-vehicle-template.png
Normal file
BIN
public/assets/images/counter-sheet-vehicle-template.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 376 KiB |
@ -49,16 +49,6 @@
|
||||
</g>
|
||||
</defs>
|
||||
|
||||
<!--Semi-Automatic Firearms-->
|
||||
|
||||
<g id="pistol" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto" />
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="rifle" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
@ -68,62 +58,6 @@
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="riflegl" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto" />
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="laserpistol" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto"/>
|
||||
<use href="#laser"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="laserrifle" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<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">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="-2" y1="-1" x2="-2" y2="3"/>
|
||||
<line x1="2" y1="-1" x2="2" y2="3"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--Automatic Firearms-->
|
||||
|
||||
<g id="blazer" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto"/>
|
||||
<use href="#laser"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="autopistol" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto" />
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="smg" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
@ -133,134 +67,15 @@
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="smggl" style="r: inherit;" class="weapon-symbol">
|
||||
<g id="blazer" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto"/>
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="4.5"/>
|
||||
<line x1="-2" y1="4.5" x2="2" y2="4.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--Hand-to-Hand Weapons-->
|
||||
|
||||
<g id="nonlethalhand" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="-2" y1="-4.25" x2="2" y2="-4.25"/>
|
||||
<line x1="0" y1="-4.25" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="lethalhand" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--Area-Effect Weapons-->
|
||||
|
||||
<g id="srm" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<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"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="hsrm" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="0" y1="-4.75" x2="0" y2="5"/>
|
||||
<use href="#auto" />
|
||||
<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 id="law" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="0" y1="-4.75" x2="0" y2="3"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
<polyline points="-2,-2.5 0,-4 2,-2.5"/>
|
||||
<polyline points="-2,4.5 0,3 2,4.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="grenade" 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.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="gl" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto" />
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="autogl" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto" />
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="lrrifle" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="-2" y1="1" x2="2" y2="1"/>
|
||||
<line x1="-2" y1="-1" x2="-2" y2="3"/>
|
||||
<line x1="2" y1="-1" x2="2" y2="3"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
<use href="#laser"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="satchelcharge" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<rect x="-1" y="-3.25" width="2" height="2" />
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="flamer" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<path d="M -1,5 V -3.5 c 0,-1.5 2,-1.5 2,0"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="hflamer" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<line x1="-2" y1="1" x2="2" y2="1"/>
|
||||
<path d="M -1,5 V -3.5 c 0,-1.5 2,-1.5 2,0"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="inferno" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<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 -2,4.75 V -2.5 C -2,-5.5 2,-5.5 2,-2.5 V 4.75"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--Support Weapons-->
|
||||
|
||||
<g id="lmg" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
@ -271,33 +86,12 @@
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="mmg" style="r: inherit;" class="weapon-symbol">
|
||||
<g id="srm" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto" />
|
||||
<line x1="-2" y1="4.5" x2="2" y2="4.5"/>
|
||||
<line x1="0" y1="-4.5" x2="0" y2="4.5"/>
|
||||
<polyline points="-2,-3.25 0,-4.75 2,-3.25"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="hmg" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto" />
|
||||
<line x1="-2" y1="4.5" x2="2" y2="4.5"/>
|
||||
<line x1="0" y1="-4.5" x2="0" y2="4.5"/>
|
||||
<polyline points="-2,-3.25 0,-4.75 2,-3.25"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="splaser" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<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="1" x2="2" y2="1"/>
|
||||
<polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 0,4.5"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.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"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
@ -311,14 +105,23 @@
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="mpppc" style="r: inherit;" class="weapon-symbol">
|
||||
<g id="smggl" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
<circle cx="-1.5" cy="-2" style="fill: white;" r="0.25" />
|
||||
<circle cx="1.5" cy="-2" style="fill: white;" r="0.25" />
|
||||
<line x1="-2" y1="4.5" x2="2" y2="4.5"/>
|
||||
<use href="#auto"/>
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="4.5"/>
|
||||
<line x1="-2" y1="4.5" x2="2" y2="4.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="riflegl" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#semi-auto" />
|
||||
<circle cy="-2.25" r="1"/>
|
||||
<line x1="0" y1="-5" x2="0" y2="5"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 13 KiB |
BIN
public/assets/images/logo-davion.png
Normal file
BIN
public/assets/images/logo-davion.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
public/assets/images/logo-liao.png
Normal file
BIN
public/assets/images/logo-liao.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
301
public/assets/images/map4-saved.svg
Normal file
301
public/assets/images/map4-saved.svg
Normal file
@ -0,0 +1,301 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-60.619998931884766 -115 147.22000122070312 245">
|
||||
<link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/radial.css" type="text/css" />
|
||||
<link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/map.css" type="text/css" />
|
||||
|
||||
<defs>
|
||||
<polygon id="hex" points="0,10 8.66,5 8.66,-5 0,-10 -8.66,-5 -8.66,5"/>
|
||||
|
||||
<line id="ast-line" x1="-1.2" y1="0" x2="1.2" y2="0"/>
|
||||
|
||||
<pattern id="asterisk" viewBox="-8.66 -15 17.32 30" width="17.32" height="30" patternUnits="userSpaceOnUse">
|
||||
<use href="#ast-line"/>
|
||||
<use href="#ast-line" transform="rotate(60)"/>
|
||||
<use href="#ast-line" transform="rotate(-60)"/>
|
||||
|
||||
<use x="-8.66" y="-15" href="#ast-line"/>
|
||||
<use x="-8.66" y="-15" transform="rotate(60 -8.66 -15)" href="#ast-line"/>
|
||||
|
||||
<use x="8.66" y="-15" href="#ast-line"/>
|
||||
<use x="8.66" y="-15" transform="rotate(-60 8.66 -15)" href="#ast-line"/>
|
||||
|
||||
<use x="-8.66" y="15" href="#ast-line"/>
|
||||
<use x="-8.66" y="15" transform="rotate(-60 -8.66 15)" href="#ast-line"/>
|
||||
|
||||
<use x="8.66" y="15" href="#ast-line"/>
|
||||
<use x="8.66" y="15" transform="rotate(60 8.66 15)" href="#ast-line"/>
|
||||
</pattern>
|
||||
|
||||
<image id="counter-prone" href="counter_prone.jpg" width="10"/>
|
||||
<image id="counter-grenade" href="counter_grenade.jpg" width="10"/>
|
||||
|
||||
<g id="building1" class="building">
|
||||
<g class="footprint">
|
||||
<g data-q="0" data-r="0" data-s="0" data-left="1" data-top="3" data-right="2" data-bottom="4" data-offset="left"/>
|
||||
<g data-q="0" data-r="0" data-s="0" data-left="1" data-top="3" data-right="4" data-bottom="4" data-offset="left"/>
|
||||
</g>
|
||||
|
||||
<g class="structure">
|
||||
<path id="building1-floor" class="floor" d="M -30.309999,-52.5 H 38.97 l 0,119.999999 H -30.31 Z"/>
|
||||
<path id="building1-outer-wall" class="outer-wall" d="M 38.969998,-7.500001 21.65,-7.5 V 7.4999997 L 12.989997,7.5 m 0,30 25.980001,0 M 12.989997,67.5 v -60 l -17.319997,0 0,-30.0000007 M -4.330003,67.5 v -45 H -30.31 m 0,-74.999999 L 38.97,-52.5 38.969999,67.499999 -30.31,67.5 Z"/>
|
||||
<path id="building1-inner-wall" class="inner-wall" d="M 38.969998,-7.500001 21.65,-7.5 V 7.4999997 L 12.989997,7.5 m 0,30 25.980001,0 M 12.989997,67.5 v -60 l -17.319997,0 0,-30.0000007 M -4.330003,67.5 v -45 H -30.31 m 0,-74.999999 L 38.97,-52.5 38.969999,67.499999 -30.31,67.5 Z"/>
|
||||
<path id="building1-door-edges" class="door-edges" d="m 12.99,52.5 0,-15 M -4.33,45.000003 v -15 M 12.990002,30 l 0,-15"/>
|
||||
<path id="building1-doors" class="doors" d="m 12.99,48.169997 0,-6.34 M -4.33,40.67 v -6.34 m 17.320002,-8.66 0,-6.34"/>
|
||||
<path id="building1-exit-edges" class="exits door-edges" d="M 0,-52.5 H 17.32 M -30.31,8.66 V -8.66"/>
|
||||
<path id="building1-exits" class="doors exits" d="M 4.3300002,-52.5 H 12.99 m -43.3,56.8300023 v -8.660003"/>
|
||||
<path id="building1-windows" class="windows" d="m 32.501739,67.499994 -13.043478,0 m -49.768256,-8.478265 0,-13.043478 m 0,-69.456522 0,-13.043479"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<polygon id="desk" points="-1.5,-7 4.5,-7 4.5,7 -1.5,7 -2.5,6 -2.5,3 -4.5,3 -4.5,-3 -2.5,-3 -2.5,-6"/>
|
||||
<rect id="couch" x="-4.25" y="-8" width="8.5" height="16"/>
|
||||
<rect id="bed" x="-5" y="-9" width="10" height="18"/>
|
||||
<rect id="cabinet" x="-2.5" y="-4.75" width="5" height="9.5"/>
|
||||
|
||||
<g id="mapsheet" class="mapsheet">
|
||||
<g class="building1" data-q="1" data-r="-2" data-s="1">
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<circle id="counter-base" style="r: inherit;" cx="0" cy="0"/>
|
||||
|
||||
<g style="r: inherit;" id="number-1">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<text style="fill: var(--text-fill); transform: translateY(var(--translateY))">1</text>
|
||||
</g>
|
||||
|
||||
<g id="auto">
|
||||
<line x1="-2" y1="0" x2="2" y2="0"/>
|
||||
<line x1="-2" y1="1" x2="2" y2="1"/>
|
||||
<line x1="-2" y1="2" x2="2" y2="2"/>
|
||||
</g>
|
||||
|
||||
<g id="blazer" style="r: inherit;" class="weapon-symbol">
|
||||
<use style="r: inherit;" href="#counter-base"/>
|
||||
<g style="stroke: white; stroke-width: 0.5px; fill: none;">
|
||||
<use href="#auto"/>
|
||||
<polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 -3,3, 3,4 0,4.5 0,5"/>
|
||||
<polyline points="-2,-3.5 0,-5 2,-3.5"/>
|
||||
</g>
|
||||
</g>
|
||||
</defs>
|
||||
|
||||
<g class="gameboard" data-view-elevation="0" style="transform: matrix(0.703125, 0, 0, 0.703125, 1.70767, 5.86088);">
|
||||
<rect id="background" style="transform: matrix(1, 0, 0, 1, 0, 0);" x="-60.619998931884766" y="-115" width="147.22000122070312" height="245"/>
|
||||
<g class="buildings">
|
||||
<g class="mapsheet">
|
||||
<g class="building building1" transform="translate(0, -30)">
|
||||
<use href="#building1-floor" class="floor elevation-0 elevation-1"/>
|
||||
<use href="#building1-outer-wall" class="outer-wall elevation-0"/>
|
||||
<use href="#building1-inner-wall" class="inner-wall elevation-0"/>
|
||||
<use href="#building1-door-edges" class="door-edges elevation-0"/>
|
||||
<use href="#building1-doors" class="doors elevation-0"/>
|
||||
<use href="#building1-exit-edges" class="exits door-edges elevation-0"/>
|
||||
<use href="#building1-exits" class="doors exits elevation-0"/>
|
||||
<use href="#building1-windows" class="windows elevation-0"/>
|
||||
|
||||
<g class="furniture elevation-0">
|
||||
<use href="#couch" transform="rotate(90,10.34,-27.66)"/>
|
||||
<use href="#bed" transform="translate(-17.32,45)"/>
|
||||
<use href="#bed" transform="translate(25.98,56)"/>
|
||||
<use href="#cabinet" transform="rotate(90,29.575,-7.925)"/>
|
||||
<use href="#cabinet" transform="rotate(90,24.24,1.74)"/>
|
||||
<use href="#cabinet" transform="translate(10.98,-5.25)"/>
|
||||
<use href="#cabinet" transform="rotate(90,-8.245,-2.7450001)"/>
|
||||
<use href="#cabinet" transform="rotate(90,11.865878,19.740878)"/>
|
||||
<use href="#cabinet" transform="translate(32.81,22.5)"/>
|
||||
<use href="#cabinet" transform="rotate(90,-43.385,20.115)"/>
|
||||
</g>
|
||||
<text class="elevation" x="34" y="56">1</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<rect id="dots" fill="url(#asterisk)" x="-60.619998931884766" y="-115" width="147.22000122070312" height="245"/>
|
||||
|
||||
<g id="firing-arcs">
|
||||
<g id="shapes"/>
|
||||
<g id="lines"/>
|
||||
</g>
|
||||
|
||||
<g class="grid">
|
||||
<g class="mapsheets" data-width="8" data-height="8">
|
||||
<g>
|
||||
<use class="mapsheet" href="#mapsheet"/>
|
||||
</g>
|
||||
</g>
|
||||
<g class="mapsheet">
|
||||
<g class="building building1">
|
||||
<g class="elevation-0">
|
||||
<g data-q="1" data-r="-2" data-s="1" data-t="0" transform="translate(0, -30)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-2" data-s="0" data-t="0" transform="translate(-17.32, -30)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-2" data-s="2" data-t="0" transform="translate(17.32, -30)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-3" data-s="1" data-t="0" transform="translate(-8.66, -45)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-1" data-s="1" data-t="0" transform="translate(8.66, -15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-1" data-s="0" data-t="0" transform="translate(-8.66, -15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-3" data-s="2" data-t="0" transform="translate(8.66, -45)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-3" data-s="0" data-t="0" transform="translate(-25.98, -45)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-1" data-s="-1" data-t="0" transform="translate(-25.98, -15)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-2" data-s="3" data-t="0" transform="translate(34.64, -30)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-1" data-s="2" data-t="0" transform="translate(25.98, -15)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-3" data-s="3" data-t="0" transform="translate(25.98, -45)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-4" data-s="1" data-t="0" transform="translate(-17.32, -60)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-4" data-s="2" data-t="0" transform="translate(0, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="0" data-s="1" data-t="0" transform="translate(17.32, 0)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="0" data-s="0" data-t="0" transform="translate(0, 0)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="0" data-s="-1" data-t="0" transform="translate(-17.32, 0)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-4" data-s="3" data-t="0" transform="translate(17.32, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="0" data-s="2" data-t="0" transform="translate(34.64, 0)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-4" data-s="4" data-t="0" transform="translate(34.64, -60)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-5" data-s="1" data-t="0" transform="translate(-25.98, -75)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-5" data-s="2" data-t="0" transform="translate(-8.66, -75)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-5" data-s="3" data-t="0" transform="translate(8.66, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="1" data-s="1" data-t="0" transform="translate(25.98, 15)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="1" data-s="0" data-t="0" transform="translate(8.66, 15)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="1" data-s="-1" data-t="0" transform="translate(-8.66, 15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="1" data-s="-2" data-t="0" transform="translate(-25.98, 15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-5" data-s="4" data-t="0" transform="translate(25.98, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="2" data-s="1" data-t="0" transform="translate(34.64, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="2" data-s="0" data-t="0" transform="translate(17.32, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="2" data-s="-1" data-t="0" transform="translate(0, 30)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="2" data-s="-2" data-t="0" transform="translate(-17.32, 30)"><use href="#hex"/></g>
|
||||
</g>
|
||||
<g class="elevation-1">
|
||||
<g data-q="1" data-r="-2" data-s="1" data-t="1" transform="translate(0, -30)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-2" data-s="0" data-t="1" transform="translate(-17.32, -30)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-2" data-s="2" data-t="1" transform="translate(17.32, -30)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-3" data-s="1" data-t="1" transform="translate(-8.66, -45)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-1" data-s="1" data-t="1" transform="translate(8.66, -15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-1" data-s="0" data-t="1" transform="translate(-8.66, -15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-3" data-s="2" data-t="1" transform="translate(8.66, -45)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-3" data-s="0" data-t="1" transform="translate(-25.98, -45)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-1" data-s="-1" data-t="1" transform="translate(-25.98, -15)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-2" data-s="3" data-t="1" transform="translate(34.64, -30)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-1" data-s="2" data-t="1" transform="translate(25.98, -15)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-3" data-s="3" data-t="1" transform="translate(25.98, -45)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-4" data-s="1" data-t="1" transform="translate(-17.32, -60)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-4" data-s="2" data-t="1" transform="translate(0, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="0" data-s="1" data-t="1" transform="translate(17.32, 0)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="0" data-s="0" data-t="1" transform="translate(0, 0)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="0" data-s="-1" data-t="1" transform="translate(-17.32, 0)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-4" data-s="3" data-t="1" transform="translate(17.32, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="0" data-s="2" data-t="1" transform="translate(34.64, 0)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-4" data-s="4" data-t="1" transform="translate(34.64, -60)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-5" data-s="1" data-t="1" transform="translate(-25.98, -75)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-5" data-s="2" data-t="1" transform="translate(-8.66, -75)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-5" data-s="3" data-t="1" transform="translate(8.66, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="1" data-s="1" data-t="1" transform="translate(25.98, 15)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="1" data-s="0" data-t="1" transform="translate(8.66, 15)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="1" data-s="-1" data-t="1" transform="translate(-8.66, 15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="1" data-s="-2" data-t="1" transform="translate(-25.98, 15)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-5" data-s="4" data-t="1" transform="translate(25.98, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="2" data-s="1" data-t="1" transform="translate(34.64, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="2" data-s="0" data-t="1" transform="translate(17.32, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="2" data-s="-1" data-t="1" transform="translate(0, 30)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="2" data-s="-2" data-t="1" transform="translate(-17.32, 30)"><use href="#hex"/></g>
|
||||
</g>
|
||||
</g>
|
||||
<g class="elevation-0">
|
||||
<g data-q="2" data-r="0" data-s="-2" data-t="0" transform="translate(-34.64, 0)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="0" data-s="-3" data-t="0" transform="translate(-51.96, 0)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-1" data-s="-2" data-t="0" transform="translate(-43.3, -15)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="1" data-s="-3" data-t="0" transform="translate(-43.3, 15)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-2" data-s="-1" data-t="0" transform="translate(-34.64, -30)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="2" data-s="-3" data-t="0" transform="translate(-34.64, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="0" data-s="3" data-t="0" transform="translate(51.96, 0)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="1" data-s="2" data-t="0" transform="translate(43.3, 15)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="-1" data-s="3" data-t="0" transform="translate(43.3, -15)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="3" data-s="0" data-t="0" transform="translate(25.98, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="3" data-s="-1" data-t="0" transform="translate(8.66, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="3" data-s="-2" data-t="0" transform="translate(-8.66, 45)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="3" data-s="-3" data-t="0" transform="translate(-25.98, 45)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-2" data-s="-2" data-t="0" transform="translate(-51.96, -30)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="2" data-s="-4" data-t="0" transform="translate(-51.96, 30)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-3" data-s="-1" data-t="0" transform="translate(-43.3, -45)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="3" data-s="-4" data-t="0" transform="translate(-43.3, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="0" data-s="4" data-t="0" transform="translate(69.28, 0)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="1" data-s="3" data-t="0" transform="translate(60.620000000000005, 15)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="-1" data-s="4" data-t="0" transform="translate(60.620000000000005, -15)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="2" data-s="2" data-t="0" transform="translate(51.96, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="-2" data-s="4" data-t="0" transform="translate(51.96, -30)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="3" data-s="1" data-t="0" transform="translate(43.3, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-3" data-s="4" data-t="0" transform="translate(43.3, -45)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-4" data-s="0" data-t="0" transform="translate(-34.64, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="4" data-s="0" data-t="0" transform="translate(34.64, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="4" data-s="-1" data-t="0" transform="translate(17.32, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="4" data-s="-2" data-t="0" transform="translate(0, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="4" data-s="-3" data-t="0" transform="translate(-17.32, 60)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="4" data-s="-4" data-t="0" transform="translate(-34.64, 60)"><use href="#hex"/></g>
|
||||
<g data-q="5" data-r="-4" data-s="-1" data-t="0" transform="translate(-51.96, -60)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="4" data-s="-5" data-t="0" transform="translate(-51.96, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="1" data-s="4" data-t="0" transform="translate(77.94, 15)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="-1" data-s="5" data-t="0" transform="translate(77.94, -15)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="2" data-s="3" data-t="0" transform="translate(69.28, 30)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="-2" data-s="5" data-t="0" transform="translate(69.28, -30)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="3" data-s="2" data-t="0" transform="translate(60.620000000000005, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="-3" data-s="5" data-t="0" transform="translate(60.620000000000005, -45)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="4" data-s="1" data-t="0" transform="translate(51.96, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-4" data-s="5" data-t="0" transform="translate(51.96, -60)"><use href="#hex"/></g>
|
||||
<g data-q="5" data-r="-5" data-s="0" data-t="0" transform="translate(-43.3, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="5" data-s="0" data-t="0" transform="translate(43.3, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="5" data-s="-1" data-t="0" transform="translate(25.98, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="5" data-s="-2" data-t="0" transform="translate(8.66, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="5" data-s="-3" data-t="0" transform="translate(-8.66, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="5" data-s="-4" data-t="0" transform="translate(-25.98, 75)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="5" data-s="-5" data-t="0" transform="translate(-43.3, 75)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-5" data-s="5" data-t="0" transform="translate(43.3, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="3" data-s="3" data-t="0" transform="translate(77.94, 45)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="-3" data-s="6" data-t="0" transform="translate(77.94, -45)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="4" data-s="2" data-t="0" transform="translate(69.28, 60)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="-4" data-s="6" data-t="0" transform="translate(69.28, -60)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="5" data-s="1" data-t="0" transform="translate(60.620000000000005, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-5" data-s="6" data-t="0" transform="translate(60.620000000000005, -75)"><use href="#hex"/></g>
|
||||
<g data-q="6" data-r="-6" data-s="0" data-t="0" transform="translate(-51.96, -90)"><use href="#hex"/></g>
|
||||
<g data-q="5" data-r="-6" data-s="1" data-t="0" transform="translate(-34.64, -90)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-6" data-s="2" data-t="0" transform="translate(-17.32, -90)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-6" data-s="3" data-t="0" transform="translate(0, -90)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-6" data-s="4" data-t="0" transform="translate(17.32, -90)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-6" data-s="5" data-t="0" transform="translate(34.64, -90)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="6" data-s="0" data-t="0" transform="translate(51.96, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="6" data-s="-1" data-t="0" transform="translate(34.64, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="6" data-s="-2" data-t="0" transform="translate(17.32, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="6" data-s="-3" data-t="0" transform="translate(0, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="6" data-s="-4" data-t="0" transform="translate(-17.32, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="6" data-s="-5" data-t="0" transform="translate(-34.64, 90)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="6" data-s="-6" data-t="0" transform="translate(-51.96, 90)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-6" data-s="6" data-t="0" transform="translate(51.96, -90)"><use href="#hex"/></g>
|
||||
<g data-q="-7" data-r="5" data-s="2" data-t="0" transform="translate(77.94, 75)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="-5" data-s="7" data-t="0" transform="translate(77.94, -75)"><use href="#hex"/></g>
|
||||
<g data-q="-7" data-r="6" data-s="1" data-t="0" transform="translate(69.28, 90)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-6" data-s="7" data-t="0" transform="translate(69.28, -90)"><use href="#hex"/></g>
|
||||
<g data-q="6" data-r="-7" data-s="1" data-t="0" transform="translate(-43.3, -105)"><use href="#hex"/></g>
|
||||
<g data-q="5" data-r="-7" data-s="2" data-t="0" transform="translate(-25.98, -105)"><use href="#hex"/></g>
|
||||
<g data-q="4" data-r="-7" data-s="3" data-t="0" transform="translate(-8.66, -105)"><use href="#hex"/></g>
|
||||
<g data-q="3" data-r="-7" data-s="4" data-t="0" transform="translate(8.66, -105)"><use href="#hex"/></g>
|
||||
<g data-q="2" data-r="-7" data-s="5" data-t="0" transform="translate(25.98, -105)"><use href="#hex"/></g>
|
||||
<g data-q="1" data-r="-7" data-s="6" data-t="0" transform="translate(43.3, -105)"><use href="#hex"/></g>
|
||||
<g data-q="-7" data-r="7" data-s="0" data-t="0" transform="translate(60.620000000000005, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="7" data-s="-1" data-t="0" transform="translate(43.3, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="7" data-s="-2" data-t="0" transform="translate(25.98, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="7" data-s="-3" data-t="0" transform="translate(8.66, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="7" data-s="-4" data-t="0" transform="translate(-8.66, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="7" data-s="-5" data-t="0" transform="translate(-25.98, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="7" data-s="-6" data-t="0" transform="translate(-43.3, 105)"><use href="#hex"/></g>
|
||||
<g data-q="0" data-r="-7" data-s="7" data-t="0" transform="translate(60.620000000000005, -105)"><use href="#hex"/></g>
|
||||
<g data-q="-8" data-r="7" data-s="1" data-t="0" transform="translate(77.94, 105)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="-7" data-s="8" data-t="0" transform="translate(77.94, -105)"><use href="#hex"/></g>
|
||||
<g data-q="-8" data-r="8" data-s="0" data-t="0" transform="translate(69.28, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-7" data-r="8" data-s="-1" data-t="0" transform="translate(51.96, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-6" data-r="8" data-s="-2" data-t="0" transform="translate(34.64, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-5" data-r="8" data-s="-3" data-t="0" transform="translate(17.32, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-4" data-r="8" data-s="-4" data-t="0" transform="translate(0, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-3" data-r="8" data-s="-5" data-t="0" transform="translate(-17.32, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-2" data-r="8" data-s="-6" data-t="0" transform="translate(-34.64, 120)"><use href="#hex"/></g>
|
||||
<g data-q="-1" data-r="8" data-s="-7" data-t="0" transform="translate(-51.96, 120)"><use href="#hex"/></g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<script href="../../radial.js"/>
|
||||
<script href="../../map.js"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 25 KiB |
@ -1,6 +1,23 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
|
||||
<defs>
|
||||
<g id="building1" class="building">
|
||||
<g class="footprint">
|
||||
<g data-q="0" data-r="0" data-s="0" data-left="1" data-top="3" data-right="2" data-bottom="4" data-offset="left" />
|
||||
</g>
|
||||
|
||||
<g class="structure">
|
||||
<path id="building1-floor" class="floor" d="M -30.309999,-52.5 H 38.97 l 0,119.999999 H -30.31 Z" />
|
||||
<path id="building1-outer-wall" class="outer-wall" d="M 38.969998,-7.500001 21.65,-7.5 V 7.4999997 L 12.989997,7.5 m 0,30 25.980001,0 M 12.989997,67.5 v -60 l -17.319997,0 0,-30.0000007 M -4.330003,67.5 v -45 H -30.31 m 0,-74.999999 L 38.97,-52.5 38.969999,67.499999 -30.31,67.5 Z" />
|
||||
<path id="building1-inner-wall" class="inner-wall" d="M 38.969998,-7.500001 21.65,-7.5 V 7.4999997 L 12.989997,7.5 m 0,30 25.980001,0 M 12.989997,67.5 v -60 l -17.319997,0 0,-30.0000007 M -4.330003,67.5 v -45 H -30.31 m 0,-74.999999 L 38.97,-52.5 38.969999,67.499999 -30.31,67.5 Z" />
|
||||
<path id="building1-door-edges" class="door-edges" d="m 12.99,52.5 0,-15 M -4.33,45.000003 v -15 M 12.990002,30 l 0,-15" />
|
||||
<path id="building1-doors" class="doors" d="m 12.99,48.169997 0,-6.34 M -4.33,40.67 v -6.34 m 17.320002,-8.66 0,-6.34" />
|
||||
<path id="building1-exit-edges" class="exits door-edges" d="M 0,-52.5 H 17.32 M -30.31,8.66 V -8.66" />
|
||||
<path id="building1-exits" class="doors exits" d="M 4.3300002,-52.5 H 12.99 m -43.3,56.8300023 v -8.660003" />
|
||||
<path id="building1-windows" class="windows" d="m 32.501739,67.499994 -13.043478,0 m -49.768256,-8.478265 0,-13.043478 m 0,-69.456522 0,-13.043479" />
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<polygon id="desk" points="-1.5,-7 4.5,-7 4.5,7 -1.5,7 -2.5,6 -2.5,3 -4.5,3 -4.5,-3 -2.5,-3 -2.5,-6" />
|
||||
<rect id="couch" x="-4.25" y="-8" width="8.5" height="16" />
|
||||
<rect id="bed" x="-5" y="-9" width="10" height="18" />
|
||||
@ -8,7 +25,7 @@
|
||||
|
||||
<g id="mapsheet" class="mapsheet">
|
||||
<g class="building1" data-q="3" data-r="-5" data-s="2">
|
||||
<use href="mapsheets.svg#building1"/>
|
||||
<use href="#building1"/>
|
||||
<g class="furniture">
|
||||
<use href="#couch" transform="rotate(90,10.34,-27.66)" />
|
||||
<use href="#bed" transform="translate(-17.32,45)" />
|
||||
@ -39,7 +56,7 @@
|
||||
<g class="start-locations" data-attacker-name="liao" data-defender-name="davion">
|
||||
<g data-edge="north" style="--i: -2">
|
||||
<g class="counter" data-allegiance="attacker" data-number="1" data-squad="1" data-armor="4">
|
||||
<use class="primary-weapon" href="counters.svg#pistol"/>
|
||||
<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-1"/>
|
||||
</g>
|
||||
|
||||
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 7.2 KiB |
BIN
public/assets/images/mech_template.png
Normal file
BIN
public/assets/images/mech_template.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
5
public/assets/images/pendle.svg
Normal file
5
public/assets/images/pendle.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.1 MiB |
1478
public/assets/images/save.svg
Normal file
1478
public/assets/images/save.svg
Normal file
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 54 KiB |
BIN
public/assets/images/scans/countersheet1.jpg
Normal file
BIN
public/assets/images/scans/countersheet1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 378 KiB |
BIN
public/assets/images/scans/countersheet2.jpg
Normal file
BIN
public/assets/images/scans/countersheet2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 366 KiB |
BIN
public/assets/images/scans/countersheet3.jpg
Normal file
BIN
public/assets/images/scans/countersheet3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 402 KiB |
BIN
public/assets/images/scans/countersheet4.jpg
Normal file
BIN
public/assets/images/scans/countersheet4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 368 KiB |
BIN
public/assets/images/scans/map1.jpg
Normal file
BIN
public/assets/images/scans/map1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 227 KiB |
BIN
public/assets/images/scans/map2.jpg
Normal file
BIN
public/assets/images/scans/map2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 271 KiB |
BIN
public/assets/images/scans/map3.jpg
Normal file
BIN
public/assets/images/scans/map3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 273 KiB |
BIN
public/assets/images/scans/map4.jpg
Normal file
BIN
public/assets/images/scans/map4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 183 KiB |
@ -2,9 +2,7 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>BTroops - Infantry Combat, Solo Basic</title>
|
||||
<title>Infantry Combat Solo Basic</title>
|
||||
<link rel="stylesheet" href="assets/css/style.css">
|
||||
</head>
|
||||
|
||||
|
||||
@ -10,4 +10,4 @@ else
|
||||
port=8080
|
||||
fi
|
||||
|
||||
docker run --rm --init -it -v $PWD:/usr/src/app -u $user_id:$user_id -p $port:$port $image $@
|
||||
docker run --rm --init -it -v $PWD:/usr/src/app -v $PWD/../pan-zoom:/usr/src/pan-zoom -u $user_id:$user_id -p $port:$port $image $@
|
||||
|
||||
16
src/index.js
16
src/index.js
@ -1,10 +1,10 @@
|
||||
import { withRestore as panzoom } from 'pan-zoom';
|
||||
import * as gameboard from './modules/gameboard';
|
||||
import * as recordSheet from './modules/record_sheet';
|
||||
import * as mapSelectDialog from './modules/map_select_dialog';
|
||||
import { Observable } from './modules/observable';
|
||||
import { requestResource, build } from './modules/scenario';
|
||||
import { scenarios } from './modules/scenarios';
|
||||
import * as panzoom from './modules/pan-zoom.js';
|
||||
import * as gameboard from './modules/gameboard.js';
|
||||
import * as recordSheet from './modules/record_sheet.js';
|
||||
import * as mapSelectDialog from './modules/map_select_dialog.js';
|
||||
import { Observable } from './modules/observable.js';
|
||||
import { requestResource, build } from './modules/scenario.js';
|
||||
import { scenarios } from './modules/scenarios.js';
|
||||
|
||||
globalThis.svgns = 'http://www.w3.org/2000/svg';
|
||||
|
||||
@ -79,7 +79,7 @@ async function buildScenario(req) {
|
||||
mapResourceEl.style.opacity = 1;
|
||||
mapPlaceholder.style.opacity = 0;
|
||||
|
||||
panzoom.start(template, '.gameboard');
|
||||
panzoom.start(template);
|
||||
gameboard.start(template);
|
||||
|
||||
// recordSheet.start(svg.querySelector('.start-locations'), gameboard.getUnits());
|
||||
|
||||
@ -7,9 +7,9 @@ function dataSelector({ dataset: { allegiance, number, squad }}) {
|
||||
return `[data-number="${number}"][data-allegiance="${allegiance}"][data-squad="${squad}"]`;
|
||||
}
|
||||
|
||||
//function traceSelector(counter) {
|
||||
// return `polyline.move-trace${dataSelector(counter)}`;
|
||||
//}
|
||||
function traceSelector(counter) {
|
||||
return `polyline.move-trace${dataSelector(counter)}`;
|
||||
}
|
||||
|
||||
function getCellPosition(cell) {
|
||||
const [x, y] = cell.getAttributeNS(null, 'transform').match(/-?\d+\.?\d*/g);
|
||||
@ -17,44 +17,44 @@ function getCellPosition(cell) {
|
||||
return { x, y };
|
||||
}
|
||||
|
||||
//function getClones(svg, counter) {
|
||||
// return svg.querySelectorAll(`.counter.clone${dataSelector(counter)}`);
|
||||
//}
|
||||
function getClones(svg, counter) {
|
||||
return svg.querySelectorAll(`.counter.clone${dataSelector(counter)}`);
|
||||
}
|
||||
|
||||
//function addMoveToHistory(selected) {
|
||||
// const clone = selected.cloneNode(true);
|
||||
// clone.classList.remove(selectedClass);
|
||||
// clone.classList.add('clone');
|
||||
// selected.parentElement.appendChild(clone);
|
||||
//
|
||||
// return clone;
|
||||
//}
|
||||
function addMoveToHistory(selected) {
|
||||
const clone = selected.cloneNode(true);
|
||||
clone.classList.remove(selectedClass);
|
||||
clone.classList.add('clone');
|
||||
selected.parentElement.appendChild(clone);
|
||||
|
||||
//function updatePlacement(cell, selected, clone) {
|
||||
// const { q, r, s, t } = clone.parentElement.dataset;
|
||||
//
|
||||
// selected.dataset.previous = [q, r, s, t];
|
||||
// placeIn(cell, selected);
|
||||
//
|
||||
// Array.from(selected.children).forEach(n => {
|
||||
// if (n.classList.contains('removed')) {
|
||||
// n.remove();
|
||||
// } else if ('preexisting' in n.dataset) {
|
||||
// delete n.dataset.preexisting;
|
||||
// }
|
||||
// });
|
||||
//}
|
||||
return clone;
|
||||
}
|
||||
|
||||
//function createTrace(previous, current, selected) {
|
||||
// const trace = document.createElementNS(svgns, 'polyline');
|
||||
//
|
||||
// trace.dataset.number = selected.dataset.number;
|
||||
// trace.dataset.allegiance = selected.dataset.allegiance;
|
||||
// trace.classList.add('move-trace');
|
||||
// trace.setAttributeNS(null, 'points', `${previous.x},${previous.y} ${current.x},${current.y}`);
|
||||
//
|
||||
// return trace;
|
||||
//}
|
||||
function updatePlacement(cell, selected, clone) {
|
||||
const { q, r, s, t } = clone.parentElement.dataset;
|
||||
|
||||
selected.dataset.previous = [q, r, s, t];
|
||||
placeIn(cell, selected);
|
||||
|
||||
Array.from(selected.children).forEach(n => {
|
||||
if (n.classList.contains('removed')) {
|
||||
n.remove();
|
||||
} else if ('preexisting' in n.dataset) {
|
||||
delete n.dataset.preexisting;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function createTrace(previous, current, selected) {
|
||||
const trace = document.createElementNS(svgns, 'polyline');
|
||||
|
||||
trace.dataset.number = selected.dataset.number;
|
||||
trace.dataset.allegiance = selected.dataset.allegiance;
|
||||
trace.classList.add('move-trace');
|
||||
trace.setAttributeNS(null, 'points', `${previous.x},${previous.y} ${current.x},${current.y}`);
|
||||
|
||||
return trace;
|
||||
}
|
||||
|
||||
function placeIn(location, target) {
|
||||
location.querySelector('use[href="#hex"]').after(target);
|
||||
@ -87,30 +87,29 @@ export function createCounter(selected, weapon = 'rifle') {
|
||||
return g;
|
||||
}
|
||||
|
||||
//export function handleTrace(svg, selected, clone, current) {
|
||||
// let trace = getTrace(svg, selected);
|
||||
//
|
||||
// if (!trace) {
|
||||
// trace = createTrace(getCellPosition(clone.parentElement), current, selected);
|
||||
// svg.querySelector('.grid').before(trace);
|
||||
// } else {
|
||||
// const points = `${trace.getAttribute('points')} ${current.x},${current.y}`;
|
||||
// trace.setAttributeNS(null, 'points', points);
|
||||
// }
|
||||
//}
|
||||
export function handleTrace(svg, selected, clone, current) {
|
||||
let trace = getTrace(svg, selected);
|
||||
|
||||
if (!trace) {
|
||||
trace = createTrace(getCellPosition(clone.parentElement), current, selected);
|
||||
svg.querySelector('.grid').before(trace);
|
||||
} else {
|
||||
const points = `${trace.getAttribute('points')} ${current.x},${current.y}`;
|
||||
trace.setAttributeNS(null, 'points', points);
|
||||
}
|
||||
}
|
||||
|
||||
export function getAllCounters(container) {
|
||||
return container.querySelectorAll('g.counter[data-allegiance][data-number]');
|
||||
}
|
||||
|
||||
export function getCounter(svg, selected) {
|
||||
//return svg.querySelector(`.counter${dataSelector(selected)}:not(.clone)`);
|
||||
return svg.querySelector(`.counter${dataSelector(selected)}`);
|
||||
return svg.querySelector(`.counter${dataSelector(selected)}:not(.clone)`);
|
||||
}
|
||||
|
||||
//export function getTrace(svg, counter) {
|
||||
// return svg.querySelector(traceSelector(counter));
|
||||
//}
|
||||
export function getTrace(svg, counter) {
|
||||
return svg.querySelector(traceSelector(counter));
|
||||
}
|
||||
|
||||
export function place(svg, selected, cell) {
|
||||
//console.log(selected.parentElement);
|
||||
@ -135,23 +134,23 @@ export function place(svg, selected, cell) {
|
||||
//}
|
||||
}
|
||||
|
||||
//export function removeClones(svg, counter) {
|
||||
// getClones(svg, counter).forEach(c => c.remove());
|
||||
//}
|
||||
export function removeClones(svg, counter) {
|
||||
getClones(svg, counter).forEach(c => c.remove());
|
||||
}
|
||||
|
||||
//export function endMove(svg, counter) {
|
||||
//Array.from(counter.children).forEach(n => {
|
||||
// if (n.classList.contains('removed')) {
|
||||
// n.remove();
|
||||
// } else {
|
||||
// n.dataset.preexisting = '';
|
||||
// }
|
||||
//});
|
||||
export function endMove(svg, counter) {
|
||||
Array.from(counter.children).forEach(n => {
|
||||
if (n.classList.contains('removed')) {
|
||||
n.remove();
|
||||
} else {
|
||||
n.dataset.preexisting = '';
|
||||
}
|
||||
});
|
||||
|
||||
//svg.querySelector(traceSelector(counter))?.remove();
|
||||
//delete counter.dataset.previous;
|
||||
//removeClones(svg, counter);
|
||||
//}
|
||||
svg.querySelector(traceSelector(counter))?.remove();
|
||||
delete counter.dataset.previous;
|
||||
removeClones(svg, counter);
|
||||
}
|
||||
|
||||
export function getSelectedClass() {
|
||||
return selectedClass;
|
||||
|
||||
@ -46,6 +46,17 @@ function isMechTemplate(el) {
|
||||
return el && el.getAttribute('class') === 'mech-template';
|
||||
}
|
||||
|
||||
function isClone(counter) {
|
||||
const isClone = counter.classList.contains('clone'),
|
||||
{ allegiance: clAl, number: clNum } = counter.dataset;
|
||||
|
||||
return {
|
||||
of: function ({ dataset: { allegiance, number }}) {
|
||||
return isClone && clAl == allegiance && clNum == number;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function getCellPosition(cell) {
|
||||
const [x, y] = cell.getAttributeNS(null, 'transform').match(/-?\d+\.?\d*/g);
|
||||
|
||||
@ -116,6 +127,57 @@ function drawSightLine(sourceCell, targetCell) {
|
||||
svg.querySelector('.gameboard').appendChild(line);
|
||||
}
|
||||
|
||||
function moveBackOneStepInHistory(counter) {
|
||||
const trace = soldier.getTrace(svg, counter);
|
||||
|
||||
counter.remove();
|
||||
counter = getCounterAtGridIndex(...counter.dataset.previous.split(','));
|
||||
counter.classList.remove('clone');
|
||||
counter.classList.add(soldier.getSelectedClass());
|
||||
|
||||
if (!('previous' in counter.dataset)) {
|
||||
trace.remove();
|
||||
} else {
|
||||
const points = trace.getAttribute('points').split(' ');
|
||||
points.pop();
|
||||
trace.setAttributeNS(null, 'points', points.join(' '));
|
||||
}
|
||||
|
||||
return counter;
|
||||
}
|
||||
|
||||
function clearMoveHistory(clone, counter) {
|
||||
clone.classList.remove('clone');
|
||||
clone.classList.add(soldier.getSelectedClass());
|
||||
counter.remove();
|
||||
counter = clone;
|
||||
soldier.removeClones(svg, counter);
|
||||
soldier.getTrace(svg, counter).remove();
|
||||
|
||||
return counter;
|
||||
}
|
||||
|
||||
function deleteClone(occupant, counter, cell) {
|
||||
const index = getGridIndex(occupant),
|
||||
trace = soldier.getTrace(svg, counter),
|
||||
pos = getCellPosition(cell),
|
||||
points = trace.getAttribute('points').split(' ').filter(p => p != `${pos.x},${pos.y}`).join(' ');;
|
||||
|
||||
let current = counter;
|
||||
trace.setAttributeNS(null, 'points', points);
|
||||
|
||||
while (current.dataset.previous != `${index.q},${index.r},${index.s},${index.t}`) {
|
||||
current = getCounterAtGridIndex(...current.dataset.previous.split(','));
|
||||
}
|
||||
|
||||
current.dataset.previous = occupant.dataset.previous;
|
||||
occupant.remove();
|
||||
}
|
||||
|
||||
function hasPreviousMoveInHistory(counter) {
|
||||
return 'previous' in counter.dataset;
|
||||
}
|
||||
|
||||
function selectOffBoard() {
|
||||
Observable.notify('select', this, { revealRecord: true });
|
||||
}
|
||||
@ -167,6 +229,7 @@ function endMove() {
|
||||
const selected = getSelected();
|
||||
|
||||
if (selected) {
|
||||
soldier.endMove(svg, selected);
|
||||
deselect();
|
||||
}
|
||||
}
|
||||
@ -179,6 +242,8 @@ export function start(el) {
|
||||
// For when the pointer leaves the window
|
||||
document.querySelector('object').addEventListener('pointerout', e => {
|
||||
if (clearHexDialog.open) return;
|
||||
//console.log('object pointerout');
|
||||
//console.log('Left map... CLEARING HOVERS');
|
||||
svg.querySelectorAll('.hover').forEach(el => el.classList.remove('hover'));
|
||||
|
||||
[...frontmost.children].forEach(child => {
|
||||
@ -198,6 +263,7 @@ export function start(el) {
|
||||
|
||||
// Pointer moves outside the edge of the grid
|
||||
if (!targetCell) {
|
||||
//console.log('No target cell... CLEARING HOVERS');
|
||||
svg.querySelectorAll('.hover').forEach(el => el.classList.remove('hover'));
|
||||
|
||||
[...frontmost.children].forEach(child => {
|
||||
@ -218,6 +284,7 @@ export function start(el) {
|
||||
// 's contents that is in frontmost, whose parent cell is not already highlighted
|
||||
!(targetCell.classList.contains('frontmost') && frontmostStore.get(e.target.closest('.frontmost > *')).classList.contains('hover'))
|
||||
].every(e => e)) {
|
||||
//console.log('Target cell missing hover... CLEARING HOVERS AND ADDING TO TARGET CELL');
|
||||
svg.querySelectorAll('.hover').forEach(el => el.classList.remove('hover'));
|
||||
|
||||
if (placing[0]?.getAttributeNS(null, 'class') === 'mech-template') {
|
||||
@ -258,6 +325,8 @@ export function start(el) {
|
||||
} else {
|
||||
getActiveSightLine(svg) && clearSightLine();
|
||||
}
|
||||
|
||||
//console.log('frontmost contents', frontmost.children);
|
||||
});
|
||||
|
||||
grid.addEventListener('click', clickHandler);
|
||||
@ -325,6 +394,53 @@ export function start(el) {
|
||||
const selected = getSelected();
|
||||
}
|
||||
|
||||
// debug //
|
||||
// Add a trooper counter
|
||||
//const defender = { dataset: { allegiance: 'defender', number: 1, squad: 2 }};
|
||||
//const cell2 = getCell(-5, 10, -5, 0);
|
||||
//frontmost.setAttributeNS(null, 'transform', cell2.getAttributeNS(null, 'transform'));
|
||||
//const trooper2 = soldier.createCounter(defender, 'gl');
|
||||
//frontmostStore.set(trooper2, cell2);
|
||||
//frontmost.append(trooper2);
|
||||
//cell2.classList.add('hover');
|
||||
//
|
||||
|
||||
//const trooper1 = soldier.createCounter({ dataset: { allegiance: 'attacker', number: 1, squad: 1 }}, 'blazer');
|
||||
//soldier.place(svg, trooper1, getCell(-3, 9, -6, 0));
|
||||
//
|
||||
//soldier.place(
|
||||
// svg,
|
||||
// soldier.createCounter({ dataset: { allegiance: 'defender', number: 1, squad: 1 }}, 'blazer'),
|
||||
// getCell(1, -8, 7, 0)
|
||||
//);
|
||||
|
||||
// Add some counters in an unoccupied cell
|
||||
//const countersCell = getCell(-1, 1, 0, 0);
|
||||
|
||||
//const counter = document.createElementNS(svgns, 'use');
|
||||
//const name = 'grenade';
|
||||
//counter.setAttributeNS(null, 'href', `#counter-${name}`);
|
||||
//counter.classList.add(`counter-${name}`);
|
||||
//frontmostStore.set(counter, cell2);
|
||||
//frontmost.append(counter);
|
||||
//arrangeCounters(frontmost)
|
||||
|
||||
//counter.addEventListener('click', e => {
|
||||
// e.stopPropagation()
|
||||
// const container = counter.parentElement;
|
||||
// counter.remove()
|
||||
// arrangeCounters(container);
|
||||
//});
|
||||
|
||||
//setCounter('grenade');
|
||||
//setCounter('prone');
|
||||
//setCounter('1st-floor');
|
||||
//const e = new PointerEvent('click');
|
||||
//countersCell.dispatchEvent(e);
|
||||
//countersCell.dispatchEvent(e);
|
||||
//countersCell.dispatchEvent(e);
|
||||
///////////
|
||||
|
||||
Observable.subscribe('select', select);
|
||||
Observable.subscribe('endmove', endMove);
|
||||
Observable.subscribe('viewElevation', viewElevation);
|
||||
|
||||
33
src/modules/pan-zoom.js
Normal file
33
src/modules/pan-zoom.js
Normal file
@ -0,0 +1,33 @@
|
||||
import { pan, zoom } from 'pan-zoom';
|
||||
|
||||
const storageKey = 'pan-zoom';
|
||||
const zoomFactor = 0.25;
|
||||
|
||||
function restorePanZoomVal(el) {
|
||||
const storedPanZoomVal = localStorage.getItem(storageKey);
|
||||
|
||||
if (storedPanZoomVal) el.style.transform = storedPanZoomVal;
|
||||
}
|
||||
|
||||
function addEventListeners(svg, el) {
|
||||
svg.addEventListener('wheel', zoom(el, zoomFactor), { passive: false });
|
||||
svg.addEventListener('pointerdown', pan(el), { passive: false });
|
||||
}
|
||||
|
||||
function storePanZoomVal(transformMatrix) {
|
||||
localStorage.setItem(storageKey, transformMatrix);
|
||||
}
|
||||
|
||||
function observePanZoomChanges(el) {
|
||||
const observer = new MutationObserver(() => storePanZoomVal(el.style.transform));
|
||||
|
||||
observer.observe(el, { attributeFilter: ['style'] });
|
||||
}
|
||||
|
||||
export function start(svg) {
|
||||
const targetEl = svg.querySelector('.gameboard');
|
||||
|
||||
restorePanZoomVal(targetEl);
|
||||
addEventListeners(svg, targetEl);
|
||||
observePanZoomChanges(targetEl);
|
||||
}
|
||||
@ -49,121 +49,7 @@ const weapons = {
|
||||
damage: '4/2/1 L',
|
||||
shortRange: '1-10',
|
||||
longRange: '11-24'
|
||||
},
|
||||
pistol: {
|
||||
name: 'Pistol',
|
||||
damage: '3L',
|
||||
shortRange: '1-7',
|
||||
longRange: '8-20'
|
||||
},
|
||||
laserpistol: {
|
||||
name: 'Laser Pistol',
|
||||
damage: '4L',
|
||||
shortRange: '1-12',
|
||||
longRange: '13-30'
|
||||
},
|
||||
laserrifle: {
|
||||
name: 'Laser Rifle',
|
||||
damage: '5L',
|
||||
shortRange: '1-17',
|
||||
longRange: '18-105'
|
||||
},
|
||||
gyrojetrifle: {
|
||||
name: 'Gyrojet Rifle',
|
||||
damage: '6L',
|
||||
shortRange: '1-57',
|
||||
longRange: '58-180'
|
||||
},
|
||||
autopistol: {
|
||||
name: 'Auto Pistol',
|
||||
damage: '2L',
|
||||
shortRange: '1-7',
|
||||
longRange: '8-20'
|
||||
},
|
||||
law: {
|
||||
name: 'LAW',
|
||||
damage: '7/3/1 L',
|
||||
shortRange: '1-22',
|
||||
longRange: '23-80'
|
||||
},
|
||||
hsrm: {
|
||||
name: 'Heavy SRM',
|
||||
damage: '13/6/3/1 L',
|
||||
shortRange: '1-54',
|
||||
longRange: '55-96'
|
||||
},
|
||||
gl: {
|
||||
name: 'Grenade Launcher',
|
||||
damage: '4/2/1 L',
|
||||
shortRange: '1-10',
|
||||
longRange: '11-24'
|
||||
},
|
||||
autogl: {
|
||||
name: 'Auto Grenade Launcher',
|
||||
damage: '3/2/1 L',
|
||||
shortRange: '1-22',
|
||||
longRange: '23-50'
|
||||
},
|
||||
lrrifle: {
|
||||
name: 'Light Recoilless Rifle',
|
||||
damage: '4/2/1 L',
|
||||
shortRange: '1-36',
|
||||
longRange: '37-70'
|
||||
},
|
||||
satchelcharge: {
|
||||
name: 'Satchel Charge',
|
||||
damage: '10/5/2 L',
|
||||
shortRange: 'NA',
|
||||
longRange: 'NA'
|
||||
},
|
||||
flamer: {
|
||||
name: 'Flamer',
|
||||
damage: '2/1 L',
|
||||
shortRange: '1-6',
|
||||
longRange: '7-12'
|
||||
},
|
||||
hflamer: {
|
||||
name: 'Heavy Flamer',
|
||||
damage: '2/2/1 L',
|
||||
shortRange: '1-6',
|
||||
longRange: '7-12'
|
||||
},
|
||||
inferno: {
|
||||
name: 'Inferno',
|
||||
damage: '4/2/1 L',
|
||||
shortRange: '1-44',
|
||||
longRange: '45-108'
|
||||
},
|
||||
mmg: {
|
||||
name: 'Medium MG',
|
||||
damage: '6L',
|
||||
shortRange: '1-30',
|
||||
longRange: '31-84'
|
||||
},
|
||||
hmg: {
|
||||
name: 'Heavy MG',
|
||||
damage: '7L',
|
||||
shortRange: '1-36',
|
||||
longRange: '37-110'
|
||||
},
|
||||
splaser: {
|
||||
name: 'Semi-Portable Laser',
|
||||
damage: '11L',
|
||||
shortRange: '1-80',
|
||||
longRange: '81-240'
|
||||
},
|
||||
mpppc: {
|
||||
name: 'Man-Pack PPC',
|
||||
damage: '8L',
|
||||
shortRange: '1-50',
|
||||
longRange: '51-110'
|
||||
},
|
||||
grenade: {
|
||||
name: 'Grenade',
|
||||
damage: '6/3/1 L',
|
||||
shortRange: 'Special',
|
||||
longRange: 'Special'
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
function createIcon(number) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user