Two Balls Rolling Down Slopes and Colliding, a Computer model for the Pedagogy of Modeling JavaScript HTML5 Applet Simulation Model

added with inputs from SL 20240904

https://sg.iwant2study.org/ospsg/index.php/1248

updated with energy stores with inputs from BC 20240903

https://sg.iwant2study.org/ospsg/index.php/1248

1. Understanding Gravitational Potential Energy Store

Question: Observe the Gravitational Potential Energy Store (G) of both spheres before they start moving down the slopes. How is the Gravitational Potential Energy Store related to the height of each sphere on the slope?

Follow-up: Predict how the Gravitational Potential Energy Store will change as each sphere rolls down the slope and explain your reasoning.

2. Comparing Kinetic Energy Store

Question: As the spheres roll down their respective slopes, how does their Kinetic Energy Store (K) change? Compare the Kinetic Energy Stores of the two spheres when they reach the horizontal track.

Follow-up: Based on your observations, what factors influence the amount of Kinetic Energy Store each sphere has at the bottom of the slope?

3. Effect of Slope Angle on Speed

Question: Adjust the inclined angle of one slope to be steeper than the other. How does changing the slope angle affect the speed of the sphere at the bottom of the slope? Explain your observations using the concepts of Gravitational Potential Energy Store and Kinetic Energy Store.

Follow-up: What do you predict will happen to the position of collision if one slope is steeper than the other? Justify your answer.

4. Investigating the Impact of Mass

Question: Set both slopes to the same angle, but give the two spheres different masses. How does the mass of each sphere affect the speed and Kinetic Energy Store at the bottom of the slope? Does mass influence the position of the collision?

Follow-up: Why does the mass of the spheres not affect their acceleration down the slope, even though it does influence their Kinetic Energy Store?

5. Investigating the Radius of the Balls

Question: Adjust the radius of each sphere. How does changing the radius affect the speed and Kinetic Energy Store of the spheres as they reach the bottom of the slope?

Follow-up: How does the radius of the spheres influence the collision position? Consider the moment of inertia in your explanation.

6. Analyzing the Collision Position

Question: Using the physics equations of motion and the energy principles, predict the position where the two spheres will collide. How accurate is your prediction compared to the simulation result?

Follow-up: What adjustments would you make to your calculations or the simulation parameters to improve the accuracy of your prediction?

 

https://sg.iwant2study.org/ospsg/index.php/1248

EJS Simulation: Two Balls Rolling Down Slopes and Colliding

This EJS (Easy Java Simulations) model simulates the motion of two spherical balls rolling down inclined planes and eventually colliding on a horizontal track. The simulation is designed with careful attention to both physics and user interface, allowing for a rich exploration of the dynamics involved.

Initialization and Setup

The initialization code sets up the starting conditions for the simulation:

• Variables: The positions (x, y, x2, y2) and angles (angle, angle2) for the two balls are initialized. These variables are key in determining how the balls will move down their respective slopes.
• Precision Handling: A small tolerance (tol) is added to ensure that the event-driven nature of the ODE solver doesn’t cause the simulation to hang due to floating-point precision issues.

javascript
var tol = 1e-5;
x = L * Math.sin(angle) + tol;
y = -L * Math.cos(angle);

acuteAngle = 3 * pi / 2 - angle;
acuteAngledeg = acuteAngle * 180 / pi;

x2 = lengthHorizontalTrack + L * Math.sin(-angle2);
y2 = L * Math.cos(angle2);
acuteAngle2 = pi / 2 + angle2;
acuteAngle2deg = acuteAngle2 * 180 / pi;

getA();

This setup ensures that both balls are positioned correctly on their slopes at the start of the simulation.

Control Panel and UI Design

The control panel is a crucial part of this simulation, providing the user with the ability to manipulate various parameters:

• Sliders: The control panel includes sliders for adjusting the angles of the slopes (Angle of Slope, Angle of Slope2). These sliders are tied to the angles that determine the steepness of the slopes.
• Labels and Text Fields: The horizontal track length is displayed and can be modified, giving users control over the length of the flat section where the balls eventually collide.
• Play, Step, and Reset Buttons: These buttons control the simulation’s playback, allowing users to run, step through, or reset the simulation.

The control panel and the main simulation area are defined using HTMLView elements in the EJSS environment, enabling a clean and interactive interface.

html
<panel>
  <slider name="angleSlider" value="angle" min="0" max="90" label="Angle of Slope"/>
  <slider name="angleSlider2" value="angle2" min="0" max="90" label="Angle of Slope2"/>
  <textfield name="lengthHorizontalTrackField" value="lengthHorizontalTrack" label="Horizontal Track Length"/>
  <button name="playButton" text="Play" action="play()"/>
  <button name="stepButton" text="Step" action="step()"/>
  <button name="resetButton" text="Reset" action="reset()"/>
</panel>

HTMLView Construction

The HTMLView components are constructed carefully to allow users to interact with the simulation intuitively. The use of sliders and text fields allows for real-time adjustments, which directly influence the behavior of the simulation.

The main simulation view is designed to update dynamically as the user interacts with the control elements, ensuring a seamless experience. The graphical representations of the balls and slopes update immediately to reflect changes in parameters like slope angles.

Ordinary Differential Equations (ODEs) and Event Handling

The ODEs are defined to simulate the motion of the balls along the slopes:

javascript
dx/dt = vx;
dvx/dt = ax;
dy/dt = vy;
dvy/dt = ay;
dx2/dt = vx2;
dvx2/dt = ax2;
dy2/dt = vy2;
dvy2/dt = ay2;

These equations govern the velocity and acceleration in both x and y directions for the two balls.

Event Handling is meticulously designed to manage transitions in the simulation:

• Hit Horizontal Track: This event sets the vertical velocity (vy) to zero when the balls hit the horizontal track, effectively simulating the transition from slope to flat ground.
• Collision Detection: The simulation includes an event to detect when the two balls collide, at which point the simulation pauses. This collision detection is crucial for accurately modeling the interaction between the two balls.

javascript
// Event for ball 1 hitting horizontal
return y - 0;
action
ax = 0;
ay = 0;
vy = 0;

// Event for ball 2 hitting horizontal
return y2 - 0;
action
ax2 = 0;
ay2 = 0;
vy2 = 0;

// Collision event
return (x + radius) - (x2 - radius);
action
_pause();

Custom Functions and Sphere Dynamics

The getA function calculates the accelerations based on the ball’s position on the slope. The factor 5/7 is used to account for the rolling motion of the sphere, considering its moment of inertia:

javascript
function getA() {
    var factorOfSphere = 5/7;
    var zeroPositive = 0.01;

    // Ball 1
    if (x < zeroPositive) {
        ax = factorOfSphere * Math.cos(acuteAngle) * (-g * Math.cos(angle));
    } else {
        ax = 0;
    }

    if (x < zeroPositive) {
        ay = factorOfSphere * Math.sin(acuteAngle) * (g * Math.cos(angle));
    } else {
        ay = 0;
    }

    if (x >= zeroPositive) {
        vy = 0;
    }

    // Ball 2
    if (x2 > lengthHorizontalTrack - zeroPositive) {
        ax2 = factorOfSphere * Math.cos(acuteAngle2) * (-g * Math.cos(angle2));
    } else {
        ax2 = 0;
    }

    if (x2 > lengthHorizontalTrack - zeroPositive) {
        ay2 = factorOfSphere * Math.sin(acuteAngle2) * (-g * Math.cos(angle2));
    } else {
        ay2 = 0;
    }

    if (x2 <= lengthHorizontalTrack - zeroPositive) {
        vy2 = 0;
    }
}

Conclusion

This EJS simulation provides a rich, interactive platform for exploring the dynamics of rolling spheres. By carefully integrating the physics with a user-friendly interface, it allows users to visualize and manipulate key aspects of the simulation, such as slope angles and track length. The detailed control panel, coupled with precise ODEs and event handling, ensures that the simulation is both accurate and engaging.

This model serves as an excellent educational tool, demonstrating the complexities of rotational motion and collision dynamics in a clear and accessible manner. The source code’s attention to detail, particularly in constructing the HTMLView elements and managing the control panel design, underscores the power and flexibility of the EJS platform in creating sophisticated simulations.