checkpoint ui refactor

This commit is contained in:
Stewart Allen 2024-05-23 00:38:38 -04:00
commit 331bff9378
7 changed files with 88 additions and 98 deletions

View file

@ -187,8 +187,6 @@ CAM.init = function(kiri, api) {
if (wannot.tab && wannot.tab.length) hasTabs = true; if (wannot.tab && wannot.tab.length) hasTabs = true;
if (wannot.trace && wannot.trace.length) hasTraces = true; if (wannot.trace && wannot.trace.length) hasTraces = true;
} }
// show/hide dots in enabled process pop buttons
api.ui.camTabs.marker.style.display = hasTabs ? 'flex' : 'none';
api.platform.update_bounds(); api.platform.update_bounds();
updateIndex(); updateIndex();
updateStock(); updateStock();

View file

@ -137,9 +137,9 @@ FDM.init = function(kiri, api) {
if (!isFdmMode) { if (!isFdmMode) {
return; return;
} }
// if (!api.conf.get().controller.danger) { if (!api.conf.get().controller.danger) {
return; return;
// } }
let pct = 0; let pct = 0;
let int = setInterval(() => { let int = setInterval(() => {
if (pct <= 1) { if (pct <= 1) {

View file

@ -28,7 +28,6 @@ const LASER = driver.LASER = {
function init(kiri, api) { function init(kiri, api) {
api.event.on("settings.saved", (settings) => { api.event.on("settings.saved", (settings) => {
let ui = kiri.api.ui; let ui = kiri.api.ui;
ui.knife.marker.style.display = ui.knifeOn.checked ? '' : 'none';
}); });
} }

View file

@ -1951,8 +1951,8 @@ gapp.register("kiri.init", [], (root, exports) => {
camStockOffset: uc.newBoolean(LANG.cs_offs_s, onBooleanClick, {title:LANG.cs_offs_l, modes:CAM}), camStockOffset: uc.newBoolean(LANG.cs_offs_s, onBooleanClick, {title:LANG.cs_offs_l, modes:CAM}),
camStockClipTo: uc.newBoolean(LANG.cs_clip_s, onBooleanClick, {title:LANG.cs_clip_l, modes:CAM}), camStockClipTo: uc.newBoolean(LANG.cs_clip_s, onBooleanClick, {title:LANG.cs_clip_l, modes:CAM}),
camSep: uc.newBlank({class:"pop-sep", modes:CAM}), camSep: uc.newBlank({class:"pop-sep", modes:CAM}),
camStockIndexGrid: uc.newBoolean(LANG.cs_ishg_s, onBooleanClick, {title:LANG.cs_ishg_l, modes:CAM, show:() => ui.camStockIndexed.checked}),
camStockIndexed: uc.newBoolean(LANG.cs_indx_s, onBooleanClick, {title:LANG.cs_indx_l, modes:CAM}), camStockIndexed: uc.newBoolean(LANG.cs_indx_s, onBooleanClick, {title:LANG.cs_indx_l, modes:CAM}),
camStockIndexGrid: uc.newBoolean(LANG.cs_ishg_s, onBooleanClick, {title:LANG.cs_ishg_l, modes:CAM, show:() => ui.camStockIndexed.checked}),
camCommon: uc.newGroup(LANG.cc_menu, null, {modes:CAM}), camCommon: uc.newGroup(LANG.cc_menu, null, {modes:CAM}),
camZAnchor: uc.newSelect(LANG.ou_zanc_s, {title: LANG.ou_zanc_l, action:zAnchorSave, modes:CAM, trace:true, show:() => !ui.camStockIndexed.checked}, "zanchor"), camZAnchor: uc.newSelect(LANG.ou_zanc_s, {title: LANG.ou_zanc_l, action:zAnchorSave, modes:CAM, trace:true, show:() => !ui.camStockIndexed.checked}, "zanchor"),

View file

@ -253,48 +253,47 @@ gapp.register("kiri.ui", [], (root, exports) => {
let row = DOC.createElement('div'), let row = DOC.createElement('div'),
dbkey = `beta-${prefix}-show-${group}`, dbkey = `beta-${prefix}-show-${group}`,
popper = !opt.inline && label, // popper = !opt.inline && label,
link; link;
if (popper) { // if (popper) {
let pop = DOC.createElement('div'); // let pop = DOC.createElement('div');
pop.classList.add('set-pop'); // pop.classList.add('set-pop');
if (opt.class) { // if (opt.class) {
for (let ce of opt.class.split(' ')) { // for (let ce of opt.class.split(' ')) {
pop.classList.add(ce); // pop.classList.add(ce);
} // }
} // }
row.appendChild(pop); // row.appendChild(pop);
row.setAttribute("class", "set-group noselect"); // row.setAttribute("class", "set-group noselect");
addTo = pop; // addTo = pop;
} else { // } else {
if (opt.class) { if (opt.class) {
opt.class.split(' ').forEach(ce => { opt.class.split(' ').forEach(ce => {
row.classList.add(ce); row.classList.add(ce);
}); });
} else { } else {
row.setAttribute("class", "set-header col"); row.setAttribute("class", "set-header");
} }
addTo = lastDiv; addTo = lastDiv;
} // }
if (opt.marker) {
let marker = row.marker = DOC.createElement('div');
marker.setAttribute('class', 'marker');
row.appendChild(marker);
}
div.appendChild(row); div.appendChild(row);
if (label) { if (label) {
link = DOC.createElement('a'); link = DOC.createElement('a');
link.appendChild(DOC.createTextNode(label)); link.appendChild(DOC.createTextNode(label));
row.appendChild(link); row.appendChild(link);
let line = DOC.createElement('hr');
line.classList.add('set-header-line');
row.appendChild(line);
} }
addModeControls(row, opt); addModeControls(row, opt);
lastGroup = groups[group] = []; lastGroup = groups[group] = [];
lastGroup.key = dbkey; lastGroup.key = dbkey;
groupName = group; groupName = group;
groupShow[group] = popper ? state[dbkey] === 'true' : state[dbkey] !== 'false'; groupShow[group] = state[dbkey] !== 'false';
// groupShow[group] = popper ? state[dbkey] === 'true' : state[dbkey] !== 'false';
row.onclick = function(ev) { row.onclick = function(ev) {
if (ev.target !== link && ev.target !== row) { if (ev.target !== link && ev.target !== row) {
return; return;
@ -302,41 +301,41 @@ gapp.register("kiri.ui", [], (root, exports) => {
console.log({ toggleGroup: group, dbkey }); console.log({ toggleGroup: group, dbkey });
toggleGroup(group, dbkey); toggleGroup(group, dbkey);
}; };
if (popper) { // if (popper) {
let saveclick = row.onclick; // let saveclick = row.onclick;
row.onclick = function(ev) { // row.onclick = function(ev) {
let showing = groupShow[group]; // let showing = groupShow[group];
if (saveclick && showing) { // if (saveclick && showing) {
saveclick(ev); // saveclick(ev);
} else { // } else {
row.onmouseenter(ev, true); // row.onmouseenter(ev, true);
} // }
}; // };
row.onmouseenter = function(ev, click) { // row.onmouseenter = function(ev, click) {
let showing = groupShow[group]; // let showing = groupShow[group];
if (!(letHoverPop || click || showing)) { // if (!(letHoverPop || click || showing)) {
return; // return;
} // }
if (ev.target !== link && ev.target !== row) { // if (ev.target !== link && ev.target !== row) {
return; // return;
} // }
clearTimeout(exitimer); // clearTimeout(exitimer);
showGroup(group); // showGroup(group);
}; // };
row.onmouseleave = function(ev) { // row.onmouseleave = function(ev) {
if (groupSticky) { // if (groupSticky) {
return; // return;
} // }
if (ev.target !== link && ev.target !== row) { // if (ev.target !== link && ev.target !== row) {
return; // return;
} // }
clearTimeout(exitimer); // clearTimeout(exitimer);
exitimer = setTimeout(showGroup, 1000); // exitimer = setTimeout(showGroup, 1000);
}; // };
addTo._group = group; // addTo._group = group;
addModeControls(addTo, opt); // addModeControls(addTo, opt);
lastGroup.push(addTo); // lastGroup.push(addTo);
} // }
return row; return row;
} }

View file

@ -497,10 +497,12 @@ th, tr, td, label {
z-index: -1; z-index: -1;
} }
.chonk { .chonk {
height: 10px; margin: 10px 0 10px 0;
min-height: 10px; height: 0px;
min-height: 0px;
max-height: 0px;
min-width: 100px; min-width: 100px;
background-color: rgba(0,0,0,0.25); border-top: 3px dashed black;
} }
#mode-info { #mode-info {
white-space: nowrap; white-space: nowrap;
@ -927,13 +929,12 @@ th, tr, td, label {
gap: 5px; gap: 5px;
} }
.cam-pop-op { .cam-pop-op {
top: 0;
right: 100%;
text-align: left; text-align: left;
position: absolute; position: absolute;
white-space: nowrap; white-space: nowrap;
flex-direction: column; flex-direction: column;
top: 0;
right: 100%;
/* transform: translateY(-30%); */
background-color: rgba(255,255,255,0.8); background-color: rgba(255,255,255,0.8);
border: 1px solid #aaa; border: 1px solid #aaa;
border-radius: 5px; border-radius: 5px;
@ -1827,12 +1828,15 @@ th, tr, td, label {
align-items: stretch; align-items: stretch;
text-transform: capitalize; text-transform: capitalize;
background-color: rgba(255,255,255,0.5); background-color: rgba(255,255,255,0.5);
padding: 5px; /* padding: 5px; */
gap: 2px; /* gap: 2px; */
} }
#settings .set-group { #settings .set-group {
cursor: pointer; cursor: pointer;
} }
#settings .pop-sep {
display: none !important;
}
.pop-sep { .pop-sep {
border: 0 !important; border: 0 !important;
padding: 0 !important; padding: 0 !important;
@ -1848,12 +1852,19 @@ th, tr, td, label {
right: -9px; right: -9px;
} }
.set-header { .set-header {
background-color: rgba(0,0,0,0.1); padding: 3px 5px 3px 5px;
text-align: center; margin: 7px 3px 3px 3px;
white-space: nowrap; white-space: nowrap;
justify-content: center;
border-radius: 2px; border-radius: 2px;
} }
.set-header:hover {
background-color: rgba(0,0,0,0.1);
border-radius: 2px;
}
.set-header-line {
margin-left: 5px;
width: 100%;
}
.set-group { .set-group {
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
@ -1881,29 +1892,12 @@ th, tr, td, label {
margin-right: 5px; margin-right: 5px;
padding: 5px; padding: 5px;
} }
/* .set-pop.xdown { #settings .var-row {
transform: translateY(-25%) !important; margin: 0 10px 0 15px;
} }
.set-pop.fdmout { #settings .ext-buttons {
transform: translateY(-63%) !important; margin: 0 9px 0 14px;
} gap: 3px;
.set-pop.fdmadv {
transform: translateY(-74%) !important;
}
.set-pop.rough {
transform: translateY(-14%) !important;
}
.set-pop.outline {
transform: translateY(-36%) !important;
} */
.marker {
position:absolute;
border-radius: 2px;
background-color: rgba(0,0,0,0.25);
bottom: 1px;
left: 1px;
width: 4px;
height: 4px;
} }
#layers .var-row { #layers .var-row {
border-radius: 10px; border-radius: 10px;

View file

@ -488,10 +488,10 @@
</div> </div>
</div> </div>
<div id="end" class="f-col a-center"> <!-- <div id="end" class="f-col a-center">
the end the end
<div id="bottom">the bottom</div> <div id="bottom">the bottom</div>
</div> </div> -->
<!-- ThreeJS container --> <!-- ThreeJS container -->
<div id="container"></div> <div id="container"></div>