diff --git a/Pendulum/Pendulum.html b/Pendulum/Pendulum.html index 1b932c3..2b5e41a 100644 --- a/Pendulum/Pendulum.html +++ b/Pendulum/Pendulum.html @@ -6,7 +6,7 @@ - Continually Rotate A Triangle (Button) + Rotating pendulum in frictionless vacuum diff --git a/Pendulum/PendulumComponents.js b/Pendulum/PendulumComponents.js index 2dca304..60046aa 100644 --- a/Pendulum/PendulumComponents.js +++ b/Pendulum/PendulumComponents.js @@ -18,8 +18,7 @@ class Polygon extends ShapedObject { this.vertices = []; for (var i = 0; i <= sides; i++) { // Create vertices by adding center-point in Homogeneous coordinates to an offset vector generated from polar coordinates. - this.vertices[i] = new Homogeneous2D().from_polar(radius, 2 * Math.PI * i / sides) - .add_m(new Homogeneous2D(center.x, center.y, 1)); + this.vertices[i] = new Homogeneous2D().from_polar(radius, 2 * Math.PI * i / sides, 0).add_m(new Homogeneous2D(center.x, center.y, 1)); } } // Wrap the init function to set the draw_primitive type to TRIANGLE_FAN @@ -55,17 +54,20 @@ class Anchor extends ShapedObject { } } - // This doesn't need to extend ShapedObject, but I love the symmetry class Pendulum extends ShapedObject { - constructor({ angle = 0, length = PEN_LENGTH, radius = BOB_RADIUS} = {}) { + constructor({ angle = 60, length = PEN_LENGTH, radius = BOB_RADIUS } = {}) { super(); - this.angle = angle; + length = 0.994 + this.angle_initial = angle; + this.period = Math.sqrt(9.81 / length); + // define where anchor and bob are var anchor = { x: 0, y: 0 }, bob = { x: 0, y: -length }; + // create the components this.components = [ new Rod({ anchor: anchor, bob: bob }), new Anchor({ center: anchor }), - new Polygon({ sides: 6, radius: radius, center: bob }) + new Polygon({ radius: radius, center: bob }) ]; } @@ -83,6 +85,7 @@ class Pendulum extends ShapedObject { draw(gl, modelMatrix, u_ModelMatrix) { // Rotate the pendulum modelMatrix.setIdentity(); + modelMatrix.translate(0, 0.5, 0, 1); modelMatrix.rotate(this.angle, 0, 0, 1); // Draw each component for (var component of this.components) { @@ -90,10 +93,16 @@ class Pendulum extends ShapedObject { } } + tick_tock_clock_pendulum_simulation() { + var now = Date.now(), elapsed = (now - this.t_prev) / 1000 * this.period; + this.angle = this.angle_initial * Math.cos(elapsed); + } + // Tick the pendulum (update and perform movement) tick() { - var now = Date.now(), elapsed = now - this.t_prev; - this.t_prev = now; - this.angle = (this.angle + (A_VELOCITY * elapsed / 1000)) % 360; + this.tick_tock_clock_pendulum_simulation(); + //var now = Date.now(), elapsed = now - this.t_prev; + //this.t_prev = now; + //this.angle = (this.angle + (A_VELOCITY * elapsed / 1000)) % 360; } } \ No newline at end of file