4 files changed, 22 insertions, 28 deletions
diff --git a/src/client/views/nodes/PhysicsSimulationApp.tsx b/src/client/views/nodes/PhysicsSimulationApp.tsx
index 0536d0679..1dfa04a31 100644
--- a/src/client/views/nodes/PhysicsSimulationApp.tsx
+++ b/src/client/views/nodes/PhysicsSimulationApp.tsx
@@ -3,8 +3,6 @@ import "./PhysicsSimulationBox.scss";
 import Weight, { IForce }  from "./PhysicsSimulationWeight";
 import Wall, { IWallProps }  from "./PhysicsSimulationWall"
 import Wedge from "./PhysicsSimulationWedge"
-import { props, any } from 'bluebird';
-import { render } from 'react-dom';
 
 interface PhysicsVectorTemplate {
   top: number;
@@ -70,8 +68,8 @@ export default class App extends React.Component<{}, IState> {
   };
   xMin = 0;
   yMin = 0;
-  xMax = window.innerWidth * 0.7;
-  yMax = window.innerHeight * 0.8;
+  xMax = 300;
+  yMax = 300;
   color = `rgba(0,0,0,0.5)`;
   radius = 50
 
@@ -461,7 +459,7 @@ export default class App extends React.Component<{}, IState> {
                     </div>
                   );
                 })} */}
-              {/* {this.state.weight && (
+              {this.state.weight && (
                 <Weight
                   adjustPendulumAngle={this.state.adjustPendulumAngle}
                   color={"red"}
@@ -506,7 +504,7 @@ export default class App extends React.Component<{}, IState> {
                   wedgeWidth={this.state.wedgeWidth}
                   coefficientOfKineticFriction={this.state.coefficientOfKineticFriction}
                 />
-              )} */}
+              )}
               {this.state.wedge && (
                 <Wedge
                   startWidth={this.state.wedgeWidth}
diff --git a/src/client/views/nodes/PhysicsSimulationWall.tsx b/src/client/views/nodes/PhysicsSimulationWall.tsx
index 2608e4772..e1f753179 100644
--- a/src/client/views/nodes/PhysicsSimulationWall.tsx
+++ b/src/client/views/nodes/PhysicsSimulationWall.tsx
@@ -1,5 +1,4 @@
-import React from "react";
-import { useState, useEffect } from "react";
+import React = require('react');
 
 export interface Force {
   magnitude: number;
diff --git a/src/client/views/nodes/PhysicsSimulationWedge.tsx b/src/client/views/nodes/PhysicsSimulationWedge.tsx
index bf0cadce2..b3988221c 100644
--- a/src/client/views/nodes/PhysicsSimulationWedge.tsx
+++ b/src/client/views/nodes/PhysicsSimulationWedge.tsx
@@ -1,5 +1,4 @@
-import React from "react";
-import { useState, useEffect, useCallback } from "react";
+import React = require('react');
 import "./PhysicsSimulationBox.scss";
 
 export interface IWedgeProps {
@@ -29,16 +28,16 @@ export default class Wedge extends React.Component<IWedgeProps, IState> {
 
   updateCoordinates() {
     const coordinatePair1 =
-      Math.round(this.state.left) + "," + Math.round(window.innerHeight * 0.8) + " ";
+      Math.round(this.state.left) + "," + Math.round(300 * 0.8) + " ";
     const coordinatePair2 =
       Math.round(this.state.left + this.props.startWidth) +
       "," +
-      Math.round(window.innerHeight * 0.8) +
+      Math.round(300 * 0.8) +
       " ";
     const coordinatePair3 =
       Math.round(this.state.left) +
       "," +
-      Math.round(window.innerHeight * 0.8 - this.props.startHeight);
+      Math.round(300 * 0.8 - this.props.startHeight);
     const coord = coordinatePair1 + coordinatePair2 + coordinatePair3;
     this.setState({coordinates: coord}); 
   }
@@ -59,8 +58,8 @@ export default class Wedge extends React.Component<IWedgeProps, IState> {
       <div>
         <div style={{ position: "absolute", left: "0", top: "0", zIndex: -5 }}>
           <svg
-            width={window.innerWidth * 0.7 + "px"}
-            height={window.innerHeight * 0.8 + "px"}
+            width={300 * 0.7 + "px"}
+            height={300 * 0.8 + "px"}
           >
             <polygon points={this.state.coordinates} style={{ fill: "burlywood" }} />
           </svg>
@@ -71,7 +70,7 @@ export default class Wedge extends React.Component<IWedgeProps, IState> {
             position: "absolute",
             zIndex: 500,
             left: Math.round(this.state.left + this.props.startWidth - 80) + "px",
-            top: Math.round(window.innerHeight * 0.8 - 40) + "px",
+            top: Math.round(300 * 0.8 - 40) + "px",
           }}
         >
           {Math.round(((this.state.angleInRadians * 180) / Math.PI) * 100) / 100}°
diff --git a/src/client/views/nodes/PhysicsSimulationWeight.tsx b/src/client/views/nodes/PhysicsSimulationWeight.tsx
index 669aab67a..9ce740ae9 100644
--- a/src/client/views/nodes/PhysicsSimulationWeight.tsx
+++ b/src/client/views/nodes/PhysicsSimulationWeight.tsx
@@ -1,6 +1,4 @@
-import React from "react";
-import { useEffect, useState } from "react";
-import { render } from "react-dom";
+import React = require('react');
 import { IWallProps } from "./PhysicsSimulationWall";
 import Wedge from "./PhysicsSimulationWedge";
 
@@ -94,9 +92,9 @@ export default class Weight extends React.Component<IWeightProps, IState> {
     magnitude: this.props.mass * 9.81,
     directionInDegrees: 270,
   };
-  xMax = window.innerWidth * 0.7;
+  xMax = 300;
   xMin = 0;
-  yMax = window.innerHeight * 0.8;
+  yMax = 300;
   yMin = 0;
 
   // Helper function to go between display and real values
@@ -352,11 +350,11 @@ export default class Weight extends React.Component<IWeightProps, IState> {
     let collision = false;
     const minX = this.state.xPosition;
     const maxX = this.state.xPosition + 2 * this.props.radius;
-    const containerWidth = window.innerWidth;
+    const containerWidth = 300;
     if (this.state.xVelocity != 0) {
       this.props.walls.forEach((wall) => {
         if (wall.angleInDegrees == 90) {
-          const wallX = (wall.xPos / 100) * window.innerWidth;
+          const wallX = (wall.xPos / 100) * 300;
           if (wall.xPos < 0.35) {
             if (minX <= wallX) {
               if (this.props.elasticCollisions) {
@@ -390,7 +388,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
     if (this.state.yVelocity > 0) {
       this.props.walls.forEach((wall) => {
         if (wall.angleInDegrees == 0) {
-          const groundY = (wall.yPos / 100) * window.innerHeight;
+          const groundY = (wall.yPos / 100) * 300;
           if (maxY >= groundY) {
             if (this.props.elasticCollisions) {
               this.setState({yVelocity: -this.state.yVelocity})
@@ -602,7 +600,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
             zIndex: -2,
           }}
         >
-          <svg width={this.xMax + "px"} height={window.innerHeight + "px"}>
+          <svg width={this.xMax + "px"} height={300 + "px"}>
             <line
               x1={this.state.xPosition + this.props.radius}
               y1={this.state.yPosition + this.props.radius}
@@ -651,7 +649,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
               top: 0,
             }}
           >
-            <svg width={this.xMax + "px"} height={window.innerHeight + "px"}>
+            <svg width={this.xMax + "px"} height={300 + "px"}>
               <defs>
                 <marker
                   id="accArrow"
@@ -720,7 +718,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
               top: 0,
             }}
           >
-            <svg width={this.xMax + "px"} height={window.innerHeight + "px"}>
+            <svg width={this.xMax + "px"} height={300 + "px"}>
               <defs>
                 <marker
                   id="velArrow"
@@ -815,7 +813,7 @@ export default class Weight extends React.Component<IWeightProps, IState> {
               >
                 <svg
                   width={this.xMax - this.xMin + "px"}
-                  height={window.innerHeight + "px"}
+                  height={300 + "px"}
                 >
                   <defs>
                     <marker