From a26e7d24e505ee6562139fbed04f672be902c471 Mon Sep 17 00:00:00 2001
From: Keith Valin <keith@mailtux.net>
Date: Tue, 8 Sep 2020 18:20:41 -0400
Subject: [PATCH 01/12] Added object transparency function for the cursor

---
 src/myr/Myr.js       | 43 +++++++++++++++++++++++++++----------------
 src/myr/reference.js |  6 ++++++
 2 files changed, 33 insertions(+), 16 deletions(-)

diff --git a/src/myr/Myr.js b/src/myr/Myr.js
index 86a8cb6a..fdbd57ca 100644
--- a/src/myr/Myr.js
+++ b/src/myr/Myr.js
@@ -13,6 +13,7 @@ class Myr {
         this.sceneEl = document.querySelector("a-scene");
         this.cursor = {
             color: "red",
+            opacity: 1,
             position: {
                 x: 0,
                 y: 0,
@@ -80,6 +81,7 @@ class Myr {
         this.id = 0;
         this.cursor = {
             color: "red",
+            opacity: 1,
             position: {
                 x: 0,
                 y: 0,
@@ -123,6 +125,7 @@ class Myr {
     resetCursor = () => {
         this.cursor = {
             color: "red",
+            opacity: 1,
             position: {
                 x: 0,
                 y: 0,
@@ -154,6 +157,14 @@ class Myr {
         return this.counter++;
     };
 
+    setTransparency = (opacity = 0) => {
+        if(typeof opacity === "number" && opacity <= 100 && opacity >= 0) {
+            this.cursor.opacity = (100 - opacity) / 100;
+        }
+
+        return this.cursor.opacity;
+    }
+
     setPosition = (x = 0, y = 1, z = 0) => {
         if (typeof x === "number" && typeof y === "number" && typeof z === "number") {
             this.cursor.position = {
@@ -514,7 +525,7 @@ class Myr {
         let base = {
             geometry: "primitive: box;",
             id: "box" + this.genNewId(),
-            material: `color: ${this.cursor.color}; side: double`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
             position: { ...this.cursor.position },
             rotation: this.cursor.rotation,
             scale: this.cursor.scale,
@@ -530,7 +541,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double;`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -539,7 +550,7 @@ class Myr {
     cone = (params) => {
         let base = {
             id: "cone" + this.genNewId(),
-            geometry: `primitive: cone; radiusBottom: ${this.cursor.radius}; radiusTop: 0.1;`,
+            geometry: `primitive: cone; radiusBottom: ${this.cursor.radius}; radiusTop: 0.1; opacity: ${this.cursor.opacity};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -552,7 +563,7 @@ class Myr {
     cylinder = (params) => {
         let base = {
             id: "cyl" + this.genNewId(),
-            geometry: `primitive: cylinder; radius: ${this.cursor.radius}; theta-length: ${this.cursor.phiLength};`,
+            geometry: `primitive: cylinder; radius: ${this.cursor.radius}; theta-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -570,7 +581,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double;`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -583,7 +594,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double;`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -596,7 +607,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double;`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -618,7 +629,7 @@ class Myr {
     plane = (params) => {
         let base = {
             id: "plane" + this.genNewId(),
-            geometry: `primitive: plane; height: 1; width: 1; phi-length: ${this.cursor.phiLength};`,
+            geometry: `primitive: plane; height: 1; width: 1; phi-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -631,7 +642,7 @@ class Myr {
     polyhedron = (params) => {
         let base = {
             id: "poly" + this.genNewId(),
-            geometry: `primitive: sphere; segmentsWidth: 2; segmentsHeight: 8; phi-length: ${this.cursor.phiLength};`,
+            geometry: `primitive: sphere; segmentsWidth: 2; segmentsHeight: 8; phi-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -643,7 +654,7 @@ class Myr {
     ring = (params) => {
         let base = {
             id: "ring" + this.genNewId(),
-            geometry: `primitive: ring; radiusInner: 0.5; radiusOuter: 1; theta-length: ${this.cursor.phiLength};`,
+            geometry: `primitive: ring; radiusInner: 0.5; radiusOuter: 1; theta-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -660,7 +671,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double;`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -672,7 +683,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double;`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -711,7 +722,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double;`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -723,7 +734,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
             p: 2,
             q: 3,
         };
@@ -737,7 +748,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double;`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
@@ -751,7 +762,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double;`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
         };
         return this.mergeProps(base, params);
     }
diff --git a/src/myr/reference.js b/src/myr/reference.js
index 854bca81..dd4dfc95 100644
--- a/src/myr/reference.js
+++ b/src/myr/reference.js
@@ -283,6 +283,12 @@ let transformations = [
         description: <span>The setZPos function changes the z component of the position in the cursor. The default z position is 0.</span>,
         example: "setZPos"
     },
+    {
+        name: "setTransparency",
+        parameters: [{type: "number", name: "transparentcy"}],
+        description: <span>The setTransparency function changes the opacity of the element. The range of transparency is from 0% (solid) to 100% (invisible). The default is 0%.</span>,
+        example: "setTransparency"
+    },
     {
         name: "increasePosition",
         parameters: [{ type: "number", name: "x" }, { type: "number", name: "y" }, { type: "number", name: "z" }],

From 805ef903b9db0101cc89ab460d500d869098d3cd Mon Sep 17 00:00:00 2001
From: Keith Valin <keith@mailtux.net>
Date: Tue, 8 Sep 2020 18:26:47 -0400
Subject: [PATCH 02/12] Updated tests and added in checks for setTransparency

---
 src/tests/Myr.test.js | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/tests/Myr.test.js b/src/tests/Myr.test.js
index 5477f200..7bf43cd7 100644
--- a/src/tests/Myr.test.js
+++ b/src/tests/Myr.test.js
@@ -6,6 +6,7 @@ let colorRegEx = new RegExp("#([0-9]|[A-F]|[a-f]){6}");
 
 const defaultCursor = {
     color: "red",
+    opacity: 1,
     position: {
         x: 0,
         y: 0,
@@ -880,4 +881,18 @@ describe("Other Myr functionality", () => {
         expect(myr.cursor.color).toEqual("red");
     });
 
+
+    it("setTransparency should set the appropriate cursor attribute correctly", () => {
+        myr.setTransparency(0);
+        expect(myr.cursor.opacity).toEqual(1);
+
+        myr.setTransparency(100);
+        expect(myr.cursor.opacity).toEqual(0);
+
+        myr.setTransparency(50);
+        expect(myr.cursor.opacity).toEqual(0.5);
+
+        myr.setTransparency(40);
+        expect(myr.cursor.opacity).toEqual(0.6);
+    });
 });

From 1ba507490c167081c04085c4d29aa7d0abf38485 Mon Sep 17 00:00:00 2001
From: Keith Valin <keith@mailtux.net>
Date: Wed, 9 Sep 2020 13:21:27 -0400
Subject: [PATCH 03/12] Code Review feedback

---
 src/myr/Myr.js        | 49 ++++++++++++++++++++++++-------------------
 src/tests/Myr.test.js | 36 ++++++++++++++++++++++++++-----
 2 files changed, 58 insertions(+), 27 deletions(-)

diff --git a/src/myr/Myr.js b/src/myr/Myr.js
index fdbd57ca..d3d8c9d7 100644
--- a/src/myr/Myr.js
+++ b/src/myr/Myr.js
@@ -13,7 +13,7 @@ class Myr {
         this.sceneEl = document.querySelector("a-scene");
         this.cursor = {
             color: "red",
-            opacity: 1,
+            transparency: 0,
             position: {
                 x: 0,
                 y: 0,
@@ -81,7 +81,7 @@ class Myr {
         this.id = 0;
         this.cursor = {
             color: "red",
-            opacity: 1,
+            transparency: 0,
             position: {
                 x: 0,
                 y: 0,
@@ -125,7 +125,7 @@ class Myr {
     resetCursor = () => {
         this.cursor = {
             color: "red",
-            opacity: 1,
+            transparency: 0,
             position: {
                 x: 0,
                 y: 0,
@@ -157,9 +157,11 @@ class Myr {
         return this.counter++;
     };
 
-    setTransparency = (opacity = 0) => {
-        if(typeof opacity === "number" && opacity <= 100 && opacity >= 0) {
-            this.cursor.opacity = (100 - opacity) / 100;
+    setTransparency = (transparency = 0) => {
+        if(typeof transparency === "number" && transparency <= 100 && transparency >= 0) {
+            this.cursor.transparency = transparency / 100;
+        } else {
+            console.error("setTransparency() either recieved a non numeric value or a value out of range (0-100)");
         }
 
         return this.cursor.opacity;
@@ -345,6 +347,9 @@ class Myr {
             case "magnitude":
                 this.setMagnitude(value);
                 break;
+            case "transparency":
+                this.setTransparency(value);
+                break;
             default:
                 this.cursor[key] = value;
         }
@@ -525,7 +530,7 @@ class Myr {
         let base = {
             geometry: "primitive: box;",
             id: "box" + this.genNewId(),
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
             position: { ...this.cursor.position },
             rotation: this.cursor.rotation,
             scale: this.cursor.scale,
@@ -541,7 +546,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -550,7 +555,7 @@ class Myr {
     cone = (params) => {
         let base = {
             id: "cone" + this.genNewId(),
-            geometry: `primitive: cone; radiusBottom: ${this.cursor.radius}; radiusTop: 0.1; opacity: ${this.cursor.opacity};`,
+            geometry: `primitive: cone; radiusBottom: ${this.cursor.radius}; radiusTop: 0.1; opacity: ${1 - this.cursor.transparency};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -563,7 +568,7 @@ class Myr {
     cylinder = (params) => {
         let base = {
             id: "cyl" + this.genNewId(),
-            geometry: `primitive: cylinder; radius: ${this.cursor.radius}; theta-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
+            geometry: `primitive: cylinder; radius: ${this.cursor.radius}; theta-length: ${this.cursor.phiLength}; opacity: ${1 - this.cursor.transparency};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -581,7 +586,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -594,7 +599,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -607,7 +612,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -629,7 +634,7 @@ class Myr {
     plane = (params) => {
         let base = {
             id: "plane" + this.genNewId(),
-            geometry: `primitive: plane; height: 1; width: 1; phi-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
+            geometry: `primitive: plane; height: 1; width: 1; phi-length: ${this.cursor.phiLength}; opacity: ${1 - this.cursor.transparency};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -642,7 +647,7 @@ class Myr {
     polyhedron = (params) => {
         let base = {
             id: "poly" + this.genNewId(),
-            geometry: `primitive: sphere; segmentsWidth: 2; segmentsHeight: 8; phi-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
+            geometry: `primitive: sphere; segmentsWidth: 2; segmentsHeight: 8; phi-length: ${this.cursor.phiLength}; opacity: ${1 - this.cursor.transparency};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -654,7 +659,7 @@ class Myr {
     ring = (params) => {
         let base = {
             id: "ring" + this.genNewId(),
-            geometry: `primitive: ring; radiusInner: 0.5; radiusOuter: 1; theta-length: ${this.cursor.phiLength}; opacity: ${this.cursor.opacity};`,
+            geometry: `primitive: ring; radiusInner: 0.5; radiusOuter: 1; theta-length: ${this.cursor.phiLength}; opacity: ${1 - this.cursor.transparency};`,
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
@@ -671,7 +676,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -683,7 +688,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -722,7 +727,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -734,7 +739,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color}; side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color}; side: double; opacity: ${1 - this.cursor.transparency};`,
             p: 2,
             q: 3,
         };
@@ -748,7 +753,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
@@ -762,7 +767,7 @@ class Myr {
             position: this.cursor.position,
             scale: this.cursor.scale,
             rotation: this.cursor.rotation,
-            material: `color: ${this.cursor.color};  side: double; opacity: ${this.cursor.opacity};`,
+            material: `color: ${this.cursor.color};  side: double; opacity: ${1 - this.cursor.transparency};`,
         };
         return this.mergeProps(base, params);
     }
diff --git a/src/tests/Myr.test.js b/src/tests/Myr.test.js
index 7bf43cd7..80af38ab 100644
--- a/src/tests/Myr.test.js
+++ b/src/tests/Myr.test.js
@@ -6,7 +6,7 @@ let colorRegEx = new RegExp("#([0-9]|[A-F]|[a-f]){6}");
 
 const defaultCursor = {
     color: "red",
-    opacity: 1,
+    transparency: 0,
     position: {
         x: 0,
         y: 0,
@@ -884,15 +884,41 @@ describe("Other Myr functionality", () => {
 
     it("setTransparency should set the appropriate cursor attribute correctly", () => {
         myr.setTransparency(0);
-        expect(myr.cursor.opacity).toEqual(1);
+        expect(myr.cursor.transparency).toEqual(0);
 
         myr.setTransparency(100);
-        expect(myr.cursor.opacity).toEqual(0);
+        expect(myr.cursor.transparency).toEqual(1);
 
         myr.setTransparency(50);
-        expect(myr.cursor.opacity).toEqual(0.5);
+        expect(myr.cursor.transparency).toEqual(0.5);
 
         myr.setTransparency(40);
-        expect(myr.cursor.opacity).toEqual(0.6);
+        expect(myr.cursor.transparency).toEqual(0.4);
+    });
+
+    it("setTransparency should not change opacity if it received an invalid argument", () => {
+        myr.reset();
+
+        myr.setTransparency(-100);
+        expect(myr.cursor.transparency).toEqual(0);
+        myr.setTransparency(-50);
+        expect(myr.cursor.transparency).toEqual(0);
+        myr.setTransparency(-1);
+        expect(myr.cursor.transparency).toEqual(0);
+
+        myr.setTransparency("50");
+        expect(myr.cursor.transparency).toEqual(0);
+        myr.setTransparency("1");
+        expect(myr.cursor.transparency).toEqual(0);
+
+        myr.setTransparency([1, 2, 3]);
+        expect(myr.cursor.transparency).toEqual(0);
+
+        myr.setTransparency({
+            test: true,
+            valid: "false",
+            value: 1
+        });
+        expect(myr.cursor.transparency).toEqual(0);
     });
 });

From 4bfb674b1a1bbeb1e8aa97f7f04b2ca226f43e88 Mon Sep 17 00:00:00 2001
From: jlu18 <justin_lu@student.uml.edu>
Date: Mon, 14 Sep 2020 12:50:53 -0400
Subject: [PATCH 04/12] Added new title for the MYR pages.

---
 public/index.html                         | 2 +-
 src/actions/collectionActions.js          | 1 +
 src/actions/courseActions.js              | 5 +++--
 src/actions/editorActions.js              | 2 ++
 src/components/reference/ReferencePage.js | 1 +
 5 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/public/index.html b/public/index.html
index 0f4848ec..2f9c09e8 100644
--- a/public/index.html
+++ b/public/index.html
@@ -23,7 +23,7 @@
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <link rel="stylesheet" href="https://highlightjs.org/static/demo/styles/github.css" />
 
-  <title>Myr.js</title>
+  <title>MYR</title>
 </head>
 
 <body>
diff --git a/src/actions/collectionActions.js b/src/actions/collectionActions.js
index c2dcf2ce..1b91b3b4 100644
--- a/src/actions/collectionActions.js
+++ b/src/actions/collectionActions.js
@@ -33,6 +33,7 @@ export function asyncCollection(collectionID, uid) {
                 .then((resp) => {
                     switch(resp.status){
                         case 200:
+                            document.title = collectionID + " Collection | MYR";
                             resp.json().then((data) => {
                                 data.forEach((doc) => {
                                     collectionProjects.push(doc);
diff --git a/src/actions/courseActions.js b/src/actions/courseActions.js
index a238246f..4e301d04 100644
--- a/src/actions/courseActions.js
+++ b/src/actions/courseActions.js
@@ -50,11 +50,12 @@ export function fetchCourse(courseId) {
             .then(response => {
                 response.json()
                     .then(json => {
+                        document.title = json.name + " Course | MYR";
                         dispatch(loadCourse(json));
 
                         //Make sure that the course is not empty
                         if(json.lessons.length <= 0){
-                            noLessons.name = json.name;
+                            noLessons.name = json.name; 
                             dispatch(loadLesson(noLessons));
                             return;
                         }
@@ -66,7 +67,7 @@ export function fetchCourse(courseId) {
                             {
                                 name: json.lessons[0].name,
                                 desc: "This scene was saved from the course: " + json.name
-                            }));
+                            }));   
                     })
                     .catch(err => {
                         console.error(err);
diff --git a/src/actions/editorActions.js b/src/actions/editorActions.js
index 564ee8f5..68e5599a 100644
--- a/src/actions/editorActions.js
+++ b/src/actions/editorActions.js
@@ -60,6 +60,8 @@ export function fetchScene(id, uid = "anon") {
 
             response.json().then((json) =>{
                 if(json.code){
+                    //don't change the title when fetching scene in collection
+                    if(!document.title.includes("Collection")) document.title = json.name + " | MYR";
                     dispatch(render(json.code, uid || "anon"));
                     dispatch(updateSavedText(json.code));
                     let settings = DEF_SETTINGS;
diff --git a/src/components/reference/ReferencePage.js b/src/components/reference/ReferencePage.js
index 1e93b38d..3cb497bb 100644
--- a/src/components/reference/ReferencePage.js
+++ b/src/components/reference/ReferencePage.js
@@ -95,6 +95,7 @@ export default class Reference extends React.Component {
     };
 
     render() {
+        document.title = "Reference | MYR";
         return (
             <div id="reference-page">
                 <Tabs

From 6fd45e5789ceb15ad683107e4fc9172ece972694 Mon Sep 17 00:00:00 2001
From: Patrick Sullivan <psullivang7@gmail.com>
Date: Sun, 27 Sep 2020 14:41:13 -0400
Subject: [PATCH 05/12] fixed save sync confirmation box not appearing

---
 src/components/layouts/Ide.js              | 2 +-
 src/components/structural/header/Header.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/layouts/Ide.js b/src/components/layouts/Ide.js
index c21c2e92..a3a01542 100644
--- a/src/components/layouts/Ide.js
+++ b/src/components/layouts/Ide.js
@@ -44,7 +44,7 @@ export const Ide = ({ editor, editorActions, user, authActions, scene, sceneActi
                     :
                     <>
                         <div id="interface" className="col-12 col-md-4" >
-                            <Editor refresh={editorActions.refresh} render={editorActions.render} text={editor.text} user={user} savedText={editor.savedText} />/>
+                            <Editor refresh={editorActions.refresh} render={editorActions.render} text={editor.text} user={user} savedText={editor.savedText} />
                         </div>
                         <div id="scene" className="col-12 col-md-8" >
                             <View objects={editor.objects} sceneConfig={scene} assets={editor.assets} />
diff --git a/src/components/structural/header/Header.js b/src/components/structural/header/Header.js
index 99c018e5..24283b34 100644
--- a/src/components/structural/header/Header.js
+++ b/src/components/structural/header/Header.js
@@ -64,7 +64,7 @@ class Header extends Component {
 
         this.state.socket.on("update", () => {
             let editor = window.ace.edit("ace-editor");            
-            if(editor.getSession().getValue() === this.props.text || window.confirm("A new version of the scene is available, would you like to load it?")){
+            if(editor.getSession().getValue() === this.props.scene.code || window.confirm("A new version of the scene is available, would you like to load it?")){
                 this.props.actions.fetchScene(this.props.projectId);
             }
         });

From 05ad496623d7483d6694371b07d2e6fe6a2ed9bf Mon Sep 17 00:00:00 2001
From: Keith Valin <keith@mailtux.net>
Date: Wed, 7 Oct 2020 11:16:58 -0400
Subject: [PATCH 06/12] Fixed typo

---
 src/myr/reference.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/myr/reference.js b/src/myr/reference.js
index dd4dfc95..3334452d 100644
--- a/src/myr/reference.js
+++ b/src/myr/reference.js
@@ -285,7 +285,7 @@ let transformations = [
     },
     {
         name: "setTransparency",
-        parameters: [{type: "number", name: "transparentcy"}],
+        parameters: [{type: "number", name: "transparency"}],
         description: <span>The setTransparency function changes the opacity of the element. The range of transparency is from 0% (solid) to 100% (invisible). The default is 0%.</span>,
         example: "setTransparency"
     },

From d236eb24295da15380688adc1d9e99be8c8af758 Mon Sep 17 00:00:00 2001
From: jlu18 <justin_lu@student.uml.edu>
Date: Wed, 14 Oct 2020 10:45:52 -0400
Subject: [PATCH 07/12] Add title for reference exmaple page

---
 src/actions/referenceExampleActions.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/actions/referenceExampleActions.js b/src/actions/referenceExampleActions.js
index 5440f7a4..45b98121 100644
--- a/src/actions/referenceExampleActions.js
+++ b/src/actions/referenceExampleActions.js
@@ -32,6 +32,8 @@ export function fetchReferenceExample(funcName) {
                 response.json()
                     .then(json => {
                         dispatch(loadReferenceExample(response.status === 200 ? json : notFound));
+                        if(response.status === 200) document.title = json.functionName + " Reference | MYR";
+                        else document.title = "Reference | MYR";
                         dispatch(render(json.code || ""));
                         dispatch(sceneActions.setNameDesc(
                             {

From 875ccd60fc829075f793abff98ed2a8abf1fdaea Mon Sep 17 00:00:00 2001
From: Patrick Sullivan <psullivang7@gmail.com>
Date: Thu, 29 Oct 2020 09:50:40 -0400
Subject: [PATCH 08/12] Added missing default parameter

---
 src/myr/Myr.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/myr/Myr.js b/src/myr/Myr.js
index 86a8cb6a..e35c6057 100644
--- a/src/myr/Myr.js
+++ b/src/myr/Myr.js
@@ -288,7 +288,7 @@ class Myr {
         return this.cursor.scale.z;
     };
 
-    setRotation = (x, y = 0, z = 0) => {
+    setRotation = (x = 0, y = 0, z = 0) => {
         if (typeof x === "number" && typeof y === "number" && typeof z === "number") {
             this.cursor.rotation = {
                 x: x,

From 15ccb0868f35cc51106191a8bf3c0627d76414c6 Mon Sep 17 00:00:00 2001
From: jlu18 <justin_lu@student.uml.edu>
Date: Thu, 29 Oct 2020 15:34:45 -0400
Subject: [PATCH 09/12] Add gtag for sending custom uid to GA

---
 src/components/structural/header/Header.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/structural/header/Header.js b/src/components/structural/header/Header.js
index 99c018e5..3c9e23a0 100644
--- a/src/components/structural/header/Header.js
+++ b/src/components/structural/header/Header.js
@@ -206,6 +206,9 @@ class Header extends Component {
         this.props.projectActions.asyncUserProj(this.props.user.uid);
         this.props.collectionActions.asyncCollections(this.props.user.uid);
         this.setRefreshTime(googleAuth.tokenObj.expires_at);
+
+        //send uid to google analyrica
+        window.gtag('config', 'UA-122925714-1', {'user_id': this.props.user.googleId});
     }
 
     setRefreshTime = (time) => {

From 3704d34d0b7905eedf31967f698669141055edd4 Mon Sep 17 00:00:00 2001
From: jlu18 <justin_lu@student.uml.edu>
Date: Mon, 2 Nov 2020 09:08:42 -0500
Subject: [PATCH 10/12] add brackets and replace single with double quote to
 pass eslint test

---
 src/actions/editorActions.js               | 4 +++-
 src/actions/referenceExampleActions.js     | 7 +++++--
 src/components/structural/header/Header.js | 2 +-
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/actions/editorActions.js b/src/actions/editorActions.js
index 68e5599a..b9646aaa 100644
--- a/src/actions/editorActions.js
+++ b/src/actions/editorActions.js
@@ -61,7 +61,9 @@ export function fetchScene(id, uid = "anon") {
             response.json().then((json) =>{
                 if(json.code){
                     //don't change the title when fetching scene in collection
-                    if(!document.title.includes("Collection")) document.title = json.name + " | MYR";
+                    if(!document.title.includes("Collection")) {
+                        document.title = json.name + " | MYR";
+                    }
                     dispatch(render(json.code, uid || "anon"));
                     dispatch(updateSavedText(json.code));
                     let settings = DEF_SETTINGS;
diff --git a/src/actions/referenceExampleActions.js b/src/actions/referenceExampleActions.js
index 45b98121..ef09d827 100644
--- a/src/actions/referenceExampleActions.js
+++ b/src/actions/referenceExampleActions.js
@@ -32,8 +32,11 @@ export function fetchReferenceExample(funcName) {
                 response.json()
                     .then(json => {
                         dispatch(loadReferenceExample(response.status === 200 ? json : notFound));
-                        if(response.status === 200) document.title = json.functionName + " Reference | MYR";
-                        else document.title = "Reference | MYR";
+                        if(response.status === 200) {
+                            document.title = json.functionName + " Reference | MYR";
+                        } else {
+                            document.title = "Reference | MYR";
+                        }
                         dispatch(render(json.code || ""));
                         dispatch(sceneActions.setNameDesc(
                             {
diff --git a/src/components/structural/header/Header.js b/src/components/structural/header/Header.js
index 3c9e23a0..89e8dc52 100644
--- a/src/components/structural/header/Header.js
+++ b/src/components/structural/header/Header.js
@@ -208,7 +208,7 @@ class Header extends Component {
         this.setRefreshTime(googleAuth.tokenObj.expires_at);
 
         //send uid to google analyrica
-        window.gtag('config', 'UA-122925714-1', {'user_id': this.props.user.googleId});
+        window.gtag("config", "UA-122925714-1", {"user_id": this.props.user.googleId});
     }
 
     setRefreshTime = (time) => {

From 6addf29125c2f6449961fe800ac7f64c2d955583 Mon Sep 17 00:00:00 2001
From: Jason Kiesling <jason@learnmyr.org>
Date: Mon, 30 Nov 2020 12:07:52 -0500
Subject: [PATCH 11/12] v2.1.0

---
 README.md | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index dfc0829f..5b41ccc4 100644
--- a/README.md
+++ b/README.md
@@ -9,8 +9,12 @@ The Engaging Computing Group develops new technologies to enable learners—yout
 ## Status
 [![CircleCI](https://circleci.com/gh/engaging-computing/MYR.svg?style=shield)](https://circleci.com/gh/engaging-computing/MYR)
 
-## Change Log - 2.0.0 -> 2.0.1
-- Fixed bug where tokens expired after one hour and weren't refreshed
+## Change Log - 2.0.1 -> 2.1.0
+- Added object transparency
+- Page titles are not all Myr.js
+- Fixed bug where save prompt would not appear
+- Added missing defauly argument to setRotation
+- Track UID in Analytics
 
 ## Acknowledgments
 MYR uses [Aframe](https://aframe.io), a fantastic open source project, to render objects and effects in the three dimensional space.  

From e5170566c01b20c63aa94735d9fb1a2284178a72 Mon Sep 17 00:00:00 2001
From: Jason Kiesling <jason@learnmyr.org>
Date: Mon, 30 Nov 2020 12:08:16 -0500
Subject: [PATCH 12/12] v2.1.0

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 2b4af10b..7aca4b24 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "myr",
-    "version": "2.0.1",
+    "version": "2.1.0",
     "private": false,
     "engines": {
         "node": "12.18.2"