mirror
/
OpenBuilds-CONTROL
kopia lustrzana https://github.com/OpenBuilds/OpenBuilds-CONTROL
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Minor enhancements to Jog CSS and Fix for Alarm state on startup

pull/110/head
openbuilds-engineer 2018-06-24 16:14:28 +02:00
rodzic 6491fb52ff
commit 046664e746
7 zmienionych plików z 125 dodań i 165 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

95
app/css/buttons.css
Wyświetl plik

@ -1,105 +1,44 @@
.glossydro {
display: block;
text-decoration: none;
background-color: #f7f7f7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
background-color: #f5f6f7;
color: #a7a7a7;
margin: 5px;
width: 150px;
height: 42px;
margin: 2px;
width: 140px;
height: 32px;
position: relative;
text-align: right;
padding-right: 6px;
padding-left: 6px;
line-height: 40px;
border-radius: 6px;
box-shadow: 1px 1px 2px #aaa, inset 0px 2px 3px #fff;
border: solid 1px transparent;
line-height: 30px;
border-radius: 2px;
border: 1px solid #ddd;
font-weight:900;
font-size: 18px;
cursor: default;
}
.glossybtn:link, .glossybtn:visited {
display: block;
text-decoration: none;
background-color: #f7f7f7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
background-color: #f5f6f7;
color: #a7a7a7;
margin: 5px;
width: 60px;
height: 60px;
margin: 2px;
width: 50px;
height: 50px;
position: relative;
text-align: center;
line-height: 50px;
border-radius: 6px;
box-shadow: 1px 1px 4px #aaa, inset 0px 2px 3px #fff;
border: solid 1px transparent;
border-radius: 2px;
border: 1px solid #f5f6f7;
}
.glossybtn:active {
box-shadow: none;
background-color: #f2f2f2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
background-image: -webkit-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -moz-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -ms-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -o-linear-gradient(top, #f2f2f2, #c1c1c1);
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #ccc;
background: #d5d6d7;
}
.glossybtn:hover {
text-decoration: none;
color: #555;
background: #f5f5f5;
background: rgba(164,206,249, 0.2);
border: 1px solid rgb(164,206,249);
}​
/* .glossybtnsm:link, .glossybtnsm:visited {
display: block;
text-decoration: none;
background-color: #f7f7f7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
color: #a7a7a7;
margin: 5px;
width: 60px;
height: 60px;
position: relative;
text-align: center;
line-height: 50px;
border-radius: 10%;
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
border: solid 1px transparent;
}
.glossybtnsm:active {
box-shadow: none;
background-color: #f2f2f2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
background-image: -webkit-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -moz-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -ms-linear-gradient(top, #f2f2f2, #c1c1c1);
background-image: -o-linear-gradient(top, #f2f2f2, #c1c1c1);
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #ccc;
}
.glossybtnsm:hover {
text-decoration: none;
color: #555;
background: #f5f5f5;
}​ */

4
app/css/main.css
Wyświetl plik

@ -11,8 +11,8 @@ body {
}
#editor {
min-height: calc(100vh - 400px) !important;
height: calc(100vh - 400px);
min-height: calc(100vh - 385px);
height: calc(100vh - 385px);
width: 100%;
border-top: 1px solid #ccc;
}

136
app/index.html
Wyświetl plik

@ -86,7 +86,7 @@
<span class="icon">
<i class="far fa-folder-open fg-amber"></i>
</span>
<input id="file" type="file" accept=".gcode, .gc, .tap, .nc" />
<input id="file" type="file" accept=".gcode, .gc, .tap, .nc, .cnc" />
<span class="caption">Open<br>GCODE</span>
</label>
<button class="ribbon-button grblmode" onclick="sendGcode('G10 P1 L20 X0 Y0 Z0')">
@ -213,11 +213,11 @@
<td>
<a href="#" class="glossybtn grblmode" id="yP">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-up fg-green" data-fa-transform="grow-4 down-18.5"></i>
<span class="fa-layers-text fg-green" data-fa-transform="up-14" style="font-weight:900">Y+</span>
</span>
</a>
<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>
</td>
<td>
@ -228,39 +228,39 @@
<td>
<a href="#" class="glossybtn grblmode" id="zP">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-up fg-blue" data-fa-transform="grow-4 down-18.5"></i>
<span class="fa-layers-text fg-blue" data-fa-transform="up-14" style="font-weight:900">Z+</span>
</span>
</a>
<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>
</td>
</tr>
<tr>
<td>
<a href="#" class="glossybtn grblmode" id="xM">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-left fg-red" data-fa-transform="grow-4 up-10.5"></i>
<span class="fa-layers-text fg-red" data-fa-transform="down-22" style="font-weight:900">X-</span>
</span>
</a>
<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>
</td>
<td>
<a href="#" class="glossybtn grblmode" id="yM">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-down fg-green" data-fa-transform="grow-4 up-10.5"></i>
<span class="fa-layers-text fg-green" data-fa-transform="down-22" style="font-weight:900">Y-</span>
</span>
</a>
<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>
</td>
<td>
<a href="#" class="glossybtn grblmode" id="xP">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-right fg-red" data-fa-transform="grow-4 up-10.5"></i>
<span class="fa-layers-text fg-red" data-fa-transform="down-22" style="font-weight:900">X+</span>
</span>
</a>
<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>
</td>
<td>
@ -268,63 +268,59 @@
<td>
<a href="#" class="glossybtn grblmode" id="zM">
<span class="fa-layers fa-fw">
<i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-10.5"></i>
<span class="fa-layers-text fg-blue" data-fa-transform="down-22" style="font-weight:900">Z-</span>
</span>
</a>
<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>
</td>
</tr>
<tr>
<td>
<a href="#" class="glossybtn grblmode" style="height: 30px; width: 150px; line-height: 25px;" id="gotozero">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span class="fa-layers-text fg-amber" data-fa-transform="down-1" style="font-weight:900">GOTOZERO</span>
</span>
</a>
<a href="#" class="glossybtn grblmode" style="height: 30px; width: 140px; line-height: 27px;" id="gotozero">
<span class=" fa-layers fa-fw">
<span class="fa-layers-text fg-amber" data-fa-transform="down-1" style="font-weight:900; font-family: Arial; font-size: 12px;">GOTOZERO</span>
</span>
</a>
</td>
<td>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 25px;" id="dist01">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span id="dist01label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-weight:900">0.1mm</span>
</span>
</a>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 27px;" id="dist01">
<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>
</td>
<td>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 25px;" id="dist1">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span id="dist1label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-weight:900">1mm</span>
</span>
</a>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 27px;" 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: 30px; line-height: 25px;" id="dist10">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span id="dist10label" class="fa-layers-text fg-dark jogdist" data-fa-transform="down-1" style="font-weight:900">10mm</span>
</span>
</a>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 27px;" 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: 30px; line-height: 25px;" id="dist100">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span id="dist100label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-weight:900">100mm</span>
</span>
</a>
</td>
<td>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 25px;" id="dist500">
<span class=" fa-layers fa-fw">
<!-- <i class="fas fa-arrow-down fg-blue" data-fa-transform="grow-4 up-5.5"></i> -->
<span id="dist500label" class="fa-layers-text fg-gray jogdist" data-fa-transform="down-1" style="font-weight:900">500mm</span>
</span>
</a>
</td>
</td>
<td>
<a href="#" class="glossybtn grblmode" style="height: 30px; line-height: 27px;" 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>
</td>
<td colspan="5">
<input data-role="slider" data-accuracy="5" data-hint-always="true" data-hint-position="right" data-hint-mask="Feed: $1%">
</td>
</tr>
</table>
</div>

34
app/js/websocket.js
Wyświetl plik

@ -165,6 +165,7 @@ function initSocket() {
$('#portUSB').parent(".select").addClass('success')
$('#portUSB').parent(".select").removeClass('alert')
showGrbl(false)
bellstate = false
} else if (status.comms.connectionStatus == 1 || status.comms.connectionStatus == 2) { // Connected, but not Playing yet
$("#portUSB").val(status.comms.interfaces.activePort);
$('#connectStatus').html("Port: Connected");
@ -187,6 +188,7 @@ function initSocket() {
$('#portUSB').parent(".select").addClass('disabled')
$('#portUSB').parent(".select").removeClass('success')
$('#portUSB').parent(".select").addClass('alert')
bellstate = false
} else if (status.comms.connectionStatus == 3) { // Busy Streaming GCODE
$("#portUSB").val(status.comms.interfaces.activePort);
$('#connectStatus').html("Port: Connected");
@ -204,6 +206,7 @@ function initSocket() {
$('#portUSB').parent(".select").addClass('disabled')
$('#portUSB').parent(".select").removeClass('success')
$('#portUSB').parent(".select").addClass('alert')
bellstate = false
} else if (status.comms.connectionStatus == 4) { // Paused
$("#portUSB").val(status.comms.interfaces.activePort);
$('#connectStatus').html("Port: Connected");
@ -221,6 +224,7 @@ function initSocket() {
$('#portUSB').parent(".select").addClass('disabled')
$('#portUSB').parent(".select").removeClass('success')
$('#portUSB').parent(".select").addClass('alert')
bellstate = false
} else if (status.comms.connectionStatus == 5) { // Alarm State
$("#portUSB").val(status.comms.interfaces.activePort);
$('#connectStatus').html("Port: Connected");
@ -322,22 +326,24 @@ function initSocket() {
var bellflash = setInterval(function() {
if (!nostatusyet) {
if (laststatus.comms.connectionStatus == 5) {
if (bellstate == false) {
// $('#navbell').addClass("text-dark");
// $('#navbell').removeClass("text-danger");
$('#navbell').hide();
$('#navbellBtn').hide();
bellstate = true
if (laststatus) {
if (laststatus.comms.connectionStatus == 5) {
if (bellstate == false) {
// $('#navbell').addClass("text-dark");
// $('#navbell').removeClass("text-danger");
$('#navbell').hide();
$('#navbellBtn').hide();
bellstate = true
} else {
// $('#navbell').removeClass("text-dark");
// $('#navbell').addClass("text-danger");
$('#navbell').show();
$('#navbellBtn').show();
bellstate = false
}
} else {
// $('#navbell').removeClass("text-dark");
// $('#navbell').addClass("text-danger");
$('#navbell').show();
$('#navbellBtn').show();
bellstate = false
$('#navbell').hide();
}
} else {
$('#navbell').hide();
}
}
}, 200);

18
index.js
Wyświetl plik

@ -280,6 +280,7 @@ var PortCheckinterval = setInterval(function() {
app.use(express.static(path.join(__dirname, "app")));
app.on('certificate-error', function(event, webContents, url, error,
certificate, callback) {
event.preventDefault();
@ -1465,6 +1466,23 @@ function parseFeedback(data) {
// console.log(data)
var state = data.substring(1, data.search(/(,|\|)/));
status.comms.runStatus = state
if (state == "Alarm") {
console.log("ALARM: " + data)
status.comms.connectionStatus = 5;
isAlarmed = true;
switch (status.machine.firmware.type) {
case 'grbl':
grblBufferSize.shift();
var alarmCode = parseInt(data.split(':')[1]);
console.log('ALARM: ' + alarmCode + ' - ' + grblStrings.alarms(alarmCode));
status.comms.alarm = alarmCode + ' - ' + grblStrings.alarms(alarmCode)
break;
case 'smoothie':
status.comms.alarm = data;
break;
}
status.comms.connectionStatus = 5;
}
if (status.machine.firmware.type == "grbl") {
// Extract wPos (for Grbl > 1.1 only!)
var startWPos = data.search(/wpos:/i) + 5;

2
package.json
Wyświetl plik

@ -1,6 +1,6 @@
{
"name": "OpenBuildsMachineDriver",
"version": "0.0.2",
"version": "0.0.3",
"license": "AGPL-3.0",
"description": "Machine Interface Driver for OpenBuilds",
"author": "github.com/openbuilds",

1
todo 100644
Wyświetl plik

@ -0,0 +1 @@
Catch alarm when grbl is Locked on Init