@archvisioninc/canvas 2.7.2 → 2.7.4

package/dist/helpers/utilityHelpers.js

@@ -563,7 +563,11 @@ const billboardScreenshot = view => {
 };
 export const takePreviewScreenshots = () => {
   // BUG: The first item from orthoOptions creates a blank screenshot.
-  const orthoViews = ['perspective', ...Object.keys(orthoOptions).map(view => view)];
+  const orthoViews = Object.keys(orthoOptions).map(view => view);
+  const baseView = ['perspective'];
+  if (!props.materialMode) {
+    baseView.push(...orthoViews);
+  }
   const outerFrame = guiTexture.getControlByName(GUI.outerSafeFrame);
   const xAxisMesh = scene.getMeshByName('xAxisMesh');
   const yAxisMesh = scene.getMeshByName('yAxisMesh');
@@ -595,7 +599,7 @@ export const takePreviewScreenshots = () => {
   };
   toggleUI();
   try {
-    const screenshots = orthoViews.map(async view => {
+    const screenshots = baseView.map(async view => {
       const imageData = await billboardScreenshot(view);
       return {
         name: view,
@@ -603,7 +607,7 @@ export const takePreviewScreenshots = () => {
       };
     });
     Promise.all(screenshots).then(screenshots => {
-      const hasAllScreenshots = screenshots.length === orthoViews.length;
+      const hasAllScreenshots = screenshots.length === baseView.length;
       if (hasAllScreenshots) props.setBillboardImages?.(screenshots);
       screenshots.forEach(screenshot => {
         scene.getCameraByName(screenshot.name)?.dispose();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@archvisioninc/canvas",
-  "version": "2.7.2",
+  "version": "2.7.4",
   "private": false,
   "main": "dist/Canvas.js",
   "module": "dist/Canvas.js",
@@ -42,11 +42,11 @@
     "@testing-library/user-event": "^13.5.0",
     "@typescript-eslint/eslint-plugin": "^5.48.0",
     "axios": "^1.2.0",
-    "babylonjs": "^6.32.1",
-    "babylonjs-gui": "^6.32.1",
-    "babylonjs-loaders": "^6.32.1",
-    "babylonjs-materials": "^6.32.1",
-    "babylonjs-serializers": "^6.32.1",
+    "babylonjs": "^6.33.2",
+    "babylonjs-gui": "^6.33.2",
+    "babylonjs-loaders": "^6.33.2",
+    "babylonjs-materials": "^6.33.2",
+    "babylonjs-serializers": "^6.33.2",
     "eslint-plugin-destructuring": "^2.2.1",
     "eslint-plugin-etc": "^2.0.2",
     "eslint-plugin-no-inline-styles": "^1.0.5",

package/src/package/helpers/utilityHelpers.js

@@ -623,7 +623,12 @@ const billboardScreenshot = view => {
 
 export const takePreviewScreenshots = () => {
   // BUG: The first item from orthoOptions creates a blank screenshot.
-  const orthoViews = [ 'perspective', ...Object.keys(orthoOptions).map(view => view) ];
+  const orthoViews = Object.keys(orthoOptions).map(view => view);
+  const baseView = [ 'perspective' ];
+
+  if (!props.materialMode) {
+    baseView.push(...orthoViews);
+  }
 
   const outerFrame = guiTexture.getControlByName(GUI.outerSafeFrame);
   const xAxisMesh = scene.getMeshByName('xAxisMesh');
@@ -659,13 +664,13 @@ export const takePreviewScreenshots = () => {
   toggleUI();
 
   try {
-    const screenshots = orthoViews.map(async view => {
+    const screenshots = baseView.map(async view => {
       const imageData = await billboardScreenshot(view);
       return { name: view, imageData };
     });
 
     Promise.all(screenshots).then(screenshots => {
-      const hasAllScreenshots = screenshots.length === orthoViews.length;
+      const hasAllScreenshots = screenshots.length === baseView.length;
       if (hasAllScreenshots) props.setBillboardImages?.(screenshots);
 
       screenshots.forEach(screenshot => {

package/src/scenes/App/App.js

@@ -5,7 +5,7 @@ import { AppContainer, DebugButtons, Button } from './styles';
 import { theme } from 'static/theme';
 import { fetchDownloadURL } from 'helpers/fetchHelpers';
 import { ENVIRONMENTS } from 'constants';
-import { updateCamera, updateMaterial, scene } from 'package/helpers';
+import { updateMaterial, scene } from 'package/helpers';
 import Canvas from 'package/Canvas';
 import _ from 'lodash';
 
@@ -84,7 +84,7 @@ const App = () => {
   const [ previewURL, setPreviewURL ] = useState(null);
   const [ selectedTheme, setSelectedTheme ] = useState('dark');
   const [ , setSerializedData ] = useState({});
-  const [ exportModel ] = useState(false);
+  const [ exportModel, setExportModel ] = useState(false);
   const [ previewImage ] = useState(null);
   const [ billboardImages ] = useState([]);
   const guid = window.location.pathname.split('/')[1];
@@ -203,19 +203,10 @@ const App = () => {
           theme={theme}
           $selectedTheme={selectedTheme}
           onClick={() => {
-            const inboundData = {
-              payload: {
-                takeScreenshot: true,
-                aspectRatio: 1.33,
-                imageDataOnly: true,
-              },
-            };
-
-            updateCamera(inboundData);
-            console.log({ screenshotData: scene.metadata?.screenshotData });
+            setExportModel(true);
           }}
         >
-          Screenshot Data
+          Take screenshot
         </Button>
 
         <Button