index.html

---
layout: default
---

<canvas id="physics"></canvas>
<div id="controls">
    <button class="ctrl-edit pop">Edit</button>
    <button class="ctrl-randomize">Randomize!</button>
    <div class="btn-group block above">
        <button class="ctrl-pause">Pause</button>
        <a href="#" class="btn ctrl-download">Save Image</a>
        <button class="ctrl-share ok">Share</button>
    </div>
    <div class="edit-type">
        <label>Edit initial:</label>
        <div class="radio-group">
            <a href="#" class="ctrl-edit-positions on">Positions</a>
            <a href="#" class="ctrl-edit-velocities">Velocities</a>
        </div>
    </div>
    <div class="edit-group btn-group block above">
        <button class="ctrl-add pop">Add Vertex</button>
        <button class="ctrl-remove danger">Remove Last Vertex</button>
    </div>
</div>

<div id="ctx-menu">
    <h3 class="title">vertex options</h3>
    <label for="ctrl-mass">mass:</label>
    <input type="text" class="ctrl-mass" />
    <div id="ctrl-mass"></div>
    <label for="ctrl-color">color:</label>
    <input class="color" id="ctrl-color"/>
    <label for="ctrl-path">draw paths?</label>
    <input id="ctrl-path" type="checkbox" />
    <!-- <div class="ctrl-close">&mdash;</div> -->
</div>

<div id="shareOverlay">
    <h3 class="title">Use this link to share this exact pendulum!</h3>
    <input type="text" />
    <button class="ctrl-close">close</button>
</div>