diff options
Diffstat (limited to '2d/softbody/softbody_1.html')
| -rw-r--r-- | 2d/softbody/softbody_1.html | 106 |
1 files changed, 79 insertions, 27 deletions
diff --git a/2d/softbody/softbody_1.html b/2d/softbody/softbody_1.html index 12ee272..3f0fc40 100644 --- a/2d/softbody/softbody_1.html +++ b/2d/softbody/softbody_1.html @@ -78,10 +78,15 @@ addButtonListener('gl_canvas_play_undamped', 'gl_canvas_stop_undamped', [ document.getElementById('undamped_spring_length'), - document.getElementById('undamped_start_position') + document.getElementById('undamped_start_position'), + document.getElementById('undamped_spring_constant'), + document.getElementById('undamped_spring_mass') ]); addButtonListener('gl_canvas_play_damped', 'gl_canvas_stop_damped', [ - + document.getElementById('damped_spring_length'), + document.getElementById('damped_start_position'), + document.getElementById('damped_spring_constant'), + document.getElementById('damped_spring_mass') ]); // -- Slider logic @@ -108,40 +113,64 @@ Undamped_SetDisplacement = Module.cwrap('Undamped_SetDisplacement', 'void', ['number']), Undamped_SetK = Module.cwrap('Undamped_SetK', 'void', ['number']), Undamped_SetMass = Module.cwrap('Undamped_SetMass', 'void', ['number']), - lengthSlider = document.getElementById('undamped_spring_length'), - displacementSlider = document.getElementById('undamped_start_position'), - kSlider = document.getElementById('undamped_spring_constant'), - massSlider = document.getElementById('undamped_spring_mass'), - setLength = function(value) { + + Damped_SetLength = Module.cwrap('Damped_SetLength', 'void', ['number']), + Damped_SetDisplacement = Module.cwrap('Damped_SetDisplacement', 'void', ['number']), + Damped_SetK = Module.cwrap('Damped_SetK', 'void', ['number']), + Damped_SetMass = Module.cwrap('Damped_SetMass', 'void', ['number']), + + Undamped_lengthSlider = document.getElementById('undamped_spring_length'), + Undamped_displacementSlider = document.getElementById('undamped_start_position'), + Undamped_kSlider = document.getElementById('undamped_spring_constant'), + Undamped_massSlider = document.getElementById('undamped_spring_mass'), + + Damped_lengthSlider = document.getElementById('damped_spring_length'), + Damped_displacementSlider = document.getElementById('damped_start_position'), + Damped_kSlider = document.getElementById('damped_spring_constant'), + Damped_massSlider = document.getElementById('damped_spring_mass'), + + undampedSetLength = function(value) { value = Number(value); Undamped_SetLength(value); - var currentDisplacementValue = displacementSlider.value; - var bound = value / 2.0; - displacementSlider.setAttribute('max', bound); - displacementSlider.setAttribute('min', -bound); + var currentDisplacementValue = Undamped_displacementSlider.value; + var bound = value; + Undamped_displacementSlider.setAttribute('max', bound); + Undamped_displacementSlider.setAttribute('min', -bound); if (currentDisplacementValue < -bound) currentDisplacementValue = -bound; else if (currentDisplacementValue > bound) currentDisplacementValue = bound; var event = new Event('change'); - displacementSlider.value = currentDisplacementValue; - displacementSlider.dispatchEvent(event); - }, - setDisplacement = function(value) { - Undamped_SetDisplacement(value); + Undamped_displacementSlider.value = currentDisplacementValue; + Undamped_displacementSlider.dispatchEvent(event); }, - setK = function(value) { - Undamped_SetK(value); - }, - setMass = function(mass) { - Undamped_SetMass(mass); + dampedSetLength = function(value) { + value = Number(value); + Damped_SetLength(value); + + var currentDisplacementValue = Damped_displacementSlider.value; + var bound = value; + Damped_displacementSlider.setAttribute('max', bound); + Damped_displacementSlider.setAttribute('min', -bound); + + if (currentDisplacementValue < -bound) currentDisplacementValue = -bound; + else if (currentDisplacementValue > bound) currentDisplacementValue = bound; + + var event = new Event('change'); + Damped_displacementSlider.value = currentDisplacementValue; + Damped_displacementSlider.dispatchEvent(event); }; - lengthSlider.addEventListener('change', function(event) { setLength(Number(event.target.value)); }); - displacementSlider.addEventListener('change', function(event) { setDisplacement(Number(event.target.value)); }); - kSlider.addEventListener('change', function(event) { setK(Number(event.target.value)); }); - massSlider.addEventListener('change', function(event) { setMass(Number(event.target.value)); }); + Undamped_lengthSlider.addEventListener('change', function(event) { undampedSetLength(Number(event.target.value)); }); + Undamped_displacementSlider.addEventListener('change', function(event) { Undamped_SetDisplacement(Number(event.target.value)); }); + Undamped_kSlider.addEventListener('change', function(event) { Undamped_SetK(Number(event.target.value)); }); + Undamped_massSlider.addEventListener('change', function(event) { Undamped_SetMass(Number(event.target.value)); }); + + Damped_lengthSlider.addEventListener('change', function(event) { dampedSetLength(Number(event.target.value)); }); + Damped_displacementSlider.addEventListener('change', function(event) { Damped_SetDisplacement(Number(event.target.value)); }); + Damped_kSlider.addEventListener('change', function(event) { Damped_SetK(Number(event.target.value)); }); + Damped_massSlider.addEventListener('change', function(event) { Damped_SetMass(Number(event.target.value)); }); }; } @@ -171,13 +200,13 @@ <span class='widget_container'> <label for='undamped_start_position'>Start Displacement (m)</label> - <input type='range' id='undamped_start_position' min='-75' max='75' value='0'/> + <input type='range' id='undamped_start_position' min='-150' max='150' value='0'/> <span></span> </span> <span class='widget_container'> <label for='undamped_spring_constant'>Spring Constant (N / m)</label> - <input type='range' id='undamped_spring_constant' min='0.1' max='5.0' value='1.0' step='0.1'/> + <input type='range' id='undamped_spring_constant' min='0.1' max='20.0' value='1.0' step='0.1'/> <span></span> </span> @@ -204,6 +233,29 @@ Damped Springs </h2> <p> + <span class='widget_container'> + <label for='undamped_spring_length'>Spring Length (m)</label> + <input type='range' id='damped_spring_length' min="50" max="300" value="150"/> + <span></span> + </span> + + <span class='widget_container'> + <label for='undamped_start_position'>Start Displacement (m)</label> + <input type='range' id='damped_start_position' min='-150' max='150' value='0'/> + <span></span> + </span> + + <span class='widget_container'> + <label for='undamped_spring_constant'>Spring Constant (N / m)</label> + <input type='range' id='damped_spring_constant' min='0.1' max='20.0' value='1.0' step='0.1'/> + <span></span> + </span> + + <span class='widget_container'> + <label for='undamped_spring_mass'>Mass (kg)</label> + <input type='range' id='damped_spring_mass' min='0.1' max='10.0' value='1.0' step='0.1'/> + <span></span> + </span> </p> <div class="opengl_canvas_container"> |