Zoom to fit for openscad (#569)

* Add viewall flag to openscad cli in prep for zoom to fit for scad previews

* Fix remaining issues with social image capture

app/web/src/helpers/cadPackages/common.ts

@@ -1,10 +1,11 @@
 import { STLLoader } from 'three/examples/jsm/loaders/STLLoader'
 import { State } from 'src/helpers/hooks/useIdeState'
 import { CadhubParams } from 'src/components/Customizer/customizerConverter'
+import type { Camera } from 'src/helpers/hooks/useIdeState'
 
 export const lambdaBaseURL =
   process.env.CAD_LAMBDA_BASE_URL ||
-  'https://2inlbple1b.execute-api.us-east-1.amazonaws.com/prod2'
+  'https://oxt2p7ddgj.execute-api.us-east-1.amazonaws.com/prod'
 
 export const stlToGeometry = (url) =>
   new Promise((resolve, reject) => {
@@ -18,6 +19,7 @@ export interface RenderArgs {
     camera: State['camera']
     viewerSize: State['viewerSize']
     quality: State['objectData']['quality']
+    viewAll: boolean
   }
 }
 
@@ -36,6 +38,7 @@ export interface HealthyResponse {
   }
   customizerParams?: any[]
   currentParameters?: RawCustomizerParams
+  camera?: Camera
 }
 
 export interface RawCustomizerParams {
@@ -48,12 +51,14 @@ export function createHealthyResponse({
   consoleMessage,
   type,
   customizerParams,
+  camera,
 }: {
   date: Date
   data: any
   consoleMessage: string
   type: HealthyResponse['objectData']['type']
   customizerParams?: CadhubParams[]
+  camera?: Camera
 }): HealthyResponse {
   return {
     status: 'healthy',
@@ -66,6 +71,7 @@ export function createHealthyResponse({
       message: consoleMessage,
       time: date,
     },
+    camera,
     customizerParams,
   }
 }

app/web/src/helpers/cadPackages/jsCad/jsCadController.tsx

@@ -99,7 +99,7 @@ class WorkerHelper {
   }
   render = (
     code: string,
-    parameters: { [key: string]: any }
+    parameters: { [key: string]: any } // eslint-disable-line @typescript-eslint/no-explicit-any
   ): Promise<RenderResponse> => {
     const response: Promise<RenderResponse> = new Promise(
       (resolve: ResolveFn) => {

app/web/src/helpers/cadPackages/openScad/openScadController.ts

@@ -8,6 +8,7 @@ import {
   splitGziped,
 } from '../common'
 import { openScadToCadhubParams } from './openScadParams'
+import type { XYZ, Camera } from 'src/helpers/hooks/useIdeState'
 
 export const render = async ({ code, settings }: RenderArgs) => {
   const pixelRatio = window.devicePixelRatio || 1
@@ -19,6 +20,7 @@ export const render = async ({ code, settings }: RenderArgs) => {
   const body = JSON.stringify({
     settings: {
       size,
+      viewAll: settings.viewAll,
       parameters: settings.parameters,
       camera: {
         // rounding to give our caching a chance to sometimes work
@@ -59,7 +61,21 @@ export const render = async ({ code, settings }: RenderArgs) => {
     }
     const blob = await response.blob()
     const text = await new Response(blob).text()
-    const { consoleMessage, customizerParams, type } = splitGziped(text)
+    const { consoleMessage, customizerParams, type, cameraInfo } =
+      splitGziped(text)
+    const vecArray2Obj = (arr: number[]): XYZ => ({
+      x: arr[0],
+      y: arr[1],
+      z: arr[2],
+    })
+    const camera: Camera = cameraInfo
+      ? {
+          dist: cameraInfo?.distance,
+          position: vecArray2Obj(cameraInfo?.translation),
+          rotation: vecArray2Obj(cameraInfo?.rotation),
+          isScadUpdate: true,
+        }
+      : undefined
     return createHealthyResponse({
       type: type !== 'stl' ? 'png' : 'geometry',
       data:
@@ -67,6 +83,7 @@ export const render = async ({ code, settings }: RenderArgs) => {
           ? blob
           : await stlToGeometry(window.URL.createObjectURL(blob)),
       consoleMessage,
+      camera,
       date: new Date(),
       customizerParams: openScadToCadhubParams(customizerParams || []),
     })

app/web/src/helpers/hooks/use3dViewerResize.ts

@@ -18,12 +18,13 @@ export const use3dViewerResize = () => {
       })
       thunkDispatch((dispatch, getState) => {
         const state = getState()
-        if (['png', 'INIT'].includes(state.objectData?.type)) {
+        if (state.objectData?.type === 'png') {
           dispatch({ type: 'setLoading' })
           requestRender({
             state,
             dispatch,
             viewerSize: { width, height },
+            viewAll: state.objectData?.type === 'INIT',
           })
         }
       })

app/web/src/helpers/hooks/useIdeState.ts

@@ -19,11 +19,17 @@ const codeStorageKey = 'Last-editor-code'
 export const makeCodeStoreKey = (ideType) => `${codeStorageKey}-${ideType}`
 let mutableState: State = null
 
-interface XYZ {
+export interface XYZ {
   x: number
   y: number
   z: number
 }
+export interface Camera {
+  dist?: number
+  position?: XYZ
+  rotation?: XYZ
+  isScadUpdate?: boolean
+}
 
 export interface MosaicTree {
   first: string | MosaicTree
@@ -69,11 +75,7 @@ export interface State {
   currentParameters?: RawCustomizerParams
   isCustomizerOpen: boolean
   layout: MosaicTree
-  camera: {
-    dist?: number
-    position?: XYZ
-    rotation?: XYZ
-  }
+  camera: Camera
   viewerSize: { width: number; height: number }
   isLoading: boolean
   threeInstance: RootState
@@ -165,6 +167,7 @@ const reducer = (state: State, { type, payload }): State => {
           ? [...state.consoleMessages, payload.message]
           : payload.message,
         isLoading: false,
+        camera: payload.camera || state.camera,
       }
     }
     case 'errorRender':
@@ -308,6 +311,7 @@ export const useIdeState = (): [State, (actionOrThunk: any) => any] => {
 interface RequestRenderArgsStateless {
   state: State
   camera?: State['camera']
+  viewAll?: boolean
   viewerSize?: State['viewerSize']
   quality?: State['objectData']['quality']
   specialCadProcess?: string
@@ -317,6 +321,7 @@ interface RequestRenderArgsStateless {
 export const requestRenderStateless = ({
   state,
   camera,
+  viewAll,
   viewerSize,
   quality = 'low',
   specialCadProcess = null,
@@ -339,6 +344,7 @@ export const requestRenderStateless = ({
       parameters: state.isCustomizerOpen
         ? parameters || state.currentParameters
         : {},
+      viewAll,
       camera: camera || state.camera,
       viewerSize: viewerSize || state.viewerSize,
       quality,
@@ -363,6 +369,7 @@ export const requestRender = ({ dispatch, ...rest }: RequestRenderArgs) => {
         status,
         customizerParams,
         currentParameters,
+        camera,
       }) => {
         if (status === 'error') {
           dispatch({
@@ -378,6 +385,7 @@ export const requestRender = ({ dispatch, ...rest }: RequestRenderArgs) => {
               lastRunCode: code,
               customizerParams,
               currentParameters,
+              camera,
             },
           })
           return objectData