index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>Dollar Game</title>
    <link rel="stylesheet" href="style.css"/>
</head>
<body>
    <h1>The Dollar Game</h1>
    <p>
        Inspired by the Numberphile <a href="https://www.youtube.com/watch?v=U33dsEcKgeQ">video</a>.
        This site by <a href="https://github.com/kvverti">Thalia Nero</a>.
    </p>
    <svg>
        <g id="graph"></g>
        <g id="stats">
            <text x="3" y="16">Moves taken: <tspan id="stat-moves">0</tspan></text>
        </g>
    </svg>
    <ul id="inputs">
        <li>
            <label for="input-node-count">Number of nodes:</label>
            <input id="input-node-count" type="number" value="8" min="5"/>
        </li>
        <li>
            <label for="input-range">Value range:</label>
            <input id="input-range" type="number" value="10" min="1"/>
        </li>
        <li>
            <label for="input-surplus">Allow total value greater than genus:</label>
            <input id="input-surplus" type="checkbox" checked/>
        </li>
        <li>
            <input id="input-generate" type="button" value="Generate puzzle"/>
        </li>
    </ul>
    <p>This site uses <a href="https://d3js.org">d3js</a>.</p>
    <script src="https://d3js.org/d3.v5.min.js"></script>
    <script src="graph.js"></script>
</body>
</html>