index.html

---
layout: default
---

<div id="sim">
    <canvas id="physics"></canvas>
</div>

<div id="video-msg">
    <a href="#" class="ctrl-close">&times;</a>
    <p>There is also a <a href="http://www.youtube.com/watch?v=nrUBPO6zZ40&amp;list=PLED25F943F8D6081C" target="_blank">MinutePhysics video about Brownian Motion</a> that you can watch.</p>
</div>

<div id="controls">
    <label>Drag to see what's actually going on</label>
    <div id="ctrl-opacity"></div>

    <div class="labels">
        <label>Energy:</label>
        <div class="ctrl">
            <div id="ctrl-energy"></div>
        </div>
        <label>Size Ratio:</label>
        <div class="ctrl">
            <div id="ctrl-ratio"></div>
        </div>
        <label>Mass Ratio:</label>
        <div class="ctrl">
            <div id="ctrl-mass-ratio"></div>
        </div>
    </div>
    <div class="btns">
        <button id="ctrl-draw-paths" class="pop toggle on">Trace Paths</button>
        <a href="#" id="ctrl-download" class="btn">Get Image</a>
    </div>
    <label id="ctrl-move">move</label>
</div>