Merge pull request #841 from vorth/classic-features

adding features to online classic

.vscode/launch.json

@@ -52,6 +52,16 @@
         "/": "${workspaceFolder}/online/src"
       }
     },
+    {
+      "name":             "classic w/design",
+
+      "type": "chrome",
+      "request": "launch",
+      "url": "http://localhost:8532/classic/index.html?design=//raw.githubusercontent.com/vorth/vzome-sharing/main/2021/09/11/10-10-11-rose-olive-bombshell-solid/rose-olive-bombshell-solid.vZome",
+      "pathMapping": {
+        "/": "${workspaceFolder}/online/src"
+      }
+    },
     {
       "name":             "classic PWA",
 

online/build.gradle

@@ -229,7 +229,7 @@ core.config {
     'com/vzome/core/edits/RunZomodScript.java',
     'com/vzome/core/edits/RunPythonScript.java',
     'com/vzome/core/edits/RealizeMetaParts.java',
-    'com/vzome/core/edits/ReplaceWithShape.java',
+    // 'com/vzome/core/edits/ReplaceWithShape.java',
 
     'com/vzome/core/exporters/ColoredMeshJsonExporter.java',
     'com/vzome/core/exporters/SimpleMeshJsonExporter.java',

online/src/app/browser/browser.jsx

@@ -39,6 +39,8 @@ const DesignList = (props) =>
   );
 }
 
+const classicURL = new URL( '../classic/index.html', window.location ) .toString() + "?design=";
+
 const DesignActions = (props) =>
 {
   const copyHtml = path =>
@@ -76,6 +78,9 @@ const DesignActions = (props) =>
         <Button variant="contained" target="_blank" rel="noopener" href={ getAssetUrl( props.githubUser, props.path ) }>
           Show GitHub Assets
         </Button>
+        <Button variant="contained" color="secondary" target="_blank" rel="noopener" href={ classicURL + props.url }>
+          Open in vZome Online
+        </Button>
       </div>
     </Show>
   );

online/src/app/classic/menus/contextmenu.jsx

@@ -20,6 +20,8 @@ export const ContextualMenu = props =>
         return state.picked?.type && state.picked.type !== 'ball';
       case 'panel':
         return state.picked?.type === null;
+      case 'ballOrStrut':
+        return state.picked?.type !== null;
       default:
         return true;
     }
@@ -99,7 +101,7 @@ export const ContextualMenu = props =>
 
             <ContextMenuSeparator/>
 
-            <PickingItem action='ReplaceWithShape' label='Replace With Panels' disabled />
+            <PickingItem action='ReplaceWithShape' label='Replace With Panels' type='ballOrStrut' />
 
             <ContextMenuSeparator/>
 
@@ -110,7 +112,7 @@ export const ContextualMenu = props =>
                 <PickingItem action='CreateStrutPrototype' label='Create Strut Prototype' disabled />
             } */}
 
-            <PickingItem action='setBuildOrbitAndLength' label='Build With This' type='strut' disabled />
+            <PickingItem action='setBuildOrbitAndLength' label='Build With This' type='strut' />
             {/* // this .add( enabler .setMenuAction( "showProperties-"+key, this .controller, new JMenuItem( "Show Properties" ) ) ); */}
           </ContextMenu.Content>
 

online/src/app/classic/menus/filemenu.jsx

@@ -1,5 +1,5 @@
 
-import { createEffect, createSignal, mergeProps } from "solid-js";
+import { createEffect, createSignal, mergeProps, onMount } from "solid-js";
 import { unwrap } from "solid-js/store";
 
 import { controllerExportAction, controllerProperty, useEditor } from "../../../viewer/context/editor.jsx";
@@ -11,6 +11,12 @@ import { UrlDialog } from '../dialogs/webloader.jsx'
 import { SvgPreviewDialog } from "../dialogs/svgpreview.jsx";
 import { useCamera } from "../../../viewer/context/camera.jsx";
 
+const queryParams = new URLSearchParams( window.location.search );
+const relativeUrl = queryParams.get( 'design' );
+
+// Must make this absolute before the worker tries to, with the wrong base URL
+const url = ( relativeUrl && new URL( relativeUrl, window.location ) .toString() );
+
 const NewDesignItem = props =>
 {
   const { rootController } = useEditor();
@@ -83,6 +89,9 @@ export const FileMenu = () =>
     }
   }
 
+  // Open the design indicated in the query string, if any
+  onMount( () => url && openUrl( url ) );
+
   const [ svgPreview, setSvgPreview ] = createSignal( false );
 
   const exportAs = ( extension, mimeType, format=extension ) => evt =>

online/src/app/classic/menus/toolsmenu.jsx

@@ -39,7 +39,7 @@ export const ToolsMenu = () =>
 
         <Divider />
 
-        <SymmetryAction label="Replace With Panels" action="ReplaceWithShape" disabled={true} />
+        <SymmetryAction label="Replace With Panels" action="ReplaceWithShape" />
 
         <Divider />
 

online/src/viewer/export.jsx

@@ -1,10 +1,12 @@
 
-import { DropdownMenu } from "@kobalte/core";
+import { DropdownMenu, Link } from "@kobalte/core";
 
 import { useViewer } from "./context/viewer.jsx";
 import { saveFileAs } from "../viewer/util/files.js";
 import { useGltfExporter } from "./geometry.jsx";
 
+const editUrlBase = 'https://vzome.com/app/classic/index.html?design=';
+
 export const ExportMenu = (props) =>
 {
   const { source } = useViewer();
@@ -42,6 +44,11 @@ export const ExportMenu = (props) =>
       </DropdownMenu.Trigger>
       <DropdownMenu.Portal mount={props.root}>
         <DropdownMenu.Content class="exports__content">
+          <DropdownMenu.Item closeOnSelect={true} class="exports__item">
+            <Link.Root class="link" href={ editUrlBase + source.url } target="_blank" rel="noopener">
+              Open in vZome Online
+            </Link.Root>
+          </DropdownMenu.Item>
           <DropdownMenu.Item onSelect={downloadVZome} closeOnSelect={true} class="exports__item">
             .vZome source
           </DropdownMenu.Item>

online/src/viewer/index.jsx

@@ -133,7 +133,7 @@ const UrlViewer = (props) =>
   return (
     <CameraProvider>
       <WorkerStateProvider workerClient={props.workerClient}>
-        <ViewerProvider config={{ url: props.url, preview: true, debug: false, showScenes: props.showScenes, labels: props.config.labels }}>
+        <ViewerProvider config={{ url: props.url, preview: true, debug: false, showScenes: props.showScenes, labels: props.config?.labels }}>
           <DesignViewer config={ { ...props.config, allowFullViewport: true } }
               componentRoot={props.componentRoot}
               height="100%" width="100%" >

online/src/worker/legacy/controllers/editor.js

@@ -176,6 +176,18 @@ export class EditorController extends com.vzome.desktop.controller.DefaultContro
         break;
       }
 
+      case "setBuildOrbitAndLength": {
+        const { picked } = params.getConfig();
+        const rm = picked .getRenderedObject();
+        const length = rm .getStrutLength();
+        const orbit = rm .getStrutOrbit();
+        this.symmController .availableController .doAction( "enableDirection." + orbit .getName() );
+        this.symmController .buildController .doAction( "setSingleDirection." + orbit .getName() );
+        const lmodel = this.symmController .buildController .getSubController( "currentLength" );
+        lmodel .setActualLength( length );
+        break;
+      }
+
       case "exportText":
         const { format, selection, camera, lighting, height=500, width=800,
                 useShapes=true, drawOutlines=true, monochrome=false, showBackground=true, useLighting=true } = params.getConfig();