diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/nodes/PhysicsSimulationBox.scss | 8 | ||||
| -rw-r--r-- | src/client/views/nodes/PhysicsSimulationBox.tsx | 76 | ||||
| -rw-r--r-- | src/client/views/nodes/PhysicsSimulationWeight.tsx | 3 |
3 files changed, 61 insertions, 26 deletions
diff --git a/src/client/views/nodes/PhysicsSimulationBox.scss b/src/client/views/nodes/PhysicsSimulationBox.scss index 7573f1472..0f05010b4 100644 --- a/src/client/views/nodes/PhysicsSimulationBox.scss +++ b/src/client/views/nodes/PhysicsSimulationBox.scss @@ -63,12 +63,10 @@ button { z-index: 1000; } -.mechanicsSimulationSettingsMenuColumn { +.mechanicsSimulationSettingsMenuRow { display: flex; - flex-direction: column; - width: 50%; } -.mechanicsSimulationSettingsMenuContents { - display: flex; +.mechanicsSimulationSettingsMenuRowDescription { + width: 50%; }
\ No newline at end of file diff --git a/src/client/views/nodes/PhysicsSimulationBox.tsx b/src/client/views/nodes/PhysicsSimulationBox.tsx index 7eb9092bf..1a64ec795 100644 --- a/src/client/views/nodes/PhysicsSimulationBox.tsx +++ b/src/client/views/nodes/PhysicsSimulationBox.tsx @@ -119,6 +119,7 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi let mag = 9.81 * Math.cos((angle * Math.PI) / 180); this.dataDoc.pendulumAngle = angle; this.dataDoc.pendulumLength = length; + this.dataDoc.startPendulumAngle = angle; this.dataDoc.adjustPendulumAngle = !this.dataDoc.adjustPendulumAngle; } @@ -316,7 +317,7 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi <div className="mechanicsSimulationElements"> {this.dataDoc.weight && ( <Weight - adjustPendulumAnge={this.dataDoc.adjustPendulumAnge} + adjustPendulumAngle={this.dataDoc.adjustPendulumAngle} color={"red"} dataDoc={this.dataDoc} mass={1} @@ -326,6 +327,10 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi startPosY={this.dataDoc.startPosY} timestepSize={0.002} updateDisplay={this.dataDoc.updateDisplay} + walls={this.dataDoc.wallPositions} + wedge={this.dataDoc.wedge} + wedgeWidth={this.dataDoc.wedgeWidth} + wedgeHeight={this.dataDoc.wedgeHeight} xMax={this.xMax} xMin={this.xMin} yMax={this.yMax} @@ -365,32 +370,63 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi <FontAwesomeIcon icon={'times'} color="black" size={'lg'} /> </div> <h4>Simulation Settings</h4> - <div className="mechanicsSimulationSettingsMenuContents"> - <div className="mechanicsSimulationSettingsMenuColumn"> - <div><p>Show forces</p></div> - <div><p>Show acceleration</p></div> - <div><p>Show velocity</p></div> - {this.dataDoc.simulationType == "Free Weight" && <div><p>Elastic collisions </p></div>} - </div> - <div className="mechanicsSimulationSettingsMenuColumn"> - <div><input type="checkbox" checked={this.dataDoc.showForces} onClick={() => {this.dataDoc.showForces = !this.dataDoc.showForces}}/></div> - <div><input type="checkbox" checked={this.dataDoc.showAcceleration} onClick={() => {this.dataDoc.showAcceleration = !this.dataDoc.showAcceleration}}/></div> - <div><input type="checkbox" checked={this.dataDoc.showVelocity} onClick={() => {this.dataDoc.showVelocity = !this.dataDoc.showVelocity}}/></div> - {this.dataDoc.simulationType == "Free Weight" && <div><input type="checkbox" checked={this.dataDoc.elasticCollisions} onClick={() => {this.dataDoc.elasticCollisions = !this.dataDoc.elasticCollisions}}/></div>} - </div> + <div className="mechanicsSimulationSettingsMenuRow"> + <div className="mechanicsSimulationSettingsMenuRowDescription"><p>Show forces</p></div> + <div><input type="checkbox" checked={this.dataDoc.showForces} onClick={() => {this.dataDoc.showForces = !this.dataDoc.showForces}}/></div> + </div> + <div className="mechanicsSimulationSettingsMenuRow"> + <div className="mechanicsSimulationSettingsMenuRowDescription"><p>Show acceleration</p></div> + <div><input type="checkbox" checked={this.dataDoc.showAcceleration} onClick={() => {this.dataDoc.showAcceleration = !this.dataDoc.showAcceleration}}/></div> </div> + <div className="mechanicsSimulationSettingsMenuRow"> + <div className="mechanicsSimulationSettingsMenuRowDescription"> + <p>Show velocity</p></div> + <div><input type="checkbox" checked={this.dataDoc.showVelocity} onClick={() => {this.dataDoc.showVelocity = !this.dataDoc.showVelocity}}/></div> + </div> + <br/> + {this.dataDoc.simulationType == "Free Weight" && <div className="mechanicsSimulationSettingsMenuRow"> + <div className="mechanicsSimulationSettingsMenuRowDescription"><p>Elastic collisions </p></div> + <div><input type="checkbox" checked={this.dataDoc.elasticCollisions} onClick={() => {this.dataDoc.elasticCollisions = !this.dataDoc.elasticCollisions}}/></div> + </div>} + {this.dataDoc.simulationType == "Pendulum" && <div className="mechanicsSimulationSettingsMenuRow"> + <div className="mechanicsSimulationSettingsMenuRowDescription"><p>Pendulum start angle</p></div> + <div> + <input + type="number" + value={this.dataDoc.startPendulumAngle} + max={35} + min={0} + step={1} + onInput={(e) => { + let angle = e.target.value; + if (angle > 35) { + angle = 35 + } + if (angle < 0) { + angle = 0 + } + let length = this.xMax*0.7; + let x = length * Math.cos(((90 - angle) * Math.PI) / 180); + let y = length * Math.sin(((90 - angle) * Math.PI) / 180); + let xPos = this.xMax / 2 - x - this.radius; + let yPos = y - this.radius; + this.dataDoc.startPosX = xPos; + this.dataDoc.startPosY = yPos; + let mag = 9.81 * Math.cos((angle * Math.PI) / 180); + this.dataDoc.pendulumAngle = angle; + this.dataDoc.pendulumLength = length; + this.dataDoc.startPendulumAngle = angle; + this.dataDoc.adjustPendulumAngle = !this.dataDoc.adjustPendulumAngle; + }} + /> + </div> + </div>} {/* {this.dataDoc.simulationType == "Inclined Plane" && <div className="mechanicsSimulationSettingsMenuRow"> <p>Inclined plane angle </p> <p>input field!</p> </div> } */} - {/* {this.dataDoc.simulationType == "Pendulum" && - <div className="mechanicsSimulationSettingsMenuRow"> - <p>Pendulum angle </p> - <p>input field!</p> - </div> - } */} </div> )} </div> diff --git a/src/client/views/nodes/PhysicsSimulationWeight.tsx b/src/client/views/nodes/PhysicsSimulationWeight.tsx index 66af645b5..9aa5a6aab 100644 --- a/src/client/views/nodes/PhysicsSimulationWeight.tsx +++ b/src/client/views/nodes/PhysicsSimulationWeight.tsx @@ -293,6 +293,7 @@ export default class Weight extends React.Component<IWeightProps, IState> { this.setState({xVelocity: this.props.startVelX ?? 0}) this.setState({yVelocity: this.props.startVelY ?? 0}) this.props.dataDoc['updatedForces'] = (this.props.dataDoc['startForces']) + this.setState({angleLabel: Math.round(this.props.dataDoc['pendulumAngle']* 100) / 100}) this.setDisplayValues(); }; @@ -356,7 +357,7 @@ export default class Weight extends React.Component<IWeightProps, IState> { magnitude: mag, directionInDegrees: angle, }; - this.setState({angleLabel: Math.round(oppositeAngle * 100) / 100}) + this.setState({angleLabel: Math.round(this.props.dataDoc['pendulumAngle']* 100) / 100}) return [this.forceOfGravity, forceOfTension]; }; |