improved context menu for workspace object options
This commit is contained in:
parent
f3478c6c9c
commit
841e2b56db
5 changed files with 93 additions and 90 deletions
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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" }), ]
|
||||
)
|
||||
})
|
||||
])
|
||||
]
|
||||
}));
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
Loading…
Reference in a new issue