Merge pull request #468 from kdvalin/depends-updates

Dependency Updates

Author: kdvalin

.github/workflows/ci.yml

@@ -6,7 +6,7 @@ jobs:
   ci-checks:
     runs-on: ubuntu-latest
     container:
-      image: node:10.13
+      image: node:12.18
 
     steps:
       - uses: actions/checkout@v1
@@ -15,6 +15,10 @@ jobs:
         with:
           path: node_modules
           key: ${{ runner.os }}-${{ hashFiles('**/package-lock.json') }}
+      - name: Reconfigure git to use HTTP authentication
+        run: >
+          git config --global url."https://github.com/".insteadOf
+          ssh://git@github.com/
       - name: Fetch packages
         run: npm install
       - name: Run Linter

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:10.13
+FROM node:12.18
 
 WORKDIR /app
 COPY . /app
@@ -8,4 +8,4 @@ ENV REACT_APP_GOOGLE_CLIENTID ${REACT_APP_GOOGLE_CLIENTID}
 
 RUN npm install
 RUN npm run build
-RUN npm run doc
+RUN npm run doc

package-lock.json

@@ -3,16 +3,16 @@
     "version": "2.4.0",
     "private": false,
     "engines": {
-        "node": "12.18.2"
+        "node": "^12.18.2"
     },
     "devDependencies": {
-        "babel-eslint": "^9.0.0",
+        "@babel/core": "^7.9.0",
         "enzyme": "^3.3.0",
         "enzyme-adapter-react-16": "^1.1.1",
         "esdoc": "^1.1.0",
         "esdoc-standard-plugin": "^1.0.0",
         "eslint-plugin-react": "^7.13.0",
-        "react-scripts": "2.1.1",
+        "react-scripts": "^4.0.0",
         "redux-devtools": "^3.4.1"
     },
     "dependencies": {
@@ -26,16 +26,15 @@
         "bootstrap": "^4.6.0",
         "browserslist": "^4.6.2",
         "cannon": "^0.6.2",
-        "create-react-app": "^3.0.1",
+        "create-react-app": "^4.0.1",
         "esdoc-ecmascript-proposal-plugin": "^1.0.0",
         "esdoc-jsx-plugin": "^1.0.0",
         "esdoc-react-plugin": "^1.0.1",
-        "eslint": "5.6.0",
         "jquery": "^3.3.1",
         "qrcode": "^1.2.0",
-        "qrcode.react": "^0.8.0",
+        "qrcode.react": "^1.0.1",
         "react": "^16.8.4",
-        "react-ace": "^5.9.0",
+        "react-ace": "^6.0.0",
         "react-color": "^2.17.0",
         "react-dom": "^16.2.0",
         "react-google-login": "^5.1.19",
@@ -46,10 +45,10 @@
         "reactour": "^1.9.1",
         "redux": "^3.7.2",
         "redux-thunk": "^2.3.0",
-        "socket.io-client": "^2.3.0",
-        "source-map-explorer": "^1.6.0",
-        "styled-components": "^4.0.3",
-        "three": "^0.98.0",
+        "socket.io-client": "^4.0.0",
+        "source-map-explorer": "^2.0.0",
+        "styled-components": "^5.0.0",
+        "three": "^0.126.1",
         "ua-parser-js": "^0.7.24"
     },
     "scripts": {
@@ -64,10 +63,17 @@
         "doc": "./node_modules/.bin/esdoc"
     },
     "proxy": "http://localhost:1337/",
-    "browserslist": [
-        ">0.2%",
-        "not dead",
-        "not ie <= 11",
-        "not op_mini all"
-    ]
+    "browserslist": {
+        "production": [
+            ">0.2%",
+            "not dead",
+            "not ie <= 11",
+            "not op_mini all"
+        ],
+        "development": [
+            "last 5 chrome version",
+            "last 5 firefox version",
+            "last 5 safari version"
+        ]
+    }
 }

package.json

@@ -342,8 +342,8 @@ class View extends Component {
                     {this.props.assets ? this.props.assets.map((x) => this.assetsHelper(x)) : null}
                 </a-assets>
                 <a-sky color={this.props.sceneConfig.settings.skyColor} />
-                <this.coordinateHelper />
-                <this.makeFloor />
+                {this.coordinateHelper()}
+                {this.makeFloor()}
                 {this.props.sceneConfig.settings.defaultLight ? 
                             <a-entity id="DefaultLight">                   
                                 <a-entity id="AmbientLight" light="type: ambient; color: #BBB"></a-entity>
@@ -356,7 +356,7 @@ class View extends Component {
                         return this.helper(this.props.objects[it]);
                     })
                 }
-                <this.createCam />
+                {this.createCam()}
                 {this.props.sceneConfig.settings.camConfig === 1 ?
                     <a-entity position="0 0 0">
                         <a-cylinder checkpoint radius="1" height="0.3" position="-25 1 -25" color="#39BB82"></a-cylinder>

src/components/structural/View.js

@@ -482,7 +482,7 @@ class Header extends Component {
                     onClick={this.handleSaveToggle}>
                     <Icon className="material-icons">close</Icon>
                 </IconButton>
-                <this.sceneName />
+                {this.sceneName()}
                 <Button
                     variant="contained"
                     size="small"

src/components/structural/header/Header.js

@@ -75,7 +75,7 @@ class Myr {
         // For each function bind it to the window
         funs.forEach(element => {
             // If a collision is detected then do not override and warn
-            if (window.hasOwnProperty(element)) {
+            if (Object.prototype.hasOwnProperty.call(window, element)) {
                 console.warn(`The ${element} of Myr is being overridden.\n` +
                     "If this was not intentional consider renaming the function.");
             } else {

src/myr/Myr.js

@@ -27,12 +27,9 @@ AFRAME.registerComponent("spotlightindicator",{
             circle.translate(0,0,0.5);
         }
 
-        let geometry = new THREE.Geometry(); 
-        geometry.merge(circle);
-        geometry.merge(cone);
+        let geometry = THREE.BufferGeometryUtils.mergeBufferGeometries([cone, circle]);
 
         /*      define outline geometry */
-    
         let outCone = new THREE.CylinderGeometry(.2,1,1.5,24,1,true);
         let outCircle = new THREE.CircleGeometry(.2,24);
 
@@ -45,9 +42,7 @@ AFRAME.registerComponent("spotlightindicator",{
             outCircle.translate(0,0,.75);
         }
 
-        let outGeometry = new THREE.Geometry();
-        outGeometry.merge(outCircle);
-        outGeometry.merge(outCone);
+        let outGeometry = THREE.BufferGeometryUtils.mergeBufferGeometries([outCone, outCircle]);
 
         /*      define material     */
         const material = new THREE.MeshBasicMaterial({color: data.color, side: THREE.DoubleSide});
@@ -113,20 +108,16 @@ AFRAME.registerComponent("directionallightindicator", {
         arrowHead.translate(0,1.8,0);
         arrowHead.rotateX(Math.PI);
 
-        let geometry = new THREE.Geometry();
-        geometry.merge(arrowHead);
-        geometry.merge(arrowPole);
+        let geometry = THREE.BufferGeometryUtils.mergeBufferGeometries([arrowHead, arrowPole]);
 
         /*      define outside geometry     */  
         let outArrowHead = new THREE.ConeGeometry(.7,1.3);
         let outArrowPole = new THREE.CylinderGeometry(.2,.2, 2.8, 20, 4 );
 
-        let outGeometry = new THREE.Geometry();
         outArrowHead.translate(0,1.8,0);
         outArrowHead.rotateX(Math.PI);
 
-        outGeometry.merge(outArrowHead);
-        outGeometry.merge(outArrowPole);
+        let outGeometry = THREE.BufferGeometryUtils.mergeBufferGeometries([outArrowHead, outArrowPole]);
 
         /*      define material     */
         let material = new THREE.MeshBasicMaterial({color:data.color});
@@ -158,57 +149,38 @@ AFRAME.registerComponent("hemispherelightindicator",{
     },
     init: function(){
         const data = this.data;
-        
-        /*      define geometry      */
-        let geometry = new THREE.Geometry();
-        
+        let geometry = [];
         //define parts of geometry
         let head = new THREE.ConeGeometry(.5);
         let pole = new THREE.CylinderGeometry(.1,.1 ,1 ,20);
         head.translate(0,1.5,0);
         pole.translate(0,0.5,0);
-        
-        //merge geometries
-        let arrowGeo = new THREE.Geometry();
-        arrowGeo.merge(head);
-        arrowGeo.merge(pole);
-
-        //get down matrix
-        let temp = new THREE.Mesh(arrowGeo);
-        temp.rotateX(Math.PI);
-        temp.updateMatrix();
-        
-        geometry.merge(arrowGeo,new THREE.Matrix4(), 0);
-        geometry.merge(arrowGeo, temp.matrix, 1);
 
-        /*      define outline geometry      */
-        let outGeometry = new THREE.Geometry();
+        //merge geometries
+        geometry.push(THREE.BufferGeometryUtils.mergeBufferGeometries([head, pole]));
 
         const outHead = new THREE.ConeGeometry(.7,1.3,20,12);
         const outPole = new THREE.CylinderGeometry(0.2, 0.2, 1.2, 20);
         outHead.translate(0, 1.5, 0);
         outPole.translate(0, 0.6, 0);
 
-        let outArrowGeo = new THREE.Geometry();
-        outArrowGeo.merge(outHead);
-        outArrowGeo.merge(outPole);
-
-        outGeometry.merge(outArrowGeo, new THREE.Matrix4(), 0);
-        outGeometry.merge(outArrowGeo, temp.matrix, 1);
-
-        /*      define material     */
-        const material = new THREE.MeshBasicMaterial({color: data.color});
-        const secondMaterial = new THREE.MeshBasicMaterial({color:data.secondColor});
-        const outMaterial = CreateOutlineMaterial(material);
-        const outSecondMaterial = CreateOutlineMaterial(secondMaterial);
-
+        /*      define outline geometry      */
+        geometry.push(THREE.BufferGeometryUtils.mergeBufferGeometries([outHead, outPole]));
+        
         /*  define and group all the meshes together      */
-        let mesh = new AFRAME.THREE.Mesh(geometry, [material, secondMaterial]);
-        let outlineMesh = new AFRAME.THREE.Mesh(outGeometry,[outMaterial, outSecondMaterial]);
-
-        let group = new AFRAME.THREE.Group();
-        group.add(mesh);
-        group.add(outlineMesh);
+        let group = new THREE.Group();
+        geometry.forEach((shape, i) => {
+            let mat = new THREE.MeshBasicMaterial({color: data.color});
+            let secondMat = new THREE.MeshBasicMaterial({color: data.secondColor});
+            
+            if(i === 1){
+                mat = CreateOutlineMaterial(mat);
+                secondMat = CreateOutlineMaterial(secondMat);
+            }
+
+            group.add(new THREE.Mesh(shape, mat));
+            group.add(new THREE.Mesh(shape.clone().rotateX(Math.PI), secondMat));
+        });
 
         let el = this.el;
         el.setObject3D("group", group);