aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx355
1 files changed, 177 insertions, 178 deletions
diff --git a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
index 101cf1d4a..446c4933b 100644
--- a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
+++ b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
@@ -89,8 +89,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
// Constants
const xMin = 0;
const yMin = 0;
- const xMax = window.innerWidth * 0.7;
- const yMax = window.innerHeight * 0.8;
+ const xMax = 100;
+ const yMax = 100;
const color = `rgba(0,0,0,0.5)`;
const radius = 50;
const wallPositions: IWallProps[] = [];
@@ -102,8 +102,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
this.wallPositions.push({ length: 80, xPos: 69.5, yPos: 0, angleInDegrees: 90 });
// Used throughout sims
- this.xMax = this.layoutDoc._width;
- this.yMax = this.layoutDoc._height;
+ this.xMax = this.layoutDoc._width*0.08;
+ this.yMax = this.layoutDoc._height*0.08;
this.radius = 0.1*this.layoutDoc._height;
this.dataDoc.reviewCoefficient = this.dataDoc.reviewCoefficient ?? 0;
this.dataDoc.questionVariables = this.dataDoc.questionVariables ?? [];
@@ -356,8 +356,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
}
componentDidUpdate() {
- this.xMax = this.layoutDoc._width;
- this.yMax = this.layoutDoc._height;
+ this.xMax = this.layoutDoc._width*0.08;
+ this.yMax = this.layoutDoc._height*0.08;
this.radius = 0.1*this.layoutDoc._height;
}
@@ -1762,108 +1762,107 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
label="Show velocity vector"
labelPlacement="start"
/>
-
<InputField
label={<Box>Speed</Box>}
lowerBound={1}
- changeValue={setSimulationSpeed}
+ changeValue={this.dataDoc.simulationSpeed} //TODO - deal with input field change value now that datadoc is being used!
step={1}
unit={"x"}
upperBound={10}
- value={simulationSpeed}
+ value={this.dataDoc.simulationSpeed}
labelWidth={"5em"}
/>
- {simulationPaused && simulationType != "Circular Motion" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType != "Circular Motion" && (
<InputField
label={<Box>Gravity</Box>}
lowerBound={-30}
- changeValue={setGravity}
+ changeValue={this.dataDoc.gravity}
step={0.01}
unit={"m/s2"}
upperBound={0}
- value={gravity}
+ value={this.dataDoc.gravity}
effect={(val: number) => {
- setResetAll(!resetAll);
+ this.dataDoc.resetAll = (!this.dataDoc.resetAll);
}}
labelWidth={"5em"}
/>
)}
- {simulationPaused && simulationType != "Pulley" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType != "Pulley" && (
<InputField
label={<Box>Mass</Box>}
lowerBound={1}
- changeValue={setMass}
+ changeValue={this.dataDoc.mass}
step={0.1}
unit={"kg"}
upperBound={5}
- value={mass}
+ value={this.dataDoc.mass}
effect={(val: number) => {
- setResetAll(!resetAll);
+ this.dataDoc.resetAll = (!this.dataDoc.resetAll);
}}
labelWidth={"5em"}
/>
)}
- {simulationPaused && simulationType == "Pulley" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType == "Pulley" && (
<InputField
label={<Box>Red mass</Box>}
lowerBound={1}
- changeValue={setMass}
+ changeValue={this.dataDoc.mass}
step={0.1}
unit={"kg"}
upperBound={5}
- value={mass}
+ value={this.dataDoc.mass}
effect={(val: number) => {
- setResetAll(!resetAll);
+ this.dataDoc.resetAll = (!this.dataDoc.resetAll);
}}
labelWidth={"5em"}
/>
)}
- {simulationPaused && simulationType == "Pulley" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType == "Pulley" && (
<InputField
label={<Box>Blue mass</Box>}
lowerBound={1}
- changeValue={setMass2}
+ changeValue={this.dataDoc.mass2}
step={0.1}
unit={"kg"}
upperBound={5}
- value={mass2}
+ value={this.dataDoc.mass2}
effect={(val: number) => {
- setResetAll(!resetAll);
+ this.dataDoc.resetAll = (!this.dataDoc.resetAll);
}}
labelWidth={"5em"}
/>
)}
- {simulationPaused && simulationType == "Circular Motion" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType == "Circular Motion" && (
<InputField
label={<Box>Rod length</Box>}
lowerBound={100}
- changeValue={setCircularMotionRadius}
+ changeValue={this.dataDoc.circularMotionRadius}
step={5}
unit={"kg"}
upperBound={250}
- value={circularMotionRadius}
+ value={this.dataDoc.circularMotionRadius}
effect={(val: number) => {
- setResetAll(!resetAll);
+ this.dataDoc.resetAll = (!this.dataDoc.resetAll);
}}
labelWidth={"5em"}
/>
)}
</FormGroup>
</FormControl>
- {simulationType == "Spring" && simulationPaused && (
+ {this.dataDoc.simulationType == "Spring" && this.dataDoc.simulationPaused && (
<div>
<InputField
label={
<Typography color="inherit">Spring stiffness</Typography>
}
lowerBound={0.1}
- changeValue={setSpringConstant}
+ changeValue={this.dataDoc.springConstant}
step={1}
unit={"N/m"}
upperBound={500}
value={springConstant}
effect={(val: number) => {
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset(!this.dataDoc.simulationReset);
}}
radianEquivalent={false}
mode={"Freeform"}
@@ -1872,13 +1871,13 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<InputField
label={<Typography color="inherit">Rest length</Typography>}
lowerBound={10}
- changeValue={setSpringRestLength}
+ changeValue={this.dataDoc.springRestLength}
step={100}
unit={""}
upperBound={500}
- value={springRestLength}
+ value={this.dataDoc.springRestLength}
effect={(val: number) => {
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
radianEquivalent={false}
mode={"Freeform"}
@@ -1890,16 +1889,16 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
Starting displacement
</Typography>
}
- lowerBound={-(springRestLength - 10)}
+ lowerBound={-(this.dataDoc.springRestLength - 10)}
changeValue={(val: number) => {}}
step={10}
unit={""}
- upperBound={springRestLength}
- value={springStartLength - springRestLength}
+ upperBound={this.dataDoc.springRestLength}
+ value={this.dataDoc.springStartLength - this.dataDoc.springRestLength}
effect={(val: number) => {
- setStartPosY(springRestLength + val);
- setSpringStartLength(springRestLength + val);
- setSimulationReset(!simulationReset);
+ this.dataDoc.startPosY = (this.dataDoc.springRestLength + val);
+ this.dataDoc.springStartLength = (this.dataDoc.springRestLength + val);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
radianEquivalent={false}
mode={"Freeform"}
@@ -1907,19 +1906,19 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
/>
</div>
)}
- {simulationType == "Inclined Plane" && simulationPaused && (
+ {this.dataDoc.simulationType == "Inclined Plane" && this.dataDoc.simulationPaused && (
<div>
<InputField
label={<Box>&theta;</Box>}
lowerBound={0}
- changeValue={setWedgeAngle}
+ changeValue={this.dataDoc.wedgeAngle}
step={1}
unit={"°"}
upperBound={49}
- value={wedgeAngle}
+ value={this.dataDoc.wedgeAngle}
effect={(val: number) => {
- changeWedgeBasedOnNewAngle(val);
- setSimulationReset(!simulationReset);
+ this.changeWedgeBasedOnNewAngle(val);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
radianEquivalent={true}
mode={"Freeform"}
@@ -1932,17 +1931,17 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
</Box>
}
lowerBound={0}
- changeValue={setCoefficientOfStaticFriction}
+ changeValue={this.dataDoc.coefficientOfStaticFriction}
step={0.1}
unit={""}
upperBound={1}
- value={coefficientOfStaticFriction}
+ value={this.dataDoc.coefficientOfStaticFriction}
effect={(val: number) => {
- updateForcesWithFriction(val);
- if (val < Number(coefficientOfKineticFriction)) {
- setCoefficientOfKineticFriction(val);
+ this.updateForcesWithFriction(val);
+ if (val < Number(this.dataDoc.coefficientOfKineticFriction)) {
+ this.dataDoc.soefficientOfKineticFriction = (val);
}
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
mode={"Freeform"}
labelWidth={"2em"}
@@ -1954,54 +1953,54 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
</Box>
}
lowerBound={0}
- changeValue={setCoefficientOfKineticFriction}
+ changeValue={this.dataDoc.coefficientOfKineticFriction}
step={0.1}
unit={""}
- upperBound={Number(coefficientOfStaticFriction)}
- value={coefficientOfKineticFriction}
+ upperBound={Number(this.dataDoc.coefficientOfStaticFriction)}
+ value={this.dataDoc.coefficientOfKineticFriction}
effect={(val: number) => {
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
mode={"Freeform"}
labelWidth={"2em"}
/>
</div>
)}
- {simulationType == "Inclined Plane" && !simulationPaused && (
+ {this.dataDoc.simulationType == "Inclined Plane" && !this.dataDoc.simulationPaused && (
<Typography>
- &theta;: {Math.round(Number(wedgeAngle) * 100) / 100}° ≈{" "}
- {Math.round(((Number(wedgeAngle) * Math.PI) / 180) * 100) /
+ &theta;: {Math.round(Number(this.dataDoc.wedgeAngle) * 100) / 100}° ≈{" "}
+ {Math.round(((Number(this.dataDoc.wedgeAngle) * Math.PI) / 180) * 100) /
100}{" "}
rad
<br />
- &mu; <sub>s</sub>: {coefficientOfStaticFriction}
+ &mu; <sub>s</sub>: {this.dataDoc.coefficientOfStaticFriction}
<br />
- &mu; <sub>k</sub>: {coefficientOfKineticFriction}
+ &mu; <sub>k</sub>: {this.dataDoc.coefficientOfKineticFriction}
</Typography>
)}
- {simulationType == "Pendulum" && !simulationPaused && (
+ {this.dataDoc.simulationType == "Pendulum" && !this.dataDoc.simulationPaused && (
<Typography>
- &theta;: {Math.round(pendulumAngle * 100) / 100}° ≈{" "}
- {Math.round(((pendulumAngle * Math.PI) / 180) * 100) / 100}{" "}
+ &theta;: {Math.round(this.dataDoc.pendulumAngle * 100) / 100}° ≈{" "}
+ {Math.round(((this.dataDoc.pendulumAngle * Math.PI) / 180) * 100) / 100}{" "}
rad
</Typography>
)}
- {simulationType == "Pendulum" && simulationPaused && (
+ {this.dataDoc.simulationType == "Pendulum" && this.dataDoc.simulationPaused && (
<div>
<InputField
label={<Box>Angle</Box>}
lowerBound={0}
- changeValue={setPendulumAngle}
+ changeValue={this.dataDoc.pendulumAngle}
step={1}
unit={"°"}
upperBound={59}
- value={pendulumAngle}
+ value={this.dataDoc.pendulumAngle}
effect={(value) => {
- setStartPendulumAngle(value);
+ this.dataDoc.startPendulumAngle = (value);
if (simulationType == "Pendulum") {
const mag =
mass *
- Math.abs(gravity) *
+ Math.abs(this.dataDoc.gravity) *
Math.cos((value * Math.PI) / 180);
const forceOfTension: IForce = {
@@ -2020,7 +2019,7 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
const gravityParallel: IForce = {
description: "Gravity Parallel Component",
magnitude:
- Math.abs(gravity) *
+ Math.abs(this.dataDoc.gravity) *
Math.cos((value * Math.PI) / 180),
directionInDegrees: 270 - value,
component: true,
@@ -2028,50 +2027,50 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
const gravityPerpendicular: IForce = {
description: "Gravity Perpendicular Component",
magnitude:
- Math.abs(gravity) *
+ Math.abs(this.dataDoc.gravity) *
Math.sin((value * Math.PI) / 180),
directionInDegrees: -value,
component: true,
};
- const length = pendulumLength;
+ const length = this.dataDoc.pendulumLength;
const x =
length * Math.cos(((90 - value) * Math.PI) / 180);
const y =
length * Math.sin(((90 - value) * Math.PI) / 180);
- const xPos = xMax / 2 - x - radius;
+ const xPos = this.xMax / 2 - x - radius;
const yPos = y - radius - 5;
- setStartPosX(xPos);
- setStartPosY(yPos);
+ this.dataDoc.startPosX = (xPos);
+ this.dataDoc.startPosY= (yPos);
- setStartForces([
+ this.dataDoc.startForces = ([
{
description: "Gravity",
- magnitude: Math.abs(gravity) * mass,
+ magnitude: Math.abs(this.dataDoc.gravity) * this.dataDoc.mass,
directionInDegrees: 270,
component: false,
},
forceOfTension,
]);
- setUpdatedForces([
+ this.dataDoc.updatedForces = ([
{
description: "Gravity",
- magnitude: Math.abs(gravity) * mass,
+ magnitude: Math.abs(this.dataDoc.gravity) * this.dataDoc.mass,
directionInDegrees: 270,
component: false,
},
forceOfTension,
]);
- setComponentForces([
+ this.dataDoc.componentForces = ([
tensionComponent,
gravityParallel,
gravityPerpendicular,
]);
- setAdjustPendulumAngle({
+ this.dataDoc.adjustPendulumAngle = ({
angle: value,
length: pendulumLength,
});
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}
}}
radianEquivalent={true}
@@ -2081,18 +2080,18 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<InputField
label={<Box>Rod length</Box>}
lowerBound={0}
- changeValue={setPendulumLength}
+ changeValue={this.dataDoc.pendulumLength}
step={1}
unit={"m"}
upperBound={400}
- value={Math.round(pendulumLength)}
+ value={Math.round(this.dataDoc.pendulumLength)}
effect={(value) => {
if (simulationType == "Pendulum") {
- setAdjustPendulumAngle({
- angle: pendulumAngle,
+ this.dataDoc.adjustPendulumAngle = ({
+ angle: this.dataDoc.pendulumAngle,
length: value,
});
- setSimulationReset(!simulationReset);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}
}}
radianEquivalent={false}
@@ -2104,39 +2103,39 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
</div>
)}
<div className="mechanicsSimulationEquation">
- {mode == "Freeform" && (
+ {this.dataDoc.mode == "Freeform" && (
<table>
<tbody>
<tr>
- <td>{simulationType == "Pulley" ? "Red Weight" : ""}</td>
+ <td>{this.dataDoc.simulationType == "Pulley" ? "Red Weight" : ""}</td>
<td>X</td>
<td>Y</td>
</tr>
<tr>
<td
style={{ cursor: "help" }}
- onClick={() => {
- window.open(
- "https://www.khanacademy.org/science/physics/two-dimensional-motion"
- );
- }}
+ // onClick={() => {
+ // window.open(
+ // "https://www.khanacademy.org/science/physics/two-dimensional-motion"
+ // );
+ // }}
>
<Box>Position</Box>
</td>
- {(!simulationPaused ||
- simulationType == "Inclined Plane" ||
- simulationType == "Suspension" ||
- simulationType == "Circular Motion" ||
- simulationType == "Pulley") && (
+ {(!this.dataDoc.simulationPaused ||
+ this.dataDoc.simulationType == "Inclined Plane" ||
+ this.dataDoc.simulationType == "Suspension" ||
+ this.dataDoc.simulationType == "Circular Motion" ||
+ this.dataDoc.simulationType == "Pulley") && (
<td style={{ cursor: "default" }}>
- {positionXDisplay} m
+ {this.dataDoc.positionXDisplay} m
</td>
)}{" "}
- {simulationPaused &&
- simulationType != "Inclined Plane" &&
- simulationType != "Suspension" &&
- simulationType != "Circular Motion" &&
- simulationType != "Pulley" && (
+ {this.dataDoc.simulationPaused &&
+ this.dataDoc.simulationType != "Inclined Plane" &&
+ this.dataDoc.simulationType != "Suspension" &&
+ this.dataDoc.simulationType != "Circular Motion" &&
+ this.dataDoc.simulationType != "Pulley" && (
<td
style={{
cursor: "default",
@@ -2144,15 +2143,15 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
>
<InputField
lowerBound={0}
- changeValue={setPositionXDisplay}
+ changeValue={this.dataDoc.positionXDisplay}
step={1}
unit={"m"}
- upperBound={xMax - 110}
- value={positionXDisplay}
+ upperBound={this.xMax - 110}
+ value={this.dataDoc.positionXDisplay}
effect={(value) => {
- setDisplayChange({
+ this.dataDoc.displayChange = ({
xDisplay: value,
- yDisplay: positionYDisplay,
+ yDisplay: this.dataDoc.positionYDisplay,
});
}}
small={true}
@@ -2160,20 +2159,20 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
/>
</td>
)}{" "}
- {(!simulationPaused ||
- simulationType == "Inclined Plane" ||
- simulationType == "Suspension" ||
- simulationType == "Circular Motion" ||
- simulationType == "Pulley") && (
+ {(!this.dataDoc.simulationPaused ||
+ this.dataDoc.simulationType == "Inclined Plane" ||
+ this.dataDoc.simulationType == "Suspension" ||
+ this.dataDoc.simulationType == "Circular Motion" ||
+ this.dataDoc.simulationType == "Pulley") && (
<td style={{ cursor: "default" }}>
- {positionYDisplay} m
+ {this.dataDoc.positionYDisplay} m
</td>
)}{" "}
- {simulationPaused &&
- simulationType != "Inclined Plane" &&
- simulationType != "Suspension" &&
- simulationType != "Circular Motion" &&
- simulationType != "Pulley" && (
+ {this.dataDoc.simulationPaused &&
+ this.dataDoc.simulationType != "Inclined Plane" &&
+ this.dataDoc.simulationType != "Suspension" &&
+ this.dataDoc.simulationType != "Circular Motion" &&
+ this.dataDoc.simulationType != "Pulley" && (
<td
style={{
cursor: "default",
@@ -2181,14 +2180,14 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
>
<InputField
lowerBound={0}
- changeValue={setPositionYDisplay}
+ changeValue={this.dataDoc.positionYDisplay}
step={1}
unit={"m"}
- upperBound={yMax - 110}
- value={positionYDisplay}
+ upperBound={this.yMax - 110}
+ value={this.dataDoc.positionYDisplay}
effect={(value) => {
- setDisplayChange({
- xDisplay: positionXDisplay,
+ this.dataDoc.displayChange = ({
+ xDisplay: this.dataDoc.positionXDisplay,
yDisplay: value,
});
}}
@@ -2201,24 +2200,24 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<tr>
<td
style={{ cursor: "help" }}
- onClick={() => {
- window.open(
- "https://www.khanacademy.org/science/physics/two-dimensional-motion"
- );
- }}
+ // onClick={() => {
+ // window.open(
+ // "https://www.khanacademy.org/science/physics/two-dimensional-motion"
+ // );
+ // }}
>
<Box>Velocity</Box>
</td>
- {(!simulationPaused ||
- (simulationType != "One Weight" &&
- simulationType != "Circular Motion")) && (
+ {(!this.dataDoc.simulationPaused ||
+ (this.dataDoc.simulationType != "One Weight" &&
+ this.dataDoc.simulationType != "Circular Motion")) && (
<td style={{ cursor: "default" }}>
- {velocityXDisplay} m/s
+ {this.dataDoc.velocityXDisplay} m/s
</td>
)}{" "}
- {simulationPaused &&
- (simulationType == "One Weight" ||
- simulationType == "Circular Motion") && (
+ {this.dataDoc.simulationPaused &&
+ (this.dataDoc.simulationType == "One Weight" ||
+ this.dataDoc.simulationType == "Circular Motion") && (
<td
style={{
cursor: "default",
@@ -2226,26 +2225,26 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
>
<InputField
lowerBound={-50}
- changeValue={setVelocityXDisplay}
+ changeValue={this.dataDoc.velocityXDisplay}
step={1}
unit={"m/s"}
upperBound={50}
- value={velocityXDisplay}
+ value={this.dataDoc.velocityXDisplay}
effect={(value) => {
- setStartVelX(value);
- setSimulationReset(!simulationReset);
+ this.dataDoc.startVelX = (value);
+ this.dataDoc.simulationReset = (!this.dataDoc.simulationReset);
}}
small={true}
mode={"Freeform"}
/>
</td>
)}{" "}
- {(!simulationPaused || simulationType != "One Weight") && (
+ {(!this.dataDoc.simulationPaused || this.dataDoc.simulationType != "One Weight") && (
<td style={{ cursor: "default" }}>
- {velocityYDisplay} m/s
+ {this.dataDoc.velocityYDisplay} m/s
</td>
)}{" "}
- {simulationPaused && simulationType == "One Weight" && (
+ {this.dataDoc.simulationPaused && this.dataDoc.simulationType == "One Weight" && (
<td
style={{
cursor: "default",
@@ -2253,16 +2252,16 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
>
<InputField
lowerBound={-50}
- changeValue={setVelocityYDisplay}
+ changeValue={this.dataDoc.velocityYDisplay}
step={1}
unit={"m/s"}
upperBound={50}
- value={velocityYDisplay}
+ value={this.dataDoc.velocityYDisplay}
effect={(value) => {
- setStartVelY(-value);
- setDisplayChange({
- xDisplay: positionXDisplay,
- yDisplay: positionYDisplay,
+ this.dataDoc.startVelY = (-value);
+ this.dataDoc.displayChange = ({
+ xDisplay: this.dataDoc.positionXDisplay,
+ yDisplay: this.dataDoc.positionYDisplay,
});
}}
small={true}
@@ -2274,19 +2273,19 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<tr>
<td
style={{ cursor: "help" }}
- onClick={() => {
- window.open(
- "https://www.khanacademy.org/science/physics/two-dimensional-motion"
- );
- }}
+ // onClick={() => {
+ // window.open(
+ // "https://www.khanacademy.org/science/physics/two-dimensional-motion"
+ // );
+ // }}
>
<Box>Acceleration</Box>
</td>
<td style={{ cursor: "default" }}>
- {accelerationXDisplay} m/s<sup>2</sup>
+ {this.dataDoc.accelerationXDisplay} m/s<sup>2</sup>
</td>
<td style={{ cursor: "default" }}>
- {accelerationYDisplay} m/s<sup>2</sup>
+ {this.dataDoc.accelerationYDisplay} m/s<sup>2</sup>
</td>
</tr>
<tr>
@@ -2294,16 +2293,16 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<Box>Momentum</Box>
</td>
<td>
- {Math.round(velocityXDisplay * mass * 10) / 10} kg*m/s
+ {Math.round(this.dataDoc.velocityXDisplay * this.dataDoc.mass * 10) / 10} kg*m/s
</td>
<td>
- {Math.round(velocityYDisplay * mass * 10) / 10} kg*m/s
+ {Math.round(this.dataDoc.velocityYDisplay * this.dataDoc.mass * 10) / 10} kg*m/s
</td>
</tr>
</tbody>
</table>
)}
- {mode == "Freeform" && simulationType == "Pulley" && (
+ {this.dataDoc.mode == "Freeform" && this.dataDoc.simulationType == "Pulley" && (
<table>
<tbody>
<tr>
@@ -2315,19 +2314,19 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<td>
<Box>Position</Box>
</td>
- <td style={{ cursor: "default" }}>{positionXDisplay2} m</td>
- <td style={{ cursor: "default" }}>{positionYDisplay2} m</td>
+ <td style={{ cursor: "default" }}>{this.dataDoc.positionXDisplay2} m</td>
+ <td style={{ cursor: "default" }}>{this.dataDoc.positionYDisplay2} m</td>
</tr>
<tr>
<td>
<Box>Velocity</Box>
</td>
<td style={{ cursor: "default" }}>
- {velocityXDisplay2} m/s
+ {this.dataDoc.velocityXDisplay2} m/s
</td>
<td style={{ cursor: "default" }}>
- {velocityYDisplay2} m/s
+ {this.dataDoc.velocityYDisplay2} m/s
</td>
</tr>
<tr>
@@ -2335,10 +2334,10 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<Box>Acceleration</Box>
</td>
<td style={{ cursor: "default" }}>
- {accelerationXDisplay2} m/s<sup>2</sup>
+ {this.dataDoc.accelerationXDisplay2} m/s<sup>2</sup>
</td>
<td style={{ cursor: "default" }}>
- {accelerationYDisplay2} m/s<sup>2</sup>
+ {this.dataDoc.accelerationYDisplay2} m/s<sup>2</sup>
</td>
</tr>
<tr>
@@ -2346,17 +2345,17 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<Box>Momentum</Box>
</td>
<td>
- {Math.round(velocityXDisplay2 * mass * 10) / 10} kg*m/s
+ {Math.round(this.dataDoc.velocityXDisplay2 * this.dataDoc.mass * 10) / 10} kg*m/s
</td>
<td>
- {Math.round(velocityYDisplay2 * mass * 10) / 10} kg*m/s
+ {Math.round(this.dataDoc.velocityYDisplay2 * this.dataDoc.mass * 10) / 10} kg*m/s
</td>
</tr>
</tbody>
</table>
)}
</div>
- {simulationType != "Pendulum" && simulationType != "Spring" && (
+ {this.dataDoc.simulationType != "Pendulum" && this.dataDoc.simulationType != "Spring" && (
<div>
<p>Kinematic Equations</p>
<ul>
@@ -2373,7 +2372,7 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
</ul>
</div>
)}
- {simulationType == "Spring" && (
+ {this.dataDoc.simulationType == "Spring" && (
<div>
<p>Harmonic Motion Equations: Spring</p>
<ul>
@@ -2409,7 +2408,7 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
</ul>
</div>
)}
- {simulationType == "Pendulum" && (
+ {this.dataDoc.simulationType == "Pendulum" && (
<div>
<p>Harmonic Motion Equations: Pendulum</p>
<ul>
@@ -2425,8 +2424,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<div
style={{
position: "fixed",
- top: window.innerHeight - 120 + 20 + "px",
- left: xMin + 90 - 80 + "px",
+ top: this.layoutDoc._height - 120 + 20 + "px",
+ left: this.xMin + 90 - 80 + "px",
zIndex: -10000,
}}
>
@@ -2466,8 +2465,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<p
style={{
position: "fixed",
- top: window.innerHeight - 120 + 40 + "px",
- left: xMin + 90 - 80 + "px",
+ top: this.layoutDoc._height - 120 + 40 + "px",
+ left: this.xMin + 90 - 80 + "px",
}}
>
{simulationType == "Circular Motion" ? "Z" : "Y"}
@@ -2475,8 +2474,8 @@ export default class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<Fi
<p
style={{
position: "fixed",
- top: window.innerHeight - 120 + 80 + "px",
- left: xMin + 90 - 40 + "px",
+ top: this.layoutDoc._height - 120 + 80 + "px",
+ left: this.xMin + 90 - 40 + "px",
}}
>
X