add focuser. defer bindings until curtain opens

This commit is contained in:
Stewart Allen 2020-06-08 00:08:19 -04:00
commit a23c62d3e9
4 changed files with 49 additions and 33 deletions

View file

@ -1071,14 +1071,15 @@
SPACE.useDefaultKeys(API.feature.on_key === undefined || API.feature.on_key_defaults);
Object.assign(UI, {
// from static HTML
load: $('load-file'),
alert: {
dialog: $('alert-area'),
text: $('alert-text')
},
container: container,
load: $('load-file'),
focuser: $('focuser'),
container: container,
menusep: $('lt-sep'),
rotate: $('lt-rotate'),
scale: $('lt-scale'),
@ -1568,27 +1569,6 @@
API.modal.show('setup');
}
// bind interface action elements
$('app-name').onclick = API.help.show;
$('app-mode').onclick = showSetup;
$('set-device').onclick = showSetup;
$('set-tools').onclick = showTools;
$('set-prefs').onclick = () => { API.modal.show('prefs') };
$('file-recent').onclick = () => { API.modal.show('files') };
$('file-import').onclick = API.event.import;
$('lt-action').onclick = API.platform.layout;
$('act-slice').onclick = (ev) => { ev.stopPropagation(); API.function.slice() };
$('act-preview').onclick = (ev) => { ev.stopPropagation(); API.function.print() };
$('act-export').onclick = (ev) => { ev.stopPropagation(); API.function.export() };
$('view-arrange').onclick = API.platform.layout;
$('view-top').onclick = SPACE.view.top;
$('view-home').onclick = SPACE.view.home;
$('mode-fdm').onclick = () => { API.mode.set('FDM') };
$('mode-sla').onclick = () => { API.mode.set('SLA') };
$('mode-cam').onclick = () => { API.mode.set('CAM') };
$('mode-laser').onclick = () => { API.mode.set('LASER') };
function mksvg(src) {
let svg = DOC.createElement('svg');
svg.innerHTML = src;
@ -1777,6 +1757,27 @@
// lift curtain
$('curtain').style.display = 'none';
// bind interface action elements
$('app-name').onclick = API.help.show;
$('app-mode').onclick = (ev) => { ev.stopPropagation(); showSetup() };
$('set-device').onclick = (ev) => { ev.stopPropagation(); showSetup() };
$('set-tools').onclick = (ev) => { ev.stopPropagation(); showTools() };
$('set-prefs').onclick = (ev) => { ev.stopPropagation(); API.modal.show('prefs') };
$('set-help').onclick = (ev) => { ev.stopPropagation(); API.help.show() };
$('file-recent').onclick = () => { API.modal.show('files') };
$('file-import').onclick = () => { API.event.import() };
$('lt-action').onclick = API.platform.layout;
$('act-slice').onclick = (ev) => { ev.stopPropagation(); API.function.slice() };
$('act-preview').onclick = (ev) => { ev.stopPropagation(); API.function.print() };
$('act-export').onclick = (ev) => { ev.stopPropagation(); API.function.export() };
$('view-arrange').onclick = API.platform.layout;
$('view-top').onclick = SPACE.view.top;
$('view-home').onclick = SPACE.view.home;
$('mode-fdm').onclick = () => { API.mode.set('FDM') };
$('mode-sla').onclick = () => { API.mode.set('SLA') };
$('mode-cam').onclick = () => { API.mode.set('CAM') };
$('mode-laser').onclick = () => { API.mode.set('LASER') };
}
// if a language needs to load, the script is injected and loaded

View file

@ -1833,7 +1833,7 @@
}
function setFocus(el) {
el = [ el || UI.load, DOC.body ];
el = [ el || UI.focuser, UI.load, UI.sizeX, DOC.body ];
for (let es, i=0; i<el.length; i++) {
es = el[i];
es.focus();

View file

@ -79,7 +79,7 @@ select, textarea, button, input, a {
}
select {
border: 1px solid #bbb;
background-color: white;
background-color: rgba(255,255,255,0.5);
border-radius: 3px;
}
select option[local="1"] {
@ -160,10 +160,10 @@ th, tr, td {
left: 0;
right: 0;
bottom: 0;
position: absolute;
position: fixed;
background-color: #fff;
font-family: 'Russo One', sans-serif;
z-index: 100;
z-index: 11;
}
#tracker {
@ -196,6 +196,9 @@ th, tr, td {
#top > div {
margin: 0 5px 0 5px;
}
#top, #mid-sep {
z-index: 15;
}
#app-mode, #app-acct {
width: 125px;
@ -534,7 +537,7 @@ th, tr, td {
color: white;
}
.t-body {
background-color: white;
background-color: rgba(255,255,255,0.5);
border: 1px solid #bbb;
border-radius: 3px;
}
@ -732,3 +735,10 @@ th, tr, td {
flex-direction: row;
align-items: stretch;
}
#focuser {
position: fixed;
z-index: -100;
left: -100%;
top: -100%;
}

View file

@ -21,6 +21,8 @@
<script src="/code/kiri.js?{{version}}"></script>
</head>
<body class="col">
<input id="focuser" size=10></input>
<div id="curtain" class="j-center a-center">loading...</div>
<div id="container"></div>
<div id="tracker"></div>
<div id="top" class="row">
@ -47,8 +49,7 @@
<div id="mid-sep"></div>
<div id="mid" class="grow row">
<div id="progress"><div id="progbar"><div id="progtxt">loading</div></div></div>
<div id="curtain" class="j-center a-center">loading...</div>
<div id="mid-lcol" class="col j-center">
<div id="mid-lcol" class="col j-center noshow">
<div id="lt-top"></div>
<div id="lt-setup" class="lt-menu">
<i class="fas fa-cogs"></i>
@ -66,6 +67,10 @@
<i class="fas fa-sliders-h"></i>
<label>prefs<label>
</div>
<div id="set-help">
<i class="far fa-question-circle"></i>
<label>help<label>
</div>
</div>
</div>
<div id="lt-file" class="lt-menu">
@ -271,13 +276,13 @@
<div id="mod-local" class="mdialog"></div>
<div id="mod-print" class="mdialog"></div>
<!-- hidden file input loader -->
<input id="load-file" type="file" name="loadme" style="display:none" accept=".stl,.gcode,.nc"/>
<input id="load-file" type="file" name="loadme" xstyle="display:none" accept=".stl,.gcode,.nc"/>
<div class="mod-end"></div>
</div>
</div>
</div>
<div id="mid-rcol" class="col j-center">
<div id="mid-rcol" class="col j-center noshow">
<div id="set-menu" class="col">
<div id="set-top" class="set-group"><a>settings</a></div>
<div id="settings" class="col"></div>