diff --git a/src/main/mesh.js b/src/main/mesh.js index 145a961f..6d587933 100644 --- a/src/main/mesh.js +++ b/src/main/mesh.js @@ -356,11 +356,7 @@ function space_init(data) { space.refresh() } } else { - for (let s of selection.list(true)) { - selection.remove(s); - s.showBounds(false); - s.remove(); - } + selection.delete(); } estop(evt); break; diff --git a/src/mesh/api.js b/src/mesh/api.js index b5a9e3b3..6f063278 100644 --- a/src/mesh/api.js +++ b/src/mesh/api.js @@ -88,6 +88,15 @@ const selection = { util.defer(selection.update); }, + // remove all + delete() { + for (let s of selection.list()) { + selection.remove(s); + s.showBounds(false); + s.remove(); + } + }, + // @param group {MeshObject} toggle(object) { if (selected.contains(object)) { diff --git a/src/mesh/build.js b/src/mesh/build.js index e438f990..5f35b6b6 100644 --- a/src/mesh/build.js +++ b/src/mesh/build.js @@ -11,6 +11,7 @@ const { broker } = gapp; const { mesh } = root; const { api, util } = mesh; +const trash = FontAwesome.icon({ prefix: "fas", iconName: "trash" }).html[0]; const eye_open = FontAwesome.icon({ prefix: "fas", iconName: "eye" }).html[0]; const eye_closed = FontAwesome.icon({ prefix: "fas", iconName: "eye-slash" }).html[0]; @@ -365,8 +366,8 @@ function ui_build() { h.div([ h.div({ _: "view", class: "head" }), h.button({ _: 'bounds', onclick() { selection.boundsBox({ toggle: true }) } }), - h.button({ _: 'gridlines', onclick() { api.grid() } }), h.button({ _: 'normals', onclick() { api.normals() } }), + h.button({ _: 'gridlines', onclick() { api.grid() } }), h.button({ _: 'wireframe', onclick() { api.wireframe() } }), ]), h.div([ @@ -504,6 +505,7 @@ function ui_build() { if (s_mdl.length === 0) { return h.bind(selectlist, []); } + // toggle-able stat block generator let sdata = {}; function sblock(label, title, grid) { @@ -520,6 +522,7 @@ function ui_build() { ]) ]; } + // map selection to divs let g_pos = util.average(s_grp.map(g => g.object.position)); let g_rot = util.average(s_grp.map(g => g.object.rotation)); @@ -563,13 +566,31 @@ function ui_build() { h.label({ _: util.comma(t_face) }), ]) ])]; + + let m_viz = !s_mdl.map(m => !m.visible()).reduce((v,b) => v || b); + let h_ops = [h.div([ + h.button({ _: `ops` }), + h.div({ class: ["grid","grid1"]}, [ + h.div({ class: [ 'square' ], + onclick(e) { + api.selection.visible(!m_viz); + update_selector(); + } + }, [ h.raw(m_viz ? eye_open : eye_closed) ]), + h.div({ class: [ 'square' ], + onclick(e) { api.selection.delete() } + }, [ h.raw(trash) ]) + ]) + ])]; + // bind elements to selectlist div let bound = h.bind(selectlist, [ ...h_grp, ...h_mdl, ...h_bnd, ...h_ara, - ...h_msh + ...h_msh, + ...h_ops ]); // bind rotation editable fields diff --git a/web/mesh/index.css b/web/mesh/index.css index c0fd6282..56975e50 100644 --- a/web/mesh/index.css +++ b/web/mesh/index.css @@ -574,6 +574,10 @@ button.selected:hover { gap: 2px; } +#selectlist > button, #selectlist > div > button { + border-radius: 3px; +} + #selectlist label { border-radius: 3px; font-family: monospace; @@ -606,6 +610,15 @@ button.selected:hover { grid: min-content 1fr 1fr / min-content 1fr 1fr 1fr; } +#selectlist .grid1 { + display: flex; + flex-grow: 1; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 5px; +} + #selectlist .grid2 { grid: min-content 1fr / min-content 1fr; }