debugging

1 files changed, 25 insertions, 8 deletions

diff --git a/src/client/views/nodes/PhysicsBox/PhysicsSimulationWeight.tsx b/src/client/views/nodes/PhysicsBox/PhysicsSimulationWeight.tsx
index a5bd5a04e..38af55635 100644
--- a/src/client/views/nodes/PhysicsBox/PhysicsSimulationWeight.tsx
+++ b/src/client/views/nodes/PhysicsBox/PhysicsSimulationWeight.tsx
@@ -409,18 +409,19 @@ export default class Weight extends React.Component<IWeightProps, IState> {
     // Update x position when start pos x changes
     if (prevProps.startPosX != this.props.startPosX) {
       if (this.props.paused) {
+        console.log('update start x to ', this.props.startPosX)
         this.setState({xPosition: this.props.startPosX})
         this.setState({updatedStartPosX: this.props.startPosX})
-        this.props.dataDoc['positionXDisplay'] = this.props.startPosX
+        this.setXPosDisplay(this.props.startPosX)
       }
     }
 
-    // Update y position when start pos y changes TODO debug
+    // // Update y position when start pos y changes TODO debug
     // if (prevProps.startPosY != this.props.startPosY) {
     //    if (this.props.paused) {
     //     this.setState({yPosition: this.props.startPosY})
     //     this.setState({updatedStartPosY: this.props.startPosY})
-    //     this.props.dataDoc['positionYDisplay'] = this.getDisplayYPos(this.props.startPosY)
+    //     this.setYPosDisplay(this.props.startPosY)
     //   }
     // }
 
@@ -433,6 +434,25 @@ export default class Weight extends React.Component<IWeightProps, IState> {
       const coord = coordinatePair1 + coordinatePair2 + coordinatePair3;
       this.setState({coordinates: coord})
     } 
+
+    if (this.state.xPosition != prevState.xPosition || this.state.yPosition != prevState.yPosition) {
+      this.weightStyle = {
+        alignItems: "center",
+        backgroundColor: this.props.color,
+        borderColor: "black",
+        borderRadius: 50 + "%",
+        borderStyle: "solid",
+        display: "flex",
+        height: 2 * this.props.radius + "px",
+        justifyContent: "center",
+        left: this.state.xPosition + "px",
+        position: "absolute" as "absolute",
+        top: this.state.yPosition + "px",
+        touchAction: "none",
+        width: 2 * this.props.radius + "px",
+        zIndex: 5,
+      };
+    }
   }
 
   // Reset simulation on reset button click
@@ -890,7 +910,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
   // Render weight, spring, rod(s), vectors
   render () { 
     return (
-    <div style={{ zIndex: -1000 }}>
+    <div>
       <div
         className="weightContainer"
         onPointerDown={(e) => {
@@ -1018,7 +1038,6 @@ export default class Weight extends React.Component<IWeightProps, IState> {
             position: "absolute",
             left: 0,
             top: 0,
-            zIndex: -2,
           }}
         >
           <svg width={this.props.xMax + "px"} height={this.props.layoutDoc._height + "px"}>
@@ -1060,7 +1079,6 @@ export default class Weight extends React.Component<IWeightProps, IState> {
             position: "absolute",
             left: 0,
             top: 0,
-            zIndex: -1,
           }}
         >
           <svg width={this.props.xMax + "px"} height={this.props.layoutDoc._height + "px"}>
@@ -1264,7 +1282,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
       {this.props.dataDoc['simulationType'] == "Inclined Plane" && (
         <div>
           <div
-            style={{ position: "absolute", left: "0", top: "0", zIndex: -5 }}
+            style={{ position: "absolute", left: "0", top: "0" }}
           >
             <svg width={this.props.xMax + "px"} height={this.props.yMax + "px"}>
               <polygon points={this.state.coordinates} style={{ fill: "burlywood" }} />
@@ -1274,7 +1292,6 @@ export default class Weight extends React.Component<IWeightProps, IState> {
           <p
             style={{
               position: "absolute",
-              zIndex: 500,
               left: Math.round(this.props.xMax * 0.5 - 200 + this.props.wedgeWidth - 80) + "px",
               top: Math.round(this.props.yMax - 40) + "px",
             }}