| | <!DOCTYPE html> |
| | <html> |
| |
|
| | <head> |
| | <meta charset="UTF-8" /> |
| | <title>Sinus</title> |
| | </head> |
| |
|
| | <body> |
| | <h1>Sinus</h1> |
| | <div id="sliders"> |
| | <label for="amplitude">Amplitude:</label> |
| | <input type="range" id="amplitude" min="0" max="100" value="25" /> |
| | <span id="amplitudeValue">25</span> |
| | <br /> |
| | <label for="frequency">Sinus Frequency:</label> |
| | <input type="range" id="frequency" min="0" max="2" step="0.1" value="0.5" /> |
| | <span id="frequencyValue">0.5</span> |
| | <br /> |
| | </div> |
| | <h1>Synchronisation</h1> |
| | <div id="synchronisation"> |
| | <label for="sync">Sync freq:</label> |
| | <input type="range" id="sync" min="1" max="200" step="10" value="100" /> |
| | <span id="syncValue">50</span> |
| | <br /> |
| | <label for="motor_0">Motor 0 synced:</label> |
| | <input type="checkbox" id="motor_0_synced" /> |
| | <br /> |
| | <label for="motor_1">Motor 1 synced:</label> |
| | <input type="checkbox" id="motor_1_synced" /> |
| | <br /> |
| | <label for="motor_2">Motor 2 synced:</label> |
| | <input type="checkbox" id="motor_2_synced" checked /> |
| | <br /> |
| | <label for="motor_3">Motor 3 synced:</label> |
| | <input type="checkbox" id="motor_3_synced" checked /> |
| | <br /> |
| | <label for="motor_4">Motor 4 synced:</label> |
| | <input type="checkbox" id="motor_4_synced" /> |
| | <br /> |
| | <label for="motor_5">Motor 5 synced:</label> |
| | <input type="checkbox" id="motor_5_synced" /> |
| | <br /> |
| | </div> |
| |
|
| | <h1>Debug</h1> |
| | <div id="debug"> |
| | <label for="verbose">Verbose:</label> |
| | <input type="checkbox" id="verbose" /> |
| | </div> |
| |
|
| | |
| |
|
| | <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js" |
| | integrity="sha512-q/dWJ3kcmjBLU4Qc47E4A9kTB4m3wuTY7vkFJDTZKjTs8jhyGQnaUrxa0Ytd0ssMZhbNua9hE+E7Qv1j+DyZwA==" |
| | crossorigin="anonymous"></script> |
| | <script src="sinus.js"></script> |
| |
|
| | </body> |
| |
|
| | </html> |
