2018-06-19 08:07:03 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
2018-06-20 13:00:05 +00:00
|
|
|
|
2018-06-21 20:02:40 +00:00
|
|
|
<head>
|
|
|
|
|
<title>OpenBuilds Machine Driver</title>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
|
<meta name="author" content="">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
|
<meta name="metro4:init" content="true">
|
|
|
|
|
<script type="text/javascript" src="lib/jquery/jquery.min.js"></script>
|
|
|
|
|
<link rel="stylesheet" href="lib/metro4/css/metro-all.css" />
|
|
|
|
|
<link rel="stylesheet" href="css/buttons.css" />
|
|
|
|
|
<link rel="stylesheet" href="css/main.css" />
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
|
2018-06-20 13:00:05 +00:00
|
|
|
|
2018-06-21 20:02:40 +00:00
|
|
|
<div class="window" style="height: 100vh;">
|
|
|
|
|
<div class="window-caption" style="-webkit-app-region: drag;">
|
|
|
|
|
<span class="icon mif-cog"></span>
|
2018-06-26 10:33:13 +00:00
|
|
|
<span class="title" id="windowtitle">OpenBuids Machine Driver</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
<div class="buttons" style="-webkit-app-region: no-drag">
|
2018-06-25 17:25:19 +00:00
|
|
|
<span class="btn-min" onclick="socket.emit('minimise')"></span>
|
|
|
|
|
<span data-cls-hint="bg-light fg-dark drop-shadow" class="btn-close" onclick="confirmQuit()"></span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="window-content" style="height: 100%; overflow: hidden !important;">
|
|
|
|
|
|
|
|
|
|
<nav data-role="ribbonmenu" class="mt-1">
|
|
|
|
|
<ul class="tabs-holder">
|
|
|
|
|
<li><a href="#section-one" onclick="connectionPanel();">Connection</a></li>
|
2018-06-25 20:13:58 +00:00
|
|
|
<li id="grblSettings" style="display: none;"><a href="#section-grbl" onclick="grblPanel();">Grbl Settings</a></li>
|
2018-06-22 19:49:51 +00:00
|
|
|
<li><a href="#section-two" onclick="manualcontrolPanel();">Control</a></li>
|
2018-06-21 20:02:40 +00:00
|
|
|
</ul>
|
|
|
|
|
<div class="content-holder">
|
|
|
|
|
<div class="section" id="section-one">
|
|
|
|
|
<div class="group">
|
|
|
|
|
<div class="form-group" style="width: calc(100vw - 200px);">
|
|
|
|
|
<form class="inline-form">
|
2018-06-25 17:25:19 +00:00
|
|
|
<select data-prepend=" <i class='fab fa-usb'></i>" class="success" data-role="select" id="portUSB" disabled>
|
2018-06-21 20:02:40 +00:00
|
|
|
<option value="">Waiting for USB</option>
|
|
|
|
|
</select>
|
2018-06-22 19:49:51 +00:00
|
|
|
<button class="button success" onclick="selectPort()" id="connectBtn" type="button" disabled>Connect</button>
|
2018-06-21 20:02:40 +00:00
|
|
|
<button class="button alert" style="display:none;" onclick="closePort()" id="disconnectBtn" type="button">Disconnect</button>
|
|
|
|
|
</form>
|
|
|
|
|
<center><small class="text-muted">Establish connection to the machine</small></center>
|
|
|
|
|
</div>
|
|
|
|
|
<span class="title">Machine Interface</span>
|
|
|
|
|
</div>
|
2018-06-25 20:13:58 +00:00
|
|
|
<div class="group" style="width: 190px;">
|
2018-06-21 20:02:40 +00:00
|
|
|
<div id="grblButtons" style="display: none;">
|
|
|
|
|
<div class="ribbon-group">
|
|
|
|
|
<button class="ribbon-icon-button" onclick="sendGcode(String.fromCharCode(0x18))">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="mif-loop"></span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Reset</span>
|
2018-06-20 13:00:05 +00:00
|
|
|
</button>
|
2018-06-25 20:13:58 +00:00
|
|
|
<!-- <button class="ribbon-icon-button" onclick="sendGcode('$X')">
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="icon">
|
|
|
|
|
<span class="mif-unlock"></span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Unlock</span>
|
2018-06-25 20:13:58 +00:00
|
|
|
</button> -->
|
|
|
|
|
<button class="ribbon-icon-button" onclick="sendGcode('$$')">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="mif-cogs"></span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Settings</span>
|
2018-06-22 19:49:51 +00:00
|
|
|
</button>
|
2018-06-20 13:00:05 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-21 20:02:40 +00:00
|
|
|
<span class="title" id="firmwarename"></span>
|
|
|
|
|
</div>
|
2018-06-25 20:13:58 +00:00
|
|
|
<div class="group" style="width: 100px;">
|
|
|
|
|
<button class="ribbon-button" onclick="socket.emit('clearAlarm', 2)">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers" data-toggle="tooltip" data-placement="bottom" title="Flashes red when machine has entered ALARM state, click Clear Alarm button">
|
|
|
|
|
<i id="navbellBtn1" class="fas fa-bell fg-red" style="display: none;"></i>
|
|
|
|
|
<i class="far fa-bell"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Unlock<br>Alarm</span>
|
|
|
|
|
</button>
|
|
|
|
|
<button class="ribbon-button" onclick="socket.emit('stop', true);">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-circle fg-red" data-fa-transform="grow-8"></i>
|
|
|
|
|
<i class="fa-inverse far fa-hand-paper" data-fa-transform="grow-1 left-0.5"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Stop<br>Job</span>
|
|
|
|
|
</button>
|
|
|
|
|
<span class="title">E-Stop</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="section" id="section-grbl">
|
|
|
|
|
<div class="group" style="width: calc(100vw - 40px);">
|
|
|
|
|
<button class="ribbon-button" onclick="grblSaveSettings();">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<i class="fas fa-save fg-grayBlue" data-fa-transform="grow-8"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Save<br> to Firmware</span>
|
|
|
|
|
</button>
|
2018-06-25 20:42:17 +00:00
|
|
|
<button class="ribbon-button" onclick="refreshGrblSettings();">
|
2018-06-25 20:13:58 +00:00
|
|
|
<span class="icon">
|
|
|
|
|
<i class="fas fa-sync-alt"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Refresh<br>from Firmware</span>
|
|
|
|
|
</button>
|
|
|
|
|
<span class="title">Grbl Settings</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="group" style="width: 100px;">
|
|
|
|
|
<button class="ribbon-button" onclick="socket.emit('clearAlarm', 2)">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers" data-toggle="tooltip" data-placement="bottom" title="Flashes red when machine has entered ALARM state, click Clear Alarm button">
|
|
|
|
|
<i id="navbellBtn3" class="fas fa-bell fg-red" style="display: none;"></i>
|
|
|
|
|
<i class="far fa-bell"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Unlock<br>Alarm</span>
|
|
|
|
|
</button>
|
2018-06-21 20:02:40 +00:00
|
|
|
<button class="ribbon-button" onclick="socket.emit('stop', true)">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-circle fg-red" data-fa-transform="grow-8"></i>
|
|
|
|
|
<i class="fa-inverse far fa-hand-paper" data-fa-transform="grow-1 left-0.5"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="caption">Stop<br>Job</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</button>
|
|
|
|
|
<span class="title">E-Stop</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="section" id="section-two">
|
2018-06-25 20:13:58 +00:00
|
|
|
<div class="group" style="width: calc(100vw - 90px);">
|
2018-06-21 21:04:41 +00:00
|
|
|
<label href="#" class="ribbon-button btn-file m-2" title="Open a GCODE file">
|
2018-06-21 20:02:40 +00:00
|
|
|
<span class="icon">
|
2018-06-21 21:04:41 +00:00
|
|
|
<i class="far fa-folder-open fg-amber"></i>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
2018-06-24 14:14:28 +00:00
|
|
|
<input id="file" type="file" accept=".gcode, .gc, .tap, .nc, .cnc" />
|
2018-06-21 21:04:41 +00:00
|
|
|
<span class="caption">Open<br>GCODE</span>
|
|
|
|
|
</label>
|
2018-06-22 19:49:51 +00:00
|
|
|
<button id="runBtn" class="ribbon-button grblmode" onclick="if (laststatus.comms.connectionStatus == 4) {socket.emit('resume', true)} else if (laststatus.comms.connectionStatus == 3) {socket.emit('pause', true)} else { socket.emit('runJob', editor.getValue())};">
|
|
|
|
|
<span class="icon" id="playpauseresumeicon">
|
|
|
|
|
<i class="fas fa-play"></i>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span id="playpauseresumelabel" class="caption">Run<br>Job</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</button>
|
2018-06-22 19:49:51 +00:00
|
|
|
<div>
|
|
|
|
|
<button class="ribbon-button dropdown-toggle grblmode">
|
|
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-bookmark" data-fa-transform="rotate-180"></i>
|
|
|
|
|
<i class="fas fa-screwdriver" data-fa-transform="rotate-135 down-3"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="caption">Tool<br>Options</span>
|
|
|
|
|
</button>
|
|
|
|
|
<ul class="ribbon-dropdown grblmode" data-role="dropdown" data-duration="100">
|
|
|
|
|
<!-- <li class="checked"><a href="#">Modification</a></li>
|
|
|
|
|
<li class="checked"><a href="#">Type</a></li>
|
|
|
|
|
<li class="checked"><a href="#">Size</a></li>
|
|
|
|
|
<li class="checked-one"><a href="#">Tags</a></li>
|
|
|
|
|
<li class="divider"></li> -->
|
|
|
|
|
<li><a class="grblmode" href="#" onclick="sendGcode('M3 S1000')">Tool On (M3 S1000)</a></li>
|
|
|
|
|
<li><a class="grblmode" href="#" onclick="sendGcode('M5')">Tool Off (M5)</a></li>
|
|
|
|
|
<li><a class="grblmode" href="#" onclick="sendGcode('M8 S1000')">Coolant On (M8)</a></li>
|
|
|
|
|
<li><a class="grblmode" href="#" onclick="sendGcode('M9 S1000')">Coolant Off (M9)</a></li>
|
|
|
|
|
<!-- <li class="divider"></li>
|
|
|
|
|
<li><a href="#">Grbl Settings...</a></li> -->
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
2018-06-20 13:00:05 +00:00
|
|
|
|
2018-06-22 19:49:51 +00:00
|
|
|
<button class="ribbon-button grblmode" onclick="sendGcode('$H')">
|
2018-06-21 20:02:40 +00:00
|
|
|
<span class="icon">
|
2018-06-22 19:49:51 +00:00
|
|
|
<i class="fas fa-home"></i>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="caption grblmode">Home<br>All</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</button>
|
2018-06-25 20:13:58 +00:00
|
|
|
<span class="title">Control</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="group" style="width: 100px;">
|
2018-06-21 21:04:41 +00:00
|
|
|
<button class="ribbon-button" onclick="socket.emit('clearAlarm', 2)">
|
2018-06-21 20:02:40 +00:00
|
|
|
<span class="icon">
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="fa-layers" data-toggle="tooltip" data-placement="bottom" title="Flashes red when machine has entered ALARM state, click Clear Alarm button">
|
2018-06-25 20:13:58 +00:00
|
|
|
<i id="navbellBtn2" class="fas fa-bell fg-red" style="display: none;"></i>
|
2018-06-22 19:49:51 +00:00
|
|
|
<i class="far fa-bell"></i>
|
2018-06-21 21:04:41 +00:00
|
|
|
</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
2018-06-25 20:13:58 +00:00
|
|
|
<span class="caption">Unlock<br>Alarm</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</button>
|
2018-06-21 21:04:41 +00:00
|
|
|
<button class="ribbon-button" onclick="socket.emit('stop', true)">
|
2018-06-21 20:02:40 +00:00
|
|
|
<span class="icon">
|
|
|
|
|
<span class="fa-layers fa-fw">
|
2018-06-21 21:04:41 +00:00
|
|
|
<i class="fas fa-circle fg-red" data-fa-transform="grow-8"></i>
|
|
|
|
|
<i class="fa-inverse far fa-hand-paper" data-fa-transform="grow-1 left-0.5"></i>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
|
|
|
|
</span>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="caption">Stop<br>Job</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</button>
|
|
|
|
|
<span class="title">E-Stop</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nav>
|
2018-06-20 13:00:05 +00:00
|
|
|
|
|
|
|
|
|
2018-06-21 20:02:40 +00:00
|
|
|
<div id="connectionPanel">
|
|
|
|
|
<div id="console"></div>
|
|
|
|
|
<div class="fixed-bottom m-3 mb-8">
|
|
|
|
|
<form class="inline-form" style="width: 100%;">
|
|
|
|
|
<input data-prepend=" <i class='fas fa-terminal'></i>" data-role="input" data-clear-button="false" data-role="input" id="command" type="text" autocomplete="on" class="needs-connection" style="width: calc(100vw - 170px);" />
|
|
|
|
|
<button id="sendCommand" class="button dark needs-connection" type="button" data-role="hint" data-hint-position="top" data-hint-text="Execute Command" data-cls-hint="bg-light fg-dark drop-shadow">
|
|
|
|
|
<i class="fa fa-play" style="margin-right: 10px;"></i> Send
|
|
|
|
|
</button>
|
|
|
|
|
<button class="button dark emptylog" type="button" onclick="$('#console').empty();" data-role="hint" data-hint-position="top" data-hint-text="Empty console log" data-cls-hint="bg-light fg-dark drop-shadow">
|
|
|
|
|
<i class="fa fa-trash"></i>
|
|
|
|
|
</button>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="manualControlPanel" style="display: none;">
|
|
|
|
|
<center>
|
2018-06-22 19:49:51 +00:00
|
|
|
<div id="jogcontrols">
|
2018-06-25 17:25:19 +00:00
|
|
|
<div class="row flex-justify-center flex-align-center" style="width: 100%;">
|
|
|
|
|
<div class="cell">
|
|
|
|
|
<table>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<div class="glossydro">
|
|
|
|
|
<div class="float-left fg-red">X</div>
|
|
|
|
|
<div class="float-right fg-red" id="xPos" data-editable>0.000</div>
|
|
|
|
|
<input id="xPosInput" class="m-0 p-0 glossydroInput float-right fg-red" />
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<div class="glossydro">
|
|
|
|
|
<div class="float-left fg-green">Y</div>
|
|
|
|
|
<div class="float-right fg-green" id="yPos" data-editable>0.000</div>
|
|
|
|
|
<input id="yPosInput" class="m-0 p-0 glossydroInput float-right fg-green" />
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<div class="glossydro">
|
|
|
|
|
<div class="float-left fg-blue">Z</div>
|
|
|
|
|
<div class="float-right fg-blue" id="zPos" data-editable>0.000</div>
|
|
|
|
|
<input id="zPosInput" class="m-0 p-0 glossydroInput float-right fg-blue" />
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 34px; width: 140px; line-height: 30px;" id="setZero" onclick="sendGcode( 'G10 P1 L20 X0 Y0 Z0')">
|
|
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-crosshairs fg-amber" data-fa-transform="left-40"></i>
|
|
|
|
|
<span class="fa-layers-text fg-amber" data-fa-transform="down-1 right-10" style="font-weight:900; font-family: Arial; font-size: 12px;">SETZERO</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 36px; width: 140px; line-height: 30px;" id="gotozero">
|
|
|
|
|
<span class=" fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-chart-line fg-amber" data-fa-transform="left-45"></i>
|
|
|
|
|
<span class="fa-layers-text fg-amber" data-fa-transform="down-1 right-15" style="font-weight:900; font-family: Arial; font-size: 12px;">GOTOZERO</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell">
|
|
|
|
|
<table>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
</td>
|
2018-06-21 20:02:40 +00:00
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="yP">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-up fg-green" data-fa-transform="grow-4 down-8.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-green" data-fa-transform="up-14" style="font-weight:900">Y+</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
2018-06-21 20:02:40 +00:00
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
<td>
|
|
|
|
|
</td>
|
2018-06-21 20:02:40 +00:00
|
|
|
|
|
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="zP">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-up fg-blue" data-fa-transform="grow-2 down-8.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-blue" data-fa-transform="up-14" style="font-weight:900">Z+</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="xM">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-left fg-red" data-fa-transform="grow-2 up-10.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-red" data-fa-transform="down-10" style="font-weight:900">X-</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
2018-06-21 20:02:40 +00:00
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="yM">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-down fg-green" data-fa-transform="grow-2 up-10.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-green" data-fa-transform="down-10" style="font-weight:900">Y-</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
2018-06-21 20:02:40 +00:00
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="xP">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-right fg-red" data-fa-transform="grow-2 up-10.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-red" data-fa-transform="down-10" style="font-weight:900">X+</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" id="zM">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class="fa-layers fa-fw">
|
|
|
|
|
<i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-2 up-10.5"></i>
|
|
|
|
|
<span class="fa-layers-text fg-blue" data-fa-transform="down-10" style="font-weight:900">Z-</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 34px; line-height: 30px;" id="dist01">
|
2018-06-24 14:14:28 +00:00
|
|
|
<span class=" fa-layers fa-fw">
|
|
|
|
|
<span id="dist01label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-family: Arial; font-size: 12px;">0.1mm</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
2018-06-25 17:25:19 +00:00
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 34px; line-height: 30px;" id="dist1">
|
|
|
|
|
<span class=" fa-layers fa-fw">
|
|
|
|
|
<span id="dist1label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-family: Arial; font-size: 12px;">1mm</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 34px; line-height: 30px;" id="dist10">
|
|
|
|
|
<span class=" fa-layers fa-fw">
|
|
|
|
|
<span id="dist10label" class="fa-layers-text fg-dark jogdist" data-fa-transform="down-1" style="font-family: Arial; font-size: 12px;">10mm</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<a href="#" class="glossybtn grblmode" style="height: 34px; line-height: 30px;" id="dist100">
|
|
|
|
|
<span class=" fa-layers fa-fw">
|
|
|
|
|
<span id="dist100label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-family: Arial; font-size: 12px;">100mm</span>
|
|
|
|
|
</span>
|
|
|
|
|
</a>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td colspan="4">
|
|
|
|
|
<div style="margin: 2px;">
|
|
|
|
|
<input id="jograte" type="number" min="100" max="10000" step="500" placeholder="1000" data-role="input" data-prepend="Feedrate:" data-clear-button="false" value="1000" style="text-align: right;" />
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell" id="frocell">
|
2018-06-25 20:13:58 +00:00
|
|
|
<input id="fro" data-on-stop="feedOverride(arguments[0])" data-role="slider" data-vertical="true" data-size="160" data-accuracy="10" data-min="-50" data-max="200" data-value="100" data-hint="true" data-hint-always="true" data-hint-position="bottom" data-hint-mask="Feed: $1%"
|
2018-06-25 17:25:19 +00:00
|
|
|
data-cls-hint="bg-light
|
|
|
|
|
fg-dark shadow-1" data-cls-complete="bg-grayBlue">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell" id="trocell">
|
2018-06-25 20:13:58 +00:00
|
|
|
<input id="tro" data-on-stop="spindleOverride(arguments[0])" data-role="slider" data-vertical="true" data-size="160" data-accuracy="10" data-min="-50" data-max="200" data-value="100" data-hint="true" data-hint-always="true" data-hint-position="bottom"
|
2018-06-25 17:25:19 +00:00
|
|
|
data-hint-mask="Tool: $1%" data-cls-hint="bg-light
|
|
|
|
|
fg-dark shadow-1" data-cls-complete="bg-grayBlue">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
</div>
|
|
|
|
|
<div id="editor"></div>
|
2018-06-21 20:02:40 +00:00
|
|
|
</center>
|
2018-06-21 21:04:41 +00:00
|
|
|
</div>
|
2018-06-25 20:13:58 +00:00
|
|
|
<div id="grblPanel">
|
|
|
|
|
<div id="grblconfig"></div>
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
|
2018-06-21 20:02:40 +00:00
|
|
|
<!-- Bottom StatusBar -->
|
2018-06-22 19:49:51 +00:00
|
|
|
<div class="fixed-bottom">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="cell-3">
|
2018-06-21 20:02:40 +00:00
|
|
|
<div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="badge inline bg-gray fg-white" style="width: 100%;">
|
|
|
|
|
<span class="fa-layers" data-toggle="tooltip" data-placement="bottom" title="Flashes red when machine has entered ALARM state, click Clear Alarm button">
|
2018-06-21 21:04:41 +00:00
|
|
|
<i id="navbell" class="fas fa-bell fg-red" style="display: none;"></i>
|
2018-06-22 19:49:51 +00:00
|
|
|
<i class="far fa-bell"></i>
|
2018-06-21 20:02:40 +00:00
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<div class="cell-3">
|
2018-06-21 20:02:40 +00:00
|
|
|
<div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="badge inline bg-gray fg-white" id="connectStatus" style="width: 100%;">Not Connected</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<div class="cell-3">
|
2018-06-21 20:02:40 +00:00
|
|
|
<div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="badge inline bg-gray fg-white" id="runStatus" style="width: 100%;">Not Connected</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<div class="cell-3">
|
2018-06-21 20:02:40 +00:00
|
|
|
<div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<span class="badge inline bg-gray fg-white" id="gcodesent" style="width: 100%;">Queue: 0</span>
|
2018-06-21 20:02:40 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-19 08:07:03 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2018-06-21 20:02:40 +00:00
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<!-- <div style="display: none;" id="grblconfig"></div>
|
|
|
|
|
<div id="grbl-placeholder">
|
2018-06-21 20:02:40 +00:00
|
|
|
You need to connect to a compatible controller first!
|
|
|
|
|
</div>
|
2018-06-22 19:49:51 +00:00
|
|
|
<button type="button" id="grblSaveBtn" onclick="grblSaveSettings();" disabled>Save</button> -->
|
2018-06-21 20:02:40 +00:00
|
|
|
</body>
|
2018-06-19 08:07:03 +00:00
|
|
|
|
2018-06-22 19:49:51 +00:00
|
|
|
<script type="text/javascript" src="lib/fontawesome5/svg-with-js/js/fontawesome-all.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="lib/jquery/jquery.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="lib/ace/src-noconflict/ace.js"></script>
|
2018-06-25 17:25:19 +00:00
|
|
|
<script type="text/javascript" src="lib/metro4/js/metro.min.js"></script>
|
2018-06-19 08:07:03 +00:00
|
|
|
|
2018-06-22 19:49:51 +00:00
|
|
|
<script type="text/javascript" src="/lib/lodash.core.js"></script>
|
|
|
|
|
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/main.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/websocket.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/grblsettings.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/metroactions.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/jog.js"></script>
|
2018-06-20 13:00:05 +00:00
|
|
|
|
2018-06-25 17:25:19 +00:00
|
|
|
|
2018-06-21 20:02:40 +00:00
|
|
|
</html>
|
