Merge branch 'dev' of https://github.com/engaging-computing/MYR into …

…parenthesisautocomplete
engaging-computing · Apr 23, 2021 · 3b26838 · 3b26838
2 parents df87a21 + 02d2838
commit 3b26838
Show file tree

Hide file tree

Showing 3 changed files with 196 additions and 142 deletions.
diff --git a/src/css/App.css b/src/css/App.css
@@ -320,12 +320,19 @@ div#reference-drawer>div {
     margin-right: 10px;
 }
 
-/************************************
-********THIS IS THE VR BUTTON********
-************************************/
+/* Overwrites default A-Frame behavior for embedded
+ * buttons to behave as if scene was located within
+ * an iframe */
 .a-enter-vr {
-    position: "relative";
-    z-index: 1 !important;
+    position: absolute;
+    bottom:20px !important;
+    right:20px !important;
+}
+
+.a-enter-ar {
+    position: absolute;
+    bottom:20px !important;
+    right:80px !important;
 }
 
 .geometry {

diff --git a/src/myr/Myr.js b/src/myr/Myr.js
@@ -1775,23 +1775,21 @@ class Myr {
         //if the element is light
         if(String(el.id).includes("lgt")){
             let split = el.light.state.split(/\s|;/).filter(Boolean);
-            let colorIndex = split.indexOf("color:");
-            let baseCol = split[colorIndex+1];
+            let colorIndex = split.indexOf("color:")+1;
+            let baseCol = split[colorIndex];
             if(this.colourNameToHex(baseCol)!==false){
                 baseCol = this.colourNameToHex(baseCol);
             }
             if(this.colourNameToHex(color) !== false){
                 color = this.colourNameToHex(color);
             }
-            let anim = `
-            property: light.color;
+            let anim = `property: light.color;
             from: ${baseCol};
             to: ${color};
             dur: ${this.cursor.duration};
             dir: alternate;
             loop: ${Boolean(this.cursor.loop)};
-            type: color;
-          `;
+            type: color;`;
             el.animation__color = anim;
             return outerElId;
         }
@@ -1801,31 +1799,29 @@ class Myr {
                 let innerEl = el.els[i];
                 //innerEl.material.split(/\s|;/) returns an array of strings separated by " " and ";",
                 //color is always its first attribute (after "color: ")
-                let anim = `
-          property: components.material.material.color;
-          from: ${(innerEl.material.split(/\s|;/))[1]};
-          to: ${color};
-          dur: ${this.cursor.duration};
-          dir: alternate;
-          loop: ${Boolean(this.cursor.loop)};
-          isRawProperty: true;
-          type: color;
-        `;
+                let anim = `property: components.material.material.color;
+            from: ${(innerEl.material.split(/\s|;/))[1]};
+            to: ${color};
+            dur: ${this.cursor.duration};
+            dir: alternate;
+            loop: ${Boolean(this.cursor.loop)};
+            isRawProperty: true;
+            type: color;`;
                 innerEl.animation__color = anim;
 
             }
             return outerElId;
         }
-        let anim = `
-      property: components.material.material.color;
-      from: ${(el.material.split(/\s|;/))[2]};
-      to: ${color};
-      dur: ${this.cursor.duration};
-      dir: alternate;
-      loop: ${Boolean(this.cursor.loop)};
-      isRawProperty: true;
-      type: color;
-    `;
+
+        const mat = el.material.split(/\s|;/);
+        let anim = `property: components.material.material.color;
+        from: ${mat[mat.indexOf("color:")+1]};
+        to: ${color};
+        dur: ${this.cursor.duration};
+        dir: alternate;
+        loop: ${Boolean(this.cursor.loop)};
+        isRawProperty: true;
+        type: color;`;
         el.animation__color = anim;
         return outerElId;
     }