improved context menu for workspace object options

This commit is contained in:
Stewart Allen 2024-06-07 09:51:09 -07:00
commit 841e2b56db
5 changed files with 93 additions and 90 deletions

View file

@ -2682,10 +2682,10 @@ gapp.register("kiri.init", [], (root, exports) => {
$('render-wire').onclick = () => { api.view.wireframe(true, 0, api.space.is_dark() ? 0.25 : 0.5); };
$('render-solid').onclick = () => { api.view.wireframe(false, 0, 1); };
// mesh buttons
$('mesh-swap').onclick = () => { api.widgets.replace() };
$('mesh-enable').onclick = () => { api.selection.enable() };
$('mesh-disable').onclick = () => { api.selection.disable() };
$('mesh-rename').onclick = () => { api.widgets.rename() };
// $('mesh-swap').onclick = () => { api.widgets.replace() };
// $('mesh-enable').onclick = () => { api.selection.enable() };
// $('mesh-disable').onclick = () => { api.selection.disable() };
// $('mesh-rename').onclick = () => { api.widgets.rename() };
$('mesh-export-stl').onclick = () => { objectsExport('stl') };
$('mesh-export-obj').onclick = () => { objectsExport('obj') };
$('context-duplicate').onclick = duplicateSelection;

View file

@ -235,44 +235,6 @@ function platformUpdateSelected() {
const { extruders } = device;
const { selection, ui } = api;
const selwid = selection.widgets(true);
const selreal = selection.widgets(false).length;
const selcount = selwid.length;
$('mesh-enable').disabled = selreal != 1;
$('mesh-disable').disabled = selreal != 1;
$('mesh-rename').disabled = selcount != 1;
$('mesh-swap').disabled = selcount != 1;
if (selcount) {
let enaC = selwid.filter(w => w.meta.disabled !== true).length;
let disC = selwid.filter(w => w.meta.disabled === true).length;
if (api.feature.meta && selcount) {
let name = selwid[0].meta.file || selwid[0].meta.url;
if (name) {
name = name
.toLowerCase()
.replace(/_/g, ' ')
.replace(/.png/, '')
.replace(/.stl/, '');
let sp = name.indexOf('/');
if (sp >= 0) {
name = name.substring(sp + 1);
}
}
let vert = selwid.map(w => w.meta.vertices).reduce((a,b) => a+b);
ui.mesh.points.innerText = util.comma(vert);
ui.mesh.faces.innerText = util.comma(vert / 3);
} else {
ui.mesh.points.innerText = '-';
ui.mesh.faces.innerText = '-';
}
} else {
ui.mesh.points.innerText = '-';
ui.mesh.faces.innerText = '-';
}
ui.mesh.name.innerText = selection.widgets(false).length;
if (extruders) {
for (let i = 0; i < extruders.length; i++) {
let b = $(`sel-ext-${i}`);
@ -568,29 +530,77 @@ function platformDeletePost() {
function platformChanged() {
h.bind($('ws-widgets'), api.widgets.all().map(w => {
let color;
let file = w.meta.file || 'no name';
let fsho = file.length > 25 ? file.slice(0,20) + '..' + file.slice(-2) : file;
return [
h.div([
h.div({
onmouseenter() {
color = w.getColor();
w.setColor(0x0088ff, null, false);
},
onmouseleave() {
w.setColor(color, null, false);
},
},[
h.div({ class: "widpop" }, [
h.div({ class: "widopt" }, [
h.button(
{
title: "rename",
onclick() { api.widgets.rename(w)
}},
[ h.i({ class:"fas fa-pen-to-square" }) ]
),
h.button(
{
title: "replace",
onclick() { api.widgets.replace(null,w) }
},
[ h.i({ class:"fas fa-rotate" }) ]
),
h.button(
{
id: `w-en-${w.id}`,
title: "toggle disabled",
class: w.meta.disabled ? "disabled" : "",
onclick() {
let dis = w.meta.disabled = !w.meta.disabled;
let sel = api.selection.contains(w);
api.uc.setClass($(`w-en-${w.id}`), "disabled", dis);
w.setColor(sel ? COLOR.selected : COLOR.deselected, null, false);
}
},
[ h.i({ class:"fas fa-ban" }) ]
),
h.button(
{
title: "delete",
onclick() { platformDelete(w) }
},
[ h.i({ class:"fas fa-trash" }), ]
)
]),
h.button([
h.i({ class: "fa-solid fa-caret-left" })
])
]),
h.button({
_: w.meta.file || 'no name',
_: fsho,
id: `ws-${w.id}`,
class: "grow",
onmouseenter() {
color = w.getColor();
w.setColor(0x0088ff);
},
onmouseleave() {
w.setColor(color);
},
class: "grow name",
title: file,
// onmouseenter() {
// color = w.getColor();
// w.setColor(0x0088ff, null, false);
// },
// onmouseleave() {
// w.setColor(color, null, false);
// },
onclick() {
platformSelect(w, true, false);
color = w.getColor();
}
}),
h.button(
{ onclick() { platformDelete(w) } },
[ h.i({ class:"fas fa-trash" }), ]
)
})
])
]
}));

View file

@ -29,8 +29,9 @@ function annotate(id) {
return (w.anno = w.anno || {});
}
function rename() {
let widgets = api.selection.widgets(true);
/** TODO really should be on widget, not widgets */
function rename(sel) {
let widgets = sel ? [ sel ] : api.selection.widgets(true);
if (widgets.length !== 1) {
return;
}
@ -43,8 +44,8 @@ function rename() {
}
}
function replace(vertices) {
let widgets = api.selection.widgets(true);
function replace(vertices, sel) {
let widgets = sel ? [sel] : api.selection.widgets(true);
if (!widgets.length) {
return;
}

View file

@ -912,16 +912,28 @@ th, tr, td, label {
#ws-widgets button {
text-transform: none;
text-align: left;
white-space: nowrap;
align-items: center;
overflow: hidden;
max-width: 150px;
}
#ws-widgets button.selected {
background-color: var(--blue-3);
color: #000;
}
/* .slim-hide {
width: 0;
overflow: hidden;
} */
.widpop:not(:hover) .widopt {
display: none;
}
.widopt {
background-color: white;
position: absolute;
top: 0;
right: 0;
bottom: 0;
}
.widopt button.disabled {
background-color: var(--blue-3);
}
#top-sep {
display: none;
}
@ -1126,8 +1138,7 @@ th, tr, td, label {
#ft-mesh-btn {
display: grid;
grid-auto-flow: row;
grid-template-rows: 1fr 1fr;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr;
}
#ft-mesh-btn button {
justify-content: center;

View file

@ -214,7 +214,7 @@
<!-- toolbar with mesh and rendering options -->
<div>
<div id="render-tools">
<span id="tool-rotate"><i class="fas fa-sync-alt" title="rotate selection"></i>
<span id="tool-rotate"><i class="fas fa-rotate-right" title="rotate selection"></i>
<div id="ft-rotate" class="grid pop">
<div id="rot_x_lt"><i class="fas fa-chevron-left"></i></div>
<label>X</label>
@ -233,7 +233,7 @@
</div>
</div>
</span>
<span id="tool-scale"><i class="fas fa-expand" title="scale selection"></i>
<span id="tool-scale"><i class="fas fa-expand" title="scale or resize selection"></i>
<div id="ft-scale" class="grid pop">
<div><label>X</label><input id="lock_x" type="checkbox" checked></div>
<div><label>Y</label><input id="lock_y" type="checkbox" checked></div>
@ -252,31 +252,12 @@
</div>
</div>
</span>
<span id="tool-mesh"><i class="fas fa-dice-d20" title="selected mesh tool"></i>
<span id="tool-mesh"><i class="fas fa-dice-d20"></i>
<div id="ft-mesh" class="grow f-col pop">
<div id="ft-mesh-btn">
<div><button id="mesh-enable" lkx="rc_swap">enable</button></div>
<div><button id="mesh-disable" lkx="rc_swap">disable</button></div>
<div><button id="mesh-rename" lkx="rc_swap">rename</button></div>
<div><button id="mesh-swap" lkx="rc_swap">replace</button></div>
<div><button id="mesh-export-obj" lk="rc_xobj">export OBJ</button></div>
<div><button id="mesh-export-stl" lk="rc_xstl">export STL</button></div>
</div>
<div class="set-sep"></div>
<div id="mesh-info" class="f-row gap3">
<div class="em1">
<label>selected</label>
<span id="mesh-name" class="value">[0]</span>
</div>
<div class="em3">
<label>faces</label>
<span id="mesh-faces" class="value">-</span>
</div>
<div class="em3">
<label>points</label>
<span id="mesh-points" class="value">-</span>
</div>
</div>
</div>
</span>
<span id="context-mirror" xlk="rc_mirr">