AI_Assistant/grid-apps-cmms
Watch
1
0
Fork
You've already forked grid-apps-cmms
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

begin refactor of 4.x ui

Browse source
This commit is contained in:
Stewart Allen 2024-05-19 22:31:25 -04:00
commit 25c1959e57
11 changed files with 375 additions and 278 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/kiri/function.js
View file

@ -12,7 +12,7 @@
// dep: kiri-mode.laser.driver // dep: kiri-mode.laser.driver
gapp.register("kiri.function", [], (root, exports) => { gapp.register("kiri.function", [], (root, exports) => {
const { kiri, noop } = root; const { kiri } = root;
const { api, client, consts, utils } = kiri; const { api, client, consts, utils } = kiri;
const { space } = moto; const { space } = moto;
const { COLOR, PMODES } = consts; const { COLOR, PMODES } = consts;
@ -427,6 +427,7 @@ function parseCode(code, type) {
}); });
} }
// extend API (api.function)
const functions = api.function = { const functions = api.function = {
slice: prepareSlices, slice: prepareSlices,
print: preparePreview, print: preparePreview,

31
src/kiri/init.js
View file

@ -149,7 +149,7 @@ gapp.register("kiri.init", [], (root, exports) => {
function speedSave() { function speedSave() {
settings().controller.showSpeeds = ui.showSpeeds.checked; settings().controller.showSpeeds = ui.showSpeeds.checked;
api.platform.update_speeds(); api.view.update_speeds();
} }
function zAnchorSave() { function zAnchorSave() {
@ -808,9 +808,8 @@ gapp.register("kiri.init", [], (root, exports) => {
selext.innerHTML = ''; selext.innerHTML = '';
for (let i=0; i<dev.extruders.length; i++) { for (let i=0; i<dev.extruders.length; i++) {
let d = DOC.createElement('div'); let d = DOC.createElement('div');
d.appendChild(DOC.createTextNode(i)); d.innerHTML = `<label>extruder ${i}</label>`;
d.setAttribute('id', `sel-ext-${i}`); d.setAttribute('id', `sel-ext-${i}`);
d.setAttribute('class', 'col j-center');
d.onclick = function() { d.onclick = function() {
api.selection.for_widgets(w => { api.selection.for_widgets(w => {
api.widgets.annotate(w.id).extruder = i; api.widgets.annotate(w.id).extruder = i;
@ -1621,8 +1620,8 @@ gapp.register("kiri.init", [], (root, exports) => {
export: $('label-export'), export: $('label-export'),
}, },
acct: { acct: {
help: $('acct-help'), help: $('app-help'),
export: $('acct-export') export: $('app-export')
}, },
dev: { dev: {
header: $('dev-header'), header: $('dev-header'),
@ -1660,8 +1659,8 @@ gapp.register("kiri.init", [], (root, exports) => {
ltview: $('lt-view'), ltview: $('lt-view'),
ltact: $('lt-start'), ltact: $('lt-start'),
edit: $('lt-tools'), edit: $('lt-tools'),
nozzle: $('lt-nozzle'), nozzle: $('menu-nozzle'),
render: $('lt-render'), render: $('menu-render'),
modal: $('modal'), modal: $('modal'),
modalBox: $('modal-box'), modalBox: $('modal-box'),
@ -2452,22 +2451,10 @@ gapp.register("kiri.init", [], (root, exports) => {
} }
}; };
if (DOC.body.requestFullscreen) { if (!DOC.body.requestFullscreen) {
$('app-xpnd').style.display = 'flex'; $('app-xpnd').style.display = 'none';
} }
let hpops = [];
uc.hoverPop(ui.ltsetup, { group: hpops, target: $('set-pop') });
uc.hoverPop(ui.ltfile, { group: hpops, target: $('file-pop') });
uc.hoverPop(ui.ltview, { group: hpops, target: $('pop-view') });
uc.hoverPop(ui.ltact, { group: hpops, target: $('pop-slice') });
uc.hoverPop(ui.render, { group: hpops, target: $('pop-render'), xsticky: false });
uc.hoverPop(ui.edit, { group: hpops, target: $('pop-tools'), xsticky: false });
uc.hoverPop(ui.nozzle, { group: hpops, target: $('pop-nozzle'), xsticky: true });
uc.hoverPop($('app-acct'), { group: hpops, target: $('acct-pop') } );
// uc.hoverPop($('app-mode'), { group: hpops, target: $('mode-info') } );
uc.hoverPop($('app-name'), { group: hpops, target: $('app-info') } );
uc.onBlur([ uc.onBlur([
ui.toolName, ui.toolName,
ui.toolNum, ui.toolNum,
@ -2814,7 +2801,7 @@ gapp.register("kiri.init", [], (root, exports) => {
// bind interface action elements // bind interface action elements
$('app-name').onclick = api.help.show; $('app-name').onclick = api.help.show;
$('app-mode').onclick = (ev) => { ev.stopPropagation(); showDevices() }; $('app-state').onclick = (ev) => { ev.stopPropagation(); showDevices() };
$('set-device').onclick = (ev) => { ev.stopPropagation(); showDevices() }; $('set-device').onclick = (ev) => { ev.stopPropagation(); showDevices() };
$('set-tools').onclick = (ev) => { ev.stopPropagation(); showTools() }; $('set-tools').onclick = (ev) => { ev.stopPropagation(); showTools() };
$('set-prefs').onclick = (ev) => { ev.stopPropagation(); api.modal.show('prefs') }; $('set-prefs').onclick = (ev) => { ev.stopPropagation(); api.modal.show('prefs') };

6
src/kiri/main.js
View file

@ -861,14 +861,16 @@ gapp.register("kiri.main", [], (root, exports) => {
break; break;
case VIEWS.SLICE: case VIEWS.SLICE:
UI.back.style.display = 'flex'; UI.back.style.display = 'flex';
if (!isCAM) UI.render.classList.remove('lt-enabled'); if (isCAM) UI.render.classList.add('hide');
else UI.render.classList.remove('hide');
updateSpeeds(); updateSpeeds();
updateSliderMax(); updateSliderMax();
setWidgetVisibility(true); setWidgetVisibility(true);
break; break;
case VIEWS.PREVIEW: case VIEWS.PREVIEW:
UI.back.style.display = 'flex'; UI.back.style.display = 'flex';
if (!isCAM) UI.render.classList.remove('lt-enabled'); if (isCAM) UI.render.classList.add('hide');
else UI.render.classList.remove('hide');
setWidgetVisibility(true); setWidgetVisibility(true);
break; break;
default: default:

5
src/kiri/platform.js
View file

@ -247,7 +247,7 @@ function platformUpdateSelected() {
let disC = selwid.filter(w => w.meta.disabled === true).length; let disC = selwid.filter(w => w.meta.disabled === true).length;
enable.style.display = disC ? 'flex' : 'none'; enable.style.display = disC ? 'flex' : 'none';
disable.style.display = enaC ? 'flex' : 'none'; disable.style.display = enaC ? 'flex' : 'none';
ui.nozzle.classList.add('lt-active'); ui.nozzle.classList.remove('hide');
if (api.feature.meta && selcount === 1) { if (api.feature.meta && selcount === 1) {
let sel = selwid[0]; let sel = selwid[0];
let name = sel.meta.file || sel.meta.url; let name = sel.meta.file || sel.meta.url;
@ -276,7 +276,7 @@ function platformUpdateSelected() {
ui.mesh.name.innerText = '[0]'; ui.mesh.name.innerText = '[0]';
ui.mesh.points.innerText = '-'; ui.mesh.points.innerText = '-';
ui.mesh.faces.innerText = '-'; ui.mesh.faces.innerText = '-';
ui.nozzle.classList.remove('lt-active'); ui.nozzle.classList.add('hide');
} }
ui.nozzle.style.display = extruders && extruders.length > 1 ? 'flex' : ''; ui.nozzle.style.display = extruders && extruders.length > 1 ? 'flex' : '';
@ -862,6 +862,7 @@ function fitDeviceToWidgets() {
} }
} }
// extend API (api.platform)
const platform = api.platform = { const platform = api.platform = {
fit: fitDeviceToWidgets, fit: fitDeviceToWidgets,
add: platformAdd, add: platformAdd,

1
src/kiri/selection.js
View file

@ -267,6 +267,7 @@ function setDisabled(bool) {
api.platform.update_selected(); api.platform.update_selected();
} }
// extend API (api.selection)
const selection = api.selection = { const selection = api.selection = {
move, move,
scale, scale,

2
src/kiri/settings.js
View file

@ -733,6 +733,7 @@ function setEnableWASM(bool) {
api.event.emit("set.assembly", bool); api.event.emit("set.assembly", bool);
} }
// extend API (api.conf)
api.conf = { api.conf = {
dbo: () => { return ls2o('ws-settings') }, dbo: () => { return ls2o('ws-settings') },
get: getSettings, get: getSettings,
@ -751,6 +752,7 @@ api.conf = {
import: settingsImport, import: settingsImport,
}; };
// extend API (api.settings)
api.settings = { api.settings = {
get: getSettings, get: getSettings,
import: settingsImport, import: settingsImport,

1
src/kiri/widgets.js
View file

@ -76,6 +76,7 @@ function opacity(value) {
moto.space.update(); moto.space.update();
} }
// extend API (api.widgets)
const widgets = api.widgets = { const widgets = api.widgets = {
load: Widget.loadFromCatalog, load: Widget.loadFromCatalog,
new: newWidget, new: newWidget,

2
src/moto/service.js
View file

@ -1,3 +1,5 @@
// code for a ServiceWorker that provides support for running cached/offline
const version = self.gapp.version; const version = self.gapp.version;
const origin = self.location.origin; const origin = self.location.origin;
const stats = { const stats = {

250
web/kiri/index.css
View file

@ -7,6 +7,10 @@
--holdbar-sf: linear-gradient(to top, rgba(200,200,200,0.1), rgba(255,255,255,1), rgba(200,200,200,0.1)) !important; --holdbar-sf: linear-gradient(to top, rgba(200,200,200,0.1), rgba(255,255,255,1), rgba(200,200,200,0.1)) !important;
--highlight: rgba(126,153,183,0.4); --highlight: rgba(126,153,183,0.4);
--main-color: rgba(126,153,183,1); --main-color: rgba(126,153,183,1);
--main-color-hover: rgb(96, 127, 164);
--top: rgba(255,255,255,0.75);
--menu: #f0f0f0;
--menu-border: #555;
} }
@font-face { @font-face {
font-family: 'Russo One'; font-family: 'Russo One';
@ -28,6 +32,115 @@ a, a:hover, a:visited {
right: 0; right: 0;
bottom: 0; bottom: 0;
} }
#top {
text-transform: capitalize;
font-family: 'Russo One', sans-serif;
background-color: var(--top);
z-index: 15;
}
#top > div {
margin: 0 5px 0 5px;
}
.top-menu {
display: flex;
gap: 3px;
align-items: center;
white-space: nowrap;
}
.top-menu > span {
padding: 3px 6px 3px 6px;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
}
.top-menu label {
color: #444;
}
.top-menu svg {
color: var(--main-color);
}
.top-menu > span {
position: relative;
display: flex;
gap: 5px;
align-items: center;
}
.top-menu > span:hover label {
color: #222;
}
.top-menu > span:hover > svg {
color: var(--main-color-hover);
}
.top-menu > span:hover {
background-color: var(--menu);
border-left: 1px solid var(--menu-border);
border-right: 1px solid var(--menu-border);
}
.top-menu > span:hover .top-menu-drop {
display: flex;
}
.top-menu-left {
align-items: self-start;
}
.top-menu-left .content {
border-top-right-radius: 4px;
}
.top-menu-right {
align-items: self-end;
}
.top-menu-right .content {
border-top-left-radius: 4px;
}
.top-menu-drop {
position: absolute;
display: none;
/* border: 1px solid #555; */
top: 100%;
left: -1px;
right: -1px;
min-width: 100%;
min-height: 100%;
flex-direction: column;
font-family: sans-serif;
}
.top-menu-drop svg {
font-size: smaller;
}
#top .content {
background-color: var(--menu);
border-top: 1px dashed var(--menu-border);
border-left: 1px solid var(--menu-border);
border-right: 1px solid var(--menu-border);
border-bottom: 1px solid var(--menu-border);
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
padding: 3px 5px 3px 5px;
gap: 4px;
display: grid;
align-items: center;
grid-template-columns: auto 1fr;
}
#top .content > div {
display: contents;
}
#top .content > div > span {
text-align: center;
padding-left: 10px;
}
#top .content > div > label {
border-radius: 3px;
justify-self: stretch;
align-self: stretch;
}
#top .content > div > label:hover {
background-color: #ddd;
}
#top .content.onecol {
grid-template-columns: 1fr !important;
}
#app-name { #app-name {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -35,9 +148,34 @@ a, a:hover, a:visited {
transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);
z-index: 50; z-index: 50;
} }
#app-name, #app-acct { #app-name {
cursor: pointer; cursor: pointer;
} }
#app-name hr {
margin: 1px;
}
#app-name:hover #app-name-pop {
display: flex;
}
#app-name-pop {
/* display: none; */
color: var(--fg-gray);
font-family: sans-serif;
position: absolute;
/* right: -6px; */
top: 100%;
}
#app-name-pop .content {
/* grid-template-columns: 1fr; */
text-align: center;
}
#app-lang {
justify-content: flex-end;
}
#app-lang:hover #lang-pop {
display: flex;
}
#app,div { #app,div {
display: flex; display: flex;
padding: 0; padding: 0;
@ -284,28 +422,24 @@ th, tr, td, label {
overflow: hidden; overflow: hidden;
} }
#top { #app-state {
font-family: 'Russo One', sans-serif; position: absolute;
background-color: rgba(255,255,255,0.75); bottom: 0;
padding: 3px; left: 0;
z-index: 15; right: 0;
} }
#top > div {
margin: 0 5px 0 5px;
}
#mode-info { #mode-info {
display: none; /* display: none; */
xposition: absolute;
white-space: nowrap; white-space: nowrap;
font-size: smaller; font-size: smaller;
font-family: sans-serif; font-family: sans-serif;
top: 50%; top: 50%;
height: 100%; height: 100%;
transform: translateY(-50%); /* transform: translateY(-50%); */
padding: 1px 0 1px 0; padding: 1px 0 1px 0;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 3px;
} }
#mode-info label { #mode-info label {
font-size: smaller; font-size: smaller;
@ -332,12 +466,9 @@ th, tr, td, label {
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
} }
#app-info.hoverpop {
display: flex;
}
#app-info { #app-info {
display: none; /* display: none; */
position: absolute; /* position: absolute;
white-space: nowrap; white-space: nowrap;
font-size: smaller; font-size: smaller;
font-family: sans-serif; font-family: sans-serif;
@ -347,7 +478,7 @@ th, tr, td, label {
color: var(--fg-gray); color: var(--fg-gray);
border-radius: 3px; border-radius: 3px;
border: 1px solid #ddd; border: 1px solid #ddd;
background-color: white; background-color: white; */
} }
#doit { #doit {
@ -376,46 +507,16 @@ th, tr, td, label {
background-color: rgba(0,0,0,0.2); background-color: rgba(0,0,0,0.2);
} }
#app-xpnd { #lang-hold {
display: none; background-color: transparent;
}
#app-acct, #app-xpnd {
align-items: center;
justify-content: flex-end;
}
#acct-pop.hoverpop {
display: flex !important;
}
#acct-pop {
display: none;
color: var(--fg-gray);
font-family: sans-serif;
position: absolute; position: absolute;
right: -6px; top: 0;
top: 100%; left: 0;
right: -15px;
bottom: 0;
} }
#acct-pop > div { #lang-pop {
margin-top: 5px; border: 1px solid red;
align-items: stretch;
background-color: white;
border: 1px solid #ddd;
border-radius: 3px;
padding: 0;
}
#acct-pop > div > div {
padding: 5px;
}
#acct-pop > div > div:hover {
color: #000;
background-color: #f4f4f4;
}
#acct-lang {
justify-content: flex-end;
}
#acct-lang:hover #lang-pop, #acct-ver:hover #ver-pop {
display: flex;
}
#lang-pop, #ver-pop {
display: none; display: none;
position: absolute; position: absolute;
right: 100%; right: 100%;
@ -426,26 +527,15 @@ th, tr, td, label {
border: 1px solid #ddd; border: 1px solid #ddd;
background-color: white; background-color: white;
white-space: nowrap; white-space: nowrap;
flex-direction: column;
} }
#ver-pop { #lang-pop > div {
transform: translateY(-78%);
}
#lang-pop > div, #ver-pop > div {
padding: 5px 7px 5px 7px; padding: 5px 7px 5px 7px;
} }
#lang-pop > div:hover, #ver-pop > div:hover { #lang-pop > div:hover {
color: #000; color: #000;
background-color: #f4f4f4; background-color: #f4f4f4;
} }
#ver-pop > div {
border-radius: 3px;
border: 1px solid white;
margin: 2px;
}
#ver-pop .cver {
background-color: #dfd !important;
border: 1px solid #aaa;
}
#mid { #mid {
pointer-events: none; pointer-events: none;
@ -464,10 +554,6 @@ th, tr, td, label {
pointer-events: none; pointer-events: none;
} }
#acct-pop {
text-transform: capitalize;
}
#top-sep { #top-sep {
display: none; display: none;
} }
@ -726,20 +812,6 @@ th, tr, td, label {
.lt-menu label { .lt-menu label {
font-size: small; font-size: small;
} }
.lt-enabled, .lt-active {
color: var(--fg-gray);
}
.lt-enabled:hover, .lt-active:hover {
background-color: #eee;
border: 1px solid #aaa;
color: #000;
}
.lt-enabled:hover .pop-lcol {
display: flex;
}
.lt-active .hoverpop {
display: flex;
}
@media only screen and (max-height : 750px) { @media only screen and (max-height : 750px) {
.lt-menu, .pop-lcol { .lt-menu, .pop-lcol {
font-size: 16px !important; font-size: 16px !important;

352
web/kiri/index.html
View file

@ -32,54 +32,202 @@
<div id="container"></div> <div id="container"></div>
<div id="tracker"></div> <div id="tracker"></div>
<div id="top-sep"></div> <div id="top-sep"></div>
<!-- TOP MENU BAR -->
<div id="top" class="f-row"> <div id="top" class="f-row">
<div id="app-mode"> <div class="f-row top-menu">
<div id="mode-info" class="f-row"> <span>
<label>Mode</label><div id="app-mode-name"></div> <i class="fas fa-person-running"></i>
<label>Device</label><div id="mode-device"></div> <label>start</label>
<label>Profile</label><div id="mode-profile"></div> <div class="top-menu-drop top-menu-left">
</div> <div class="content">
<div id="act-slice">
<label id="label-slice" title="generate layer slices" lk="slice">preview</label>
<span><i class="fas fa-bars"></i></span>
</div>
<div id="act-preview">
<label id="label-preview" title="show routing and paths" lk="preview">preview</label>
<span><i class="fas fa-layer-group"></i></span>
</div>
<div id="act-animate">
<label id="label-animate" title="render routing on a mesh" lk="animate">animate</label>
<span><i class="fas fa-film"></i></span>
</div>
<div id="act-export">
<label id="label-export" title="generate gcode" lk="export">export</label>
<span><i class="fas fa-file-download"></i></span>
</div>
</div>
</div>
</span>
<span>
<i class="fas fa-folder"></i>
<label>files</label>
<div class="top-menu-drop top-menu-left">
<div class="content">
<div id="file-recent">
<label lk="recent">recent</label>
<span><i class="fas fa-list"></i></span>
</div>
<div id="file-import">
<label lk="import">import</label>
<span><i class="fas fa-file-upload"></i></span>
<!-- hidden file input loader -->
<input id="load-file" type="file" name="loadme" style="display:none"></input>
</div>
</div>
</div>
</span>
<span>
<i class="fas fa-dice-d20"></i>
<label>mesh</label>
<div class="top-menu-drop top-menu-left">
<div class="content">
<div id="tool-rotate">
<label lk="rotate">rotate</label>
<span><i class="fas fa-sync-alt"></i></span>
</div>
<div id="tool-scale">
<label lk="scale">scale</label>
<span><i class="fas fa-expand"></i></span>
</div>
<div id="tool-mesh">
<label lk="mesh">mesh</label>
<span><i class="fas fa-dice-d20"></i></span>
</div>
<div id="tool-selector">
<label lk="select">select</label>
<span><i class="fas fa-mouse-pointer"></i></span>
</div>
<div id="view-clear">
<label lk="clear">clear</label>
<span><i class="far fa-square"></i></span>
</div>
</div>
</div>
</span>
<span id="menu-nozzle">
<i class="fas fa-map-marker"></i>
<label>tool</label>
<div class="top-menu-drop top-menu-left">
<div id="pop-nozzle" class="content onecol"></div>
</div>
</span>
</div> </div>
<div class="grow"></div> <div class="grow"></div>
<div id="app-name" class="f-col a-center"> <div id="app-name" class="f-col a-center top-menu">
<div>Kiri:Moto</div> <span>
<div id="app-info">version</div> <label>Kiri:Moto</label>
<div id="app-name-pop" class="top-menu-drop top-menu-center">
<div class="content onecol">
<div id="app-help">
<label lk="help">help</label>
</div>
<div>
<hr width="100%">
<label id="app-info">version</label>
</div>
</div>
</div>
</span>
</div> </div>
<div id="doit" class="f-row a-center"> <div id="doit" class="f-row a-center">
<button id="undo"><i class="fas fa-undo-alt"></i></button> <button id="undo"><i class="fas fa-undo-alt"></i></button>
<button id="redo"><i class="fas fa-redo-alt"></i></button> <button id="redo"><i class="fas fa-redo-alt"></i></button>
</div> </div>
<div class="grow"></div> <div class="grow"></div>
<div id="app-xpnd" lkt="fullscreen"> <div class="f-row top-menu">
<i class="fa-solid fa-maximize"></i> <span id="menu-render">
</div> <i class="fas fa-dice-d20"></i>
<div id="app-acct"> <label>render</label>
<i class="fas fa-user-cog"></i> <div class="top-menu-drop top-menu-right">
<div id="acct-pop" class="f-col"> <div class="content">
<div id="acct-menu" class="f-col"> <div id="render-solid" class="grow a-center">
<div id="acct-lang"> <label lk="solid">solid</label>
<label><i class="fas fa-caret-left"></i><span class="grow">&nbsp;</span><span lk="language">language</span></label> <span><i class="fas fa-square"></i></span>
<div id="lang-pop" class="f-col"> </div>
<div id="lset-zh">简体中文</div> <div id="render-wire" class="grow a-center">
<div id="lset-da">dansk</div> <label lk="wire">wire</label>
<div id="lset-de">deutsch</div> <span><i class="fas fa-border-all"></i></span>
<div id="lset-en">english</div> </div>
<div id="lset-es">español</div> <div id="render-ghost" class="grow a-center">
<div id="lset-fr">français</div> <label lk="ghost">ghost</label>
<div id="lset-pl">polskie</div> <span><i class="fas fa-border-none"></i></span>
<div id="lset-pt">português</div> </div>
<div id="render-hide" class="grow a-center">
<label lk="hide">hide</label>
</div> </div>
</div> </div>
<div id="acct-export" class="f-col a-end"> </div>
<label lk="export">export</label> </span>
</div> <span>
<div id="acct-help" class="f-col a-end"> <i class="fas fa-eye"></i>
<label lk="help">help</label> <label>view</label>
<div class="top-menu-drop top-menu-right">
<div class="content">
<div id="view-arrange">
<label lk="arrange">arrange</label>
<span><i class="fas fa-shapes"></i></span>
</div>
<div id="view-home">
<label lk="home">home</label>
<span><i class="fas fa-home"></i></span>
</div>
<div id="view-top">
<label lk="top">top</label>
<span><i class="fas fa-square"></i></span>
</div>
<div id="app-xpnd">
<label lk="fullscreen">fullscreen</label>
<span><i class="fas fa-maximize"></i></span>
</div>
</div> </div>
</div> </div>
</div> </span>
<span>
<i class="fas fa-cog"></i>
<label>setup</label>
<div class="top-menu-drop top-menu-right">
<div class="content">
<div id="set-prefs">
<label lk="prefs">prefs</label>
<span><i class="fas fa-sliders-h"></i></span>
</div>
<div id="set-device">
<label lk="machine">machine</label>
<span><i class="fas fa-cube"></i></span>
</div>
<div id="set-tools">
<label lk="tools">tools<label>
<span><i class="fas fa-tools"></i></span>
</div>
<div id="app-lang">
<label lk="language">language</label>
<span><i class="fas fa-language"></i></span>
<div id="lang-pop">
<div id="lset-zh">简体中文</div>
<div id="lset-da">dansk</div>
<div id="lset-de">deutsch</div>
<div id="lset-en">english</div>
<div id="lset-es">español</div>
<div id="lset-fr">français</div>
<div id="lset-pl">polskie</div>
<div id="lset-pt">português</div>
<span id="lang-hold"></span>
</div>
</div>
<div id="app-export">
<label lk="export">export</label>
<span><i class="fas fa-download"></i></span>
</div>
</div>
</div>
</span>
</div> </div>
</div> </div>
<div id="mid-sep"></div> <div id="mid-sep"></div>
<div id="mid" class="grow f-row"> <div id="mid" class="grow f-row">
<div id="progress"><div id="progbar"><div id="progtxt">loading</div></div></div> <div id="progress"><div id="progbar"><div id="progtxt">loading</div></div></div>
@ -156,135 +304,6 @@
<div class="footer"></div> <div class="footer"></div>
</div> </div>
</div> </div>
<div id="lt-setup" class="lt-menu lt-active">
<i class="fas fa-cogs"></i>
<label lk="setup">setup</label>
<div id="set-pop" class="pop-lcol f-row">
<div id="set-device">
<i class="fas fa-cube"></i>
<label lk="machine">machine</label>
</div>
<div id="set-tools">
<i class="fas fa-tools"></i>
<label lk="tools">tools<label>
</div>
<div id="set-prefs">
<i class="fas fa-sliders-h"></i>
<label lk="prefs">prefs<label>
</div>
</div>
</div>
<div id="lt-file" class="lt-menu lt-active">
<i class="fas fa-folder"></i>
<label lk="files">files</label>
<div id="file-pop" class="pop-lcol f-row">
<div id="file-recent">
<i class="fas fa-list"></i>
<label lk="recent">recent</label>
</div>
<div id="file-import">
<i class="fas fa-file-upload"></i>
<label lk="import">import</label>
<!-- hidden file input loader -->
<input id="load-file" type="file" name="loadme" style="display:none"></input>
</div>
</div>
</div>
<div id="act-sep"></div>
<div id="lt-view" class="lt-menu lt-active">
<i class="fas fa-eye"></i>
<label lk="view">view</label>
<div id="pop-view" class="pop-lcol f-row">
<div id="view-arrange">
<i class="fas fa-shapes"></i>
<label lk="arrange">arrange</label>
</div>
<div id="view-home">
<i class="fas fa-home"></i>
<label lk="home">home</label>
</div>
<div id="view-top">
<i class="fas fa-square"></i>
<label lk="top">top</label>
</div>
<div id="view-clear">
<i class="far fa-square"></i>
<label lk="clear">clear</label>
</div>
</div>
</div>
<div id="lt-start" class="lt-menu lt-active">
<i class="fas fa-person-running"></i>
<label id="label-start" title="start a process" lk="start">start</label>
<div id="pop-slice" class="pop-lcol f-row">
<div id="act-slice">
<i class="fas fa-bars"></i>
<label id="label-slice" title="generate layer slices" lk="slice">preview</label>
</div>
<div id="act-preview">
<i class="fas fa-layer-group"></i>
<label id="label-preview" title="show routing and paths" lk="preview">preview</label>
</div>
<div id="act-animate">
<i class="fas fa-film"></i>
<label id="label-animate" title="render routing on a mesh" lk="animate">animate</label>
</div>
<div id="act-export">
<i class="fas fa-file-download"></i>
<label id="label-export" title="generate gcode" lk="export">export</label>
</div>
</div>
</div>
<div id="lt-sep"></div>
<div id="lt-render" class="lt-menu lt-active">
<i class="fas fa-border-style"></i>
<label lk="render">render</label>
<div id="pop-render" class="pop-lcol f-row">
<div id="render-solid" class="grow a-center">
<i class="fas fa-square"></i>
<label lk="solid">solid</label>
</div>
<div id="render-wire" class="grow a-center">
<i class="fas fa-border-all"></i>
<label lk="wire">wire</label>
</div>
<div id="render-ghost" class="grow a-center">
<i class="fas fa-border-none"></i>
<label lk="ghost">ghost</label>
</div>
<div id="render-hide" class="grow a-center">
<label lk="hide">hide</label>
</div>
</div>
</div>
<div id="lt-tools" class="lt-menu lt-active">
<i class="fas fa-tools"></i>
<label lk="tools">edit</label>
<div id="pop-tools" class="pop-lcol f-row">
<div id="tool-rotate" class="grow a-center">
<i class="fas fa-sync-alt"></i>
<label lk="rotate">rotate</label>
</div>
<div id="tool-scale" class="grow a-center">
<i class="fas fa-expand"></i>
<label lk="scale">scale</label>
</div>
<div id="tool-mesh" class="grow a-center">
<i class="fas fa-dice-d20"></i>
<label lk="mesh">mesh</label>
</div>
<div id="tool-selector" class="grow a-center">
<i class="fas fa-mouse-pointer"></i>
<label lk="select">select</label>
</div>
</div>
</div>
<div id="lt-nozzle" class="lt-menu noshow">
<i class="fas fa-map-marker"></i>
<label>nozzle</label>
<div id="pop-nozzle" class="pop-lcol f-row fillh russo"></div>
</div>
<div id="lt-end"></div>
</div> </div>
<div id="mid-mcol" class="grow"> <div id="mid-mcol" class="grow">
<div id="modal"> <div id="modal">
@ -520,6 +539,15 @@
<div class="sep"></div> <div class="sep"></div>
<button id="context-setfocus" lk="rc_focs">set focus</button> <button id="context-setfocus" lk="rc_focs">set focus</button>
</div> </div>
<div id="app-state">
<div id="mode-info" class="f-row">
<label>Mode</label><div id="app-mode-name"></div>
<label>Device</label><div id="mode-device"></div>
<label>Profile</label><div id="mode-profile"></div>
</div>
</div>
<div id="stats"> <div id="stats">
<div id="rms"></div> <div id="rms"></div>
<div id="fps"></div> <div id="fps"></div>

2
web/kiri/lang/en.js
View file

@ -30,7 +30,7 @@ self.kiri.lang['en-us'] = {
name: "name", name: "name",
off: "off", // turn something off (like a lightbulb) off: "off", // turn something off (like a lightbulb)
on: "on", // turn something on (like a lightbulb) on: "on", // turn something on (like a lightbulb)
prefs: "prefs", // left menu "preferences" prefs: "preferences", // left menu "preferences"
preview: "preview", preview: "preview",
recent: "recent", recent: "recent",
render: "render", // left render pop menu render: "render", // left render pop menu