wiring up more ui components

readme.md

@@ -10,6 +10,7 @@ Contributions in all forms (code, bug reports, community engagement, localizatio
 
 * [Grid.Space](https://grid.space) hosts [several live versions](https://grid.space/choose) of the code
 * [Kiri:Moto](https://grid.space/kiri) -- A Unique, Multi-Modal, Browser-based Slicer for 3D printers, CNC mills and Laser cutters
+* [Mesh:Tool](https://grid.space/mesh) -- A browser based mesh repair and editing tool
 
 ### Live Versions
 

src/main/mesh.js

@@ -143,18 +143,7 @@ function space_init(data) {
                     space.view.home();
                     break;
                 case 'KeyF':
-                    for (let m of selection.models()) {
-                        moto.client.fn.model_heal(m.id)
-                            .then(data => {
-                                if (data) {
-                                    m.reload(
-                                        data.vertices,
-                                        data.indices,
-                                        data.normals
-                                    );
-                                }
-                            });
-                    }
+                    api.tool.repair();
                     break;
                 case 'KeyT':
                     space.view.top();

src/mesh/api.js

@@ -211,6 +211,38 @@ let model = {
     }
 };
 
+let file = {
+    import() {
+        // binding created in mesh.build
+        $('import').click();
+    },
+
+    export() {
+        console.log('...export todo');
+    },
+};
+
+let tool = {
+    analyze() {
+        console.log('...analyze todo');
+    },
+
+    repair() {
+        for (let m of selection.models()) {
+            moto.client.fn.model_heal(m.id)
+                .then(data => {
+                    if (data) {
+                        m.reload(
+                            data.vertices,
+                            data.indices,
+                            data.normals
+                        );
+                    }
+                });
+        }
+    }
+};
+
 // api is augmented in mesh.build
 let api = mesh.api = {
     clear() {
@@ -246,10 +278,9 @@ let api = mesh.api = {
 
     model,
 
-    import() {
-        // binding created in mesh.build
-        $('import').click();
-    },
+    file,
+
+    tool,
 
     objects() {
         // return model objects suitable for finding ray intersections

src/mesh/build.js

@@ -83,16 +83,16 @@ function ui_build() {
     h.bind(actions, [
         h.div([
             // create and bind file loading elements
-            h.button({ _: 'import', onclick: api.import }, [
+            h.button({ _: 'import', onclick: api.file.import }, [
                 h.input({
                     id: "import", type: "file", class: ["hide"], multiple: true,
                     onchange(evt) { broker.send.load_files(evt.target.files) }
                 })
             ]),
-            h.button({ _: 'export' }),
+            h.button({ _: 'export', onclick: api.file.export, disabled: true }),
             h.div({ class: "vsep" }),
-            h.button({ _: 'analyze' }),
-            h.button({ _: 'repair' }),
+            h.button({ _: 'analyze', disabled: true }),
+            h.button({ _: 'repair', onclick: api.tool.repair }),
             h.div({ class: "vsep" }),
             h.button({ _: 'wireframe', onclick() { api.wireframe() } }),
         ]),
@@ -185,7 +185,7 @@ function ui_build() {
                 )
             ])];
         let h_ara = [h.div([
-                h.button({ _: `area`, title: m_id }),
+                h.button({ _: `span`, title: m_id }),
                 grid(
                     util.extract(bounds.center, map),
                     util.extract(bounds.size, map),

web/mesh/index.css

@@ -256,6 +256,8 @@ button:hover {
 
 #grouplist .models {
     gap: 2px;
+    max-height: 200px;
+    overflow-y: auto;
 }
 
 #grouplist .models button {