From 9a5f2e9d098d0ad2db1be90818b6295390a60501 Mon Sep 17 00:00:00 2001
From: brynnchernosky <56202540+brynnchernosky@users.noreply.github.com>
Date: Wed, 22 Feb 2023 14:29:44 -0500
Subject: pendulum angle

---
 src/client/views/nodes/PhysicsSimulationBox.scss   |  8 +--
 src/client/views/nodes/PhysicsSimulationBox.tsx    | 76 ++++++++++++++++------
 src/client/views/nodes/PhysicsSimulationWeight.tsx |  3 +-
 3 files changed, 61 insertions(+), 26 deletions(-)

(limited to 'src')

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];
   };
-- 
cgit v1.2.3-70-g09d2