aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/PhysicsSimulationWeight.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/PhysicsSimulationWeight.tsx')
-rw-r--r--src/client/views/nodes/PhysicsSimulationWeight.tsx129
1 files changed, 51 insertions, 78 deletions
diff --git a/src/client/views/nodes/PhysicsSimulationWeight.tsx b/src/client/views/nodes/PhysicsSimulationWeight.tsx
index dfd463bbe..fcfb149c9 100644
--- a/src/client/views/nodes/PhysicsSimulationWeight.tsx
+++ b/src/client/views/nodes/PhysicsSimulationWeight.tsx
@@ -1,4 +1,5 @@
import React = require('react');
+import { Doc } from '../../../fields/Doc';
import { IWallProps } from "./PhysicsSimulationWall";
export interface IForce {
@@ -7,35 +8,17 @@ export interface IForce {
directionInDegrees: number;
}
export interface IWeightProps {
- adjustPendulumAngle: { angle: number; length: number };
+ dataDoc: Doc;
color: string;
- displayXPosition: number;
- displayYPosition: number;
- displayXVelocity: number;
- displayYVelocity: number;
- elasticCollisions: boolean;
startForces: IForce[];
- incrementTime: number;
mass: number;
- paused: boolean;
pendulum: boolean;
pendulumLength: number;
wedge: boolean;
radius: number;
reset: boolean;
- setDisplayXAcceleration: (val: number) => any;
- setDisplayXPosition: (val: number) => any;
- setDisplayXVelocity: (val: number) => any;
- setDisplayYAcceleration: (val: number) => any;
- setDisplayYPosition: (val: number) => any;
- setDisplayYVelocity: (val: number) => any;
- setPaused: (bool: boolean) => any;
- setPendulumAngle: (val: number) => any;
- setPendulumLength: (val: number) => any;
- setStartPendulumAngle: (val: number) => any;
showAcceleration: boolean;
pendulumAngle: number;
- setSketching: (val: boolean) => any;
showForces: boolean;
showForceMagnitudes: boolean;
showVelocity: boolean;
@@ -46,7 +29,6 @@ export interface IWeightProps {
timestepSize: number;
updateDisplay: { xDisplay: number; yDisplay: number };
updatedForces: IForce[];
- setUpdatedForces: (val: IForce[]) => any;
walls: IWallProps[];
coefficientOfKineticFriction: number;
wedgeWidth: number;
@@ -125,16 +107,16 @@ export default class Weight extends React.Component<IWeightProps, IState> {
// Set display values based on real values
setYPosDisplay = (yPos: number) => {
const displayPos = this.getDisplayYPos(yPos);
- this.props.setDisplayYPosition(Math.round(displayPos * 100) / 100)
+ this.props.dataDoc['positionYDisplay'] = Math.round(displayPos * 100) / 100
};
setXPosDisplay = (xPos: number) => {
- this.props.setDisplayXPosition(Math.round(xPos * 100) / 100);
+ this.props.dataDoc['positionXDisplay'] = Math.round(xPos * 100) / 100;
};
setYVelDisplay = (yVel: number) => {
- this.props.setDisplayYVelocity((-1 * Math.round(yVel * 100)) / 100);
+ this.props.dataDoc['velocityYDisplay'] = (-1 * Math.round(yVel * 100)) / 100;
};
setXVelDisplay = (xVel: number) => {
- this.props.setDisplayXVelocity(Math.round(xVel * 100) / 100);
+ this.props.dataDoc['velocityXDisplay'] = Math.round(xVel * 100) / 100;
};
setDisplayValues = (
@@ -147,12 +129,12 @@ export default class Weight extends React.Component<IWeightProps, IState> {
this.setXPosDisplay(xPos);
this.setYVelDisplay(yVel);
this.setXVelDisplay(xVel);
- this.props.setDisplayYAcceleration(
+ this.props.dataDoc['accelerationYDisplay'] =
(-1 * Math.round(this.getNewAccelerationY(this.props.updatedForces) * 100)) / 100
- );
- this.props.setDisplayXAcceleration(
+ ;
+ this.props.dataDoc['accelerationXDisplay'] =
Math.round(this.getNewAccelerationX(this.props.updatedForces) * 100) / 100
- );
+ ;
};
componentDidUpdate(prevProps: Readonly<IWeightProps>, prevState: Readonly<IState>, snapshot?: any): void {
@@ -164,34 +146,34 @@ export default class Weight extends React.Component<IWeightProps, IState> {
x = Math.min(x, this.props.xMax - 2 * this.props.radius);
this.setState({updatedStartPosX: x})
this.setState({xPosition: x})
- this.props.setDisplayXPosition(x);
+ this.props.dataDoc['positionXDisplay'] = x;
}
if (this.props.updateDisplay.yDisplay != this.getDisplayYPos(this.state.yPosition)) {
let y = this.props.updateDisplay.yDisplay;
y = Math.max(0, y);
y = Math.min(y, this.props.yMax - 2 * this.props.radius);
- this.props.setDisplayYPosition(y);
+ this.props.dataDoc['positionYDisplay'] = y;
let coordinatePosition = this.getYPosFromDisplay(y);
this.setState({updatedStartPosY: coordinatePosition})
this.setState({yPosition: coordinatePosition})
}
- if (this.props.displayXVelocity != this.state.xVelocity) {
- let x = this.props.displayXVelocity;
+ if (this.props.dataDoc['velocityXDisplay'] != this.state.xVelocity) {
+ let x = this.props.dataDoc['velocityXDisplay'];
this.setState({xVelocity: x})
- this.props.setDisplayXVelocity(x);
+ this.props.dataDoc['velocityXDisplay'] = x;
}
- if (this.props.displayYVelocity != this.state.yVelocity) {
- let y = this.props.displayYVelocity;
+ if (this.props.dataDoc['velocityYDisplay'] != this.state.yVelocity) {
+ let y = this.props.dataDoc['velocityYDisplay'];
this.setState({yVelocity: -y})
- this.props.setDisplayXVelocity(y);
+ this.props.dataDoc['velocityYDisplay']
}
}
// Update sim
- if (this.props.incrementTime != prevProps.incrementTime) {
- if (!this.props.paused) {
+ if (this.props.dataDoc['incrementTime'] != prevProps.dataDoc['incrementTime']) {
+ if (!this.props.dataDoc['simulationPaused']) {
let collisions = false;
if (!this.props.pendulum) {
const collisionsWithGround = this.checkForCollisionsWithGround();
@@ -229,21 +211,19 @@ export default class Weight extends React.Component<IWeightProps, IState> {
this.setState({yVelocity: this.props.startVelY ?? 0})
this.setDisplayValues();
}
- if (this.props.adjustPendulumAngle != prevProps.adjustPendulumAngle) {
+ if (this.props.dataDoc['adjustPendulumAngle'] != prevProps.dataDoc['adjustPendulumAngle']) {
// Change pendulum angle based on input field
- let length = this.props.adjustPendulumAngle.length;
+ let length = this.props.dataDoc['pendulumLength'] ?? 0;
const x =
- length * Math.cos(((90 - this.props.adjustPendulumAngle.angle) * Math.PI) / 180);
+ length * Math.cos(((90 - this.props.dataDoc['pendulumAngle']) * Math.PI) / 180);
const y =
- length * Math.sin(((90 - this.props.adjustPendulumAngle.angle) * Math.PI) / 180);
+ length * Math.sin(((90 - this.props.dataDoc['pendulumAngle']) * Math.PI) / 180);
const xPos = this.props.xMax / 2 - x - this.props.radius;
const yPos = y - this.props.radius - 5;
this.setState({xPosition: xPos})
this.setState({yPosition: yPos})
this.setState({updatedStartPosX: xPos})
this.setState({updatedStartPosY: yPos})
- this.props.setPendulumAngle(this.props.adjustPendulumAngle.angle);
- this.props.setPendulumLength(this.props.adjustPendulumAngle.length);
}
// Update x start position
if (this.props.startPosX != prevProps.startPosX) {
@@ -314,24 +294,28 @@ export default class Weight extends React.Component<IWeightProps, IState> {
getNewAccelerationX = (forceList: IForce[]) => {
let newXAcc = 0;
- forceList.forEach((force) => {
- newXAcc +=
- (force.magnitude *
- Math.cos((force.directionInDegrees * Math.PI) / 180)) /
- this.props.mass;
- });
+ if (forceList) {
+ forceList.forEach((force) => {
+ newXAcc +=
+ (force.magnitude *
+ Math.cos((force.directionInDegrees * Math.PI) / 180)) /
+ this.props.mass;
+ });
+ }
return newXAcc;
};
getNewAccelerationY = (forceList: IForce[]) => {
let newYAcc = 0;
- forceList.forEach((force) => {
- newYAcc +=
- (-1 *
- (force.magnitude *
- Math.sin((force.directionInDegrees * Math.PI) / 180))) /
- this.props.mass;
- });
+ if (forceList) {
+ forceList.forEach((force) => {
+ newYAcc +=
+ (-1 *
+ (force.magnitude *
+ Math.sin((force.directionInDegrees * Math.PI) / 180))) /
+ this.props.mass;
+ });
+ }
return newYAcc;
};
@@ -356,8 +340,8 @@ export default class Weight extends React.Component<IWeightProps, IState> {
}
const pendulumLength = Math.sqrt(x * x + y * y);
- this.props.setPendulumAngle(oppositeAngle);
- this.props.setPendulumLength(Math.sqrt(x * x + y * y));
+ this.props.dataDoc['pendulumAngle'] = oppositeAngle;
+ this.props.dataDoc['pendulumLength'] = Math.sqrt(x * x + y * y);
const mag =
this.props.mass * 9.81 * Math.cos((oppositeAngle * Math.PI) / 180) +
@@ -391,7 +375,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
const wallX = (wall.xPos / 100) * 300;
if (wall.xPos < 0.35) {
if (minX <= wallX) {
- if (this.props.elasticCollisions) {
+ if (this.props.dataDoc['elasticCollisions']) {
this.setState({xVelocity: -this.state.xVelocity});
} else {
this.setState({xVelocity: 0});
@@ -401,7 +385,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
}
} else {
if (maxX >= wallX) {
- if (this.props.elasticCollisions) {
+ if (this.props.dataDoc['elasticCollisions']) {
this.setState({xVelocity: -this.state.xVelocity});
} else {
this.setState({xVelocity: 0});
@@ -424,7 +408,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
if (wall.angleInDegrees == 0) {
const groundY = (wall.yPos / 100) * this.props.yMax;
if (maxY >= groundY) {
- if (this.props.elasticCollisions) {
+ if (this.props.dataDoc['elasticCollisions']) {
this.setState({yVelocity: -this.state.yVelocity})
} else {
this.setState({yVelocity: 0})
@@ -525,7 +509,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
onPointerDown={(e) => {
if (this.draggable) {
e.preventDefault();
- this.props.setPaused(true);
+ this.props.dataDoc['simulationPaused'] = true;
this.setState({dragging: true});
this.setState({clickPositionX: e.clientX})
this.setState({clickPositionY: e.clientY})
@@ -549,7 +533,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
this.setState({yPosition: newY})
this.setState({updatedStartPosX: newX})
this.setState({updatedStartPosY: newY})
- this.props.setDisplayYPosition(Math.round((this.props.yMax - 2 * this.props.radius - newY + 5) * 100) / 100)
+ this.props.dataDoc['positionYDisplay'] = Math.round((this.props.yMax - 2 * this.props.radius - newY + 5) * 100) / 100;
this.setState({clickPositionX: e.clientX})
this.setState({clickPositionY: e.clientY})
this.setDisplayValues();
@@ -586,8 +570,8 @@ export default class Weight extends React.Component<IWeightProps, IState> {
}
const pendulumLength = Math.sqrt(x * x + y * y);
- this.props.setPendulumAngle(oppositeAngle);
- this.props.setPendulumLength(Math.sqrt(x * x + y * y));
+ this.props.dataDoc['pendulumAngle'] = oppositeAngle;
+ this.props.dataDoc['pendulumLength'] = Math.sqrt(x * x + y * y);
const mag = 9.81 * Math.cos((oppositeAngle * Math.PI) / 180);
const forceOfTension: IForce = {
description: "Tension",
@@ -629,17 +613,6 @@ export default class Weight extends React.Component<IWeightProps, IState> {
</svg>
{!this.state.dragging && (
<div>
- {/* <p
- style={{
- position: "absolute",
- zIndex: 5,
- left: this.state.xPosition + "px",
- top: this.state.yPosition - 70 + "px",
- backgroundColor: this.labelBackgroundColor,
- }}
- >
- {Math.round(this.props.pendulumLength)} m
- </p> */}
<p
style={{
position: "absolute",
@@ -648,7 +621,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
backgroundColor: this.labelBackgroundColor,
}}
>
- {Math.round(this.props.pendulumAngle * 100) / 100}°
+ {Math.round(this.props.dataDoc['pendulumAngle'] * 100) / 100}°
</p>
</div>
)}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-09 16:44:49 +0000