mirror of
https://github.com/AlecM33/Werewolf.git
synced 2025-12-26 07:47:50 +01:00
beginning of large-scale redesign
This commit is contained in:
Alec
@@ -4,7 +4,7 @@ This app is still in active development. The latest deployment can be found <a h
|
||||
|
||||
A Werewolf utility that provides the tools to run games smoothly in the absence of a deck, or in any context in which traditional moderation is hindered.
|
||||
|
||||
This is a Javascript application running on a node express server. I am using the socket.io package as a wrapper for Javascript Websocket. This was built from scratch as a learning project; I do not claim it as a shining example of socket programming or web app design in general. I welcome collaboration and suggestions for improvements.
|
||||
This is a Javascript application running on a node express main. I am using the socket.io package as a wrapper for Javascript Websocket. This was built from scratch as a learning project; I do not claim it as a shining example of socket programming or web app design in general. I welcome collaboration and suggestions for improvements.
|
||||
|
||||
All pixel art is my own (for better or for worse).
|
||||
|
||||
@@ -34,7 +34,7 @@ To learn more about this type of game, see the Wikipedia entry on the game's anc
|
||||
|
||||
Run `npm install` from the root directory.
|
||||
|
||||
Run `node server.js` from the root directory, navigate to **localhost:5000**
|
||||
Run `node main.js` from the root directory, navigate to **localhost:5000**
|
||||
|
||||
# Testing/Debugging
|
||||
|
||||
@@ -42,7 +42,7 @@ Use `npm run test` to run unit tests using <a href='https://jasmine.github.io/'>
|
||||
<br><br>
|
||||
To turn on logging at the debug level, add the `debug` argument like so:
|
||||
|
||||
`node server.js -- debug`
|
||||
`node main.js -- debug`
|
||||
|
||||
# Contributing
|
||||
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
theme: jekyll-theme-minimal
|
||||
logo: /assets/images/roles-small/wolf_logo.png
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 202 KiB |
@@ -1,107 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="119.66505mm"
|
||||
height="109.59733mm"
|
||||
viewBox="0 0 119.66505 109.59733"
|
||||
version="1.1"
|
||||
id="svg8"
|
||||
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
|
||||
sodipodi:docname="host.svg">
|
||||
<defs
|
||||
id="defs2">
|
||||
<inkscape:path-effect
|
||||
effect="bspline"
|
||||
id="path-effect4526"
|
||||
is_visible="true"
|
||||
weight="33.333333"
|
||||
steps="2"
|
||||
helper_size="0"
|
||||
apply_no_weight="true"
|
||||
apply_with_weight="true"
|
||||
only_selected="false" />
|
||||
<inkscape:path-effect
|
||||
effect="bspline"
|
||||
id="path-effect4526-4"
|
||||
is_visible="true"
|
||||
weight="33.333333"
|
||||
steps="2"
|
||||
helper_size="0"
|
||||
apply_no_weight="true"
|
||||
apply_with_weight="true"
|
||||
only_selected="false" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.35"
|
||||
inkscape:cx="-232.43275"
|
||||
inkscape:cy="116.16088"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1027"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata5">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-44.488903,-69.97024)">
|
||||
<circle
|
||||
style="opacity:0.95999995;fill:none;fill-opacity:1;stroke:whitesmoke;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path4518"
|
||||
cx="104.32143"
|
||||
cy="101.96429"
|
||||
r="30.994047" />
|
||||
<g
|
||||
id="g4548"
|
||||
transform="translate(0.75595639,-10.583334)">
|
||||
<path
|
||||
inkscape:original-d="m 44.60119,189.65476 c 6.047883,-10.5836 12.095501,-21.16693 18.142858,-31.75 13.607002,-2.6e-4 27.214549,-0.50423 40.821422,-0.75595"
|
||||
inkscape:path-effect="#path-effect4526"
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4524"
|
||||
d="m 44.60119,189.65476 c 6.047799,-10.58365 12.095417,-21.16698 21.920308,-26.58444 9.824892,-5.41745 23.437104,-5.66953 37.043972,-5.92151"
|
||||
style="fill:none;stroke:whitesmoke;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
|
||||
<path
|
||||
inkscape:original-d="m 44.60119,189.65476 c 6.047883,-10.5836 12.095501,-21.16693 18.142858,-31.75 13.607002,-2.6e-4 27.214549,-0.50423 40.821422,-0.75595"
|
||||
inkscape:path-effect="#path-effect4526-4"
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4524-1"
|
||||
d="m 44.60119,189.65476 c 6.047799,-10.58365 12.095417,-21.16698 21.920308,-26.58444 9.824892,-5.41745 23.437104,-5.66953 37.043972,-5.92151"
|
||||
style="fill:none;stroke:whitesmoke;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
transform="matrix(-1,0,0,1,207.13094,0)" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.9 KiB |
@@ -1,14 +0,0 @@
|
||||
<svg width="209" height="209" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="172" width="172" y="-1" x="-1"/>
|
||||
<g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
|
||||
<rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="svg_1" d="m0.749996,50.93695l50.18695,-50.18695l53.312819,53.312382l53.312819,-53.312382l50.187422,50.18695l-53.312833,53.312819l53.312833,53.312819l-50.187422,50.187422l-53.312819,-53.312833l-53.312819,53.312833l-50.18695,-50.187422l53.312382,-53.312819l-53.312382,-53.312819z" stroke-width="1.5" stroke="none" fill="red"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 840 B |
@@ -1,90 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="123.22025mm"
|
||||
height="123.59821mm"
|
||||
viewBox="0 0 123.22025 123.59821"
|
||||
version="1.1"
|
||||
id="svg8"
|
||||
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
|
||||
sodipodi:docname="gallery.svg">
|
||||
<defs
|
||||
id="defs2" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.35"
|
||||
inkscape:cx="-228.27896"
|
||||
inkscape:cy="141.42857"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1027"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata5">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-43.389879,-62.654773)">
|
||||
<g
|
||||
id="g848"
|
||||
transform="translate(8.2381001,13.607143)"
|
||||
style="stroke:none">
|
||||
<rect
|
||||
y="49.04763"
|
||||
x="35.151779"
|
||||
height="53.672619"
|
||||
width="53.672619"
|
||||
id="rect815"
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
|
||||
<rect
|
||||
y="49.04763"
|
||||
x="104.6994"
|
||||
height="53.672619"
|
||||
width="53.672619"
|
||||
id="rect815-7"
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
|
||||
<rect
|
||||
y="118.97321"
|
||||
x="35.151779"
|
||||
height="53.672619"
|
||||
width="53.672619"
|
||||
id="rect815-1"
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
|
||||
<rect
|
||||
y="118.97321"
|
||||
x="104.6994"
|
||||
height="53.672619"
|
||||
width="53.672619"
|
||||
id="rect815-5"
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-upload"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>
|
||||
|
Before Width: | Height: | Size: 344 B |
@@ -1,14 +0,0 @@
|
||||
<svg width="223" height="223" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="225" width="225" y="-1" x="-1"/>
|
||||
<g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
|
||||
<rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="svg_1" d="m111.499982,3.500023c-59.646658,0 -107.999967,48.353386 -107.999967,107.999967c0,59.647903 48.353308,107.999993 107.999967,107.999993c59.647946,0 107.999993,-48.352082 107.999993,-107.999993c0,-59.646581 -48.352047,-107.999967 -107.999993,-107.999967zm-9.236728,48.553238l17.983007,0l0,19.128161l-17.983007,0l0,-19.128161zm29.760957,116.085726l-19.780144,0c-7.684691,0 -10.961591,-3.269729 -10.961591,-11.117474l0,-51.012233c0,-2.452006 -1.306774,-3.597168 -3.595768,-3.597168l-6.539459,0l0,-17.662679l19.781535,0c7.690393,0 10.953072,3.432714 10.953072,11.116049l0,51.176601c0,2.296157 1.306782,3.597237 3.595768,3.597237l6.539537,0l0,17.499659l0.00705,0l0,0.000009z" stroke-width="1.5" stroke="#000" fill="#bbb8b8"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,109 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="123.22025mm"
|
||||
height="123.59821mm"
|
||||
viewBox="0 0 123.22025 123.59821"
|
||||
version="1.1"
|
||||
id="svg8"
|
||||
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
|
||||
sodipodi:docname="list.svg">
|
||||
<defs
|
||||
id="defs2" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.35"
|
||||
inkscape:cx="-228.27896"
|
||||
inkscape:cy="141.42857"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1027"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata5">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-43.389879,-62.654773)">
|
||||
<circle
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path875"
|
||||
cx="58.697918"
|
||||
cy="82.385117"
|
||||
r="5.2916665" />
|
||||
<circle
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path875-4"
|
||||
cx="58.697918"
|
||||
cy="111.11131"
|
||||
r="5.2916665" />
|
||||
<circle
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path875-8"
|
||||
cx="58.697918"
|
||||
cy="139.23279"
|
||||
r="5.2916665" />
|
||||
<circle
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path875-6"
|
||||
cx="58.697918"
|
||||
cy="166.52264"
|
||||
r="5.2916665" />
|
||||
<rect
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="rect904"
|
||||
width="85.422623"
|
||||
height="10.583333"
|
||||
x="71.171135"
|
||||
y="77.093452" />
|
||||
<rect
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="rect904-4"
|
||||
width="85.422623"
|
||||
height="10.583333"
|
||||
x="71.171135"
|
||||
y="161.23097" />
|
||||
<rect
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="rect904-43"
|
||||
width="85.422623"
|
||||
height="10.583333"
|
||||
x="71.171135"
|
||||
y="133.94112" />
|
||||
<rect
|
||||
style="opacity:0.95999995;fill:whitesmoke;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="rect904-3"
|
||||
width="85.422623"
|
||||
height="10.583333"
|
||||
x="71.171135"
|
||||
y="105.81964" />
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 4.2 KiB |
@@ -1,8 +0,0 @@
|
||||
<svg width="263" height="271" xmlns="http://www.w3.org/2000/svg">
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<ellipse stroke="gray" ry="131" rx="126" id="svg_5" fill="none" cy="135.237498" cx="131.999999" stroke-opacity="null" stroke-width="8"/>
|
||||
<rect stroke="#7d0b0b" id="svg_1" height="123.000006" width="41" y="73.737494" x="77.5" stroke-width="0" fill="gray"/>
|
||||
<rect stroke="#7d0b0b" id="svg_3" height="123.000006" width="41" y="73.737494" x="144.5" stroke-width="0" fill="gray"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 491 B |
@@ -1,14 +0,0 @@
|
||||
<svg width="132" height="192" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="194" width="134" y="-1" x="-1"/>
|
||||
<g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
|
||||
<rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="svg_2" d="m124.961908,17.099698l-20.881294,-13.124489c-5.268417,-3.308101 -12.210471,-1.715912 -15.530119,3.553603l-8.230499,13.1l39.946799,25.089697l8.23699,-13.093919c3.307049,-5.275788 1.728716,-12.224161 -3.541878,-15.524891l0,0zm-115.727379,116.707156l39.948976,25.089439l65.110209,-103.65022l-39.967994,-25.095989l-65.091198,103.656764l0.000007,0.000007zm-6.102198,31.877066l-0.88233,23.566079l20.849261,-11.027851l19.374887,-10.229887l-38.540057,-24.219893l-0.801755,21.911559l0,0l-0.000007,-0.000007z" stroke-width="4.5" stroke="none" fill="black"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB |
@@ -1,14 +0,0 @@
|
||||
<svg width="172" height="172" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="174" width="174" y="-1" x="-1"/>
|
||||
<g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
|
||||
<rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="svg_1" d="m139.382578,14.249727l-18.982996,-11.931355c-4.78947,-3.007365 -11.100429,-1.559921 -14.118291,3.230549l-7.482272,11.909092l36.315275,22.808817l7.488173,-11.903564c3.006409,-4.796172 1.57156,-11.112875 -3.219889,-14.113539l0,0zm-105.206717,106.097424l36.317254,22.808582l59.191104,-94.22748l-36.334543,-22.814538l-59.173821,94.233429l0.000006,0.000006zm-5.547453,28.979153l-0.802118,21.42371l18.953876,-10.02532l17.613535,-9.299898l-35.036418,-22.018086l-0.728868,19.9196l0,0l-0.000006,-0.000006z" stroke-width="1.5" stroke="none" fill="green"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB |
@@ -1,7 +0,0 @@
|
||||
<svg width="263" height="271" xmlns="http://www.w3.org/2000/svg">
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<ellipse stroke="gray" ry="131" rx="126" id="svg_5" cy="135.237498" cx="129.999999" fill-opacity="null" stroke-opacity="null" stroke-width="8" fill="none"/>
|
||||
<path transform="rotate(90.18392181396484 140.08586120605474,135.38354492187497) " stroke="#7d0b0b" id="svg_7" d="m86.585877,180.883554l53.499995,-91.000007l53.499995,91.000007l-106.99999,0z" fill-opacity="null" stroke-opacity="null" stroke-width="0" fill="gray"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 535 B |
@@ -1,14 +0,0 @@
|
||||
<svg width="232" height="232" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="234" width="234" y="-1" x="-1"/>
|
||||
<g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
|
||||
<rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="svg_2" d="m116.249977,0.749996c-63.791862,0 -115.499977,51.711165 -115.499977,115.500022c0,63.792136 51.708115,115.499968 115.499977,115.499968c63.788876,0 115.500013,-51.707832 115.500013,-115.499968c0,-63.788858 -51.711128,-115.500022 -115.500013,-115.500022zm10.552801,182.023345l-21.511705,0l0,-20.629285l21.511705,0l0,20.629285zm0,-42.656193l0,6.817814l-21.511705,0l0,-8.400447c0,-25.349282 28.847653,-29.371968 28.847653,-47.388589c0,-8.215218 -7.345234,-14.508297 -16.96127,-14.508297c-9.964527,0 -18.704243,7.34212 -18.704243,7.34212l-12.247236,-15.218234c0,0 12.071466,-12.589655 32.876448,-12.589655c19.762633,0 38.112195,12.238096 38.112195,32.870404c0.009222,28.862919 -30.411843,32.191492 -30.411843,51.074874l0,0.000009z" stroke-width="3" stroke="whitesmoke" fill="none"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 753 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 871 B |
Binary file not shown.
|
Before Width: | Height: | Size: 824 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1012 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 218 B |
@@ -1,57 +1,32 @@
|
||||
export let cards = [
|
||||
export const cards = [
|
||||
{
|
||||
role: "Villager",
|
||||
team: "good",
|
||||
description: "During the day, find the wolves and kill them.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Werewolf",
|
||||
team: "evil",
|
||||
description: "During the night, choose a villager to kill. Don't get killed.",
|
||||
isTypeOfWerewolf: true
|
||||
},
|
||||
{
|
||||
role: "Dream Wolf",
|
||||
team: "evil",
|
||||
description: "If a Werewolf dies, you become a Werewolf. You do not wake up with the Werewolves until this happens. You count for parity only after converting to a wolf.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Minion",
|
||||
team: "evil",
|
||||
description: "You are an evil villager - you know who the wolves are, and you want them to win.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Seer",
|
||||
team: "good",
|
||||
description: "During each night, choose one person. The moderator will tell you whether that player is a wolf.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Shadow",
|
||||
team: "evil",
|
||||
description: "If the Seer checks you, the Seer dies that night instead of whoever the wolves chose to kill. Reveal" +
|
||||
" yourself to the moderator.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Hunter",
|
||||
team: "good",
|
||||
description: "If you are alive with a wolf at the end of the game, you best the wolf, and the village wins.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Sorcerer",
|
||||
team: "good",
|
||||
description: "Once a game, change who the wolves are going to kill to someone else, including yourself.",
|
||||
isTypeOfWerewolf: false
|
||||
},
|
||||
{
|
||||
role: "Mason",
|
||||
team: "good",
|
||||
description: "Masons know who other Masons are. Wake them up to see each other on the first night.",
|
||||
isTypeOfWerewolf: false
|
||||
}
|
||||
];
|
||||
BIN
client/favicon_package/android-chrome-192x192.png
Normal file
BIN
client/favicon_package/android-chrome-192x192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
client/favicon_package/android-chrome-256x256.png
Normal file
BIN
client/favicon_package/android-chrome-256x256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
client/favicon_package/apple-touch-icon.png
Normal file
BIN
client/favicon_package/apple-touch-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
9
client/favicon_package/browserconfig.xml
Normal file
9
client/favicon_package/browserconfig.xml
Normal file
@@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<browserconfig>
|
||||
<msapplication>
|
||||
<tile>
|
||||
<square150x150logo src="/mstile-150x150.png"/>
|
||||
<TileColor>#da532c</TileColor>
|
||||
</tile>
|
||||
</msapplication>
|
||||
</browserconfig>
|
||||
BIN
client/favicon_package/favicon-16x16.png
Normal file
BIN
client/favicon_package/favicon-16x16.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
client/favicon_package/favicon-32x32.png
Normal file
BIN
client/favicon_package/favicon-32x32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
BIN
client/favicon_package/favicon.ico
Normal file
BIN
client/favicon_package/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
client/favicon_package/mstile-150x150.png
Normal file
BIN
client/favicon_package/mstile-150x150.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
54
client/favicon_package/safari-pinned-tab.svg
Normal file
54
client/favicon_package/safari-pinned-tab.svg
Normal file
@@ -0,0 +1,54 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||
width="380.000000pt" height="380.000000pt" viewBox="0 0 380.000000 380.000000"
|
||||
preserveAspectRatio="xMidYMid meet">
|
||||
<metadata>
|
||||
Created by potrace 1.14, written by Peter Selinger 2001-2017
|
||||
</metadata>
|
||||
<g transform="translate(0.000000,380.000000) scale(0.100000,-0.100000)"
|
||||
fill="#000000" stroke="none">
|
||||
<path d="M1790 3160 c0 -18 -7 -20 -60 -20 -53 0 -60 -2 -60 -20 0 -18 -7 -20
|
||||
-80 -20 -73 0 -80 -2 -80 -20 0 -18 -7 -20 -60 -20 -53 0 -60 -2 -60 -20 0
|
||||
-17 -7 -20 -40 -20 -33 0 -40 -3 -40 -20 0 -17 -7 -20 -40 -20 l-40 0 0 -40 0
|
||||
-40 -40 0 c-33 0 -40 3 -40 20 0 18 -7 20 -60 20 -53 0 -60 2 -60 20 0 18 -7
|
||||
20 -60 20 -53 0 -60 2 -60 20 0 18 -7 20 -60 20 -53 0 -60 2 -60 20 0 13 -7
|
||||
20 -20 20 -13 0 -20 7 -20 20 0 18 -7 20 -60 20 -53 0 -60 -2 -60 -20 0 -17
|
||||
-7 -20 -40 -20 l-40 0 0 -160 c0 -153 1 -160 20 -160 13 0 20 -7 20 -20 0 -13
|
||||
7 -20 20 -20 18 0 20 -7 20 -60 0 -53 2 -60 20 -60 17 0 20 -7 20 -40 0 -33 3
|
||||
-40 20 -40 17 0 20 -7 20 -40 0 -33 3 -40 20 -40 17 0 20 -7 20 -40 0 -33 -3
|
||||
-40 -20 -40 -13 0 -20 -7 -20 -20 0 -13 -7 -20 -20 -20 -18 0 -20 -7 -20 -80
|
||||
0 -73 -2 -80 -20 -80 -19 0 -20 -7 -20 -160 0 -153 1 -160 20 -160 19 0 20 -7
|
||||
20 -100 0 -93 1 -100 20 -100 19 0 20 -7 20 -140 0 -133 1 -140 20 -140 13 0
|
||||
20 -7 20 -20 0 -13 7 -20 20 -20 17 0 20 -7 20 -40 l0 -40 40 0 c33 0 40 -3
|
||||
40 -20 0 -13 7 -20 20 -20 13 0 20 -7 20 -20 0 -13 7 -20 20 -20 13 0 20 -7
|
||||
20 -20 0 -17 7 -20 40 -20 33 0 40 -3 40 -20 0 -18 7 -20 80 -20 l80 0 0 -40
|
||||
c0 -33 3 -40 20 -40 17 0 20 -7 20 -40 l0 -40 80 0 80 0 0 -40 0 -40 40 0 40
|
||||
0 0 -40 c0 -33 3 -40 20 -40 13 0 20 -7 20 -20 0 -13 7 -20 20 -20 13 0 20 -7
|
||||
20 -20 0 -18 7 -20 60 -20 53 0 60 -2 60 -20 0 -13 7 -20 20 -20 17 0 20 -7
|
||||
20 -40 l0 -40 40 0 c33 0 40 -3 40 -20 0 -13 7 -20 20 -20 17 0 20 -7 20 -40
|
||||
0 -33 3 -40 20 -40 13 0 20 -7 20 -20 0 -17 7 -20 40 -20 l40 0 0 40 0 40 40
|
||||
0 40 0 0 40 0 40 40 0 c33 0 40 3 40 20 0 17 7 20 40 20 l40 0 0 40 0 40 40 0
|
||||
c33 0 40 3 40 20 0 13 7 20 20 20 13 0 20 7 20 20 0 18 7 20 60 20 53 0 60 2
|
||||
60 20 0 13 7 20 20 20 17 0 20 7 20 40 l0 40 40 0 c33 0 40 3 40 20 0 13 7 20
|
||||
20 20 13 0 20 7 20 20 0 18 7 20 60 20 53 0 60 2 60 20 0 13 7 20 20 20 13 0
|
||||
20 7 20 20 0 13 7 20 20 20 13 0 20 7 20 20 0 17 7 20 40 20 33 0 40 3 40 20
|
||||
0 13 7 20 20 20 18 0 20 7 20 60 0 53 2 60 20 60 17 0 20 7 20 40 0 33 3 40
|
||||
20 40 13 0 20 7 20 20 0 13 7 20 20 20 17 0 20 7 20 40 0 33 3 40 20 40 18 0
|
||||
20 7 20 80 0 73 2 80 20 80 19 0 20 7 20 100 0 93 1 100 20 100 13 0 20 7 20
|
||||
20 0 13 7 20 20 20 19 0 20 7 20 120 0 113 -1 120 -20 120 -19 0 -20 7 -20
|
||||
100 0 93 -1 100 -20 100 -17 0 -20 7 -20 40 l0 40 -40 0 c-33 0 -40 3 -40 20
|
||||
0 13 7 20 20 20 13 0 20 7 20 20 0 13 7 20 20 20 17 0 20 7 20 40 0 33 3 40
|
||||
20 40 13 0 20 7 20 20 0 13 7 20 20 20 17 0 20 7 20 40 0 33 3 40 20 40 17 0
|
||||
20 7 20 40 0 33 3 40 20 40 19 0 20 7 20 120 0 113 -1 120 -20 120 -18 0 -20
|
||||
7 -20 60 0 53 -2 60 -20 60 -13 0 -20 7 -20 20 0 18 -7 20 -80 20 -73 0 -80
|
||||
-2 -80 -20 0 -17 -7 -20 -40 -20 -33 0 -40 -3 -40 -20 0 -17 -7 -20 -40 -20
|
||||
-33 0 -40 -3 -40 -20 0 -17 -7 -20 -40 -20 -33 0 -40 -3 -40 -20 0 -18 -7 -20
|
||||
-60 -20 -53 0 -60 -2 -60 -20 0 -18 -7 -20 -80 -20 l-80 0 0 40 0 40 -40 0
|
||||
c-33 0 -40 3 -40 20 0 17 -7 20 -40 20 -33 0 -40 3 -40 20 0 13 -7 20 -20 20
|
||||
-13 0 -20 7 -20 20 0 13 -7 20 -20 20 -13 0 -20 7 -20 20 0 18 -7 20 -80 20
|
||||
-73 0 -80 2 -80 20 0 18 -7 20 -60 20 -53 0 -60 -2 -60 -20 0 -17 -7 -20 -40
|
||||
-20 -33 0 -40 3 -40 20 0 18 -7 20 -60 20 -53 0 -60 -2 -60 -20z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.5 KiB |
19
client/favicon_package/site.webmanifest
Normal file
19
client/favicon_package/site.webmanifest
Normal file
@@ -0,0 +1,19 @@
|
||||
{
|
||||
"name": "",
|
||||
"short_name": "",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/android-chrome-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/android-chrome-256x256.png",
|
||||
"sizes": "256x256",
|
||||
"type": "image/png"
|
||||
}
|
||||
],
|
||||
"theme_color": "#ffffff",
|
||||
"background_color": "#ffffff",
|
||||
"display": "standalone"
|
||||
}
|
||||
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
3
client/scripts/create.js
Normal file
3
client/scripts/create.js
Normal file
@@ -0,0 +1,3 @@
|
||||
export const create = () => {
|
||||
|
||||
}
|
||||
3
client/scripts/home.js
Normal file
3
client/scripts/home.js
Normal file
@@ -0,0 +1,3 @@
|
||||
export const home = () => {
|
||||
|
||||
};
|
||||
17
client/styles/GLOBAL.css
Normal file
17
client/styles/GLOBAL.css
Normal file
@@ -0,0 +1,17 @@
|
||||
canvas, caption, center, cite, code,
|
||||
dd, del, dfn, div, dl, dt, em, embed,
|
||||
fieldset, font, form, h1, h2, h3, h4,
|
||||
h5, h6, hr, i, iframe, img, ins, kbd,
|
||||
label, legend, li, menu, object, ol, p,
|
||||
pre, q, s, samp, small, span, strike,
|
||||
strong, sub, sup, table, tbody, td, tfoot,
|
||||
th, thead, tr, tt, u, ul, var {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
}
|
||||
0
client/styles/create.css
Normal file
0
client/styles/create.css
Normal file
0
client/styles/home.css
Normal file
0
client/styles/home.css
Normal file
24
client/views/404.html
Normal file
24
client/views/404.html
Normal file
@@ -0,0 +1,24 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<title>Werewolf Utility</title>
|
||||
<meta name="description" content="Not Found">
|
||||
<meta property="og:title" content="Werewolf Utility">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://play-werewolf.herokuapp.com/">
|
||||
<meta property="og:description" content="Not Found">
|
||||
<meta property="og:image" content="image.png">
|
||||
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<h1>404</h1>
|
||||
</body>
|
||||
</html>
|
||||
38
client/views/create.html
Normal file
38
client/views/create.html
Normal file
@@ -0,0 +1,38 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Create A Game</title>
|
||||
<meta name="description" content="Create a game of Werewolf using your custom set of roles.">
|
||||
<meta property="og:title" content="Werewolf Utility - Create A Game">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://play-werewolf.herokuapp.com/create">
|
||||
<meta property="og:description" content="Create a game of Werewolf using your custom set of roles.">
|
||||
<meta property="og:image" content="image.png">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
<link rel="stylesheet" href="../styles/GLOBAL.css">
|
||||
<link rel="stylesheet" href="../styles/create.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Create A Game</h1>
|
||||
<h3>
|
||||
Creating a game gives you the moderator role. You will not be dealt a card. You will know everyone's role and can
|
||||
remove any player from the game. You can also play/pause the optional timer and, if desired, delegate your moderator
|
||||
role to any other player.
|
||||
</h3>
|
||||
<form id="game-form">
|
||||
|
||||
</form>
|
||||
<script type="module">
|
||||
import { create } from "../scripts/create.js";
|
||||
create();
|
||||
</script>
|
||||
<script src="/socket.io/socket.io.js"></script>
|
||||
<script>
|
||||
const socket = io();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
33
client/views/home.html
Normal file
33
client/views/home.html
Normal file
@@ -0,0 +1,33 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<title>Werewolf Utility</title>
|
||||
<meta name="description" content="A utility to deal Werewolf cards and run games in any setting, on any device.">
|
||||
<meta property="og:title" content="Werewolf Utility">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://play-werewolf.herokuapp.com/">
|
||||
<meta property="og:description" content="A utility to deal Werewolf cards and run games in any setting, on any device.">
|
||||
<meta property="og:image" content="image.png">
|
||||
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
|
||||
<link rel="stylesheet" href="../styles/GLOBAL.css">
|
||||
<link rel="stylesheet" href="../styles/home.css">
|
||||
</head>
|
||||
<body>
|
||||
<a href="/create">Create A Game</a>
|
||||
<script type="module">
|
||||
import { home } from "../scripts/home.js";
|
||||
home();
|
||||
</script>
|
||||
<script src="/socket.io/socket.io.js"></script>
|
||||
<script>
|
||||
const socket = io();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
@@ -1,456 +0,0 @@
|
||||
import {utility} from './util.js'
|
||||
|
||||
const socket = io();
|
||||
|
||||
const standardRoles = ["Villager", "Werewolf", "Seer", "Shadow", "Hunter", "Mason", "Minion", "Sorcerer", "Dream Wolf"];
|
||||
let clock;
|
||||
let currentGame = null;
|
||||
let lastGameState = null;
|
||||
let cardFlippedOver = false;
|
||||
let cardRendered = false;
|
||||
let lastKilled = null;
|
||||
|
||||
// respond to the game state received from the server
|
||||
socket.on('state', function(game) {
|
||||
currentGame = game;
|
||||
if(detectChanges(game)) {
|
||||
buildGameBasedOnState(game);
|
||||
}
|
||||
});
|
||||
|
||||
function buildGameBasedOnState(game) {
|
||||
switch(game.status) {
|
||||
case "lobby":
|
||||
renderLobby();
|
||||
break;
|
||||
case "started":
|
||||
renderGame();
|
||||
break;
|
||||
case "ended":
|
||||
renderEndSplash();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function detectChanges(game) {
|
||||
if (lastGameState === null ||
|
||||
lastGameState.status !== game.status ||
|
||||
lastGameState.paused !== game.paused ||
|
||||
lastGameState.lastKilled !== game.lastKilled ||
|
||||
lastGameState.startTime !== game.startTime ||
|
||||
lastGameState.players.length !== game.players.length) {
|
||||
lastGameState = game;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function hideAfterExit(e) {
|
||||
e.target.style.display = 'none';
|
||||
e.target.classList.remove(e.target.exitClass);
|
||||
}
|
||||
|
||||
function triggerExitAnimation(e) {
|
||||
e.target.classList.remove(e.target.entranceClass);
|
||||
e.target.classList.remove(e.target.exitClass);
|
||||
e.target.offsetWidth;
|
||||
e.target.classList.add(e.target.exitClass);
|
||||
window.setTimeout(()=>{
|
||||
e.target.addEventListener('animationend', hideAfterExit, true);
|
||||
},0);
|
||||
}
|
||||
|
||||
function triggerEntranceAnimation(selector, entranceClass, exitClass, image) {
|
||||
let transitionEl = document.querySelector(selector);
|
||||
transitionEl.style.display = 'flex';
|
||||
transitionEl.addEventListener('animationend', triggerExitAnimation, true);
|
||||
transitionEl.classList.remove(entranceClass);
|
||||
transitionEl.entranceClass = entranceClass;
|
||||
transitionEl.exitClass = exitClass;
|
||||
transitionEl.offsetWidth;
|
||||
if (currentGame.reveals) {
|
||||
if (image && standardRoles.includes(currentGame.killedRole)) {
|
||||
transitionEl.classList.remove("killed-role-custom");
|
||||
transitionEl.setAttribute("src", "../assets/images/roles/" + currentGame.killedRole.replace(/\s/g, '') + ".png");
|
||||
} else {
|
||||
if (image) {
|
||||
transitionEl.setAttribute("src", "../assets/images/custom.svg");
|
||||
transitionEl.setAttribute("class", "killed-role-custom");
|
||||
}
|
||||
}
|
||||
} else {
|
||||
transitionEl.setAttribute("src", "../assets/images/question_mark.svg");
|
||||
transitionEl.setAttribute("class", "killed-role-hidden");
|
||||
}
|
||||
transitionEl.classList.add(entranceClass);
|
||||
}
|
||||
|
||||
function playKilledAnimation() {
|
||||
triggerEntranceAnimation('#overlay', 'animate-overlay-in', 'animate-overlay-out', false);
|
||||
triggerEntranceAnimation('#killed-role', 'animate-role-in', 'animate-role-out', true);
|
||||
triggerEntranceAnimation('#killed-name', 'animate-name-in', 'animate-name-out', false);
|
||||
}
|
||||
|
||||
function launchGame() {
|
||||
randomlyDealCardsToPlayers();
|
||||
utility.shuffle(currentGame.players); // put the players in a random order
|
||||
socket.emit('startGame', { players: currentGame.players , code: currentGame.accessCode});
|
||||
}
|
||||
|
||||
function randomlyDealCardsToPlayers() {
|
||||
for (let player of currentGame.players) {
|
||||
player.card = drawRandomCard();
|
||||
}
|
||||
}
|
||||
|
||||
function drawRandomCard() {
|
||||
return currentGame.deck.splice(utility.getRandomInt(currentGame.deck.length) - 1, 1)[0];
|
||||
}
|
||||
|
||||
function getLiveCount() {
|
||||
let liveCount = 0;
|
||||
for (let player of currentGame.players) {
|
||||
if (!player.dead) {
|
||||
liveCount ++;
|
||||
}
|
||||
}
|
||||
return liveCount;
|
||||
}
|
||||
|
||||
function renderEndSplash() {
|
||||
clearInterval(clock);
|
||||
document.getElementById("game-container").remove();
|
||||
document.querySelector("#message-box").style.display = 'none';
|
||||
currentGame.winningTeam === "village"
|
||||
? document.getElementById("end-container").innerHTML ="<div class='winner-header'><p class='winner-village'>Village</p> wins!</div>"
|
||||
: document.getElementById("end-container").innerHTML ="<div class='winner-header'><p class='winner-wolf'>Wolves</p>win!</div>";
|
||||
const rosterContainer = document.createElement("div");
|
||||
rosterContainer.setAttribute("id", "roster");
|
||||
document.getElementById("end-container").innerHTML += "<div class='roster-header'>Here's what everyone was:</div>";
|
||||
let rosterContent = "";
|
||||
for (const player of currentGame.players) {
|
||||
rosterContent += "<div class='roster-list-item'>";
|
||||
rosterContent += standardRoles.includes(player.card.role)
|
||||
? "<img alt='' src='/assets/images/roles-small/" + player.card.role.replace(/\s/g, '') + ".png' />"
|
||||
: "<img alt='' class='card-image-custom' src='/assets/images/custom.svg' />";
|
||||
rosterContent += player.name + ": " + player.card.role + "</div>"
|
||||
}
|
||||
rosterContainer.innerHTML = rosterContent;
|
||||
document.getElementById("end-container").appendChild(rosterContainer);
|
||||
document.getElementById("end-container").innerHTML += "<a href='/'><button class='app-btn'>Home</button></a>";
|
||||
|
||||
}
|
||||
|
||||
function renderGame() {
|
||||
// remove lobby components if present
|
||||
if (document.getElementById("lobby-container") !== null && document.getElementById("launch") !== null) {
|
||||
document.getElementById("lobby-container").remove();
|
||||
document.getElementById("launch").remove();
|
||||
}
|
||||
|
||||
document.querySelector("#message-box").style.display = 'block';
|
||||
if (currentGame.killedRole && currentGame.lastKilled !== lastKilled) { // a new player has been killed
|
||||
lastKilled = currentGame.lastKilled;
|
||||
document.getElementById("killed-name").innerText = currentGame.reveals
|
||||
? currentGame.killedPlayer + " was a " + currentGame.killedRole + "!"
|
||||
: currentGame.killedPlayer + " has died!";
|
||||
playKilledAnimation();
|
||||
document.getElementById("message-box").innerText = currentGame.message;
|
||||
}
|
||||
const player = currentGame.players.find((player) => player.id === sessionStorage.getItem("id"));
|
||||
|
||||
// render the header
|
||||
document.getElementById("game-container").setAttribute("class", "game-container");
|
||||
const gameHeader = document.createElement("div");
|
||||
gameHeader.setAttribute("id", "game-header");
|
||||
gameHeader.innerHTML =
|
||||
"<div id='players-remaining'>" + getLiveCount() + "/" + currentGame.size + " alive</div>" +
|
||||
"<div id='clock'></div>" +
|
||||
"<div id='pause-container'></div>";
|
||||
if (document.getElementById("game-header")) {
|
||||
document.getElementById("card-container").removeChild(document.getElementById("game-header"));
|
||||
}
|
||||
document.getElementById("card-container").prepend(gameHeader);
|
||||
|
||||
// render the card if it hasn't been yet
|
||||
if (!cardRendered) {
|
||||
renderPlayerCard(player);
|
||||
cardRendered = true;
|
||||
}
|
||||
|
||||
// build the clock
|
||||
if (currentGame.time) {
|
||||
updateClock();
|
||||
document.getElementById("pause-container").innerHTML = currentGame.paused ?
|
||||
"<img alt='pause' src='../assets/images/play-button.svg' id='play-pause'/>"
|
||||
: "<img alt='pause' src='../assets/images/pause-button.svg' id='play-pause'/>";
|
||||
document.getElementById("play-pause").addEventListener("click", pauseOrResumeGame)
|
||||
}
|
||||
|
||||
// add the "I'm dead" button
|
||||
let killedBtn = document.createElement("button");
|
||||
killedBtn.setAttribute("id", "dead-btn");
|
||||
|
||||
if (player.dead) {
|
||||
killedBtn.setAttribute("class", "app-btn killed-btn disabled");
|
||||
killedBtn.innerText = "Killed"
|
||||
} else {
|
||||
killedBtn.setAttribute("class", "app-btn killed-btn");
|
||||
killedBtn.innerText = "I'm dead";
|
||||
}
|
||||
if (document.getElementById("dead-btn")) {
|
||||
document.getElementById("card-container").removeChild(document.getElementById("dead-btn"));
|
||||
}
|
||||
document.getElementById("card-container").appendChild(killedBtn);
|
||||
document.getElementById("dead-btn").addEventListener("click", killPlayer);
|
||||
|
||||
// add the list of dead/alive players
|
||||
renderDeadAndAliveInformation();
|
||||
}
|
||||
|
||||
function renderDeadAndAliveInformation() {
|
||||
// TODO: Refactor this function.
|
||||
currentGame.players = currentGame.players.sort((a, b) =>
|
||||
{
|
||||
return a.card.role > b.card.role ? 1 : -1;
|
||||
});
|
||||
let infoContainer = document.getElementById("info-container");
|
||||
let alivePlayers = currentGame.players.filter((player) => !player.dead);
|
||||
let deadPlayers = currentGame.players.filter((player) => player.dead);
|
||||
deadPlayers.sort((a, b) => { // sort players by the time they died
|
||||
return new Date(a.deadAt) > new Date(b.deadAt) ? -1 : 1;
|
||||
});
|
||||
|
||||
let killedContainer = document.createElement("div");
|
||||
killedContainer.setAttribute("id", "killed-container");
|
||||
let killedHeader = document.createElement("h2");
|
||||
killedHeader.innerText = "Killed Players";
|
||||
killedContainer.appendChild(killedHeader);
|
||||
|
||||
addDeadPlayers(deadPlayers, killedContainer);
|
||||
|
||||
let aliveContainer = document.createElement("div");
|
||||
aliveContainer.setAttribute("id", "alive-container");
|
||||
let aliveHeader = document.createElement("h2");
|
||||
aliveContainer.appendChild(aliveHeader);
|
||||
aliveHeader.innerText = currentGame.reveals
|
||||
? "Roles Still Alive"
|
||||
: "Roles in the Game";
|
||||
var rollCounter = {}; // RTM
|
||||
|
||||
if (currentGame.reveals) {
|
||||
addAlivePlayers(alivePlayers, aliveContainer, rollCounter);
|
||||
} else {
|
||||
addAlivePlayers(currentGame.players, aliveContainer, rollCounter);
|
||||
}
|
||||
|
||||
if (infoContainer === null) {
|
||||
infoContainer = document.createElement("div");
|
||||
infoContainer.setAttribute("id", "info-container");
|
||||
infoContainer.appendChild(killedContainer);
|
||||
infoContainer.appendChild(aliveContainer);
|
||||
document.getElementById("game-container").appendChild(infoContainer);
|
||||
// Has to be done AFTER the infoContainer is rendered in the DOM to insert the updated counts
|
||||
for (let x of document.getElementsByClassName("alive-player")) {
|
||||
x.getElementsByClassName("rolecount")[0].innerText = rollCounter[x.getElementsByTagName("p")[0].innerText];
|
||||
}
|
||||
} else {
|
||||
document.getElementById("killed-container").remove();
|
||||
document.getElementById("alive-container").remove();
|
||||
document.getElementById("info-container").append(killedContainer);
|
||||
document.getElementById("info-container").append(aliveContainer);
|
||||
// Has to be done AFTER the infoContainer is rendered in the DOM to insert the updated counts
|
||||
for (let x of document.getElementsByClassName("alive-player")) {
|
||||
x.getElementsByClassName("rolecount")[0].innerText = rollCounter[x.getElementsByTagName("p")[0].innerText];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function addDeadPlayers(deadPlayers, killedContainer) {
|
||||
deadPlayers.forEach((player) => {
|
||||
let deadPlayerClass = player.card.team === "good" ? "dead-player-village" : "dead-player-evil";
|
||||
if (player.card.isTypeOfWerewolf) {
|
||||
deadPlayerClass += " dead-player-wolf";
|
||||
}
|
||||
const killedPlayer = document.createElement("div");
|
||||
if (currentGame.reveals) {
|
||||
killedPlayer.setAttribute("class", "killed-player " + deadPlayerClass);
|
||||
} else {
|
||||
killedPlayer.setAttribute("class", "killed-player dead-player-no-reveals");
|
||||
}
|
||||
killedPlayer.innerText = currentGame.reveals
|
||||
? player.name + ": " + player.card.role
|
||||
: player.name;
|
||||
killedContainer.appendChild(killedPlayer);
|
||||
});
|
||||
}
|
||||
|
||||
function addAlivePlayers(alivePlayers, aliveContainer, rollCounter) {
|
||||
alivePlayers.forEach((player) => {
|
||||
let alivePlayerClass = player.card.team === "good" ? "alive-player-village" : "alive-player-evil";
|
||||
if (player.card.isTypeOfWerewolf) {
|
||||
alivePlayerClass += " alive-player-wolf";
|
||||
}
|
||||
//RTM
|
||||
if (rollCounter.hasOwnProperty(player.card.role)) {
|
||||
rollCounter[player.card.role] += 1;
|
||||
} else {
|
||||
rollCounter[player.card.role] = 1;
|
||||
//RTM
|
||||
const alivePlayer = document.createElement("div");
|
||||
alivePlayer.setAttribute("class", "alive-player " + alivePlayerClass);
|
||||
alivePlayer.innerHTML = "<p>" + player.card.role + "</p><img src='../assets/images/info.svg'/>";
|
||||
let roleCount = document.createElement("span"); // RTM
|
||||
roleCount.setAttribute("class", "rolecount");
|
||||
//Add hidden description span - RTM 4/18/2020
|
||||
let playerCardInfo=document.createElement("span");
|
||||
playerCardInfo.setAttribute("class","tooltiptext");
|
||||
playerCardInfo.innerText=player.card.description;
|
||||
alivePlayer.prepend(roleCount);
|
||||
alivePlayer.appendChild(playerCardInfo);
|
||||
aliveContainer.appendChild(alivePlayer);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function renderPlayerCard(player) {
|
||||
const card = player.card;
|
||||
const cardArt = standardRoles.includes(card.role) ?
|
||||
"<img alt='" + card.role + "' src='../assets/images/roles/" + card.role.replace(/\s/g, '') + ".png' />"
|
||||
: "<div class='placeholder'>Custom Role</div>";
|
||||
const cardClass = player.card.team === "good" ? "game-card-inner village" : "game-card-inner wolf";
|
||||
const playerCard = document.createElement("div");
|
||||
playerCard.setAttribute("id", "game-card");
|
||||
playerCard.setAttribute("class", getFlipState());
|
||||
playerCard.innerHTML =
|
||||
"<div class='" + cardClass + "'>" +
|
||||
"<div class='game-card-front'>" +
|
||||
"<h2>" + card.role + "</h2>" +
|
||||
cardArt +
|
||||
"<div>" +
|
||||
"<p>" + card.description + "</p>" +
|
||||
"<p id='flip-instruction'>Click to flip</p>" +
|
||||
"</div>" +
|
||||
"</div>" +
|
||||
"<div class='game-card-back'></div>" +
|
||||
"</div>";
|
||||
document.getElementById("card-container").appendChild(playerCard);
|
||||
document.getElementById("game-card").addEventListener("click", flipCard);
|
||||
}
|
||||
|
||||
function pauseOrResumeGame() {
|
||||
if (currentGame.paused) {
|
||||
socket.emit('resumeGame', currentGame.accessCode);
|
||||
} else {
|
||||
socket.emit('pauseGame', currentGame.accessCode);
|
||||
}
|
||||
}
|
||||
|
||||
function getFlipState() {
|
||||
return cardFlippedOver ? "flip-down" : "flip-up";
|
||||
}
|
||||
|
||||
function flipCard() {
|
||||
cardFlippedOver
|
||||
? flipUp()
|
||||
: flipDown();
|
||||
|
||||
cardFlippedOver = !cardFlippedOver;
|
||||
}
|
||||
|
||||
function flipUp(){
|
||||
const card = document.getElementById("game-card");
|
||||
card.classList.add("flip-up");
|
||||
card.classList.remove("flip-down");
|
||||
}
|
||||
|
||||
function flipDown(){
|
||||
const card = document.getElementById("game-card");
|
||||
card.classList.add("flip-down");
|
||||
card.classList.remove("flip-up");
|
||||
}
|
||||
|
||||
function displayTime() {
|
||||
const start = currentGame.paused ? new Date(currentGame.pauseTime) : new Date();
|
||||
const end = new Date(currentGame.endTime);
|
||||
const delta = end - start;
|
||||
let seconds = Math.floor((delta / 1000) % 60);
|
||||
let minutes = Math.floor((delta / 1000 / 60) % 60);
|
||||
let hours = Math.floor((delta / (1000 * 60 * 60)) % 24);
|
||||
|
||||
seconds = seconds < 10 ? "0" + seconds : seconds;
|
||||
minutes = minutes < 10 ? "0" + minutes : minutes;
|
||||
|
||||
document.getElementById("clock").innerText = hours > 0
|
||||
? hours + ":" + minutes + ":" + seconds
|
||||
: minutes + ":" + seconds;
|
||||
}
|
||||
|
||||
function updateClock() {
|
||||
clearInterval(clock);
|
||||
if (document.getElementById("clock") !== null) {
|
||||
displayTime();
|
||||
clock = setInterval(function() {
|
||||
displayTime();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
function killPlayer() {
|
||||
if(confirm("Are you sure you are dead?")) {
|
||||
socket.emit("killPlayer", currentGame.players.find((player) => player.id === sessionStorage.getItem("id")).id, currentGame.accessCode);
|
||||
}
|
||||
}
|
||||
|
||||
function renderLobby() {
|
||||
document.querySelector("#message-box").style.display = 'none';
|
||||
// Render lobby header
|
||||
if (document.getElementsByClassName("lobby-player").length === 0) {
|
||||
let header = document.createElement("h2");
|
||||
header.setAttribute("class", "app-header-secondary");
|
||||
header.innerText = "Lobby";
|
||||
document.getElementById("lobby-container").appendChild(header);
|
||||
let subHeader = document.createElement("div");
|
||||
subHeader.setAttribute("id", "lobby-subheader");
|
||||
subHeader.innerHTML = "<div>" +
|
||||
"<span id='join-count'>" + currentGame.players.length + "</span>" +
|
||||
"<span id='deck-size'>/" + currentGame.size + " Players</span>" +
|
||||
"</div>" +
|
||||
"<br>" +
|
||||
"<div id='game-code'>Access Code: " + currentGame.accessCode + "</div>";
|
||||
document.getElementById("lobby-container").appendChild(subHeader);
|
||||
}
|
||||
// Render all players that are new
|
||||
let i = 1;
|
||||
for (let player of currentGame.players) {
|
||||
if(!document.getElementById("player-" + i)) {
|
||||
const playerContainer = document.createElement("div");
|
||||
player.id === sessionStorage.getItem("id") ?
|
||||
playerContainer.setAttribute("class", "lobby-player highlighted")
|
||||
: playerContainer.setAttribute("class", "lobby-player");
|
||||
playerContainer.setAttribute("id", "player-" + i);
|
||||
playerContainer.innerHTML = "<p>" + player.name + "</p>";
|
||||
document.getElementById("lobby-container").appendChild(playerContainer);
|
||||
document.getElementById("join-count").innerText = currentGame.players.length.toString();
|
||||
}
|
||||
i ++;
|
||||
}
|
||||
// display the launch button if the player is the host
|
||||
if (sessionStorage.getItem("host")) {
|
||||
if (currentGame.players.length === currentGame.size) {
|
||||
document.getElementById("launch").innerHTML = "<button class='app-btn'>Start Game</button>";
|
||||
document.getElementById("launch").addEventListener("click", launchGame);
|
||||
} else {
|
||||
document.getElementById("launch").innerHTML = "<button class='app-btn disabled'>Start Game</button>";
|
||||
}
|
||||
} else {
|
||||
document.getElementById("launch").innerHTML = "<p>The host will start the game.</p>"
|
||||
}
|
||||
}
|
||||
|
||||
// request game state from server periodically
|
||||
setInterval(function () {
|
||||
socket.emit('requestState', {code: sessionStorage.getItem("code")});
|
||||
}, 200);
|
||||
@@ -1,27 +0,0 @@
|
||||
let gameModeSelect = false;
|
||||
|
||||
window.onload = function() {
|
||||
document.getElementById("create-game").addEventListener("click", toggleGameModeSelect);
|
||||
document.getElementById("game-mode-back").addEventListener("click", toggleGameModeSelect)
|
||||
};
|
||||
|
||||
function toggleGameModeSelect() {
|
||||
gameModeSelect = !gameModeSelect;
|
||||
let mainButtons = document.getElementById("main-buttons");
|
||||
let gameModes = document.getElementById("game-mode-select");
|
||||
if (gameModeSelect) {
|
||||
mainButtons.classList.remove("slide-in");
|
||||
mainButtons.offsetWidth;
|
||||
mainButtons.classList.add("slide-out");
|
||||
mainButtons.addEventListener("animationend", function() { mainButtons.style.display = "none" }, {capture: true, once: true});
|
||||
|
||||
gameModes.style.display = "flex";
|
||||
} else {
|
||||
gameModes.style.display = "none";
|
||||
|
||||
mainButtons.style.display = "flex";
|
||||
mainButtons.classList.remove("slide-out");
|
||||
mainButtons.offsetWidth;
|
||||
mainButtons.classList.add("slide-in");
|
||||
}
|
||||
}
|
||||
@@ -1,45 +0,0 @@
|
||||
const socket = io();
|
||||
import { utility } from './util.js'
|
||||
|
||||
// respond to the game state received from the server
|
||||
socket.on('joinError', function(message) {
|
||||
document.getElementById("join-btn").classList.remove('disabled');
|
||||
document.getElementById("code").classList.add("error");
|
||||
document.getElementById("join-error").innerText = message;
|
||||
});
|
||||
|
||||
// respond to the game state received from the server
|
||||
socket.on('success', function() {
|
||||
document.getElementById("join-btn").classList.remove('disabled');
|
||||
if (document.getElementById("code").classList.contains("error")) {
|
||||
document.getElementById("code").classList.remove("error");
|
||||
document.getElementById("join-error").innerText = "";
|
||||
}
|
||||
// If a player was a host of a previous game, don't make them the host of this one
|
||||
if (sessionStorage.getItem("host")) {
|
||||
sessionStorage.removeItem("host");
|
||||
}
|
||||
window.location.replace('/' + document.getElementById("code").value.toString().trim().toLowerCase());
|
||||
});
|
||||
|
||||
document.getElementById("join-btn").addEventListener("click", function() {
|
||||
document.getElementById("join-btn").classList.add('disabled');
|
||||
if (document.getElementById("name").value.length > 0) {
|
||||
const code = document.getElementById("code").value.toString().trim().toLowerCase();
|
||||
if (document.getElementById("name").classList.contains("error")) {
|
||||
document.getElementById("name").classList.remove("error");
|
||||
document.getElementById("name-error").innerText = "";
|
||||
}
|
||||
sessionStorage.setItem("code", code);
|
||||
let playerId = utility.generateID();
|
||||
sessionStorage.setItem("id", playerId);
|
||||
const playerInfo = {name: document.getElementById("name").value, id: playerId, code: code};
|
||||
socket.emit('joinGame', playerInfo);
|
||||
} else {
|
||||
document.getElementById("join-btn").classList.remove('disabled');
|
||||
document.getElementById("name").classList.add("error");
|
||||
document.getElementById("name-error").innerText = "Name is required.";
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
@@ -1,133 +0,0 @@
|
||||
const finishedArtArray = ["Villager", "Werewolf", "Seer", "Shadow", "Hunter", "Mason", "Minion", "Sorcerer", "Dream Wolf"];
|
||||
|
||||
export class CardManager {
|
||||
constructor() {}
|
||||
|
||||
static createCard(card) {
|
||||
return new Card(card.role, card.team, card.description, card.quantity, card.isTypeOfWerewolf, card.custom, card.saved);
|
||||
}
|
||||
|
||||
// builds element for the informational role modal on the setup page
|
||||
static constructModalRoleElement(card) {
|
||||
const modalRole = document.createElement("div");
|
||||
modalRole.setAttribute("class", "modal-role");
|
||||
const roleClass = card.team === "good" ? "role-village" : "role-wolf";
|
||||
let roleImage;
|
||||
if (card.custom === true) {
|
||||
roleImage = "<img alt='No art' class='card-image-custom' src='/assets/images/custom.svg' />";
|
||||
} else {
|
||||
roleImage = finishedArtArray.includes(card.role) ?
|
||||
"<img alt='No art' src='/assets/images/roles-small/" + card.role.replace(/\s/g, '') + ".png' />"
|
||||
: "<span>Art soon.</span>";
|
||||
}
|
||||
modalRole.innerHTML =
|
||||
"<div>" +
|
||||
roleImage +
|
||||
"<div>" +
|
||||
"<h2 class='" + roleClass + "'>" + card.role + "</h2>" +
|
||||
"<p>" + card.team + "</p>" +
|
||||
"</div>" +
|
||||
"</div>" +
|
||||
"<p>" + card.description + "</p>";
|
||||
return modalRole;
|
||||
}
|
||||
|
||||
static constructDeckBuilderElement(card, index) {
|
||||
const cardContainer = document.createElement("div");
|
||||
|
||||
const quantityClass = card.team === "good" ? "card-quantity quantity-village" : "card-quantity quantity-wolf";
|
||||
|
||||
let cardClass = card.isTypeOfWerewolf ? "card card-werewolf" : "card";
|
||||
cardContainer.setAttribute("class", cardClass);
|
||||
if (card.team === "good") {
|
||||
cardContainer.setAttribute("id", "card-" + index);
|
||||
} else {
|
||||
cardContainer.setAttribute("id", "card-" + index);
|
||||
}
|
||||
cardContainer.innerHTML =
|
||||
"<div class='card-top'>" +
|
||||
"<div class='card-header'>" +
|
||||
"<div>" +
|
||||
"<p class='card-role'>" + card.role + "</p>" +
|
||||
"<div class='" + quantityClass + "'>" + card.quantity + "</div>" +
|
||||
"</div>" +
|
||||
"<p>+</p>" +
|
||||
"</div>" +
|
||||
"</div>";
|
||||
cardContainer.innerHTML = card.custom
|
||||
? cardContainer.innerHTML += "<img class='card-image card-image-custom' src='/assets/images/custom.svg' alt='" + card.role + "'/>"
|
||||
: cardContainer.innerHTML +="<img class='card-image' src='/assets/images/roles-small/" + card.role.replace(/\s/g, '') + ".png' alt='" + card.role + "'/>";
|
||||
cardContainer.innerHTML +=
|
||||
"<div class='card-bottom'>" +
|
||||
"<p>-</p>" +
|
||||
"</div>";
|
||||
|
||||
return cardContainer;
|
||||
}
|
||||
|
||||
static constructCompactDeckBuilderElement(card, index) {
|
||||
const cardContainer = document.createElement("div");
|
||||
|
||||
const quantityClass = card.team === "good" ? "card-quantity quantity-village" : "card-quantity quantity-wolf";
|
||||
|
||||
let cardClass = card.isTypeOfWerewolf ? "compact-card card-werewolf" : "compact-card";
|
||||
cardContainer.setAttribute("class", cardClass);
|
||||
if (card.team === "good") {
|
||||
cardContainer.setAttribute("id", "card-" + index);
|
||||
} else {
|
||||
cardContainer.setAttribute("id", "card-" + index);
|
||||
}
|
||||
cardContainer.innerHTML =
|
||||
"<div class='compact-card-left'>" +
|
||||
"<p>-</p>" +
|
||||
"</div>" +
|
||||
"<div class='compact-card-header'>" +
|
||||
"<p class='card-role'>" + card.role + "</p>" +
|
||||
"<div class='" + quantityClass + "'>" + card.quantity + "</div>" +
|
||||
"</div>" +
|
||||
"<div class='compact-card-right'>" +
|
||||
"<p>+</p>" +
|
||||
"</div>";
|
||||
return cardContainer;
|
||||
}
|
||||
|
||||
static constructCustomCardIndicator(isCondensed, team) {
|
||||
let customCard = document.createElement("div");
|
||||
if (isCondensed) {
|
||||
customCard.classList.add("compact-card", "custom-card");
|
||||
} else {
|
||||
customCard.classList.add("card", "custom-card");
|
||||
}
|
||||
|
||||
if (team === "good") {
|
||||
customCard.setAttribute("id", "custom-good");
|
||||
} else {
|
||||
customCard.setAttribute("id", "custom-evil");
|
||||
}
|
||||
|
||||
let cardHeader = document.createElement("h1");
|
||||
cardHeader.innerText = "Add Custom Role";
|
||||
|
||||
let cardBody = document.createElement("div");
|
||||
cardBody.innerText = "+";
|
||||
|
||||
customCard.appendChild(cardHeader);
|
||||
customCard.appendChild(cardBody);
|
||||
|
||||
return customCard;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
class Card {
|
||||
constructor(role, team, description, quantity, isTypeOfWerewolf, custom, saved) {
|
||||
this.id = null;
|
||||
this.role = role;
|
||||
this.isTypeOfWerewolf = isTypeOfWerewolf;
|
||||
this.team = team;
|
||||
this.description = description;
|
||||
this.quantity = quantity || 0;
|
||||
this.custom = custom;
|
||||
this.saved = saved;
|
||||
}
|
||||
}
|
||||
@@ -1,585 +0,0 @@
|
||||
import {cards} from './cards.js'
|
||||
import {utility} from './util.js'
|
||||
import {CardManager} from './modules/card-manager.js'
|
||||
|
||||
const socket = io();
|
||||
|
||||
class Game {
|
||||
constructor(accessCode, reveals, size, deck, time, hasDreamWolf) {
|
||||
this.accessCode = accessCode;
|
||||
this.reveals = reveals;
|
||||
this.size = size;
|
||||
this.deck = deck;
|
||||
this.time = time;
|
||||
this.players = [];
|
||||
this.status = "lobby";
|
||||
this.hasDreamWolf = hasDreamWolf;
|
||||
this.endTime = null;
|
||||
}
|
||||
}
|
||||
|
||||
let gameSize = 0;
|
||||
let atLeastOnePlayer = false;
|
||||
|
||||
// register event listeners on buttons
|
||||
document.getElementById("reset-btn").addEventListener("click", resetCardQuantities);
|
||||
document.getElementById("create-btn").addEventListener("click", createGame);
|
||||
document.getElementById("role-view-changer-gallery").addEventListener("click", function() { toggleViewChanger(false) });
|
||||
document.getElementById("role-view-changer-list").addEventListener("click", function() { toggleViewChanger(true) });
|
||||
document.getElementById("role-btn").addEventListener("click", function() { displayModal("role-modal", undefined) });
|
||||
document.getElementById("edit-role-btn").addEventListener("click", function() { displayModal("edit-custom-roles-modal", undefined) });
|
||||
document.getElementById("import-role-btn").addEventListener("click", function() {
|
||||
document.getElementById("import-file-input").click();
|
||||
});
|
||||
document.getElementById("import-file-input").addEventListener("change", function(e) {
|
||||
selectRoleImportFile(e);
|
||||
});
|
||||
document.getElementById("custom-role-form").addEventListener("submit", function(e) {
|
||||
addCustomCardToRoles(e);
|
||||
});
|
||||
Array.from(document.getElementsByClassName("close")).forEach(function(element) {
|
||||
element.addEventListener('click', closeModal);
|
||||
});
|
||||
|
||||
// render all of the available cards to the user
|
||||
window.onload = function() {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
document.getElementById("create-game-header").innerText = urlParams.get('reveals') === "true"
|
||||
? "Create Reveal Game"
|
||||
: "Create No-Reveal Game";
|
||||
readInUserCustomRoles();
|
||||
renderAvailableCards(false);
|
||||
};
|
||||
|
||||
function renderAvailableCards(isCondensed) {
|
||||
cards.sort(function(a, b) {
|
||||
return a.role.toUpperCase().localeCompare(b.role);
|
||||
});
|
||||
document.getElementById("card-select-good").innerHTML = "";
|
||||
document.getElementById("card-select-evil").innerHTML = "";
|
||||
document.getElementById("roles").innerHTML = "";
|
||||
document.getElementById("custom-roles").innerHTML = "";
|
||||
|
||||
for (let i = 0; i < cards.length; i ++) {
|
||||
if (!cards[i].quantity) cards[i].quantity = 0;
|
||||
cards[i].team === "good"
|
||||
? renderGoodRole(cards[i], i, isCondensed)
|
||||
: renderEvilRole(cards[i], i, isCondensed);
|
||||
}
|
||||
|
||||
if (document.getElementById("custom-roles").getElementsByClassName("custom-role-edit").length === 0) {
|
||||
document.getElementById("custom-roles").innerHTML = "<h2>You haven't added any custom cards.</h2>";
|
||||
}
|
||||
|
||||
let customCardGood = CardManager.constructCustomCardIndicator(isCondensed, "good");
|
||||
let customCardEvil = CardManager.constructCustomCardIndicator(isCondensed, "evil");
|
||||
document.getElementById("card-select-good").appendChild(customCardGood);
|
||||
document.getElementById("card-select-evil").appendChild(customCardEvil);
|
||||
customCardGood.addEventListener("click", function() {
|
||||
displayModal("custom-card-modal", "Good");
|
||||
});
|
||||
customCardEvil.addEventListener("click", function() {
|
||||
displayModal("custom-card-modal", "Evil");
|
||||
});
|
||||
}
|
||||
|
||||
function renderGoodRole(cardInfo, i, isCondensed) {
|
||||
const card = CardManager.createCard(cardInfo);
|
||||
if (card.custom) {
|
||||
document.getElementById("custom-roles").appendChild(renderCustomRole(cardInfo));
|
||||
}
|
||||
|
||||
document.getElementById("roles").appendChild(CardManager.constructModalRoleElement(card));
|
||||
if (isCondensed) {
|
||||
document.getElementById("card-select-good").appendChild(CardManager.constructCompactDeckBuilderElement(card, i));
|
||||
let cardLeft = document.getElementById("card-" + i).getElementsByClassName("compact-card-left")[0];
|
||||
let cardQuantity = document.getElementById("card-" + i).getElementsByClassName("card-quantity")[0];
|
||||
let cardRight = document.getElementById("card-" + i).getElementsByClassName("compact-card-right")[0];
|
||||
cardRight.addEventListener("click", function() { incrementCardQuantity(cardRight) }, true);
|
||||
cardLeft.addEventListener("click", function() { decrementCardQuantity(cardLeft) }, true);
|
||||
cardRight.card = card;
|
||||
cardRight.quantityEl = cardQuantity;
|
||||
cardLeft.card = card;
|
||||
cardLeft.quantityEl = cardQuantity;
|
||||
} else {
|
||||
document.getElementById("card-select-good").appendChild(CardManager.constructDeckBuilderElement(card, i));
|
||||
// Add event listeners to the top and bottom halves of the card to change the quantity.
|
||||
let cardTop = document.getElementById("card-" + i).getElementsByClassName("card-top")[0];
|
||||
let cardQuantity = document.getElementById("card-" + i).getElementsByClassName("card-quantity")[0];
|
||||
let cardBottom = document.getElementById("card-" + i).getElementsByClassName("card-bottom")[0];
|
||||
cardTop.addEventListener("click", function() { incrementCardQuantity(cardTop) }, false);
|
||||
cardBottom.addEventListener("click", function() { decrementCardQuantity(cardBottom) }, false);
|
||||
cardTop.card = card;
|
||||
cardTop.quantityEl = cardQuantity;
|
||||
cardBottom.card = card;
|
||||
cardBottom.quantityEl = cardQuantity;
|
||||
}
|
||||
}
|
||||
|
||||
function renderEvilRole(cardInfo, i, isCondensed) {
|
||||
const card = CardManager.createCard(cardInfo);
|
||||
if (card.custom) {
|
||||
document.getElementById("custom-roles").appendChild(renderCustomRole(cardInfo));
|
||||
}
|
||||
|
||||
document.getElementById("roles").appendChild(CardManager.constructModalRoleElement(card));
|
||||
if (isCondensed) {
|
||||
document.getElementById("card-select-evil").appendChild(CardManager.constructCompactDeckBuilderElement(card, i));
|
||||
let cardLeft = document.getElementById("card-" + i).getElementsByClassName("compact-card-left")[0];
|
||||
let cardQuantity = document.getElementById("card-" + i).getElementsByClassName("card-quantity")[0];
|
||||
let cardRight = document.getElementById("card-" + i).getElementsByClassName("compact-card-right")[0];
|
||||
cardRight.addEventListener("click", function() { incrementCardQuantity(cardRight) }, false);
|
||||
cardLeft.addEventListener("click", function() { decrementCardQuantity(cardLeft) }, false);
|
||||
cardRight.card = card;
|
||||
cardRight.quantityEl = cardQuantity;
|
||||
cardLeft.card = card;
|
||||
cardLeft.quantityEl = cardQuantity;
|
||||
} else {
|
||||
document.getElementById("card-select-evil").appendChild(CardManager.constructDeckBuilderElement(card, i));
|
||||
// Add event listeners to the top and bottom halves of the card to change the quantity.
|
||||
let cardTop = document.getElementById("card-" + i).getElementsByClassName("card-top")[0];
|
||||
let cardQuantity = document.getElementById("card-" + i).getElementsByClassName("card-quantity")[0];
|
||||
let cardBottom = document.getElementById("card-" + i).getElementsByClassName("card-bottom")[0];
|
||||
cardTop.addEventListener("click", function() { incrementCardQuantity(cardTop) }, false);
|
||||
cardBottom.addEventListener("click", function() { decrementCardQuantity(cardBottom) }, false);
|
||||
cardTop.card = card;
|
||||
cardTop.quantityEl = cardQuantity;
|
||||
cardBottom.card = card;
|
||||
cardBottom.quantityEl = cardQuantity;
|
||||
}
|
||||
}
|
||||
|
||||
function addCustomCardToRoles(e) {
|
||||
e.preventDefault();
|
||||
if (!cards.find((card) => card.role === document.getElementById("custom-role-name").value)) {
|
||||
let newCard = {
|
||||
role: document.getElementById("custom-role-name").value,
|
||||
team: document.getElementById("custom-role-team").value,
|
||||
description: document.getElementById("custom-role-desc").value,
|
||||
isTypeOfWerewolf: document.getElementById("custom-role-wolf").checked,
|
||||
custom: true,
|
||||
saved: document.getElementById("custom-role-remember").checked
|
||||
};
|
||||
cards.push(newCard);
|
||||
renderAvailableCards(document.getElementById("role-view-changer-list").classList.contains("selected"));
|
||||
|
||||
if (newCard.saved === true) {
|
||||
let existingRoles = localStorage.getItem("play-werewolf-custom-roles");
|
||||
if (existingRoles !== null) {
|
||||
let rolesArray;
|
||||
try {
|
||||
rolesArray = JSON.parse(existingRoles);
|
||||
} catch (e) {
|
||||
console.error(e.message);
|
||||
}
|
||||
if (rolesArray) {
|
||||
rolesArray.push(newCard);
|
||||
}
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(rolesArray));
|
||||
} else {
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(new Array(newCard)));
|
||||
}
|
||||
}
|
||||
updateCustomRoleModal();
|
||||
closeModal();
|
||||
document.getElementById("custom-role-form").reset();
|
||||
} else {
|
||||
alert("A custom or standard card already exists with that name!")
|
||||
}
|
||||
}
|
||||
|
||||
function addImportFileToRoles (e) {
|
||||
//parse roles from file
|
||||
let match = /^data:(.*);base64,(.*)$/.exec(e.target.result);
|
||||
if (match == null) {
|
||||
throw 'Could not parse result'; // should not happen
|
||||
}
|
||||
let mimeType = match[1];
|
||||
let content = match[2];
|
||||
let newRoles;
|
||||
try {
|
||||
newRoles = JSON.parse(atob(content));
|
||||
} catch(ex) {
|
||||
console.error(ex.message);
|
||||
}
|
||||
|
||||
//add roles
|
||||
let succesfullyAddedRoles = [];
|
||||
let rolesThatFailedToImport = [];
|
||||
let expectedKeys = ["role", "description", "team", "isTypeOfWerewolf"];
|
||||
newRoles.forEach(newRole => {
|
||||
newRole.custom = true;
|
||||
newRole.saved = true;
|
||||
let newRoleValidationResult = validateNewRole(newRole, expectedKeys);
|
||||
if (newRoleValidationResult.isValid) {
|
||||
succesfullyAddedRoles.push(newRole);
|
||||
}
|
||||
else {
|
||||
rolesThatFailedToImport.push(newRoleValidationResult);
|
||||
}
|
||||
});
|
||||
cards.push(...succesfullyAddedRoles);
|
||||
renderAvailableCards(document.getElementById("role-view-changer-list").classList.contains("selected"));
|
||||
// always save imported roles
|
||||
let existingRoles = localStorage.getItem("play-werewolf-custom-roles");
|
||||
if (existingRoles !== null) {
|
||||
let rolesArray;
|
||||
try {
|
||||
rolesArray = JSON.parse(existingRoles);
|
||||
} catch (e) {
|
||||
console.error(e.message);
|
||||
}
|
||||
if (rolesArray) {
|
||||
rolesArray.push(...succesfullyAddedRoles);
|
||||
}
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(rolesArray));
|
||||
} else {
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(succesfullyAddedRoles));
|
||||
}
|
||||
updateCustomRoleModal();
|
||||
updateImportRolesModal(succesfullyAddedRoles, rolesThatFailedToImport);
|
||||
displayModal("import-custom-roles-result-modal", undefined);
|
||||
}
|
||||
|
||||
function validateNewRole(newCard,expectedKeys) {
|
||||
let newRoleValidationResult = {};
|
||||
newRoleValidationResult.role = newCard;
|
||||
newRoleValidationResult.issues = [];
|
||||
|
||||
//add warning if there already exists a loaded role with the same name
|
||||
if (cards.find((card) => card.role === newCard.role)) {
|
||||
newRoleValidationResult.issues.push({level: "warning", description: "duplicate entry"});
|
||||
}
|
||||
|
||||
//For each required field, add error if the role is missing it
|
||||
let missingKeys = expectedKeys.filter(function(key){ return Object.keys(newCard).indexOf(key) < 0 });
|
||||
missingKeys.forEach(missingKey => {
|
||||
newRoleValidationResult.issues.push({level: "error", description: "Missing data: " + missingKey});
|
||||
});
|
||||
|
||||
newRoleValidationResult.isValid = ( newRoleValidationResult.issues.length == 0 );
|
||||
|
||||
return newRoleValidationResult;
|
||||
}
|
||||
|
||||
function updateCustomRoleModal() {
|
||||
const customRoles = document.getElementById("custom-roles");
|
||||
customRoles.innerHTML = "";
|
||||
for (let i = 0; i < cards.length; i++){
|
||||
if (cards[i].custom) {
|
||||
customRoles.appendChild(renderCustomRole(cards[i]));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateImportRolesModal(succesfullyAddedRoles, rolesThatFailedToImport) {
|
||||
let numAddedRoles = succesfullyAddedRoles.length;
|
||||
if (numAddedRoles > 0) {
|
||||
let successSubheader = (numAddedRoles == 1) ? "role successfully imported" : "roles successfully imported";
|
||||
document.getElementById("import-successes-subheader").innerHTML = numAddedRoles + " " + successSubheader;
|
||||
const successfulRoleList = document.getElementById("import-successes-role-list");
|
||||
successfulRoleList.innerHTML = "";
|
||||
succesfullyAddedRoles.forEach(role => {
|
||||
successfulRoleList.appendChild(renderCustomRole(role));
|
||||
});
|
||||
}
|
||||
|
||||
let numFailedRoles = rolesThatFailedToImport.length;
|
||||
if (numFailedRoles > 0) {
|
||||
let failureSubheader = (numFailedRoles == 1) ? "role failed to import" : "roles failed to import";
|
||||
document.getElementById("import-failures-subheader").innerHTML = numFailedRoles + " " + failureSubheader;
|
||||
document.getElementById("import-failures-issue-list").innerHTML = "";
|
||||
rolesThatFailedToImport.forEach(failureInfo => {
|
||||
document.getElementById("import-failures-issue-list").appendChild(renderImportFailure(failureInfo));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function renderImportFailure(failureInfo) {
|
||||
let importFailure = document.createElement("div");
|
||||
importFailure.classList.add("import-failure");
|
||||
|
||||
let failureLabelContainer = document.createElement("div");
|
||||
failureLabelContainer.classList.add("import-failure-label");
|
||||
let triangle = document.createElement("div");
|
||||
triangle.classList.add("triangle");
|
||||
let roleName = document.createElement("p");
|
||||
roleName.innerText = failureInfo.role.role;
|
||||
failureLabelContainer.appendChild(triangle);
|
||||
failureLabelContainer.appendChild(roleName);
|
||||
|
||||
let issueDescriptionContainer = document.createElement("div");
|
||||
issueDescriptionContainer.classList.add("import-failure-data");
|
||||
let levelSeverityOrder = ["warning", "error"];
|
||||
let levelIdx = 0;
|
||||
let issueDescriptionList = document.createElement("ul");
|
||||
failureInfo.issues.forEach(issue => {
|
||||
let description = document.createElement("li");
|
||||
description.innerText = issue.description;
|
||||
let thisIssueLevelIdx = levelSeverityOrder.indexOf(issue.level);
|
||||
if (thisIssueLevelIdx > levelIdx) { levelIdx = thisIssueLevelIdx; }
|
||||
issueDescriptionList.appendChild(description);
|
||||
});
|
||||
issueDescriptionContainer.appendChild(issueDescriptionList);
|
||||
|
||||
importFailure.classList.add(levelSeverityOrder[levelIdx]);
|
||||
importFailure.appendChild(failureLabelContainer);
|
||||
importFailure.appendChild(issueDescriptionContainer);
|
||||
return importFailure;
|
||||
}
|
||||
|
||||
function readInUserCustomRoles() {
|
||||
let expectedKeys = ["role", "description", "team", "isTypeOfWerewolf", "custom", "saved"];
|
||||
let userCustomRoles = utility.validateCustomRolesJsonObject("play-werewolf-custom-roles", expectedKeys);
|
||||
if (userCustomRoles) {
|
||||
for (let i = 0; i < userCustomRoles.length; i++) {
|
||||
cards.push(userCustomRoles[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function renderCustomRole(card) {
|
||||
let roleElement = document.createElement("div");
|
||||
let editRemoveContainer = document.createElement("div");
|
||||
let editFormDiv = document.createElement("div");
|
||||
let roleLabel = document.createElement("div");
|
||||
let roleName = document.createElement("p");
|
||||
let remove = document.createElement("img");
|
||||
let edit = document.createElement("img");
|
||||
let editRoleTemplate = document.getElementById("edit-custom-role-template");
|
||||
let editForm = editRoleTemplate.content.cloneNode(true);
|
||||
|
||||
roleName.innerText = card.role;
|
||||
remove.setAttribute("src", "../assets/images/delete.svg");
|
||||
remove.setAttribute("title", "Delete");
|
||||
remove.classList.add("custom-role-button");
|
||||
remove.addEventListener("click", function() { removeCustomRole(card.role) });
|
||||
|
||||
edit.setAttribute("src", "../assets/images/pencil_green.svg");
|
||||
edit.setAttribute("title", "Edit");
|
||||
edit.classList.add("custom-role-button");
|
||||
edit.addEventListener("click", function(e) { toggleEditForm(e, editFormDiv, card) });
|
||||
roleElement.setAttribute("class", "custom-role-edit");
|
||||
|
||||
editRemoveContainer.appendChild(remove);
|
||||
editRemoveContainer.appendChild(edit);
|
||||
roleLabel.appendChild(roleName);
|
||||
roleLabel.appendChild(editRemoveContainer);
|
||||
roleElement.appendChild(roleLabel);
|
||||
const shadowRoot = editFormDiv.attachShadow({mode: 'open'});
|
||||
shadowRoot.appendChild(editForm);
|
||||
shadowRoot.getElementById("edit-role-form").addEventListener("submit", function(e) {
|
||||
updateCustomRole(e, editFormDiv, card);
|
||||
});
|
||||
|
||||
editFormDiv.style.display = "none";
|
||||
roleElement.appendChild(editFormDiv);
|
||||
|
||||
return roleElement;
|
||||
}
|
||||
|
||||
function toggleEditForm(event, formDiv, card) {
|
||||
event.preventDefault();
|
||||
let displayRule = formDiv.style.display;
|
||||
formDiv.style.display = displayRule === "none" ? "block" : "none";
|
||||
|
||||
if (formDiv.style.display === "block") {
|
||||
populateEditRoleForm(formDiv, card);
|
||||
}
|
||||
}
|
||||
|
||||
function toggleViewChanger(isCondensed) {
|
||||
|
||||
if (isCondensed) {
|
||||
document.getElementById("role-view-changer-gallery").classList.remove("selected");
|
||||
document.getElementById("role-view-changer-list").classList.add("selected");
|
||||
} else {
|
||||
document.getElementById("role-view-changer-gallery").classList.add("selected");
|
||||
document.getElementById("role-view-changer-list").classList.remove("selected");
|
||||
}
|
||||
renderAvailableCards(isCondensed);
|
||||
}
|
||||
|
||||
function populateEditRoleForm(formDiv, card) {
|
||||
formDiv.shadowRoot.querySelector("#edit-role-desc").value = card.description;
|
||||
formDiv.shadowRoot.querySelector("#edit-role-team").value = card.team;
|
||||
formDiv.shadowRoot.querySelector("#edit-role-wolf").checked = card.isTypeOfWerewolf;
|
||||
formDiv.shadowRoot.querySelector("#edit-role-remember").checked = card.saved;
|
||||
}
|
||||
|
||||
function removeCustomRole(name) {
|
||||
if (confirm("Delete this role?")) {
|
||||
let matchingCards = cards.filter((card) => card.role === name);
|
||||
matchingCards.forEach((card) => {
|
||||
cards.splice(cards.indexOf(card), 1);
|
||||
});
|
||||
let expectedKeys = ["role", "description", "team", "isTypeOfWerewolf", "custom", "saved"];
|
||||
let userCustomRoles = utility.validateCustomRolesJsonObject("play-werewolf-custom-roles", expectedKeys);
|
||||
if (userCustomRoles) {
|
||||
userCustomRoles = userCustomRoles.filter((card) => card.role !== name);
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(userCustomRoles));
|
||||
}
|
||||
updateCustomRoleModal();
|
||||
renderAvailableCards(document.getElementById("role-view-changer-list").classList.contains("selected"));
|
||||
}
|
||||
}
|
||||
|
||||
function updateCustomRole(event, formDiv, cardToUpdate) {
|
||||
event.preventDefault();
|
||||
cardToUpdate.team = formDiv.shadowRoot.querySelector("#edit-role-team").value;
|
||||
cardToUpdate.description = formDiv.shadowRoot.querySelector("#edit-role-desc").value;
|
||||
cardToUpdate.isTypeOfWerewolf = formDiv.shadowRoot.querySelector("#edit-role-wolf").checked;
|
||||
cardToUpdate.saved = formDiv.shadowRoot.querySelector("#edit-role-remember").checked;
|
||||
|
||||
removeOrAddSavedRoleIfNeeded(cardToUpdate);
|
||||
toggleEditForm(event, formDiv, cardToUpdate);
|
||||
renderAvailableCards(document.getElementById("role-view-changer-list").classList.contains("selected"));
|
||||
}
|
||||
|
||||
function removeOrAddSavedRoleIfNeeded(card) {
|
||||
let expectedKeys = ["role", "description", "team", "isTypeOfWerewolf", "custom", "saved"];
|
||||
let userCustomRoles = utility.validateCustomRolesJsonObject("play-werewolf-custom-roles", expectedKeys);
|
||||
if (userCustomRoles) {
|
||||
if (card.saved) {
|
||||
let roleToUpdate = userCustomRoles.find((savedCard) => savedCard.role === card.role);
|
||||
if (roleToUpdate) {
|
||||
userCustomRoles[userCustomRoles.indexOf(roleToUpdate)] = card;
|
||||
} else {
|
||||
userCustomRoles.push(card);
|
||||
}
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(userCustomRoles));
|
||||
} else {
|
||||
let roleToRemove = userCustomRoles.find((savedCard) => savedCard.role === card.role);
|
||||
if (roleToRemove) {
|
||||
userCustomRoles.splice(userCustomRoles.indexOf(roleToRemove), 1);
|
||||
localStorage.setItem("play-werewolf-custom-roles", JSON.stringify(userCustomRoles));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function incrementCardQuantity(e) {
|
||||
if(e.card.quantity < 25) {
|
||||
e.card.quantity += 1;
|
||||
cards.find((card) => card.role === e.card.role).quantity += 1;
|
||||
}
|
||||
e.quantityEl.innerHTML = e.card.quantity;
|
||||
updateGameSize();
|
||||
}
|
||||
|
||||
function decrementCardQuantity(e) {
|
||||
if(e.card.quantity > 0) {
|
||||
e.card.quantity -= 1;
|
||||
cards.find((card) => card.role === e.card.role).quantity -= 1;
|
||||
}
|
||||
e.quantityEl.innerHTML = e.card.quantity;
|
||||
updateGameSize();
|
||||
}
|
||||
|
||||
function updateGameSize() {
|
||||
gameSize = 0;
|
||||
for (let card of cards) {
|
||||
gameSize += card.quantity;
|
||||
}
|
||||
document.getElementById("game-size").innerText = gameSize + " Players";
|
||||
atLeastOnePlayer = gameSize > 0;
|
||||
return gameSize;
|
||||
}
|
||||
|
||||
function resetCardQuantities() {
|
||||
for (let card of cards) {
|
||||
card.quantity = 0;
|
||||
}
|
||||
updateGameSize();
|
||||
Array.prototype.filter.call(document.getElementsByClassName("card-quantity"), function(quantities){
|
||||
return quantities.innerHTML = 0;
|
||||
});
|
||||
}
|
||||
|
||||
function displayModal(modalId, teamForCustomRole) {
|
||||
if (teamForCustomRole === "Good") {
|
||||
document.getElementById("option-evil").removeAttribute("selected");
|
||||
document.getElementById("option-good").setAttribute("selected", "selected");
|
||||
}
|
||||
if (teamForCustomRole === "Evil") {
|
||||
document.getElementById("option-good").removeAttribute("selected");
|
||||
document.getElementById("option-evil").setAttribute("selected", "selected");
|
||||
}
|
||||
document.getElementById(modalId).classList.remove("hidden");
|
||||
document.getElementById("app-content").classList.add("hidden");
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
document.getElementById("role-modal").classList.add("hidden");
|
||||
document.getElementById("custom-card-modal").classList.add("hidden");
|
||||
document.getElementById("edit-custom-roles-modal").classList.add("hidden");
|
||||
document.getElementById("import-custom-roles-result-modal").classList.add("hidden");
|
||||
document.getElementById("app-content").classList.remove("hidden");
|
||||
}
|
||||
|
||||
function buildDeckFromQuantities() {
|
||||
let playerDeck = [];
|
||||
for (const card of cards) {
|
||||
for (let i = 0; i < card.quantity; i++) {
|
||||
card.id = utility.generateID();
|
||||
playerDeck.push(card);
|
||||
}
|
||||
}
|
||||
return playerDeck;
|
||||
}
|
||||
|
||||
function createGame() {
|
||||
if (document.getElementById("name").value.length > 0 && atLeastOnePlayer) {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const revealParam = urlParams.get('reveals');
|
||||
|
||||
// generate 6 digit access code
|
||||
let code = "";
|
||||
let charPool = "abcdefghijklmnopqrstuvwxyz0123456789";
|
||||
for (let i = 0; i < 6; i++) {
|
||||
code += charPool[utility.getRandomInt(36)]
|
||||
}
|
||||
|
||||
// generate unique player Id for session
|
||||
let id = utility.generateID();
|
||||
sessionStorage.setItem("id", id);
|
||||
|
||||
// player who creates the game is the host
|
||||
sessionStorage.setItem("host", true);
|
||||
|
||||
// send a new game to the server, and then join it
|
||||
const playerInfo = {name: document.getElementById("name").value, code: code, id: id};
|
||||
let gameDeck = buildDeckFromQuantities();
|
||||
const game = new Game(
|
||||
code,
|
||||
revealParam === "true",
|
||||
gameSize,
|
||||
gameDeck,
|
||||
Math.ceil(document.getElementById("time").value),
|
||||
gameDeck.find((card) => card.role === "Dream Wolf") !== undefined
|
||||
);
|
||||
socket.emit('newGame', game, function() {
|
||||
socket.emit('joinGame', playerInfo);
|
||||
sessionStorage.setItem('code', code);
|
||||
window.location.replace('/' + code);
|
||||
});
|
||||
} else {
|
||||
document.getElementById("some-error").innerText = "There are problems with your above setup.";
|
||||
if (!atLeastOnePlayer) {
|
||||
document.getElementById("game-size").classList.add("error");
|
||||
} else {
|
||||
document.getElementById("game-size").classList.remove("error");
|
||||
}
|
||||
document.getElementById("name").classList.add("error");
|
||||
document.getElementById("name-error").innerText = "Name is required.";
|
||||
}
|
||||
}
|
||||
function selectRoleImportFile(e) {
|
||||
var files = e.target.files;
|
||||
if (files.length < 1) { return; }
|
||||
var file = files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = addImportFileToRoles;
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
@@ -1,50 +0,0 @@
|
||||
export const utility =
|
||||
{
|
||||
generateID() {
|
||||
let code = "";
|
||||
let charPool = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
|
||||
for (let i = 0; i < 10; i++) {
|
||||
code += charPool[this.getRandomInt(61)]
|
||||
}
|
||||
return code;
|
||||
},
|
||||
|
||||
getRandomInt(max) {
|
||||
return Math.floor(Math.random() * Math.floor(max));
|
||||
},
|
||||
|
||||
shuffle(array) {
|
||||
for (let i = array.length - 1; i > 0; i--) {
|
||||
const j = Math.floor(Math.random() * (i + 1));
|
||||
[array[i], array[j]] = [array[j], array[i]];
|
||||
}
|
||||
return array;
|
||||
},
|
||||
|
||||
validateCustomRolesJsonObject(name, expectedKeys) {
|
||||
let value = localStorage.getItem(name);
|
||||
if (value !== null) {
|
||||
let valueJson;
|
||||
try {
|
||||
valueJson = JSON.parse(value);
|
||||
} catch(e) {
|
||||
console.error(e.message);
|
||||
localStorage.removeItem(name);
|
||||
return false;
|
||||
}
|
||||
if (valueJson && Array.isArray(valueJson)) { // some defensive programming - check if it's an array, and that the object has the expected structure
|
||||
for (let i = 0; i < valueJson.length; i++){
|
||||
if (expectedKeys.some((key) => !Object.keys(valueJson[i]).includes(key))) {
|
||||
console.error("tried to read invalid object: " + valueJson[i] + " with expected keys: " + expectedKeys);
|
||||
valueJson.splice(i, 1);
|
||||
localStorage.setItem(name, JSON.stringify(valueJson));
|
||||
}
|
||||
}
|
||||
return valueJson;
|
||||
} else { // object has been messed with. remove it.
|
||||
localStorage.removeItem(name);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -1,136 +0,0 @@
|
||||
/**
|
||||
Starting with version 2.0, this file "boots" Jasmine, performing all of the necessary initialization before executing the loaded environment and all of a project's specs. This file should be loaded after `jasmine.js` and `jasmine_html.js`, but before any project source files or spec files are loaded. Thus this file can also be used to customize Jasmine for a project.
|
||||
|
||||
If a project is using Jasmine via the standalone distribution, this file can be customized directly. If a project is using Jasmine via the [Ruby gem][jasmine-gem], this file can be copied into the support directory via `jasmine copy_boot_js`. Other environments (e.g., Python) will have different mechanisms.
|
||||
|
||||
The location of `boot.js` can be specified and/or overridden in `jasmine.yml`.
|
||||
|
||||
[jasmine-gem]: http://github.com/pivotal/jasmine-gem
|
||||
*/
|
||||
|
||||
(function() {
|
||||
|
||||
/**
|
||||
* ## Require & Instantiate
|
||||
*
|
||||
* Require Jasmine's core files. Specifically, this requires and attaches all of Jasmine's code to the `jasmine` reference.
|
||||
*/
|
||||
window.jasmine = jasmineRequire.core(jasmineRequire);
|
||||
|
||||
/**
|
||||
* Since this is being run in a browser and the results should populate to an HTML page, require the HTML-specific Jasmine code, injecting the same reference.
|
||||
*/
|
||||
jasmineRequire.html(jasmine);
|
||||
|
||||
/**
|
||||
* Create the Jasmine environment. This is used to run all specs in a project.
|
||||
*/
|
||||
var env = jasmine.getEnv();
|
||||
|
||||
/**
|
||||
* ## The Global Interface
|
||||
*
|
||||
* Build up the functions that will be exposed as the Jasmine public interface. A project can customize, rename or alias any of these functions as desired, provided the implementation remains unchanged.
|
||||
*/
|
||||
var jasmineInterface = jasmineRequire.interface(jasmine, env);
|
||||
|
||||
/**
|
||||
* Add all of the Jasmine global/public interface to the global scope, so a project can use the public interface directly. For example, calling `describe` in specs instead of `jasmine.getEnv().describe`.
|
||||
*/
|
||||
extend(window, jasmineInterface);
|
||||
|
||||
/**
|
||||
* ## Runner Parameters
|
||||
*
|
||||
* More browser specific code - wrap the query string in an object and to allow for getting/setting parameters from the runner user interface.
|
||||
*/
|
||||
|
||||
var queryString = new jasmine.QueryString({
|
||||
getWindowLocation: function() { return window.location; }
|
||||
});
|
||||
|
||||
var filterSpecs = !!queryString.getParam("spec");
|
||||
|
||||
var config = {
|
||||
failFast: queryString.getParam("failFast"),
|
||||
oneFailurePerSpec: queryString.getParam("oneFailurePerSpec"),
|
||||
hideDisabled: queryString.getParam("hideDisabled")
|
||||
};
|
||||
|
||||
var random = queryString.getParam("random");
|
||||
|
||||
if (random !== undefined && random !== "") {
|
||||
config.random = random;
|
||||
}
|
||||
|
||||
var seed = queryString.getParam("seed");
|
||||
if (seed) {
|
||||
config.seed = seed;
|
||||
}
|
||||
|
||||
/**
|
||||
* ## Reporters
|
||||
* The `HtmlReporter` builds all of the HTML UI for the runner page. This reporter paints the dots, stars, and x's for specs, as well as all spec names and all failures (if any).
|
||||
*/
|
||||
var htmlReporter = new jasmine.HtmlReporter({
|
||||
env: env,
|
||||
navigateWithNewParam: function(key, value) { return queryString.navigateWithNewParam(key, value); },
|
||||
addToExistingQueryString: function(key, value) { return queryString.fullStringWithNewParam(key, value); },
|
||||
getContainer: function() { return document.body; },
|
||||
createElement: function() { return document.createElement.apply(document, arguments); },
|
||||
createTextNode: function() { return document.createTextNode.apply(document, arguments); },
|
||||
timer: new jasmine.Timer(),
|
||||
filterSpecs: filterSpecs
|
||||
});
|
||||
|
||||
/**
|
||||
* The `jsApiReporter` also receives spec results, and is used by any environment that needs to extract the results from JavaScript.
|
||||
*/
|
||||
env.addReporter(jasmineInterface.jsApiReporter);
|
||||
env.addReporter(htmlReporter);
|
||||
|
||||
/**
|
||||
* Filter which specs will be run by matching the start of the full name against the `spec` query param.
|
||||
*/
|
||||
var specFilter = new jasmine.HtmlSpecFilter({
|
||||
filterString: function() { return queryString.getParam("spec"); }
|
||||
});
|
||||
|
||||
config.specFilter = function(spec) {
|
||||
return specFilter.matches(spec.getFullName());
|
||||
};
|
||||
|
||||
env.configure(config);
|
||||
|
||||
/**
|
||||
* Setting up timing functions to be able to be overridden. Certain browsers (Safari, IE 8, phantomjs) require this hack.
|
||||
*/
|
||||
window.setTimeout = window.setTimeout;
|
||||
window.setInterval = window.setInterval;
|
||||
window.clearTimeout = window.clearTimeout;
|
||||
window.clearInterval = window.clearInterval;
|
||||
|
||||
/**
|
||||
* ## Execution
|
||||
*
|
||||
* Replace the browser window's `onload`, ensure it's called, and then run all of the loaded specs. This includes initializing the `HtmlReporter` instance and then executing the loaded Jasmine environment. All of this will happen after all of the specs are loaded.
|
||||
*/
|
||||
var currentWindowOnload = window.onload;
|
||||
|
||||
window.onload = function() {
|
||||
if (currentWindowOnload) {
|
||||
currentWindowOnload();
|
||||
}
|
||||
htmlReporter.initialize();
|
||||
env.execute();
|
||||
};
|
||||
|
||||
/**
|
||||
* Helper function for readability above.
|
||||
*/
|
||||
function extend(destination, source) {
|
||||
for (var property in source) destination[property] = source[property];
|
||||
return destination;
|
||||
}
|
||||
|
||||
}());
|
||||
@@ -1,817 +0,0 @@
|
||||
/*
|
||||
Copyright (c) 2008-2019 Pivotal Labs
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
jasmineRequire.html = function(j$) {
|
||||
j$.ResultsNode = jasmineRequire.ResultsNode();
|
||||
j$.HtmlReporter = jasmineRequire.HtmlReporter(j$);
|
||||
j$.QueryString = jasmineRequire.QueryString();
|
||||
j$.HtmlSpecFilter = jasmineRequire.HtmlSpecFilter();
|
||||
};
|
||||
|
||||
jasmineRequire.HtmlReporter = function(j$) {
|
||||
function ResultsStateBuilder() {
|
||||
this.topResults = new j$.ResultsNode({}, '', null);
|
||||
this.currentParent = this.topResults;
|
||||
this.specsExecuted = 0;
|
||||
this.failureCount = 0;
|
||||
this.pendingSpecCount = 0;
|
||||
}
|
||||
|
||||
ResultsStateBuilder.prototype.suiteStarted = function(result) {
|
||||
this.currentParent.addChild(result, 'suite');
|
||||
this.currentParent = this.currentParent.last();
|
||||
};
|
||||
|
||||
ResultsStateBuilder.prototype.suiteDone = function(result) {
|
||||
this.currentParent.updateResult(result);
|
||||
if (this.currentParent !== this.topResults) {
|
||||
this.currentParent = this.currentParent.parent;
|
||||
}
|
||||
|
||||
if (result.status === 'failed') {
|
||||
this.failureCount++;
|
||||
}
|
||||
};
|
||||
|
||||
ResultsStateBuilder.prototype.specStarted = function(result) {};
|
||||
|
||||
ResultsStateBuilder.prototype.specDone = function(result) {
|
||||
this.currentParent.addChild(result, 'spec');
|
||||
|
||||
if (result.status !== 'excluded') {
|
||||
this.specsExecuted++;
|
||||
}
|
||||
|
||||
if (result.status === 'failed') {
|
||||
this.failureCount++;
|
||||
}
|
||||
|
||||
if (result.status == 'pending') {
|
||||
this.pendingSpecCount++;
|
||||
}
|
||||
};
|
||||
|
||||
function HtmlReporter(options) {
|
||||
var config = function() {
|
||||
return (options.env && options.env.configuration()) || {};
|
||||
},
|
||||
getContainer = options.getContainer,
|
||||
createElement = options.createElement,
|
||||
createTextNode = options.createTextNode,
|
||||
navigateWithNewParam = options.navigateWithNewParam || function() {},
|
||||
addToExistingQueryString =
|
||||
options.addToExistingQueryString || defaultQueryString,
|
||||
filterSpecs = options.filterSpecs,
|
||||
htmlReporterMain,
|
||||
symbols,
|
||||
deprecationWarnings = [];
|
||||
|
||||
this.initialize = function() {
|
||||
clearPrior();
|
||||
htmlReporterMain = createDom(
|
||||
'div',
|
||||
{ className: 'jasmine_html-reporter' },
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-banner' },
|
||||
createDom('a', {
|
||||
className: 'jasmine-title',
|
||||
href: 'http://jasmine.github.io/',
|
||||
target: '_blank'
|
||||
}),
|
||||
createDom('span', { className: 'jasmine-version' }, j$.version)
|
||||
),
|
||||
createDom('ul', { className: 'jasmine-symbol-summary' }),
|
||||
createDom('div', { className: 'jasmine-alert' }),
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-results' },
|
||||
createDom('div', { className: 'jasmine-failures' })
|
||||
)
|
||||
);
|
||||
getContainer().appendChild(htmlReporterMain);
|
||||
};
|
||||
|
||||
var totalSpecsDefined;
|
||||
this.jasmineStarted = function(options) {
|
||||
totalSpecsDefined = options.totalSpecsDefined || 0;
|
||||
};
|
||||
|
||||
var summary = createDom('div', { className: 'jasmine-summary' });
|
||||
|
||||
var stateBuilder = new ResultsStateBuilder();
|
||||
|
||||
this.suiteStarted = function(result) {
|
||||
stateBuilder.suiteStarted(result);
|
||||
};
|
||||
|
||||
this.suiteDone = function(result) {
|
||||
stateBuilder.suiteDone(result);
|
||||
|
||||
if (result.status === 'failed') {
|
||||
failures.push(failureDom(result));
|
||||
}
|
||||
addDeprecationWarnings(result);
|
||||
};
|
||||
|
||||
this.specStarted = function(result) {
|
||||
stateBuilder.specStarted(result);
|
||||
};
|
||||
|
||||
var failures = [];
|
||||
this.specDone = function(result) {
|
||||
stateBuilder.specDone(result);
|
||||
|
||||
if (noExpectations(result)) {
|
||||
var noSpecMsg = "Spec '" + result.fullName + "' has no expectations.";
|
||||
if (result.status === 'failed') {
|
||||
console.error(noSpecMsg);
|
||||
} else {
|
||||
console.warn(noSpecMsg);
|
||||
}
|
||||
}
|
||||
|
||||
if (!symbols) {
|
||||
symbols = find('.jasmine-symbol-summary');
|
||||
}
|
||||
|
||||
symbols.appendChild(
|
||||
createDom('li', {
|
||||
className: this.displaySpecInCorrectFormat(result),
|
||||
id: 'spec_' + result.id,
|
||||
title: result.fullName
|
||||
})
|
||||
);
|
||||
|
||||
if (result.status === 'failed') {
|
||||
failures.push(failureDom(result));
|
||||
}
|
||||
|
||||
addDeprecationWarnings(result);
|
||||
};
|
||||
|
||||
this.displaySpecInCorrectFormat = function(result) {
|
||||
return noExpectations(result) && result.status === 'passed'
|
||||
? 'jasmine-empty'
|
||||
: this.resultStatus(result.status);
|
||||
};
|
||||
|
||||
this.resultStatus = function(status) {
|
||||
if (status === 'excluded') {
|
||||
return config().hideDisabled
|
||||
? 'jasmine-excluded-no-display'
|
||||
: 'jasmine-excluded';
|
||||
}
|
||||
return 'jasmine-' + status;
|
||||
};
|
||||
|
||||
this.jasmineDone = function(doneResult) {
|
||||
var banner = find('.jasmine-banner');
|
||||
var alert = find('.jasmine-alert');
|
||||
var order = doneResult && doneResult.order;
|
||||
var i;
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: 'jasmine-duration' },
|
||||
'finished in ' + doneResult.totalTime / 1000 + 's'
|
||||
)
|
||||
);
|
||||
|
||||
banner.appendChild(optionsMenu(config()));
|
||||
|
||||
if (stateBuilder.specsExecuted < totalSpecsDefined) {
|
||||
var skippedMessage =
|
||||
'Ran ' +
|
||||
stateBuilder.specsExecuted +
|
||||
' of ' +
|
||||
totalSpecsDefined +
|
||||
' specs - run all';
|
||||
var skippedLink = addToExistingQueryString('spec', '');
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: 'jasmine-bar jasmine-skipped' },
|
||||
createDom(
|
||||
'a',
|
||||
{ href: skippedLink, title: 'Run all specs' },
|
||||
skippedMessage
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
var statusBarMessage = '';
|
||||
var statusBarClassName = 'jasmine-overall-result jasmine-bar ';
|
||||
var globalFailures = (doneResult && doneResult.failedExpectations) || [];
|
||||
var failed = stateBuilder.failureCount + globalFailures.length > 0;
|
||||
|
||||
if (totalSpecsDefined > 0 || failed) {
|
||||
statusBarMessage +=
|
||||
pluralize('spec', stateBuilder.specsExecuted) +
|
||||
', ' +
|
||||
pluralize('failure', stateBuilder.failureCount);
|
||||
if (stateBuilder.pendingSpecCount) {
|
||||
statusBarMessage +=
|
||||
', ' + pluralize('pending spec', stateBuilder.pendingSpecCount);
|
||||
}
|
||||
}
|
||||
|
||||
if (doneResult.overallStatus === 'passed') {
|
||||
statusBarClassName += ' jasmine-passed ';
|
||||
} else if (doneResult.overallStatus === 'incomplete') {
|
||||
statusBarClassName += ' jasmine-incomplete ';
|
||||
statusBarMessage =
|
||||
'Incomplete: ' +
|
||||
doneResult.incompleteReason +
|
||||
', ' +
|
||||
statusBarMessage;
|
||||
} else {
|
||||
statusBarClassName += ' jasmine-failed ';
|
||||
}
|
||||
|
||||
var seedBar;
|
||||
if (order && order.random) {
|
||||
seedBar = createDom(
|
||||
'span',
|
||||
{ className: 'jasmine-seed-bar' },
|
||||
', randomized with seed ',
|
||||
createDom(
|
||||
'a',
|
||||
{
|
||||
title: 'randomized with seed ' + order.seed,
|
||||
href: seedHref(order.seed)
|
||||
},
|
||||
order.seed
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: statusBarClassName },
|
||||
statusBarMessage,
|
||||
seedBar
|
||||
)
|
||||
);
|
||||
|
||||
var errorBarClassName = 'jasmine-bar jasmine-errored';
|
||||
var afterAllMessagePrefix = 'AfterAll ';
|
||||
|
||||
for (i = 0; i < globalFailures.length; i++) {
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: errorBarClassName },
|
||||
globalFailureMessage(globalFailures[i])
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
function globalFailureMessage(failure) {
|
||||
if (failure.globalErrorType === 'load') {
|
||||
var prefix = 'Error during loading: ' + failure.message;
|
||||
|
||||
if (failure.filename) {
|
||||
return (
|
||||
prefix + ' in ' + failure.filename + ' line ' + failure.lineno
|
||||
);
|
||||
} else {
|
||||
return prefix;
|
||||
}
|
||||
} else {
|
||||
return afterAllMessagePrefix + failure.message;
|
||||
}
|
||||
}
|
||||
|
||||
addDeprecationWarnings(doneResult);
|
||||
|
||||
var warningBarClassName = 'jasmine-bar jasmine-warning';
|
||||
for (i = 0; i < deprecationWarnings.length; i++) {
|
||||
var warning = deprecationWarnings[i];
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: warningBarClassName },
|
||||
'DEPRECATION: ' + warning
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
var results = find('.jasmine-results');
|
||||
results.appendChild(summary);
|
||||
|
||||
summaryList(stateBuilder.topResults, summary);
|
||||
|
||||
if (failures.length) {
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: 'jasmine-menu jasmine-bar jasmine-spec-list' },
|
||||
createDom('span', {}, 'Spec List | '),
|
||||
createDom(
|
||||
'a',
|
||||
{ className: 'jasmine-failures-menu', href: '#' },
|
||||
'Failures'
|
||||
)
|
||||
)
|
||||
);
|
||||
alert.appendChild(
|
||||
createDom(
|
||||
'span',
|
||||
{ className: 'jasmine-menu jasmine-bar jasmine-failure-list' },
|
||||
createDom(
|
||||
'a',
|
||||
{ className: 'jasmine-spec-list-menu', href: '#' },
|
||||
'Spec List'
|
||||
),
|
||||
createDom('span', {}, ' | Failures ')
|
||||
)
|
||||
);
|
||||
|
||||
find('.jasmine-failures-menu').onclick = function() {
|
||||
setMenuModeTo('jasmine-failure-list');
|
||||
};
|
||||
find('.jasmine-spec-list-menu').onclick = function() {
|
||||
setMenuModeTo('jasmine-spec-list');
|
||||
};
|
||||
|
||||
setMenuModeTo('jasmine-failure-list');
|
||||
|
||||
var failureNode = find('.jasmine-failures');
|
||||
for (i = 0; i < failures.length; i++) {
|
||||
failureNode.appendChild(failures[i]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
function failureDom(result) {
|
||||
var failure = createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-spec-detail jasmine-failed' },
|
||||
failureDescription(result, stateBuilder.currentParent),
|
||||
createDom('div', { className: 'jasmine-messages' })
|
||||
);
|
||||
var messages = failure.childNodes[1];
|
||||
|
||||
for (var i = 0; i < result.failedExpectations.length; i++) {
|
||||
var expectation = result.failedExpectations[i];
|
||||
messages.appendChild(
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-result-message' },
|
||||
expectation.message
|
||||
)
|
||||
);
|
||||
messages.appendChild(
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-stack-trace' },
|
||||
expectation.stack
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
if (result.failedExpectations.length === 0) {
|
||||
messages.appendChild(
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-result-message' },
|
||||
'Spec has no expectations'
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
return failure;
|
||||
}
|
||||
|
||||
function summaryList(resultsTree, domParent) {
|
||||
var specListNode;
|
||||
for (var i = 0; i < resultsTree.children.length; i++) {
|
||||
var resultNode = resultsTree.children[i];
|
||||
if (filterSpecs && !hasActiveSpec(resultNode)) {
|
||||
continue;
|
||||
}
|
||||
if (resultNode.type === 'suite') {
|
||||
var suiteListNode = createDom(
|
||||
'ul',
|
||||
{ className: 'jasmine-suite', id: 'suite-' + resultNode.result.id },
|
||||
createDom(
|
||||
'li',
|
||||
{
|
||||
className:
|
||||
'jasmine-suite-detail jasmine-' + resultNode.result.status
|
||||
},
|
||||
createDom(
|
||||
'a',
|
||||
{ href: specHref(resultNode.result) },
|
||||
resultNode.result.description
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
summaryList(resultNode, suiteListNode);
|
||||
domParent.appendChild(suiteListNode);
|
||||
}
|
||||
if (resultNode.type === 'spec') {
|
||||
if (domParent.getAttribute('class') !== 'jasmine-specs') {
|
||||
specListNode = createDom('ul', { className: 'jasmine-specs' });
|
||||
domParent.appendChild(specListNode);
|
||||
}
|
||||
var specDescription = resultNode.result.description;
|
||||
if (noExpectations(resultNode.result)) {
|
||||
specDescription = 'SPEC HAS NO EXPECTATIONS ' + specDescription;
|
||||
}
|
||||
if (
|
||||
resultNode.result.status === 'pending' &&
|
||||
resultNode.result.pendingReason !== ''
|
||||
) {
|
||||
specDescription =
|
||||
specDescription +
|
||||
' PENDING WITH MESSAGE: ' +
|
||||
resultNode.result.pendingReason;
|
||||
}
|
||||
specListNode.appendChild(
|
||||
createDom(
|
||||
'li',
|
||||
{
|
||||
className: 'jasmine-' + resultNode.result.status,
|
||||
id: 'spec-' + resultNode.result.id
|
||||
},
|
||||
createDom(
|
||||
'a',
|
||||
{ href: specHref(resultNode.result) },
|
||||
specDescription
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function optionsMenu(config) {
|
||||
var optionsMenuDom = createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-run-options' },
|
||||
createDom('span', { className: 'jasmine-trigger' }, 'Options'),
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-payload' },
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-stop-on-failure' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-fail-fast',
|
||||
id: 'jasmine-fail-fast',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom(
|
||||
'label',
|
||||
{ className: 'jasmine-label', for: 'jasmine-fail-fast' },
|
||||
'stop execution on spec failure'
|
||||
)
|
||||
),
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-throw-failures' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-throw',
|
||||
id: 'jasmine-throw-failures',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom(
|
||||
'label',
|
||||
{ className: 'jasmine-label', for: 'jasmine-throw-failures' },
|
||||
'stop spec on expectation failure'
|
||||
)
|
||||
),
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-random-order' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-random',
|
||||
id: 'jasmine-random-order',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom(
|
||||
'label',
|
||||
{ className: 'jasmine-label', for: 'jasmine-random-order' },
|
||||
'run tests in random order'
|
||||
)
|
||||
),
|
||||
createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-hide-disabled' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-disabled',
|
||||
id: 'jasmine-hide-disabled',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom(
|
||||
'label',
|
||||
{ className: 'jasmine-label', for: 'jasmine-hide-disabled' },
|
||||
'hide disabled tests'
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
var failFastCheckbox = optionsMenuDom.querySelector('#jasmine-fail-fast');
|
||||
failFastCheckbox.checked = config.failFast;
|
||||
failFastCheckbox.onclick = function() {
|
||||
navigateWithNewParam('failFast', !config.failFast);
|
||||
};
|
||||
|
||||
var throwCheckbox = optionsMenuDom.querySelector(
|
||||
'#jasmine-throw-failures'
|
||||
);
|
||||
throwCheckbox.checked = config.oneFailurePerSpec;
|
||||
throwCheckbox.onclick = function() {
|
||||
navigateWithNewParam('throwFailures', !config.oneFailurePerSpec);
|
||||
};
|
||||
|
||||
var randomCheckbox = optionsMenuDom.querySelector(
|
||||
'#jasmine-random-order'
|
||||
);
|
||||
randomCheckbox.checked = config.random;
|
||||
randomCheckbox.onclick = function() {
|
||||
navigateWithNewParam('random', !config.random);
|
||||
};
|
||||
|
||||
var hideDisabled = optionsMenuDom.querySelector('#jasmine-hide-disabled');
|
||||
hideDisabled.checked = config.hideDisabled;
|
||||
hideDisabled.onclick = function() {
|
||||
navigateWithNewParam('hideDisabled', !config.hideDisabled);
|
||||
};
|
||||
|
||||
var optionsTrigger = optionsMenuDom.querySelector('.jasmine-trigger'),
|
||||
optionsPayload = optionsMenuDom.querySelector('.jasmine-payload'),
|
||||
isOpen = /\bjasmine-open\b/;
|
||||
|
||||
optionsTrigger.onclick = function() {
|
||||
if (isOpen.test(optionsPayload.className)) {
|
||||
optionsPayload.className = optionsPayload.className.replace(
|
||||
isOpen,
|
||||
''
|
||||
);
|
||||
} else {
|
||||
optionsPayload.className += ' jasmine-open';
|
||||
}
|
||||
};
|
||||
|
||||
return optionsMenuDom;
|
||||
}
|
||||
|
||||
function failureDescription(result, suite) {
|
||||
var wrapper = createDom(
|
||||
'div',
|
||||
{ className: 'jasmine-description' },
|
||||
createDom(
|
||||
'a',
|
||||
{ title: result.description, href: specHref(result) },
|
||||
result.description
|
||||
)
|
||||
);
|
||||
var suiteLink;
|
||||
|
||||
while (suite && suite.parent) {
|
||||
wrapper.insertBefore(createTextNode(' > '), wrapper.firstChild);
|
||||
suiteLink = createDom(
|
||||
'a',
|
||||
{ href: suiteHref(suite) },
|
||||
suite.result.description
|
||||
);
|
||||
wrapper.insertBefore(suiteLink, wrapper.firstChild);
|
||||
|
||||
suite = suite.parent;
|
||||
}
|
||||
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
function suiteHref(suite) {
|
||||
var els = [];
|
||||
|
||||
while (suite && suite.parent) {
|
||||
els.unshift(suite.result.description);
|
||||
suite = suite.parent;
|
||||
}
|
||||
|
||||
return addToExistingQueryString('spec', els.join(' '));
|
||||
}
|
||||
|
||||
function addDeprecationWarnings(result) {
|
||||
if (result && result.deprecationWarnings) {
|
||||
for (var i = 0; i < result.deprecationWarnings.length; i++) {
|
||||
var warning = result.deprecationWarnings[i].message;
|
||||
if (!j$.util.arrayContains(warning)) {
|
||||
deprecationWarnings.push(warning);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function find(selector) {
|
||||
return getContainer().querySelector('.jasmine_html-reporter ' + selector);
|
||||
}
|
||||
|
||||
function clearPrior() {
|
||||
// return the reporter
|
||||
var oldReporter = find('');
|
||||
|
||||
if (oldReporter) {
|
||||
getContainer().removeChild(oldReporter);
|
||||
}
|
||||
}
|
||||
|
||||
function createDom(type, attrs, childrenVarArgs) {
|
||||
var el = createElement(type);
|
||||
|
||||
for (var i = 2; i < arguments.length; i++) {
|
||||
var child = arguments[i];
|
||||
|
||||
if (typeof child === 'string') {
|
||||
el.appendChild(createTextNode(child));
|
||||
} else {
|
||||
if (child) {
|
||||
el.appendChild(child);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (var attr in attrs) {
|
||||
if (attr == 'className') {
|
||||
el[attr] = attrs[attr];
|
||||
} else {
|
||||
el.setAttribute(attr, attrs[attr]);
|
||||
}
|
||||
}
|
||||
|
||||
return el;
|
||||
}
|
||||
|
||||
function pluralize(singular, count) {
|
||||
var word = count == 1 ? singular : singular + 's';
|
||||
|
||||
return '' + count + ' ' + word;
|
||||
}
|
||||
|
||||
function specHref(result) {
|
||||
return addToExistingQueryString('spec', result.fullName);
|
||||
}
|
||||
|
||||
function seedHref(seed) {
|
||||
return addToExistingQueryString('seed', seed);
|
||||
}
|
||||
|
||||
function defaultQueryString(key, value) {
|
||||
return '?' + key + '=' + value;
|
||||
}
|
||||
|
||||
function setMenuModeTo(mode) {
|
||||
htmlReporterMain.setAttribute('class', 'jasmine_html-reporter ' + mode);
|
||||
}
|
||||
|
||||
function noExpectations(result) {
|
||||
var allExpectations =
|
||||
result.failedExpectations.length + result.passedExpectations.length;
|
||||
|
||||
return (
|
||||
allExpectations === 0 &&
|
||||
(result.status === 'passed' || result.status === 'failed')
|
||||
);
|
||||
}
|
||||
|
||||
function hasActiveSpec(resultNode) {
|
||||
if (resultNode.type == 'spec' && resultNode.result.status != 'excluded') {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (resultNode.type == 'suite') {
|
||||
for (var i = 0, j = resultNode.children.length; i < j; i++) {
|
||||
if (hasActiveSpec(resultNode.children[i])) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return HtmlReporter;
|
||||
};
|
||||
|
||||
jasmineRequire.HtmlSpecFilter = function() {
|
||||
function HtmlSpecFilter(options) {
|
||||
var filterString =
|
||||
options &&
|
||||
options.filterString() &&
|
||||
options.filterString().replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
|
||||
var filterPattern = new RegExp(filterString);
|
||||
|
||||
this.matches = function(specName) {
|
||||
return filterPattern.test(specName);
|
||||
};
|
||||
}
|
||||
|
||||
return HtmlSpecFilter;
|
||||
};
|
||||
|
||||
jasmineRequire.ResultsNode = function() {
|
||||
function ResultsNode(result, type, parent) {
|
||||
this.result = result;
|
||||
this.type = type;
|
||||
this.parent = parent;
|
||||
|
||||
this.children = [];
|
||||
|
||||
this.addChild = function(result, type) {
|
||||
this.children.push(new ResultsNode(result, type, this));
|
||||
};
|
||||
|
||||
this.last = function() {
|
||||
return this.children[this.children.length - 1];
|
||||
};
|
||||
|
||||
this.updateResult = function(result) {
|
||||
this.result = result;
|
||||
};
|
||||
}
|
||||
|
||||
return ResultsNode;
|
||||
};
|
||||
|
||||
jasmineRequire.QueryString = function() {
|
||||
function QueryString(options) {
|
||||
this.navigateWithNewParam = function(key, value) {
|
||||
options.getWindowLocation().search = this.fullStringWithNewParam(
|
||||
key,
|
||||
value
|
||||
);
|
||||
};
|
||||
|
||||
this.fullStringWithNewParam = function(key, value) {
|
||||
var paramMap = queryStringToParamMap();
|
||||
paramMap[key] = value;
|
||||
return toQueryString(paramMap);
|
||||
};
|
||||
|
||||
this.getParam = function(key) {
|
||||
return queryStringToParamMap()[key];
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
function toQueryString(paramMap) {
|
||||
var qStrPairs = [];
|
||||
for (var prop in paramMap) {
|
||||
qStrPairs.push(
|
||||
encodeURIComponent(prop) + '=' + encodeURIComponent(paramMap[prop])
|
||||
);
|
||||
}
|
||||
return '?' + qStrPairs.join('&');
|
||||
}
|
||||
|
||||
function queryStringToParamMap() {
|
||||
var paramStr = options.getWindowLocation().search.substring(1),
|
||||
params = [],
|
||||
paramMap = {};
|
||||
|
||||
if (paramStr.length > 0) {
|
||||
params = paramStr.split('&');
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
var p = params[i].split('=');
|
||||
var value = decodeURIComponent(p[1]);
|
||||
if (value === 'true' || value === 'false') {
|
||||
value = JSON.parse(value);
|
||||
}
|
||||
paramMap[decodeURIComponent(p[0])] = value;
|
||||
}
|
||||
}
|
||||
|
||||
return paramMap;
|
||||
}
|
||||
}
|
||||
|
||||
return QueryString;
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
23
manifest.json
Normal file
23
manifest.json
Normal file
@@ -0,0 +1,23 @@
|
||||
{
|
||||
"name": "Werewolf Utility",
|
||||
"short_name": "Werewolf",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/client/favicon_package/android-chrome-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/client/favicon_package/android-chrome-512x512.png",
|
||||
"sizes": "512x512",
|
||||
"type": "image/png"
|
||||
}
|
||||
],
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#000000",
|
||||
"start_url": "/?source=pwa",
|
||||
"display": "fullscreen",
|
||||
"display_override": ["fullscreen", "standalone", "minimal-ui"],
|
||||
|
||||
"description": "A utility to deal Werewolf cards and run games in any setting, on any device."
|
||||
}
|
||||
@@ -4,7 +4,10 @@
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"test": "jasmine"
|
||||
"start": "node server/main.js",
|
||||
"test": "jasmine && node browsertest.js openBrowser socket",
|
||||
"test:unit": "jasmine",
|
||||
"test:e2e": "node browsertest.js"
|
||||
},
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
|
||||
206
server-helper.js
206
server-helper.js
@@ -1,206 +0,0 @@
|
||||
const debugMode = Array.from(process.argv.map( (arg)=>arg.trim().toLowerCase() )).includes("debug");
|
||||
const LOGGER = require("./javascript/modules/logger")(debugMode);
|
||||
|
||||
module.exports = class {
|
||||
|
||||
constructor(CronJob) {
|
||||
// TODO: do better than a plain object
|
||||
this.activeGames = {};
|
||||
this.timers = {};
|
||||
|
||||
// cron job for periodically clearing finished games
|
||||
const scope = this;
|
||||
this.job = new CronJob('0 0 */2 * * *', function() {
|
||||
console.log(scope.activeGames);
|
||||
for (const key in scope.activeGames) {
|
||||
if (scope.activeGames.hasOwnProperty(key) && (Math.abs((new Date()) - (new Date(scope.activeGames[key].startTime))) / 36e5) >= 2) {
|
||||
delete scope.activeGames[key];
|
||||
}
|
||||
}
|
||||
console.log("Games pruned at: " + (new Date().toDateString()) + " " + (new Date()).toTimeString());
|
||||
});
|
||||
console.log("cron job created");
|
||||
this.job.start();
|
||||
}
|
||||
|
||||
killPlayer(id, code) {
|
||||
let game = this.findGame(code);
|
||||
if (game) {
|
||||
let player = game.players.find((player) => player.id === id);
|
||||
if (player) {
|
||||
player.dead = true;
|
||||
player.deadAt = new Date().toJSON();
|
||||
game.killedPlayer = player.name;
|
||||
game.lastKilled = player.id;
|
||||
game.killedRole = player.card.role;
|
||||
game.message = game.reveals
|
||||
? player.name + ", a " + player.card.role + ", was killed!"
|
||||
: player.name + " has died!";
|
||||
console.log(game.message);
|
||||
if (player.card.isTypeOfWerewolf && game.hasDreamWolf) {
|
||||
this.activateDreamWolvesIfNeeded(game);
|
||||
}
|
||||
const winCheck = module.exports.teamWon(game);
|
||||
if (winCheck === "wolf") {
|
||||
console.log("wolves won the game!");
|
||||
game.winningTeam = "wolf";
|
||||
game.status = "ended";
|
||||
}
|
||||
if (winCheck === "village") {
|
||||
console.log("village won the game!");
|
||||
game.winningTeam = "village";
|
||||
game.status = "ended";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
endGameDueToTimeExpired(code) {
|
||||
if (this.timers[code]) {
|
||||
clearInterval(this.timers[code]);
|
||||
}
|
||||
let game = this.findGame(code);
|
||||
if (game) {
|
||||
LOGGER.debug("Game " + code + " has ended due to expired timer.");
|
||||
game.winningTeam = "wolf";
|
||||
game.status = "ended";
|
||||
}
|
||||
}
|
||||
|
||||
clearGameTimer(code) {
|
||||
if (this.timers[code]) {
|
||||
clearInterval(this.timers[code]);
|
||||
LOGGER.debug("game paused and timer cleared for " + code);
|
||||
}
|
||||
}
|
||||
|
||||
resumeGame(code) {
|
||||
let game = this.findGame(code);
|
||||
if (game) {
|
||||
game.paused = false;
|
||||
let newTime = new Date(game.endTime).getTime() + (new Date().getTime() - new Date(game.pauseTime).getTime());
|
||||
let newDate = new Date(game.endTime);
|
||||
newDate.setTime(newTime);
|
||||
game.endTime = newDate.toJSON();
|
||||
LOGGER.debug("Game " + code + " timer has been unpaused, starting clock anew...");
|
||||
this.startGameClock(code, newDate - Date.now());
|
||||
}
|
||||
}
|
||||
|
||||
pauseGame(code) {
|
||||
let game = this.findGame(code);
|
||||
if (game) {
|
||||
game.pauseTime = (new Date()).toJSON();
|
||||
game.paused = true;
|
||||
this.clearGameTimer(code);
|
||||
}
|
||||
}
|
||||
|
||||
startGameClock(code, time) {
|
||||
LOGGER.debug("timer started for game " + code);
|
||||
let moduleScope = this;
|
||||
if (this.timers[code]) {
|
||||
clearInterval(this.timers[code]);
|
||||
}
|
||||
this.timers[code] = setInterval(function() {
|
||||
moduleScope.endGameDueToTimeExpired(code)
|
||||
}, time);
|
||||
}
|
||||
|
||||
startGame(gameData) {
|
||||
let game = this.findGame(gameData.code);
|
||||
if (game) {
|
||||
LOGGER.debug("game " + gameData.code + " started");
|
||||
game.status = "started";
|
||||
game.players = gameData.players;
|
||||
if (game.time) {
|
||||
let d = new Date();
|
||||
d.setMinutes(d.getMinutes() + parseInt(game.time));
|
||||
game.endTime = d.toJSON();
|
||||
this.startGameClock(gameData.code, game.time * 60 * 1000); // provided time is in minutes
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
requestState(data, socket) {
|
||||
const game = this.findGame(data.code);
|
||||
if (game && Object.keys(socket.rooms).includes(data.code) === false) {
|
||||
socket.join(data.code, function() {
|
||||
socket.emit('state', game);
|
||||
});
|
||||
} else {
|
||||
if (game) {
|
||||
socket.emit('state', game);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
joinGame(playerInfo, socket) {
|
||||
|
||||
const game = this.findGame(playerInfo.code);
|
||||
if (game && game.players.length < game.size && !game.players.find((player) => player.id === playerInfo.id)) {
|
||||
game.players.push({name: playerInfo.name, id: playerInfo.id});
|
||||
console.log(playerInfo.name + " joined the game!");
|
||||
socket.emit('success');
|
||||
} else {
|
||||
if (game && game.players.length === game.size) {
|
||||
socket.emit("joinError", "This game is full - sorry!");
|
||||
} else {
|
||||
socket.emit("joinError", "No game found");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
newGame(game, onSuccess) {
|
||||
this.activeGames[game.accessCode] = game;
|
||||
this.activeGames[game.accessCode].startTime = (new Date()).toJSON();
|
||||
console.log("Game created at " + (new Date().toDateString()) + " " + (new Date()).toTimeString());
|
||||
onSuccess();
|
||||
}
|
||||
|
||||
findGame(code) {
|
||||
return this.activeGames[Object.keys(this.activeGames).find((key) => key === code)];
|
||||
}
|
||||
|
||||
// If there are multiple dream wolves, convert them all.
|
||||
activateDreamWolvesIfNeeded(game) {
|
||||
game.players.forEach((player) => {
|
||||
if (!player.dead && player.card.role === "Dream Wolf") {
|
||||
player.card.isTypeOfWerewolf = true;
|
||||
console.log("player " + player.name + " was converted to a wolf!");
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
static teamWon(game) {
|
||||
let wolvesAlive = 0;
|
||||
let villagersAlive = 0;
|
||||
let totalAlive = 0;
|
||||
let hunterAlive = false;
|
||||
for (const player of game.players) {
|
||||
if (!player.card.isTypeOfWerewolf && !player.dead) {
|
||||
villagersAlive ++;
|
||||
}
|
||||
if (player.card.isTypeOfWerewolf && !player.dead) {
|
||||
wolvesAlive ++;
|
||||
}
|
||||
if (player.card.role === "Hunter" && !player.dead) {
|
||||
hunterAlive = true;
|
||||
}
|
||||
if (!player.dead) {
|
||||
totalAlive ++;
|
||||
}
|
||||
}
|
||||
if (wolvesAlive === 0) {
|
||||
return "village"
|
||||
}
|
||||
if ((wolvesAlive >= villagersAlive) && (totalAlive !== 2)) {
|
||||
return "wolf";
|
||||
}
|
||||
if (totalAlive === 2) {
|
||||
return hunterAlive ? "village" : "wolf"
|
||||
}
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
79
server.js
79
server.js
@@ -1,79 +0,0 @@
|
||||
// Dependencies
|
||||
const express = require('express');
|
||||
const http = require('http');
|
||||
const socketIO = require('socket.io');
|
||||
const app = express();
|
||||
const server = http.Server(app);
|
||||
const io = socketIO(server);
|
||||
const ServerHelper = require('./server-helper.js');
|
||||
const secure = require('express-force-https');
|
||||
app.use(secure);
|
||||
|
||||
// Link websocket interaction functions, separated to aid testing
|
||||
const CronJob = require('cron').CronJob;
|
||||
const serverHelper = new ServerHelper(CronJob);
|
||||
|
||||
const debugMode = Array.from(process.argv.map( (arg)=>arg.trim().toLowerCase() )).includes("debug");
|
||||
const LOGGER = require("./javascript/modules/logger")(debugMode);
|
||||
|
||||
app.set('port', 5000);
|
||||
|
||||
app.use('/javascript', express.static(__dirname + '/javascript')); // Routing
|
||||
app.use('/assets', express.static(__dirname + '/assets')); // Routing
|
||||
app.use('/stylesheets', express.static(__dirname + '/stylesheets')); // Routing
|
||||
app.use('/node_modules/socket.io-client', express.static(__dirname + '/node_modules/socket.io-client')); // Routing
|
||||
app.get('', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/index.html');
|
||||
});
|
||||
|
||||
app.get('/learn', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/learn.html');
|
||||
});
|
||||
|
||||
app.get('/faq', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/faq.html');
|
||||
});
|
||||
|
||||
app.get('/create', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/create_game.html');
|
||||
});
|
||||
|
||||
app.get('/join', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/join_game.html');
|
||||
});
|
||||
|
||||
app.get('/:code', function(request, response) {
|
||||
response.sendFile(__dirname + '/views/game.html');
|
||||
});
|
||||
|
||||
// Starts the server.
|
||||
server.listen(process.env.PORT || 5000, function() {
|
||||
console.log('Starting server on port 5000');
|
||||
});
|
||||
|
||||
// Add the WebSocket handlers
|
||||
io.on('connection', function(socket) {
|
||||
socket.on('newGame', function(game, onSuccess) {
|
||||
serverHelper.newGame(game, onSuccess);
|
||||
});
|
||||
socket.on('joinGame', function(playerInfo) {
|
||||
serverHelper.joinGame(playerInfo, socket);
|
||||
});
|
||||
// send the game state to the client that requested it
|
||||
socket.on('requestState', function(data) {
|
||||
serverHelper.requestState(data, socket);
|
||||
});
|
||||
socket.on('startGame', function(gameData) {
|
||||
serverHelper.startGame(gameData);
|
||||
});
|
||||
socket.on('pauseGame', function(code) {
|
||||
serverHelper.pauseGame(code);
|
||||
});
|
||||
socket.on('resumeGame', function(code) {
|
||||
serverHelper.resumeGame(code);
|
||||
});
|
||||
socket.on('killPlayer', function(id, code) {
|
||||
serverHelper.killPlayer(id, code);
|
||||
});
|
||||
});
|
||||
|
||||
94
server/main.js
Normal file
94
server/main.js
Normal file
@@ -0,0 +1,94 @@
|
||||
const express = require('express');
|
||||
const http = require('http');
|
||||
const https = require('https');
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
const socketIO = require('socket.io');
|
||||
const app = express();
|
||||
let main;
|
||||
const bodyParser = require('body-parser');
|
||||
// const GameManager = require('./modules/managers/GameManager.js');
|
||||
// const QueueManager = require('./modules/managers/QueueManager');
|
||||
|
||||
app.use(bodyParser.json()); // to support JSON-encoded bodies
|
||||
app.use(bodyParser.urlencoded({ // to support URL-encoded bodies
|
||||
extended: true
|
||||
}));
|
||||
|
||||
const debugMode = Array.from(process.argv.map((arg) => arg.trim().toLowerCase())).includes('debug');
|
||||
const localServer = Array.from(process.argv.map((arg) => arg.trim().toLowerCase())).includes('local');
|
||||
const useHttps = Array.from(process.argv.map((arg) => arg.trim().toLowerCase())).includes('https');
|
||||
const port = process.env.PORT || Array
|
||||
.from(process.argv.map((arg) => {
|
||||
return arg.trim().toLowerCase();
|
||||
}))
|
||||
.filter((arg) => {
|
||||
return /port=\d+/.test(arg);
|
||||
})
|
||||
.map((arg) => {
|
||||
return /port=(\d+)/.exec(arg)[1];
|
||||
})[0] || 5000;
|
||||
const logger = require('./modules/Logger')(debugMode);
|
||||
|
||||
if (localServer) {
|
||||
logger.log('starting main in LOCAL mode.');
|
||||
if (useHttps && fs.existsSync(path.join(__dirname, './certs/localhost-key.pem')) && fs.existsSync(path.join(__dirname, './certs/localhost.pem'))) {
|
||||
const key = fs.readFileSync(path.join(__dirname, './certs/localhost-key.pem'), 'utf-8');
|
||||
const cert = fs.readFileSync(path.join(__dirname, './certs/localhost.pem'), 'utf-8');
|
||||
logger.log('local certs detected. Using HTTPS.');
|
||||
main = https.createServer({ key, cert }, app);
|
||||
logger.log(`navigate to https://localhost:${port}`);
|
||||
} else {
|
||||
logger.log('https not specified or no local certs detected. Using HTTP.');
|
||||
main = http.createServer(app);
|
||||
logger.log(`navigate to http://localhost:${port}`);
|
||||
}
|
||||
} else {
|
||||
logger.log('starting main in PRODUCTION mode. WARNING: This should not be used for local development.');
|
||||
main = http.createServer(app);
|
||||
const secure = require('express-force-https');
|
||||
app.use(secure);
|
||||
}
|
||||
|
||||
const io = socketIO(main);
|
||||
|
||||
app.set('port', port);
|
||||
|
||||
/* Instantiate the singleton game manager */
|
||||
//const gameManager = new GameManager(logger).getInstance();
|
||||
|
||||
/* Instantiate the singleton queue manager */
|
||||
//const queueManager = new QueueManager(matchmaking, logger).getInstance();
|
||||
|
||||
|
||||
/* api endpoints */
|
||||
// const games = require('./api/GamesAPI');
|
||||
// const words = require('./api/WordsAPI');
|
||||
// app.use('/api/games', games);
|
||||
// app.use('/api/words', words);
|
||||
|
||||
/* serve all the app's pages */
|
||||
app.use('/manifest.json', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, '../manifest.json'));
|
||||
});
|
||||
|
||||
app.use('/favicon.ico', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, '../client/favicon_package/favicon.ico'));
|
||||
});
|
||||
|
||||
const router = require('./routes/router');
|
||||
const faviconRouter = require('./routes/favicon-router');
|
||||
const staticRouter = require('./routes/static-router');
|
||||
|
||||
app.use('', router);
|
||||
app.use('', staticRouter);
|
||||
app.use('', faviconRouter);
|
||||
|
||||
app.use(function (req, res) {
|
||||
res.sendFile(path.join(__dirname, '../client/views/404.html'));
|
||||
});
|
||||
|
||||
// Starts the main.
|
||||
main.listen(port, function () {
|
||||
logger.log(`Starting server on port ${port} http://localhost:${port}` );
|
||||
});
|
||||
@@ -1,17 +1,17 @@
|
||||
module.exports = function(debugMode = false){
|
||||
module.exports = function (debugMode = false) {
|
||||
return {
|
||||
log(message = "") {
|
||||
log (message = '') {
|
||||
const now = new Date();
|
||||
console.log('LOG ', now.toGMTString(), ': ', message);
|
||||
},
|
||||
|
||||
debug(message = "") {
|
||||
debug (message = '') {
|
||||
if (!debugMode) return;
|
||||
const now = new Date();
|
||||
console.debug('DEBUG ', now.toGMTString(), ': ', message);
|
||||
},
|
||||
|
||||
error(message = "") {
|
||||
error (message = '') {
|
||||
if (!debugMode) return;
|
||||
const now = new Date();
|
||||
console.error('ERROR ', now.toGMTString(), ': ', message);
|
||||
18
server/routes/favicon-router.js
Normal file
18
server/routes/favicon-router.js
Normal file
@@ -0,0 +1,18 @@
|
||||
const express = require('express');
|
||||
const faviconRouter = express.Router();
|
||||
const path = require('path');
|
||||
const checkIfFileExists = require("./util");
|
||||
|
||||
faviconRouter.use('/client/favicon_package/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../../' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.png' || extension === '.ico' || extension === '.svg' || extension === 'xml')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendStatus(404);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
module.exports = faviconRouter;
|
||||
13
server/routes/router.js
Normal file
13
server/routes/router.js
Normal file
@@ -0,0 +1,13 @@
|
||||
const express = require('express');
|
||||
const router = express.Router();
|
||||
const path = require('path');
|
||||
|
||||
router.get('/', function (request, response) {
|
||||
response.sendFile(path.join(__dirname, '../../client/views/home.html'));
|
||||
});
|
||||
|
||||
router.get('/create', function (request, response) {
|
||||
response.sendFile(path.join(__dirname, '../../client/views/create.html'));
|
||||
});
|
||||
|
||||
module.exports = router;
|
||||
66
server/routes/static-router.js
Normal file
66
server/routes/static-router.js
Normal file
@@ -0,0 +1,66 @@
|
||||
const express = require('express');
|
||||
const staticRouter = express.Router();
|
||||
const path = require('path');
|
||||
const checkIfFileExists = require("./util");
|
||||
|
||||
staticRouter.use('/styles/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../../client/' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.css')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendStatus(404);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
staticRouter.use('/client/webfonts/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.ttf' || extension === '.woff2')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendStatus(404);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
staticRouter.use('/client/images/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.svg' || extension === '.png' || extension === '.jpg')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendStatus(404);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
staticRouter.use('/scripts/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../../client/' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.js')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendStatus(404);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
staticRouter.use('/views/*', (req, res) => {
|
||||
let filePath = path.join(__dirname, ('../../client/' + req.baseUrl));
|
||||
let extension = path.extname(filePath);
|
||||
checkIfFileExists(filePath).then((fileExists) => {
|
||||
if (fileExists && (extension === '.html')) {
|
||||
res.sendFile(filePath);
|
||||
} else {
|
||||
res.sendFile('../views/404.html');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
module.exports = staticRouter;
|
||||
9
server/routes/util.js
Normal file
9
server/routes/util.js
Normal file
@@ -0,0 +1,9 @@
|
||||
const fs = require('fs');
|
||||
|
||||
function checkIfFileExists(file) {
|
||||
return fs.promises.access(file, fs.constants.F_OK)
|
||||
.then(() => true)
|
||||
.catch((e) => { console.error(e); return false });
|
||||
}
|
||||
|
||||
module.exports = checkIfFileExists;
|
||||
@@ -1,11 +0,0 @@
|
||||
{
|
||||
"spec_dir": "spec/unit",
|
||||
"spec_files": [
|
||||
"**/*[sS]pec.js"
|
||||
],
|
||||
"helpers": [
|
||||
"helpers/**/*.js"
|
||||
],
|
||||
"stopSpecOnExpectationFailure": false,
|
||||
"random": true
|
||||
}
|
||||
@@ -1,65 +0,0 @@
|
||||
const ServerHelper = require('../../server-helper.js');
|
||||
const CronJob = require('cron').CronJob;
|
||||
|
||||
describe('server helper', function() {
|
||||
|
||||
let serverHelper;
|
||||
|
||||
beforeEach(function(){
|
||||
serverHelper = new ServerHelper(CronJob);
|
||||
});
|
||||
|
||||
it('should be instantiated with a cron job', function() {
|
||||
|
||||
expect(serverHelper.job).toBeDefined();
|
||||
expect(serverHelper.job instanceof CronJob).toBeTrue();
|
||||
|
||||
});
|
||||
|
||||
it('should find a specific game by code in activeGames', function() {
|
||||
|
||||
const expectedGame = {"startTime": 12345};
|
||||
serverHelper.activeGames = {
|
||||
"somegame": {"startTime": 24156},
|
||||
"expected": expectedGame,
|
||||
"filler": {"eh": "i dunno"},
|
||||
"wrong": {"this is": -Infinity}
|
||||
};
|
||||
|
||||
expect(serverHelper.findGame("expected")).toBe(expectedGame);
|
||||
|
||||
});
|
||||
|
||||
it('should create a new game', function(){
|
||||
|
||||
const spy = jasmine.createSpy("spy");
|
||||
const game = {"accessCode": "werewolf"};
|
||||
|
||||
serverHelper.newGame(game,spy);
|
||||
|
||||
expect(serverHelper.findGame("werewolf")).toBeDefined();
|
||||
expect(serverHelper.findGame("werewolf").accessCode).toEqual("werewolf");
|
||||
expect(spy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
xdescribe('should handle players joining', function() {
|
||||
|
||||
const socket = {
|
||||
"emit": (value) => {
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
it('successful adds a player to game', function() {
|
||||
|
||||
});
|
||||
|
||||
it('rejects a player when the game is full', function() {
|
||||
|
||||
});
|
||||
|
||||
it('rejects a player when game is not found', function() {
|
||||
|
||||
});
|
||||
});
|
||||
});
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,165 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Werewolf</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
<script src="../node_modules/socket.io-client/dist/socket.io.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="modal hidden" id="role-modal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<span class="close" class="close">×</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="roles"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template id="edit-custom-role-template">
|
||||
<link rel="stylesheet" href="/stylesheets/styles.css">
|
||||
<form class="edit-role-form" id="edit-role-form">
|
||||
<label for="edit-role-desc">Description</label>
|
||||
<textarea rows="3" id="edit-role-desc" required></textarea>
|
||||
<label for="edit-role-team">Team</label>
|
||||
<select id="edit-role-team">
|
||||
<option value="good">Good</option>
|
||||
<option value="evil">Evil</option>
|
||||
</select>
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="edit-role-wolf">
|
||||
<label for="edit-role-wolf">Werewolf role (counts for parity)</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="edit-role-remember">
|
||||
<label for="edit-role-remember">Remember this role for later (uses cookies)</label>
|
||||
</div>
|
||||
<br><br>
|
||||
<input type="submit" class="app-btn" value="Update">
|
||||
</form>
|
||||
</template>
|
||||
<div class="modal hidden" id="edit-custom-roles-modal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<span class="close" class="close">×</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="custom-roles"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hidden" id="import-custom-roles-result-modal">
|
||||
<input type="file" id="import-file-input" />
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<span class="close" class="close">×</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="import-successes">
|
||||
<h2 id="import-successes-subheader"></h2>
|
||||
<div id="import-successes-role-list"></div>
|
||||
</div>
|
||||
<div id="import-failures">
|
||||
<h2 id="import-failures-subheader"></h2>
|
||||
<div id="import-failures-issue-list"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hidden" id="custom-card-modal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<span class="close" class="close">×</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<h2>Add a Custom Role</h2>
|
||||
<form id="custom-role-form">
|
||||
<label for="custom-role-name">Name</label>
|
||||
<input id="custom-role-name" type="text" autocomplete="off" required/>
|
||||
<label for="custom-role-desc">Description</label>
|
||||
<textarea rows="3" id="custom-role-desc" required></textarea>
|
||||
<label for="custom-role-team">Team</label>
|
||||
<select id="custom-role-team">
|
||||
<option id="option-good" value="good">Good</option>
|
||||
<option id="option-evil" value="evil">Evil</option>
|
||||
</select>
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="custom-role-wolf">
|
||||
<label for="custom-role-wolf">Werewolf role (counts for parity)</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="custom-role-remember">
|
||||
<label for="custom-role-remember">Remember this role for later (uses cookies)</label>
|
||||
</div>
|
||||
<br><br>
|
||||
<input type="submit" class="app-btn" value="Add Role">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="app-content">
|
||||
<div id="create-game-container">
|
||||
<h2 id="create-game-header" class="app-header-secondary">Create A Game</h2>
|
||||
<label>
|
||||
Your Name
|
||||
<span>
|
||||
<input id="name" type="text" autocomplete="off"/>
|
||||
<p id="name-error"></p>
|
||||
</span>
|
||||
</label>
|
||||
<label>
|
||||
Time (Minutes, Optional)
|
||||
<input id="time" type="number" autocomplete="off"/>
|
||||
</label>
|
||||
<div id="card-select-header">
|
||||
<span>
|
||||
<button id="reset-btn" class="app-btn">Reset Deck</button>
|
||||
<button id="role-btn" class="app-btn">View Role Info</button>
|
||||
</span>
|
||||
<span>
|
||||
<div>
|
||||
<h3 id="game-size">0 Players</h3>
|
||||
<button id="edit-role-btn" class="app-btn-secondary">Manage Custom Roles
|
||||
<img src="../assets/images/pencil.svg"/>
|
||||
</button>
|
||||
<button id="import-role-btn" class="app-btn-secondary">Import Custom Roles
|
||||
<img src="../assets/images/import.svg"/>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<div id="werewolf-key"></div>
|
||||
<div> = Werewolf role (counts for <a href="/faq">parity</a>)</div>
|
||||
</div>
|
||||
</span>
|
||||
<span id="role-view-changer">
|
||||
<div id="role-view-changer-gallery" class="selected">
|
||||
<p>Gallery View</p>
|
||||
<img src="../assets/images/gallery.svg"/>
|
||||
</div>
|
||||
<div id="role-view-changer-list">
|
||||
<p>Condensed View</p>
|
||||
<img src="../assets/images/list.svg"/>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
<div id="card-select">
|
||||
<h2>Good Roles</h2>
|
||||
<div id="card-select-good"></div>
|
||||
<h2>Evil Roles</h2>
|
||||
<div id="card-select-evil"></div>
|
||||
</div>
|
||||
<div id="game-start">
|
||||
<a href="/">
|
||||
<button class="app-btn">Back</button>
|
||||
</a>
|
||||
<button id="create-btn" class="app-btn">Create</button>
|
||||
</div>
|
||||
<p id="some-error"></p>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="/javascript/setup.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,30 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="faq-container">
|
||||
<a href="/"><button class="app-btn">Back</button></a>
|
||||
<h2>FAQ</h2>
|
||||
<div class="faq-question">
|
||||
<h3 class="faq-header" id="parity">What is Parity?</h3>
|
||||
<p class="faq-answer"><i>Parity</i> means equal, and in the context of the game, this refers to an equal number of wolves and villagers.
|
||||
This is a victory condition for the wolves, because if at any time during the day parity is reached, it is certain that the wolves
|
||||
will be able to kill all the remaining villagers. Thus, if a standard or custom role is marked as a Werewolf, it will be considered
|
||||
when the game determines if parity has been reached.
|
||||
</p>
|
||||
</div>
|
||||
<div class="faq-question">
|
||||
<h3 class="faq-header" id="reveals">What does it mean when a game is "Reveal" or "No-Reveal"?</h3>
|
||||
<p class="faq-answer">If you are playing a game with "reveals," players' roles will be revealed when they die. Otherwise, they remain a mystery.</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,27 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Werewolf</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
<script src="../node_modules/socket.io-client/dist/socket.io.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app-content">
|
||||
<div id='overlay'>
|
||||
<h2 id="killed-name"></h2>
|
||||
<img id="killed-role" src="data:," alt>
|
||||
</div>
|
||||
<div id="message-box"></div>
|
||||
<div id="lobby-container"></div>
|
||||
<div id="game-container">
|
||||
<div id="card-container"></div>
|
||||
</div>
|
||||
<div id="end-container"></div>
|
||||
<div id="launch"></div>
|
||||
</div>
|
||||
<script type="module" src="/javascript/game.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,57 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Werewolf</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
<script src="../node_modules/socket.io-client/dist/socket.io.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="landing-container">
|
||||
<div class="app-title">
|
||||
<img src="../assets/images/Wolf_Logo.gif" alt="Where Are the Wolves?" />
|
||||
</div>
|
||||
<div id="main-buttons">
|
||||
<button class="app-btn" id="create-game">Create Game</button>
|
||||
<a href="/join">
|
||||
<button class="app-btn">Join</button>
|
||||
</a>
|
||||
<a href="/learn">
|
||||
<button class="app-btn">Learn the Game</button>
|
||||
</a>
|
||||
<a href="/faq">
|
||||
<button class="app-btn">FAQ</button>
|
||||
</a>
|
||||
</div>
|
||||
<div id="game-mode-select" style="display: none;">
|
||||
<span id="game-mode-back">‹</span>
|
||||
<a href="/faq#reveals">What is this?</a>
|
||||
<a href="/create?reveals=true">
|
||||
<div class="game-mode" id="game-mode-reveals">Reveal</div>
|
||||
</a>
|
||||
<a href="/create?reveals=false">
|
||||
<div class="game-mode" id="game-mode-no-reveals">No-Reveal</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<footer id="footer">
|
||||
<a class="bmc-button" target="_blank" href="https://www.buymeacoffee.com/alecm33">
|
||||
<span alt="Buy me a beer">🍺</span>
|
||||
<span style="margin-left:5px;">Buy me a beer</span>
|
||||
</a>
|
||||
<div>
|
||||
<a href="http://vanilla-js.com/">
|
||||
<img src="../assets/images/vanilla_js.png">
|
||||
</a>
|
||||
<p>Created by Alec M.</p>
|
||||
<a href="https://github.com/AlecM33/Werewolf">Github</a>
|
||||
<a href="mailto:maier.144@osu.edu?Subject=Werewolf App Question" target="_top">Contact</a>
|
||||
</div>
|
||||
<div>
|
||||
<p>Werewolf created by Andrew Plotkin</p>
|
||||
</div>
|
||||
</footer>
|
||||
<script type="module" src="/javascript/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,41 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Werewolf</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
<script src="../node_modules/socket.io-client/dist/socket.io.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app-content">
|
||||
<div id="join-game-container">
|
||||
<h2 class="app-header-secondary">Join a Game</h2>
|
||||
<form>
|
||||
<label>
|
||||
Your Name
|
||||
<span>
|
||||
<input id="name" type="text"/>
|
||||
<p id="name-error"></p>
|
||||
</span>
|
||||
</label>
|
||||
<label>
|
||||
Access Code
|
||||
<span>
|
||||
<input id="code" type="text" autocomplete="off"/>
|
||||
<p id="join-error"></p>
|
||||
</span>
|
||||
</label>
|
||||
</form>
|
||||
<div>
|
||||
<a href="/">
|
||||
<button class="app-btn">Back</button>
|
||||
</a>
|
||||
<button id="join-btn" class="app-btn">Join</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="/javascript/join.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,60 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel = "stylesheet" type = "text/css" href = "../stylesheets/styles.css" />
|
||||
<link rel="shortcut icon" type="image/png" href="../assets/images/favicon.ico"/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="learn-container">
|
||||
<a href="/"><button class="app-btn">Back</button></a>
|
||||
<h2>Introduction</h2>
|
||||
<p>This is a social strategy game involving deception, deduction, cooperation, and any number of clever tactics.
|
||||
There are two teams - the village and the werewolves. The village has the objective of finding and killing all
|
||||
the wolves, and the wolves are trying to eat all the villagers. The game is divided into two phases: day and
|
||||
night. At night is when the werewolves operate, deciding together which villager to kill off. The daytime is when
|
||||
the village is active, deciding which among them seem evil and killing them to end the day. During the day, everyone
|
||||
is disguised as a villager - even those that are actually wolves.
|
||||
</p>
|
||||
<h2>Setup</h2>
|
||||
<p>At least 5 players are needed for a sensible game. Players can decide on which cards should go in the deck to create
|
||||
a balanced experience. For example, a 7 player game might involve 2 werewolves, 3 villagers, a hunter, and a seer.
|
||||
For larger games, this can be a bit trickier, but the goal is to create a game that isn't too easy for the wolves
|
||||
or the villagers. Once the deck is chosen, the deck is dealt, and players see only their card.
|
||||
</p>
|
||||
<h2>Gameplay</h2>
|
||||
<p>Play begins with the Night One. Everyone "goes to sleep," closing their eyes and creating some sort of white
|
||||
noise (commonly a patting of the hand on the thigh). At this point, the moderator will ask the Werewolves to wake
|
||||
up and see each other. If you do not have a designated moderator, choose someone arbitrarily for the first night,
|
||||
and then the first player to die can moderate the rest of the game.<br><br>
|
||||
|
||||
First, The Werewolves will wake up and see the other wolves, giving them the knowledge that will guide the game.
|
||||
Then, the werewolves go back to sleep. If you are playing with a Minion, next the Werewolves will raise their
|
||||
hands (but not awake), and the Minion will awake to spot the wolves. You can also play with a "double-blind"
|
||||
minion, who does not know who the wolves are, but is still playing on the same team as the wolves. This is all
|
||||
that needs to happen on the first night.<br><br>
|
||||
|
||||
At this point, everyone wakes up, and Day One begins. This is an open debate between everyone in the circle about
|
||||
who they should kill in suspicion of being a wolf. This can take any amount of time, but watch out, because the
|
||||
wolves win if time expires! You should have some system for exhibiting votes to kill another player. If a player
|
||||
receives a majority vote, they should press the "I'm dead" button on their screen, and everyone else will have
|
||||
that player's role revealed to them. At this point, everyone immediately goes to sleep, and the next night begins.<br><br>
|
||||
|
||||
On every night after the first, wolves will, in silence, agree on someone in the circle (other than themselves)
|
||||
to eat during the night. After this concludes, and everyone wakes up, the player that was killed will be revealed
|
||||
by the moderator, and they will reveal their role. Then, of course, Day Two begins.<br><br>
|
||||
|
||||
The game continues in this alternating fashion until an endgame is reached. If a day ends with the same number of
|
||||
wolves as villagers, the wolves win (as they can kill a villager at night, and then have the majority to kill the
|
||||
remaining villager during the day). If the village manages to kill every wolf, then they win. In the scenario
|
||||
where there is one villager and one wolf remaining, if the remaining villager is a Hunter, then the village wins.
|
||||
There are several "power cards" such as the Hunter, which can help the village or the wolves. If you are a power
|
||||
role, you can read the description on your card to find out what your special ability is.
|
||||
</p>
|
||||
<a href="/"><button class="app-btn">Back</button></a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user