Merge back release changes to master

geppetto-showcase/src/App.js

@@ -25,6 +25,20 @@ export default class App extends Component {
         button: { main: '#fc6320' },
         toolbarBackground: { main: 'rgb(0,0,0,0.5)' },
       },
+      overrides: {
+        MuiListItemIcon: {
+          root: {
+            '& i.my-svg-icon': {
+              backgroundImage: `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7.32911 13.2291L3.85411 9.75414L2.67078 10.9291L7.32911 15.5875L17.3291 5.58748L16.1541 4.41248L7.32911 13.2291Z' fill='%23D6D5D7'/%3E%3C/svg%3E");`,
+              display: 'inline-block',
+              width: '16px',
+              height: '12px',
+              backgroundSize: 'contain',
+              backgroundRepeat: 'no-repeat'
+            }
+          }
+        }
+      }
     });
     theme = responsiveFontSizes(theme);
 

geppetto-showcase/src/examples/menu/menuConfiguration.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 const toolbarMenu = {
   global: {
     buttonsStyle: {
@@ -122,7 +124,17 @@ const toolbarMenu = {
           },
         },
         {
-          label: 'Feedback',
+          label: (
+              <>
+                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
+                  <path d="M7.32911 13.2291L3.85411 9.75414L2.67078 10.9291L7.32911 15.5875L17.3291 5.58748L16.1541 4.41248L7.32911 13.2291Z" fill="#D6D5D7"/>
+                </svg>
+                Feedback
+                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
+                  <path d="M7.32911 13.2291L3.85411 9.75414L2.67078 10.9291L7.32911 15.5875L17.3291 5.58748L16.1541 4.41248L7.32911 13.2291Z" fill="#5A48E6"/>
+                </svg>
+              </>
+          ),
           icon: '',
           action: {
             handlerAction: 'clickFeedback',
@@ -131,7 +143,7 @@ const toolbarMenu = {
         },
         {
           label: 'Social media',
-          icon: '',
+          icon: 'my-svg-icon',
           position: 'right-start',
           action: {
             handlerAction: 'submenu',

geppetto.js/geppetto-ui/src/3d-canvas/threeDEngine/ThreeDEngine.js

@@ -245,85 +245,82 @@ export default class ThreeDEngine {
           / this.renderer.domElement.width
         ) * 2 - 1;
 
-      if (event.button === 0) {
-        // only for left click
-        if (this.pickingEnabled) {
-          const intersects = this.getIntersectedObjects();
-
-          if (intersects.length > 0) {
-            // sort intersects
-            const compare = function (a, b) {
-              if (a.distance < b.distance) {
-                return -1;
-              }
-              if (a.distance > b.distance) {
-                return 1;
-              }
-              return 0;
+      if (this.pickingEnabled) {
+        const intersects = this.getIntersectedObjects();
+
+        if (intersects.length > 0) {
+          // sort intersects
+          const compare = function (a, b) {
+            if (a.distance < b.distance) {
+              return -1;
             }
-            intersects.sort(compare);
+            if (a.distance > b.distance) {
+              return 1;
+            }
+            return 0;
           }
+          intersects.sort(compare);
+        }
 
-          let selectedMap = {};
-          // Iterate and get the first visible item (they are now ordered by proximity)
-          for (let i = 0; i < intersects.length; i++) {
-            // figure out if the entity is visible
-            let instancePath = '';
-            let externalMeshId = null;
-            let geometryIdentifier = '';
-            if (
-              Object.prototype.hasOwnProperty.call(
-                intersects[i].object,
-                'instancePath'
-              )
-            ) {
-              instancePath = intersects[i].object.instancePath;
-              geometryIdentifier
-                  = intersects[i].object.geometryIdentifier;
-            } else if (Object.prototype.hasOwnProperty.call(
-                intersects[i].object.parent,
-                'instancePath'
-            )) {
-              instancePath = intersects[i].object.parent.instancePath;
-              geometryIdentifier
-                  = intersects[i].object.parent.geometryIdentifier;
-            }
-            else {
-              externalMeshId = intersects[i].object.uuid
-              geometryIdentifier = null
-            }
+        let selectedMap = {};
+        // Iterate and get the first visible item (they are now ordered by proximity)
+        for (let i = 0; i < intersects.length; i++) {
+          // figure out if the entity is visible
+          let instancePath = '';
+          let externalMeshId = null;
+          let geometryIdentifier = '';
+          if (
+            Object.prototype.hasOwnProperty.call(
+              intersects[i].object,
+              'instancePath'
+            )
+          ) {
+            instancePath = intersects[i].object.instancePath;
+            geometryIdentifier
+                = intersects[i].object.geometryIdentifier;
+          } else if (Object.prototype.hasOwnProperty.call(
+              intersects[i].object.parent,
+              'instancePath'
+          )) {
+            instancePath = intersects[i].object.parent.instancePath;
+            geometryIdentifier
+                = intersects[i].object.parent.geometryIdentifier;
+          }
+          else {
+            externalMeshId = intersects[i].object.uuid
+            geometryIdentifier = null
+          }
 
-            if (
-              (instancePath != null
-                    && Object.prototype.hasOwnProperty.call(
-                      this.meshFactory.meshes,
-                      instancePath
-                    ))
-                || Object.prototype.hasOwnProperty.call(
-                  this.meshFactory.splitMeshes,
-                  instancePath
-                )
-            ) {
-              if (!(instancePath in selectedMap)) {
-                selectedMap[instancePath] = {
-                  ...intersects[i],
-                  geometryIdentifier: geometryIdentifier,
-                  distanceIndex: i,
-                };
-              }
+          if (
+            (instancePath != null
+                  && Object.prototype.hasOwnProperty.call(
+                    this.meshFactory.meshes,
+                    instancePath
+                  ))
+              || Object.prototype.hasOwnProperty.call(
+                this.meshFactory.splitMeshes,
+                instancePath
+              )
+          ) {
+            if (!(instancePath in selectedMap)) {
+              selectedMap[instancePath] = {
+                ...intersects[i],
+                geometryIdentifier: geometryIdentifier,
+                distanceIndex: i,
+              };
             }
-            if (externalMeshId != null) {
-              if (!(externalMeshId in selectedMap)) {
-                selectedMap[externalMeshId] = {
-                  ...intersects[i],
-                  distanceIndex: i,
-                };
-              }
+          }
+          if (externalMeshId != null) {
+            if (!(externalMeshId in selectedMap)) {
+              selectedMap[externalMeshId] = {
+                ...intersects[i],
+                distanceIndex: i,
+              };
             }
           }
-          this.requestFrame();
-          this.onSelection(this.selectionStrategy(selectedMap))
         }
+        this.requestFrame();
+        this.onSelection(this.selectionStrategy(selectedMap), event)
       }
     }
   }

geppetto.js/geppetto-ui/src/list-viewer/utils/Griddle.js

@@ -6,6 +6,7 @@ import {
 } from 'redux';
 
 import Griddle, { plugins } from 'griddle-react';
+import init from 'griddle-react/dist/module/utils/initializer';
 
 const { CorePlugin: corePlugin } = plugins