Add customizer support for OpenSCAD

This also includes sending metadata and part of the concatenated gzip,
not in the s3 metadata as that has a 2kb limit.

Resolves #320

app/web/src/components/Customizer/Customizer.tsx

@@ -8,7 +8,6 @@ import {
   CadhubNumberParam,
   CadhubStringChoiceParam,
   CadhubNumberChoiceParam,
-  CadhubChoiceParam,
 } from './customizerConverter'
 
 const Customizer = () => {
@@ -82,17 +81,22 @@ const Customizer = () => {
           {customizerParams.map((param, index) => {
             const otherProps = {
               value: currentParameters[param.name],
-              onChange: (value) => updateCustomizerParam(param.name, param.type == 'number' ? Number(value) : value),
+              onChange: (value) =>
+                updateCustomizerParam(
+                  param.name,
+                  param.type == 'number' ? Number(value) : value
+                ),
             }
-            if(param.input === 'choice-string' || param.input === 'choice-number'){
-              return <StringChoiceParam key={index} param={param} {...otherProps} />
-            // }else if(param.input === 'choice-number'){
-            //     return <StringChoiceParam key={index} param={param} {...otherProps} />
-            }else if (param.type === 'string') {
-                return <StringParam key={index} param={param} {...otherProps} />
-            } else if (param.type === 'number') {
-                return <NumberParam key={index} param={param} {...otherProps} />
-            } else if (param.type === 'boolean') {
+            if (
+              param.input === 'choice-string' ||
+              param.input === 'choice-number'
+            ) {
+              return <ChoiceParam key={index} param={param} {...otherProps} />
+            } else if (param.input === 'default-string') {
+              return <StringParam key={index} param={param} {...otherProps} />
+            } else if (param.input === 'default-number') {
+              return <NumberParam key={index} param={param} {...otherProps} />
+            } else if (param.input === 'default-boolean') {
               return <BooleanParam key={index} param={param} {...otherProps} />
             }
             return <div key={index}>{JSON.stringify(param)}</div>
@@ -180,12 +184,12 @@ function StringParam({
   )
 }
 
-function StringChoiceParam({
+function ChoiceParam({
   param,
   value,
   onChange,
 }: {
-  param: CadhubChoiceParam
+  param: CadhubStringChoiceParam | CadhubNumberChoiceParam
   value: any
   onChange: Function
 }) {
@@ -196,7 +200,11 @@ function StringChoiceParam({
         value={value}
         onChange={({ target }) => onChange(target?.value)}
       >
-      {param.options.map(opt=><option value={opt.value} key={opt.name}>{opt.name}</option>)}
+        {param.options.map((opt) => (
+          <option value={opt.value} key={opt.name}>
+            {opt.name}
+          </option>
+        ))}
       </select>
     </CustomizerParamBase>
   )

app/web/src/components/Customizer/customizerConverter.ts

@@ -1,7 +1,12 @@
 // CadHub
 
 type CadhubTypeNames = 'number' | 'string' | 'boolean'
-type CadhubInputNames = 'default-number' | 'default-string' | 'default-boolean' | 'choice-string' | 'choice-number'
+type CadhubInputNames =
+  | 'default-number'
+  | 'default-string'
+  | 'default-boolean'
+  | 'choice-string'
+  | 'choice-number'
 
 export interface CadhubStringOption {
   name: string
@@ -29,6 +34,7 @@ export interface CadhubStringParam extends CadhubParamBase {
 }
 export interface CadhubBooleanParam extends CadhubParamBase {
   type: 'boolean'
+  input: 'default-boolean'
   initial?: boolean
 }
 export interface CadhubNumberParam extends CadhubParamBase {
@@ -45,13 +51,13 @@ export interface CadhubStringChoiceParam extends CadhubParamBase {
   type: 'string'
   input: 'choice-string'
   initial: string
-  options: Array<CadhubStringOption> 
+  options: Array<CadhubStringOption>
 }
 export interface CadhubNumberChoiceParam extends CadhubParamBase {
   type: 'number'
   input: 'choice-number'
   initial: number
-  options: Array<CadhubNumberOption> 
+  options: Array<CadhubNumberOption>
 }
 
 export type CadhubParams =
@@ -60,91 +66,3 @@ export type CadhubParams =
   | CadhubNumberParam
   | CadhubStringChoiceParam
   | CadhubNumberChoiceParam
-
-// OpenSCAD
-const openscadValues = `
-// slider widget for number with max. value
-sliderWithMax =34; // [50]
-
-// slider widget for number in range
-sliderWithRange =34; // [10:100]
-
-//step slider for number
-stepSlider=2; //[0:5:100]
-
-// slider widget for number in range
-sliderCentered =0; // [-10:0.1:10]
-
-// spinbox with step size 1
-Spinbox= 5;
-
-// Text box for string
-String="hello";
-
-// Text box for string with length 8
-String2="length"; //8
-
-//description
-Variable = true;
-`
-
-const openscadConverted: CadhubParams[] = [
-  {
-    type: 'number',
-    name: 'sliderWithMax',
-    caption: 'slider widget for number with max. value',
-    initial: 34,
-    step: 1,
-    max: 50,
-  },
-  {
-    type: 'number',
-    name: 'sliderWithRange',
-    caption: 'slider widget for number in range',
-    initial: 34,
-    step: 1,
-    min: 10,
-    max: 100,
-  },
-  {
-    type: 'number',
-    name: 'stepSlider',
-    caption: 'step slider for number',
-    initial: 2,
-    step: 5,
-    min: 0,
-    max: 100,
-  },
-  {
-    type: 'number',
-    name: 'sliderCentered',
-    caption: 'slider widget for number in range',
-    initial: 0,
-    step: 0.1,
-    min: -10,
-    max: 10,
-  },
-  {
-    type: 'number',
-    name: 'Spinbox',
-    caption: 'spinbox with step size 1',
-    initial: 5,
-    step: 1,
-  },
-
-  {
-    type: 'string',
-    name: 'String',
-    caption: 'Text box for string',
-    initial: 'hello',
-  },
-  {
-    type: 'string',
-    name: 'String2',
-    caption: 'Text box for string with length 8',
-    initial: 'length',
-    maxLength: 8,
-  },
-
-  { type: 'boolean', name: 'Variable', caption: 'description', initial: true },
-]

app/web/src/components/IdeConsole/IdeConsole.tsx

@@ -22,7 +22,7 @@ const IdeConsole = () => {
               {time?.toLocaleString()}
             </div>
             <div className={(type === 'error' ? 'text-red-400' : '') + ' pl-4'}>
-              {message.split('\n').map((line, index) => {
+              {(message || '').split('\n').map((line, index) => {
                 return (
                   <div key={index}>
                     {line.startsWith('ECHO:') ? (