Lazily implemented help modal
This commit is contained in:
85
index.html
85
index.html
@@ -16,6 +16,91 @@
|
||||
<body>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.2.2/pixi.min.js"></script>
|
||||
<script src="js/proximity.js"></script>
|
||||
<div id="help" style="display: none;">
|
||||
<h2>Help</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Interaction</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mouse hover</td>
|
||||
<td>push points away from cursor</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mouse/touch click and hold</td>
|
||||
<td>attract points to cursor, then explode outwards</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mouse wheel scroll down</td>
|
||||
<td>slow down time</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mouse wheel scroll up</td>
|
||||
<td>speed up time</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>left</td>
|
||||
<td>hold to restrict points to the left of the screen</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>right</td>
|
||||
<td>hold to restrict points to the right of the screen</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>up</td>
|
||||
<td>hold to restrict points to the top of the screen</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>down</td>
|
||||
<td>hold to restrict points to the bottom of the screen</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>makes points move linearly</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>makes points meander</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>makes points snappy</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>makes points bouncy</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>makes points elastic</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>6</td>
|
||||
<td>makes points overshoot</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>f</td>
|
||||
<td>toggle FPS counter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>d</td>
|
||||
<td>toggles debug mode (including FPS counter)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>n</td>
|
||||
<td>toggles display of nodes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>l</td>
|
||||
<td>toggles display of lines</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>?</td>
|
||||
<td>toggles this help modal</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<!-- Google Analytics -->
|
||||
|
||||
Reference in New Issue
Block a user