restyle output tiles. fix print loop on cnc with no output
This commit is contained in:
parent
a4febca6b7
commit
cfa3792d2b
3 changed files with 78 additions and 17 deletions
|
|
@ -6,7 +6,7 @@
|
|||
<table id="print-info">
|
||||
<tr><th>file name</th><td><input id="print-filename" size="30" spellcheck="false" /></td></tr>
|
||||
<tr><th>file size (bytes)</th><td><input id="print-filesize" size="10" disabled="true" /></td></tr>
|
||||
<tr id="mill-info"><th>estimated mill time (h:m:s)</th><td><input id="mill-time" size="10" disabled="true" /></td></tr>
|
||||
<tr id="mill-info"><th>estimate (h:m:s)</th><td><input id="mill-time" size="10" disabled="true" /></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
|
@ -15,36 +15,35 @@
|
|||
<tr><th>filament used (mm)</th><td><input id="print-filament" size="10" disabled="true" /></td></tr>
|
||||
<tr><th>filament density (g/cm^3)</th><td><input id="print-density" size="10" value="1.25" /></td></tr>
|
||||
<tr><th>printed weight (g)</th><td><input id="print-weight" size="10" disabled="true" /></td></tr>
|
||||
<tr><th>estimated print time (h:m:s)</th><td><input id="print-time" size="10" disabled="true" /></td></tr>
|
||||
<tr><th>estimate (h:m:s)</th><td><input id="print-time" size="10" disabled="true" /></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="print-sel">
|
||||
<table><tr><th>
|
||||
<button id="print-download">download .gcode</button>
|
||||
<button id="print-serial">use gcode sender</button>
|
||||
</th></tr></table>
|
||||
<div class="print-sel print-gcode flex frow">
|
||||
<span><label>gcode</label></span>
|
||||
<button id="print-download" class="fgro">download</button>
|
||||
<button id="print-serial" class="fgro">use gcode sender</button>
|
||||
</div>
|
||||
|
||||
<div class="print-sel" id="send-to-octoprint">
|
||||
<div class="print-sel flex frow" id="send-to-octoprint">
|
||||
<span><label>octoprint</label></span>
|
||||
<table>
|
||||
<tr><th colspan="2"><button id="print-octoprint">send to octoprint</button></th></tr>
|
||||
<tr id="ophost"><th>host:port</th><td><input id="octo-host" size="35" placeholder="http(s)://host:port" /></td></tr>
|
||||
<tr id="opapik"><th>api key</th><td><input id="octo-apik" size="35" /></td></tr>
|
||||
<!--<tr><th>options</th><td><input type="checkbox" id="octo-print">start print</td></tr>-->
|
||||
<tr id="ophost"><th>host</th><td><input id="octo-host" size="35" placeholder="http(s)://host:port" /></td></tr>
|
||||
<tr id="opapik"><th>key</th><td><input id="octo-apik" size="35" /></td></tr>
|
||||
<tr id="ophint"><td colspan="2"><span id="octo-hint"><a href="http://docs.octoprint.org/en/master/api/general.html?highlight=cors#cross-origin-requests" target="_help">CORS support</a> must be enabled in API settings</span></td></tr>
|
||||
</table>
|
||||
<button id="print-octoprint" class="print-send">send</button>
|
||||
</div>
|
||||
|
||||
<div class="print-sel" id="send-to-gridhost">
|
||||
<div class="print-sel flex frow" id="send-to-gridhost">
|
||||
<span><label>grid:host</label></span>
|
||||
<table>
|
||||
<tr><th colspan="2"><button id="print-gridhost">send to grid:host</button></th></tr>
|
||||
<tr><th>host:port</th><td><input id="grid-host" size="35" placeholder="http(s)://host:port" /></td></tr>
|
||||
<tr><th>host</th><td><input id="grid-host" size="35" placeholder="http(s)://host:port" /></td></tr>
|
||||
<tr id="gpapik"><th>api key</th><td><input id="grid-apik" size="35" /></td></tr>
|
||||
<tr><th>target</th><td>
|
||||
<!--<input id="grid-target" size="35" />-->
|
||||
<select id="grid-target"></select>
|
||||
</td></tr>
|
||||
<tr><td colspan="2"><span id="grid-hint">setup <a href="https://github.com/GridSpace/grid-host" target="_help">grid:host</a> for your network</span></td></tr>
|
||||
</table>
|
||||
<button id="print-gridhost" class="print-send">send</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -149,6 +149,46 @@ select {
|
|||
padding: 2px;
|
||||
margin: 6px 0 6px 0;
|
||||
}
|
||||
.print-sel {
|
||||
position: relative;
|
||||
margin-top: 15px !important;
|
||||
padding: 15px 5px 10px 5px !important;
|
||||
}
|
||||
.print-send {
|
||||
margin: 0 0 0 5px !important;
|
||||
width: 50px !important;
|
||||
min-width: 50px !important;
|
||||
max-width: 50px !important;
|
||||
}
|
||||
.print-gcode > button {
|
||||
margin: 0 2px 0 2px !important;
|
||||
}
|
||||
.print-sel > button {
|
||||
max-width: 1000px;
|
||||
flex-basis: 100px;
|
||||
}
|
||||
.print-sel > span {
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
.print-sel > span > label {
|
||||
background-color: rgba(255,255,255,0.9);
|
||||
font-size: 15px;
|
||||
padding: 0 5px 0 5px;
|
||||
border-top: 0;
|
||||
border-bottom: 0;
|
||||
border-left: 1px solid #aaa;
|
||||
border-right: 1px solid #aaa;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.print-sel td,th {
|
||||
padding: 2px;
|
||||
}
|
||||
.print-sel th {
|
||||
text-align: right !important;
|
||||
}
|
||||
#print .print-sel:hover {
|
||||
border: 1px solid #555;
|
||||
}
|
||||
|
|
@ -631,3 +671,19 @@ button[import="1"] {
|
|||
padding: 3px 0 3px 0;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.frow {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.fcol {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.fgro {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue