aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx')
-rw-r--r--src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx80
1 files changed, 41 insertions, 39 deletions
diff --git a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
index f4acba2a6..be8dbbd40 100644
--- a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
+++ b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
@@ -6,7 +6,7 @@ import QuestionMarkIcon from '@mui/icons-material/QuestionMark';
import ReplayIcon from '@mui/icons-material/Replay';
import { Box, Button, Checkbox, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, FormControl, FormControlLabel, FormGroup, IconButton, LinearProgress, Stack } from '@mui/material';
import Typography from '@mui/material/Typography';
-import { computed, IReactionDisposer, reaction } from 'mobx';
+import { action, computed, IReactionDisposer, observable, reaction } from 'mobx';
import { observer } from 'mobx-react';
import { NumListCast } from '../../../../fields/Doc';
import { List } from '../../../../fields/List';
@@ -76,6 +76,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
}
_widthDisposer: IReactionDisposer | undefined;
+ @observable _simReset = 0;
// semi-Constants
xMin = 0;
@@ -215,6 +216,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
directionInDegrees: 270,
});
+ @action
setupSimulation = () => {
const simulationType = this.simulationType;
const mode = this.simulationMode;
@@ -237,8 +239,6 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
this.dataDoc.mass1_positionX = (this.xMax + this.xMin) / 2 - this.mass1Radius;
this.dataDoc.mass1_forcesUpdated = JSON.stringify([this.gravityForce(this.mass1)]);
this.dataDoc.mass1_forcesStart = JSON.stringify([this.gravityForce(this.mass1)]);
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- ``;
break;
case 'Inclined Plane': this.setupInclinedPlane(); break;
case 'Pendulum': this.setupPendulum(); break;
@@ -247,7 +247,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
case 'Pulley': this.setupPulley(); break;
case 'Suspension': this.setupSuspension();break;
}
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
} else if (mode == 'Review') {
this.dataDoc.simulation_showComponentForces = false;
this.dataDoc.simulation_showForceMagnitudes = true;
@@ -333,7 +333,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
this.dataDoc.simulation_showForceMagnitudes = tutorials.suspension.steps[0].showMagnitude;
break;
}
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
}
};
@@ -604,6 +604,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
};
// Default setup for uniform circular motion simulation
+ @action
setupCircular = (value: number) => {
this.dataDoc.simulation_showComponentForces = false;
this.dataDoc.mass1_velocityYstart = 0;
@@ -619,7 +620,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
};
this.dataDoc.mass1_forcesUpdated = JSON.stringify([tensionForce]);
this.dataDoc.mass1_forcesStart = JSON.stringify([tensionForce]);
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
};
setupInclinedPlane = () => {
@@ -662,6 +663,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
};
// Default setup for spring simulation
+ @action
setupSpring = () => {
this.dataDoc.simulation_showComponentForces = false;
this.dataDoc.mass1_forcesUpdated = JSON.stringify([this.gravityForce(this.mass1)]);
@@ -671,10 +673,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
this.dataDoc.spring_constant = 0.5;
this.dataDoc.spring_lengthRest = 200;
this.dataDoc.spring_lengthStart = 200;
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
};
// Default setup for suspension simulation
+ @action
setupSuspension = () => {
let xPos = (this.xMax + this.xMin) / 2 - this.mass1Radius;
let yPos = this.yMin + 200;
@@ -696,10 +699,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
const gravity = this.gravityForce(this.mass1);
this.dataDoc.mass1_forcesUpdated = JSON.stringify([tensionForce1, tensionForce2, gravity]);
this.dataDoc.mass1_forcesStart = JSON.stringify([tensionForce1, tensionForce2, gravity]);
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
};
// Default setup for pulley simulation
+ @action
setupPulley = () => {
this.dataDoc.simulation_showComponentForces = false;
this.dataDoc.mass1_positionYstart = (this.yMax + this.yMin) / 2;
@@ -728,8 +732,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
this.dataDoc.mass2_positionX = (this.xMin + this.xMax) / 2 + 5;
this.dataDoc.mass2_forcesUpdated = JSON.stringify([gravityForce2, tensionForce2]);
this.dataDoc.mass2_forcesStart = JSON.stringify([gravityForce2, tensionForce2]);
-
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
};
public static parseJSON(json: string) {
@@ -799,12 +802,14 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
setSpringLength = (length: number) => {
this.dataDoc.spring_lengthStart = length;
};
+ resetRequest = () => this._simReset;
render() {
const commonWeightProps = {
pause: this.pause,
paused: BoolCast(this.dataDoc.simulation_paused),
panelWidth: this.props.PanelWidth,
panelHeight: this.props.PanelHeight,
+ resetRequest: this.resetRequest,
xMax: this.xMax,
xMin: this.xMin,
yMax: this.yMax,
@@ -830,7 +835,6 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
startPendulumAngle: this.pendulumAngleStart,
startPendulumLength: this.pendulumLengthStart,
radius: this.mass1Radius,
- reset: BoolCast(this.dataDoc.simulation_reset),
simulationSpeed: NumCast(this.dataDoc.simulation_speed, 2),
showAcceleration: BoolCast(this.dataDoc.simulation_showAcceleration),
showForceMagnitudes: BoolCast(this.dataDoc.simulation_showForceMagnitudes),
@@ -916,7 +920,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
</div>
</div>
</div>
- <div className="mechanicsSimulationEquationContainer">
+ <div className="mechanicsSimulationEquationContainer" style={{ overflow: 'auto', height: `${(1000 / this.props.PanelWidth()) * 100}%`, transform: `scale(${this.props.PanelWidth() / 1000})` }}>
<div className="mechanicsSimulationControls">
<Stack direction="row" spacing={1}>
{this.dataDoc.simulation_paused && this.simulationMode != 'Tutorial' && (
@@ -930,7 +934,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
</IconButton>
)}
{this.dataDoc.simulation_paused && this.simulationMode != 'Tutorial' && (
- <IconButton onClick={() => (this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset)}>
+ <IconButton onClick={action(() => this._simReset++)}>
<ReplayIcon />
</IconButton>
)}
@@ -1291,11 +1295,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
</p>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<Button
- onClick={() => {
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ onClick={action(() => {
+ this._simReset++;
this.checkAnswers();
this.dataDoc.simulation_showIcon = true;
- }}
+ })}
variant="outlined">
<p>Submit</p>
</Button>
@@ -1427,7 +1431,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={'N/m'}
upperBound={500}
value={this.springConstant}
- effect={(val: number) => (this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset)}
+ effect={action(() => this._simReset++)}
radianEquivalent={false}
mode={'Freeform'}
labelWidth={'7em'}
@@ -1441,7 +1445,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit=""
upperBound={500}
value={this.springLengthRest}
- effect={(val: number) => (this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset)}
+ effect={action(() => this._simReset++)}
radianEquivalent={false}
mode="Freeform"
labelWidth={'7em'}
@@ -1455,11 +1459,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit=""
upperBound={this.springLengthRest}
value={this.springLengthStart - this.springLengthRest}
- effect={(val: number) => {
+ effect={action((val: number) => {
this.dataDoc.mass1_positionYstart = this.springLengthRest + val;
this.dataDoc.spring_lengthStart = this.springLengthRest + val;
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- }}
+ this._simReset++;
+ })}
radianEquivalent={false}
mode="Freeform"
labelWidth={'7em'}
@@ -1477,10 +1481,10 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={'°'}
upperBound={49}
value={this.wedgeAngle}
- effect={(val: number) => {
+ effect={action((val: number) => {
this.changeWedgeBasedOnNewAngle(val);
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- }}
+ this._simReset++;
+ })}
radianEquivalent={true}
mode={'Freeform'}
labelWidth={'2em'}
@@ -1498,13 +1502,13 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={''}
upperBound={1}
value={NumCast(this.dataDoc.coefficientOfStaticFriction) ?? 0}
- effect={(val: number) => {
+ effect={action((val: number) => {
this.updateForcesWithFriction(val);
if (val < NumCast(this.dataDoc.coefficientOfKineticFriction)) {
this.dataDoc.soefficientOfKineticFriction = val;
}
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- }}
+ this._simReset++;
+ })}
mode={'Freeform'}
labelWidth={'2em'}
/>
@@ -1521,9 +1525,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={''}
upperBound={NumCast(this.dataDoc.coefficientOfStaticFriction)}
value={NumCast(this.dataDoc.coefficientOfKineticFriction) ?? 0}
- effect={(val: number) => {
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- }}
+ effect={action(() => this._simReset++)}
mode={'Freeform'}
labelWidth={'2em'}
/>
@@ -1556,7 +1558,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={'°'}
upperBound={59}
value={NumCast(this.dataDoc.pendulum_angle, 30)}
- effect={value => {
+ effect={action(value => {
this.dataDoc.pendulum_angleStart = value;
this.dataDoc.pendulum_lengthStart = this.dataDoc.pendulum_length;
if (this.simulationType == 'Pendulum') {
@@ -1589,9 +1591,9 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
this.dataDoc.mass1_forcesStart = JSON.stringify([this.gravityForce(this.mass1), forceOfTension]);
this.dataDoc.mass1_forcesUpdated = JSON.stringify([this.gravityForce(this.mass1), forceOfTension]);
this.dataDoc.mass1_componentForces = JSON.stringify([forceOfTension, gravityParallel, gravityPerpendicular]);
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
}
- }}
+ })}
radianEquivalent={true}
mode="Freeform"
labelWidth="5em"
@@ -1605,13 +1607,13 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit="m"
upperBound={400}
value={Math.round(this.pendulumLength)}
- effect={value => {
+ effect={action(value => {
if (this.simulationType == 'Pendulum') {
this.dataDoc.pendulum_angleStart = this.pendulumAngle;
this.dataDoc.pendulum_lengthStart = value;
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
+ this._simReset++;
}
- }}
+ })}
radianEquivalent={false}
mode="Freeform"
labelWidth="5em"
@@ -1768,10 +1770,10 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
unit={'m/s'}
upperBound={50}
value={NumCast(this.dataDoc.mass1_velocityX)}
- effect={value => {
+ effect={action(value => {
this.dataDoc.mass1_velocityXstart = value;
- this.dataDoc.simulation_reset = !this.dataDoc.simulation_reset;
- }}
+ this._simReset++;
+ })}
small={true}
mode="Freeform"
/>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 15:04:43 +0000