Added about page and better index page.

This commit is contained in:
Andrew Lalis 2022-05-31 15:18:40 +02:00
parent 2561c8f3d4
commit 71ca7b4467
10 changed files with 1085 additions and 5 deletions

View File

@ -0,0 +1,280 @@
<?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="512"
height="200"
viewBox="0 0 135.46666 52.916668"
version="1.1"
id="svg8"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="layout.svg"
inkscape:export-filename="/home/andrew/Programming/github-andrewlalis/RailSignalAPI/quasar-app/src/assets/img/guide/layout.png"
inkscape:export-xdpi="192"
inkscape:export-ydpi="192">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.979899"
inkscape:cx="261.33576"
inkscape:cy="131.69301"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:pagecheckerboard="false"
inkscape:window-width="1920"
inkscape:window-height="1009"
inkscape:window-x="0"
inkscape:window-y="0"
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(0,-244.08333)">
<path
style="fill:#fb6700;fill-opacity:0.23137255;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 43.67314,257.80597 55.767023,12.57864 0.06207,18.71578 H 30.710567 v -18.33185 z"
id="path1012"
inkscape:connector-curvature="0" />
<rect
y="151.32266"
x="173.9552"
height="18.148809"
width="39.182587"
id="rect1006"
style="fill:#00fcb4;fill-opacity:0.23157893;stroke:none;stroke-width:1.05833328;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1"
transform="rotate(45)" />
<rect
style="fill:#0afc00;fill-opacity:0.23157893;stroke:none;stroke-width:1.05833328;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1"
id="rect1004"
width="31.245104"
height="18.715776"
x="-0.53453904"
y="270.38474" />
<rect
y="270.38474"
x="99.440163"
height="18.715775"
width="36.914753"
id="rect1008"
style="fill:#2200fc;fill-opacity:0.23157893;stroke:none;stroke-width:1.05833328;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M -2.2717908,280.13995 H 137.51017"
id="path817"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 75.50364,280.14805 c -34.076865,0 -57.596582,-37.15857 -57.596582,-37.15857"
id="path819"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<rect
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1"
id="rect945"
width="4.5178719"
height="4.5178719"
x="266.22791"
y="125.43176"
transform="rotate(45)" />
<path
style="fill:none;stroke:#ff0000;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1"
d="m 99.502231,270.76854 v 18.33185"
id="path821"
inkscape:connector-curvature="0" />
<rect
transform="rotate(45)"
y="174.00168"
x="217.65794"
height="4.5178719"
width="4.5178719"
id="rect943"
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1" />
<path
inkscape:connector-curvature="0"
id="path823"
d="m 30.710565,270.76854 v 18.33185"
style="fill:none;stroke:#ff0000;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1"
id="rect941"
width="4.5178719"
height="4.5178719"
x="210.94887"
y="158.59915"
transform="rotate(45)" />
<path
style="fill:none;stroke:#ff0000;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:2.11666664, 1.05833332;stroke-dashoffset:0;stroke-opacity:1"
d="M 43.673141,257.80597 30.710565,270.76854"
id="path825"
inkscape:connector-curvature="0" />
<text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:10.58333302px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
x="63.122021"
y="251.64285"
id="text829"><tspan
sodipodi:role="line"
id="tspan827"
x="63.122021"
y="261.00662"
style="stroke-width:0.26458332"></tspan></text>
<g
transform="matrix(0.08953353,0,0,0.08953353,102.00472,251.52712)"
id="layer1-3"
inkscape:label="Layer 1">
<path
inkscape:connector-curvature="0"
id="path815"
d="M 33.866667,296.90549 V 276.77826"
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
rx="6.6145835"
y="233.04643"
x="16.933334"
height="43.845234"
width="33.866665"
id="rect817"
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="5.8586307"
cy="245.50073"
cx="33.866665"
id="path819-5"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle821"
cx="33.866665"
cy="262.60416"
r="5.8586307" />
</g>
<g
inkscape:label="Layer 1"
id="g929"
transform="matrix(0.08953353,0,0,0.08953353,23.962019,262.35154)">
<path
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,296.90549 V 276.77826"
id="path921"
inkscape:connector-curvature="0" />
<rect
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect923"
width="33.866665"
height="43.845234"
x="16.933334"
y="233.04643"
rx="6.6145835" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle925"
cx="33.866665"
cy="245.50073"
r="5.8586307" />
<circle
r="5.8586307"
cy="262.60416"
cx="33.866665"
id="circle927"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
transform="matrix(0.08953353,0,0,0.08953353,25.832906,239.90089)"
id="g939"
inkscape:label="Layer 1">
<path
inkscape:connector-curvature="0"
id="path931"
d="M 33.866667,296.90549 V 276.77826"
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
rx="6.6145835"
y="233.04643"
x="16.933334"
height="43.845234"
width="33.866665"
id="rect933"
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="5.8586307"
cy="245.50073"
cx="33.866665"
id="circle935"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle937"
cx="33.866665"
cy="262.60416"
r="5.8586307" />
</g>
<g
transform="matrix(0.10431371,0,0,0.10431371,60.72992,252.67196)"
id="layer1-2"
inkscape:label="Layer 1"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1">
<path
inkscape:connector-curvature="0"
id="path838"
d="M 33.866667,291.12006 V 259.31498"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 56.356255,236.8254"
id="path840"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path842"
d="M 33.866667,259.31498 11.377087,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="7.7508163"
cy="238.06705"
cx="13.554182"
id="path844"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle846"
cx="54.713692"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="287.79529"
cx="33.866665"
id="circle848"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -0,0 +1,632 @@
<?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="512"
height="256"
viewBox="0 0 135.46666 67.733335"
version="1.1"
id="svg8"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="layout2.svg"
inkscape:export-filename="/home/andrew/Programming/github-andrewlalis/RailSignalAPI/quasar-app/src/assets/img/guide/layout2.png"
inkscape:export-xdpi="192"
inkscape:export-ydpi="192">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.979899"
inkscape:cx="191.26796"
inkscape:cy="128.73452"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:pagecheckerboard="false"
inkscape:window-width="1920"
inkscape:window-height="1009"
inkscape:window-x="0"
inkscape:window-y="0"
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(0,-229.26666)">
<rect
style="fill:#fc8700;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect1179"
width="58.515881"
height="29.386139"
x="35.644123"
y="253.14487" />
<rect
transform="rotate(90)"
y="-136.71936"
x="264.76611"
height="42.559361"
width="8.8824463"
id="rect1173"
style="fill:#fcdf00;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:10.58333302px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
x="63.122021"
y="251.64285"
id="text829"><tspan
sodipodi:role="line"
id="tspan827"
x="63.122021"
y="261.00662"
style="stroke-width:0.26458332"></tspan></text>
<g
transform="matrix(0.08953353,0,0,0.08953353,50.295819,223.70883)"
id="g939"
inkscape:label="Layer 1">
<path
inkscape:connector-curvature="0"
id="path931"
d="M 33.866667,296.90549 V 276.77826"
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
rx="6.6145835"
y="233.04643"
x="16.933334"
height="43.845234"
width="33.866665"
id="rect933"
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="5.8586307"
cy="245.50073"
cx="33.866665"
id="circle935"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle937"
cx="33.866665"
cy="262.60416"
r="5.8586307" />
</g>
<rect
transform="rotate(90)"
y="-35.825115"
x="273.64856"
height="42.559361"
width="8.8824463"
id="rect1177"
style="fill:#00fcac;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="fill:#7afc00;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect1175"
width="8.8824463"
height="42.559361"
x="264.76611"
y="-35.825115"
transform="rotate(90)" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666664;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="M -2.0045214,269.47123 H 137.37654"
id="path1071"
inkscape:connector-curvature="0" />
<rect
style="fill:#fc0058;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect1171"
width="8.8824463"
height="42.559361"
x="273.64856"
y="-136.71936"
transform="rotate(90)" />
<path
inkscape:connector-curvature="0"
id="path1073"
d="M -2.0045214,278.29112 H 137.37654"
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
style="fill:#2200fc;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect1167"
width="8.8824406"
height="27.59226"
x="56.412945"
y="225.94048" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 61.071086,227.50992 v 21.11429"
id="path1075"
inkscape:connector-curvature="0" />
<rect
y="225.94048"
x="65.295387"
height="27.59226"
width="8.8824406"
id="rect1169"
style="fill:#b200fc;fill-opacity:0.23157893;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<path
inkscape:connector-curvature="0"
id="path1077"
d="m 69.490076,227.50992 v 21.11429"
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 69.490076,248.62421 c 0,29.66692 29.600098,29.66692 29.600098,29.66692"
id="path1079"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
id="path1081"
d="m 61.071086,248.62421 c 0,29.66692 29.600098,29.66692 29.600098,29.66692"
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
id="path1083"
d="m 69.490076,248.62421 c 0,29.66692 -29.600098,29.66692 -29.600098,29.66692"
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1"
id="rect945"
width="4.5178719"
height="4.5178719"
x="224.94077"
y="126.66696"
transform="rotate(45)" />
<path
style="fill:none;stroke:#000000;stroke-width:2.11666656;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 61.071086,248.62421 c 0,29.66692 -29.600098,29.66692 -29.600098,29.66692"
id="path1085"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<rect
transform="rotate(45)"
y="132.63582"
x="218.97191"
height="4.5178719"
width="4.5178719"
id="rect1087"
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1" />
<rect
transform="rotate(45)"
y="126.71421"
x="262.33102"
height="4.5178719"
width="4.5178719"
id="rect1089"
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1" />
<g
transform="matrix(0.10431371,0,0,0.10431371,65.957315,227.96333)"
id="layer1-2"
inkscape:label="Layer 1"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1">
<path
inkscape:connector-curvature="0"
id="path838"
d="M 33.866667,291.12006 V 259.31498"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 56.356255,236.8254"
id="path840"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path842"
d="M 33.866667,259.31498 11.377087,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="7.7508163"
cy="238.06705"
cx="13.554182"
id="path844"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle846"
cx="54.713692"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="287.79529"
cx="33.866665"
id="circle848"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<rect
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1"
id="rect1091"
width="4.5178719"
height="4.5178719"
x="256.04718"
y="120.43036"
transform="rotate(45)" />
<rect
transform="rotate(45)"
y="170.01033"
x="219.0349"
height="4.5178719"
width="4.5178719"
id="rect1093"
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="fill:#963ae0;fill-opacity:1;stroke:none;stroke-width:0.8320865;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:1.6641731, 0.83208655;stroke-dashoffset:0;stroke-opacity:1"
id="rect1095"
width="4.5178719"
height="4.5178719"
x="212.75104"
y="163.72647"
transform="rotate(45)" />
<g
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1"
inkscape:label="Layer 1"
id="g1109"
transform="matrix(0.10431371,0,0,0.10431371,57.516077,227.96333)">
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,291.12006 V 259.31498"
id="path1097"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path1099"
d="M 33.866667,259.31498 56.356255,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 11.377087,236.8254"
id="path1101"
inkscape:connector-curvature="0" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1103"
cx="13.554182"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="238.06705"
cx="54.713692"
id="circle1105"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1107"
cx="33.866665"
cy="287.79529"
r="7.7508163" />
</g>
<g
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1"
inkscape:label="Layer 1"
id="g1123"
transform="matrix(0,0.10431371,-0.10431371,0,119.75106,274.75839)">
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,291.12006 V 259.31498"
id="path1111"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path1113"
d="M 33.866667,259.31498 56.356255,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 11.377087,236.8254"
id="path1115"
inkscape:connector-curvature="0" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1117"
cx="13.554182"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="238.06705"
cx="54.713692"
id="circle1119"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1121"
cx="33.866665"
cy="287.79529"
r="7.7508163" />
</g>
<g
transform="matrix(0,0.10431371,-0.10431371,0,112.85299,274.75839)"
id="g1137"
inkscape:label="Layer 1"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1">
<path
inkscape:connector-curvature="0"
id="path1125"
d="M 33.866667,291.12006 V 259.31498"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 56.356255,236.8254"
id="path1127"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path1129"
d="M 33.866667,259.31498 11.377087,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="7.7508163"
cy="238.06705"
cx="13.554182"
id="circle1131"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1133"
cx="54.713692"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="287.79529"
cx="33.866665"
id="circle1135"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1"
inkscape:label="Layer 1"
id="g1151"
transform="matrix(0,-0.10431371,0.10431371,0,10.810111,281.82389)">
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,291.12006 V 259.31498"
id="path1139"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path1141"
d="M 33.866667,259.31498 56.356255,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 11.377087,236.8254"
id="path1143"
inkscape:connector-curvature="0" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1145"
cx="13.554182"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="238.06705"
cx="54.713692"
id="circle1147"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1149"
cx="33.866665"
cy="287.79529"
r="7.7508163" />
</g>
<g
transform="matrix(0,-0.10431371,0.10431371,0,18.180647,281.82389)"
id="g1165"
inkscape:label="Layer 1"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-opacity:1">
<path
inkscape:connector-curvature="0"
id="path1153"
d="M 33.866667,291.12006 V 259.31498"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,259.31498 56.356255,236.8254"
id="path1155"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path1157"
d="M 33.866667,259.31498 11.377087,236.8254"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="7.7508163"
cy="238.06705"
cx="13.554182"
id="circle1159"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1161"
cx="54.713692"
cy="238.06705"
r="7.7508163" />
<circle
r="7.7508163"
cy="287.79529"
cx="33.866665"
id="circle1163"
style="fill:#f5bc42;fill-opacity:1;stroke:#f5bc42;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
inkscape:label="Layer 1"
id="g1189"
transform="matrix(0.08953353,0,0,0.08953353,75.151885,223.70883)">
<path
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,296.90549 V 276.77826"
id="path1181"
inkscape:connector-curvature="0" />
<rect
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect1183"
width="33.866665"
height="43.845234"
x="16.933334"
y="233.04643"
rx="6.6145835" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1185"
cx="33.866665"
cy="245.50073"
r="5.8586307" />
<circle
r="5.8586307"
cy="262.60416"
cx="33.866665"
id="circle1187"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
transform="matrix(0.08953353,0,0,0.08953353,95.063465,236.80504)"
id="g1199"
inkscape:label="Layer 1">
<path
inkscape:connector-curvature="0"
id="path1191"
d="M 33.866667,296.90549 V 276.77826"
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
rx="6.6145835"
y="233.04643"
x="16.933334"
height="43.845234"
width="33.866665"
id="rect1193"
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="5.8586307"
cy="245.50073"
cx="33.866665"
id="circle1195"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1197"
cx="33.866665"
cy="262.60416"
r="5.8586307" />
</g>
<g
inkscape:label="Layer 1"
id="g1209"
transform="matrix(0.08953353,0,0,0.08953353,95.063465,263.39836)">
<path
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,296.90549 V 276.77826"
id="path1201"
inkscape:connector-curvature="0" />
<rect
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect1203"
width="33.866665"
height="43.845234"
x="16.933334"
y="233.04643"
rx="6.6145835" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1205"
cx="33.866665"
cy="245.50073"
r="5.8586307" />
<circle
r="5.8586307"
cy="262.60416"
cx="33.866665"
id="circle1207"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
transform="matrix(0.08953353,0,0,0.08953353,27.978814,263.39836)"
id="g1219"
inkscape:label="Layer 1">
<path
inkscape:connector-curvature="0"
id="path1211"
d="M 33.866667,296.90549 V 276.77826"
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<rect
rx="6.6145835"
y="233.04643"
x="16.933334"
height="43.845234"
width="33.866665"
id="rect1213"
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
r="5.8586307"
cy="245.50073"
cx="33.866665"
id="circle1215"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1217"
cx="33.866665"
cy="262.60416"
r="5.8586307" />
</g>
<g
inkscape:label="Layer 1"
id="g1229"
transform="matrix(0.08953353,0,0,0.08953353,27.978814,236.93868)">
<path
style="fill:none;stroke:#000000;stroke-width:6.3499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 33.866667,296.90549 V 276.77826"
id="path1221"
inkscape:connector-curvature="0" />
<rect
style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:6.3499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect1223"
width="33.866665"
height="43.845234"
x="16.933334"
y="233.04643"
rx="6.6145835" />
<circle
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle1225"
cx="33.866665"
cy="245.50073"
r="5.8586307" />
<circle
r="5.8586307"
cy="262.60416"
cx="33.866665"
id="circle1227"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:4.23333311;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

View File

@ -1,6 +1,7 @@
<template>
<q-item
clickable
v-ripple
:to="'/rail-systems/' + railSystem.id"
>
<q-item-section>

View File

@ -26,6 +26,26 @@
bordered
>
<rail-systems-list :rail-systems="rsStore.railSystems" />
<q-item
clickable
v-ripple
:to="'/'"
@click="rsStore.selectedRailSystem = null"
>
<q-item-section>
<q-item-label>Home</q-item-label>
</q-item-section>
</q-item>
<q-item
clickable
v-ripple
:to="'/about'"
@click="rsStore.selectedRailSystem = null"
>
<q-item-section>
<q-item-label>About</q-item-label>
</q-item-section>
</q-item>
</q-drawer>
<q-page-container>

View File

@ -0,0 +1,36 @@
<template>
<q-page class="q-pa-md">
<div class="row">
<div class="col-md-6">
<div class="text-h2">About Rail Signal</div>
<hr>
<p>
This application was developed by <a href="https://andrewlalis.github.io">Andrew Lalis</a>
after several years of tinkering with various ways to automate rail
networks in Minecraft.
</p>
<p>
This web app was built using <a href="https://quasar.dev">Quasar</a>
and <a href="https://vuejs.org/">VueJS</a>. The API that powers this
application was built using <a href="https://spring.io/">Spring</a>
and Java 17. For more technical information, please visit Rail Signal's
<a href="https://github.com/andrewlalis/RailSignalAPI">GitHub repository</a>.
</p>
<p>
If you're enjoying this app, please consider making a <a href="https://paypal.me/andrewlalis" target="_blank">donation to
Andrew's work on paypal</a>.
</p>
</div>
</div>
</q-page>
</template>
<script>
export default {
name: "AboutPage"
};
</script>
<style scoped>
</style>

View File

@ -1,8 +1,115 @@
<template>
<q-page>
<p>
This is the index page.
</p>
<q-page class="q-pa-md">
<div class="row">
<div class="col-md-6">
<div class="text-h2">Welcome to Rail Signal</div>
<hr>
<p>
To begin, expand the menu on the left, and select a rail system, or
create a new one. The remainder of this page will serve as a quick
guide on how to use Rail Signal to manage your rail system more
effectively.
</p>
</div>
</div>
<div class="row">
<div class="col-md-6 q-pa-md">
<div class="text-h4">Introduction to Rail Networks</div>
<q-img src="~assets/img/guide/layout.png"/>
<p>
The above diagram illustrates all of the basic concepts you need to
know in order to build and manage your rail networks.
</p>
<p>
Each rail system can be conceptually split up into lots of small
<strong>segments</strong>, each of which represents a single part of
the network that a single train should go through at once. For
example, in our diagram, each shaded area is a segment. We only want
one train to go through the junction at once, or there might be a
crash!
</p>
<p>
At the places where segments meet, we see a <strong style="color: #963ae0">segment boundary</strong>
which is also denoted with a red dotted line for convenience. This is
a physical point on a track where trains travel from one segment to
another. What's special about segment boundaries is that they're where
we can used devices to track trains moving in and out of segments. To
put it simply, imagine there's a little computer next to each segment
boundary point that sends a message saying, "Hey! A train just passed!"
every time that it detects a train going over it.
</p>
<p>
Now that we've covered segments and segment boundaries, we can now
display a segment's status using a <strong>signal</strong>. A signal
is a device that is linked to a segment, and whenever the segment's
status updates (<em>when a train enters or leaves it</em>), the signal
will be updated as well. Usually, signals are placed near the segment
boundary, so that approaching trains know whether they're safe to
continue, but with Rail Signal, you can place a signal anywhere, and
connect it to any segment.
</p>
<p>
Finally, unless you're just making a boring single-line loop, you'll
most likely have some <strong style="color: #f5bc42">switches</strong>
in your network. Switches are just sections of rail that allow trains
to choose between two different paths to take. Rail Signal gives you
the ability to manage these automatically, so you can use this web
interface to configure switches instead of doing it manually.
</p>
</div>
<div class="col-md-6 q-pa-md">
<div class="text-h4">Paths and Path Nodes</div>
<p>
We mentioned segment boundaries and switches earlier, as simple
components that you can add to your network in order to link it to the
internet. There's more to it than that, however.
</p>
<p>
Behind the scenes, your Rail Signal models your network as a set of
<strong>path nodes</strong>, where each node can be connected to any
other number of nodes. A train travels through your network by moving
from node to node, until it reaches its desired destination. Both the
segment boundary and switch are types of path nodes.
</p>
<ul>
<li>
Segment boundaries may only be connected to at most two nodes. This
is because a segment boundary is fundamentally just a point on a
single rail line.
</li>
<li>
Switches are connected to nodes based on their set of defined
configurations. In the example diagram, our switch allows two
possible configurations:
<ul>
<li>Between the <strong style="color: #3cadab">blue</strong> and <strong style="color: #7169b4">purple</strong> segments.</li>
<li>Between the <strong style="color: #81d07b">green</strong> and <strong style="color: #7169b4">purple</strong> segments.</li>
</ul>
This implies that our switch node is connected to three other nodes:
each of the segment boundaries that it allows traffic between.
</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-md-6 q-pa-md">
<div class="text-h4">Advanced Usage</div>
<q-img src="~assets/img/guide/layout2.png"/>
<p>
The above diagram shows a more typical network arrangement for a large
scale, two-way mainline. Here, we see that each side of the main line
has its own segment, so that trains can travel past each other without
issue. We make the entire junction a single segment, so that only one
train can pass through at a time. More advanced setups might have
separate segments for bypass lines to avoid traffic jams. Beside each
entrance and exit to the junction, we've placed a signal. On the
outbound segments, the signal will report the status of the outbound
segment, while on the inbound segments, the signal will show the
status of the junction segment.
</p>
</div>
</div>
</q-page>
</template>

View File

@ -9,6 +9,10 @@ const routes = [
path: '',
component: () => import('pages/IndexPage.vue')
},
{
path: 'about',
component: () => import('pages/AboutPage.vue')
},
{// Rail Systems page
path: 'rail-systems/:id',
component: () => import('pages/RailSystem.vue'),

View File

@ -9,7 +9,7 @@ import org.springframework.web.bind.annotation.RequestMapping;
* web app's index page.
*/
@Controller
@RequestMapping(path = {"/", "/app", "/home", "/index.html", "/index"})
@RequestMapping(path = {"/", "/app", "/app/**", "/home", "/index.html", "/index"})
public class IndexPageController {
@GetMapping
public String getIndex() {