From aeb4fc2aec4378aa0742f71324baa76fd5891316 Mon Sep 17 00:00:00 2001
From: mattkae <mattkae@protonmail.com>
Date: Sat, 8 Jan 2022 08:29:53 -0500
Subject: Added controls for damped motion
---
2d/softbody/softbody_1.html.content | 106 +++++++++++++++++++++++++++---------
1 file changed, 79 insertions(+), 27 deletions(-)
(limited to '2d/softbody/softbody_1.html.content')
diff --git a/2d/softbody/softbody_1.html.content b/2d/softbody/softbody_1.html.content
index 4f66ce3..bef14d8 100644
--- a/2d/softbody/softbody_1.html.content
+++ b/2d/softbody/softbody_1.html.content
@@ -25,10 +25,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
@@ -55,40 +60,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)); });
};
}
@@ -118,13 +147,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>
@@ -151,6 +180,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">
--
cgit v1.2.1