checkpoint floating tool menu work

This commit is contained in:
Stewart Allen 2021-10-08 11:07:38 -04:00
commit 7622c61e67
3 changed files with 38 additions and 26 deletions

View file

@ -196,11 +196,21 @@
}, 100); }, 100);
} }
function onLayerToggle() { function parentWithClass(el, classname) {
API.conf.update(); while (el) {
API.show.slices(); if (el.classList.contains(classname)) {
return el;
}
el = el.parentNode;
}
return el;
} }
// function onLayerToggle() {
// API.conf.update();
// API.show.slices();
// }
function onBooleanClick() { function onBooleanClick() {
// prevent hiding elements in device editor on clicks // prevent hiding elements in device editor on clicks
// if (!API.modal.visible()) { // if (!API.modal.visible()) {
@ -1510,8 +1520,8 @@
ltview: $('lt-view'), ltview: $('lt-view'),
ltact: $('act-slice'), ltact: $('act-slice'),
edit: $('lt-tools'), edit: $('lt-tools'),
rotate: $('lt-rotate'), // rotate: $('lt-rotate'),
scale: $('lt-scale'), // scale: $('lt-scale'),
nozzle: $('lt-nozzle'), nozzle: $('lt-nozzle'),
render: $('lt-render'), render: $('lt-render'),
@ -2231,8 +2241,8 @@
UC.hoverPop(UI.ltact, { group: hpops, target: $('pop-slice') }); UC.hoverPop(UI.ltact, { group: hpops, target: $('pop-slice') });
UC.hoverPop(UI.render, { group: hpops, target: $('pop-render'), sticky: false }); UC.hoverPop(UI.render, { group: hpops, target: $('pop-render'), sticky: false });
UC.hoverPop(UI.edit, { group: hpops, target: $('pop-tools'), sticky: false }); UC.hoverPop(UI.edit, { group: hpops, target: $('pop-tools'), sticky: false });
UC.hoverPop(UI.rotate, { group: hpops, target: $('pop-rotate'), sticky: true }); // UC.hoverPop(UI.rotate, { group: hpops, target: $('pop-rotate'), sticky: true });
UC.hoverPop(UI.scale, { group: hpops, target: $('pop-scale'), sticky: true }); // UC.hoverPop(UI.scale, { group: hpops, target: $('pop-scale'), sticky: true });
UC.hoverPop(UI.nozzle, { group: hpops, target: $('pop-nozzle'), sticky: true }); UC.hoverPop(UI.nozzle, { group: hpops, target: $('pop-nozzle'), sticky: true });
UC.hoverPop($('app-acct'), { group: hpops, target: $('acct-pop') } ); UC.hoverPop($('app-acct'), { group: hpops, target: $('acct-pop') } );
UC.hoverPop($('app-mode'), { group: hpops, target: $('mode-info') } ); UC.hoverPop($('app-mode'), { group: hpops, target: $('mode-info') } );
@ -2621,6 +2631,7 @@
let grp = groups[gid] = groups[gid] || []; let grp = groups[gid] = groups[gid] || [];
let target = $(sid); let target = $(sid);
target.style.display = 'none'; target.style.display = 'none';
target.control = tt;
grp.push(target); grp.push(target);
tt.onclick = () => { tt.onclick = () => {
for (let p of grp) { for (let p of grp) {
@ -2630,12 +2641,23 @@
} }
for (let tt of [...document.getElementsByClassName('closer')]) { for (let tt of [...document.getElementsByClassName('closer')]) {
let tid = tt.getAttribute('target'); let tid = tt.getAttribute('target');
let target = $(tid); let target = tid ? $(tid) : parentWithClass(tt, 'movable');
target.style.display = 'none'; target.style.display = 'none';
tt.onclick = () => { tt.onclick = () => {
target.style.display = 'none'; target.style.display = 'none';
}; };
} }
// bind tool show buttons
function showTool(tictac) {
if (typeof(tictac) === 'string') {
tictac = $(tictac);
}
let mover = parentWithClass(tictac.control, 'movable');
mover.style.display = 'flex';
tictac.control.onclick();
}
$('tool-rotate').onclick = () => { showTool('ft-rotate') };
$('tool-scale').onclick = () => { showTool('ft-scale') };
// warn users they are running a beta release // warn users they are running a beta release
if (KIRI.beta && KIRI.beta > 0 && SDB.kiri_beta != KIRI.beta) { if (KIRI.beta && KIRI.beta > 0 && SDB.kiri_beta != KIRI.beta) {

View file

@ -1816,8 +1816,8 @@
let menu_show = selcount ? 'flex': ''; let menu_show = selcount ? 'flex': '';
$('winfo').style.display = 'none'; $('winfo').style.display = 'none';
if (selcount) { if (selcount) {
UI.scale.classList.add('lt-active'); // UI.scale.classList.add('lt-active');
UI.rotate.classList.add('lt-active'); // UI.rotate.classList.add('lt-active');
UI.nozzle.classList.add('lt-active'); UI.nozzle.classList.add('lt-active');
UI.trash.style.display = 'flex'; UI.trash.style.display = 'flex';
if (feature.meta && selcount === 1) { if (feature.meta && selcount === 1) {
@ -1838,8 +1838,8 @@
} }
} }
} else { } else {
UI.scale.classList.remove('lt-active'); // UI.scale.classList.remove('lt-active');
UI.rotate.classList.remove('lt-active'); // UI.rotate.classList.remove('lt-active');
UI.nozzle.classList.remove('lt-active'); UI.nozzle.classList.remove('lt-active');
UI.trash.style.display = ''; UI.trash.style.display = '';
} }

View file

@ -80,9 +80,9 @@
<div id="lt-top"> <div id="lt-top">
<div id="float-tools" class="f-col movable"> <div id="float-tools" class="f-col movable">
<div id="float-tools-title" class="title mover" target="float-tools"> <div id="float-tools-title" class="title mover">
<label class="grow">title bar</label> <label class="grow">title bar</label>
<div id="float-tools-close" class="closer" target="float-tools"> <div id="float-tools-close" class="closer">
<i class="fas fa-times"></i> <i class="fas fa-times"></i>
</div> </div>
</div> </div>
@ -145,16 +145,6 @@
</div> </div>
</div> </div>
</div> </div>
<div id="lt-rotate" xclass="lt-menu">
<div lkt="rotate"><i class="fas fa-sync-alt"></i></div>
<div id="pop-rotate" class="pop-lcol f-row russo"></div>
</div>
<div id="lt-scale" xclass="lt-menu">
<div lkt="scale"><i class="fas fa-expand"></i></div>
<div id="pop-scale" class="pop-lcol f-row russo"></div>
</div>
</div> </div>
</div> </div>
<div id="lt-setup" class="lt-menu lt-active"> <div id="lt-setup" class="lt-menu lt-active">
@ -256,11 +246,11 @@
<i class="fas fa-tools"></i> <i class="fas fa-tools"></i>
<label lk="tools">edit</label> <label lk="tools">edit</label>
<div id="pop-tools" class="pop-lcol f-row"> <div id="pop-tools" class="pop-lcol f-row">
<div class="grow a-center"> <div id="tool-rotate" class="grow a-center">
<i class="fas fa-sync-alt"></i> <i class="fas fa-sync-alt"></i>
<label lk="rotate">rotate</label> <label lk="rotate">rotate</label>
</div> </div>
<div class="grow a-center"> <div id="tool-scale" class="grow a-center">
<i class="fas fa-expand"></i> <i class="fas fa-expand"></i>
<label lk="scale">scale</label> <label lk="scale">scale</label>
</div> </div>