2018-06-19 08:07:03 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
2018-06-19 20:25:40 +00:00
< title > OpenBuilds Machine Driver< / title >
2018-06-19 08:07:03 +00:00
< meta charset = "utf-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" >
2018-06-19 20:25:40 +00:00
< meta name = "author" content = "" >
2018-06-19 08:07:03 +00:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2018-06-20 13:00:05 +00:00
< meta name = "metro4:init" content = "true" >
2018-06-19 20:25:40 +00:00
< script type = "text/javascript" src = "lib/jquery/jquery.min.js" > < / script >
2018-06-20 13:00:05 +00:00
< link rel = "stylesheet" href = "lib/metro4/css/metro-all.css" / >
2018-06-19 20:25:40 +00:00
< link rel = "stylesheet" href = "css/main.css" / >
2018-06-19 08:07:03 +00:00
< / head >
< body >
2018-06-20 13:00:05 +00:00
< div class = "window" style = "height: 100vh;" >
< div class = "window-caption" style = "-webkit-app-region: drag;" >
< span class = "icon mif-cog" > < / span >
< span class = "title" > OpenBuids Machine Driver< / span >
< div class = "buttons" style = "-webkit-app-region: no-drag" >
< span data-role = "hint" data-hint-position = "bottom" data-hint-text = "Minimize to Tray" data-cls-hint = "bg-cyan fg-white drop-shadow" class = "btn-min" onclick = "socket.emit('minimise')" > < / span >
< span data-role = "hint" data-hint-position = "bottom" data-hint-text = "Quit" data-cls-hint = "bg-cyan fg-white drop-shadow" class = "btn-close" onclick = "confirmQuit()" > < / span >
< / div >
2018-06-19 20:25:40 +00:00
< / div >
2018-06-20 13:00:05 +00:00
< div class = "window-content p-2" style = "height: 100%" >
2018-06-19 08:07:03 +00:00
2018-06-20 13:00:05 +00:00
< nav data-role = "ribbonmenu" >
< ul class = "tabs-holder" >
< li > < a href = "#section-one" onclick = "connectionPanel();" > Connection< / a > < / li >
< li > < a href = "#section-two" onclick = "manualcontrolPanel();" > Manual Control< / a > < / li >
< li > < a href = "#section-three" onclick = "jobcontrolPanel();" > Job Setup< / a > < / li >
< / ul >
< div class = "content-holder" >
< div class = "section" id = "section-one" >
< div class = "group" >
< div class = "form-group" style = "width: calc(100vw - 90px);" >
< form class = "inline-form" >
< select data-prepend = " <i class='fab fa-usb'></i>" class = "success" data-role = "select" id = "portUSB" > `
< option value = "" > Waiting for USB< / option >
< / select >
< button class = "button success" onclick = "selectPort()" id = "connectBtn" type = "button" > Connect< / button >
< 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 >
< div class = "group" style = "width: 90px;" >
< button class = "ribbon-button" >
< 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 = "shrink-1" > < / i >
< / span >
< / span >
< span class = "caption" > Abort!< / span >
< / button >
< span class = "title" > E-Stop< / span >
< / div >
< / div >
< div class = "section" id = "section-two" >
< div class = "group" >
< div class = "form-group" style = "width: calc(100vw - 90px);" >
< / div >
< span class = "title" > Manual< / span >
< / div >
< div class = "group" style = "width: 90px;" >
< button class = "ribbon-button" >
< 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 = "shrink-1" > < / i >
< / span >
< / span >
< span class = "caption" > Abort!< / span >
< / button >
< span class = "title" > E-Stop< / span >
< / div >
< / div >
< div class = "section" id = "section-three" >
< div class = "group" >
< div class = "form-group" style = "width: calc(100vw - 90px);" >
< / div >
< span class = "title" > Job Control< / span >
< / div >
< div class = "group" style = "width: 90px;" >
< button class = "ribbon-button" >
< 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 = "shrink-1" > < / i >
< / span >
< / span >
< span class = "caption" > Abort!< / span >
< / button >
< span class = "title" > E-Stop< / span >
< / div >
< / div >
< / div >
< / nav >
< div id = "connectionPanel" >
< div id = "console" > < / div >
< div class = "fixed-bottom m-3 mb-8" >
< form class = "inline-form" >
< input data-role = "input" data-clear-button = "false" data-role = "input" id = "command" type = "text" autocomplete = "on" class = "needs-connection" / >
< button id = "sendCommand" class = "button dark needs-connection" type = "button" >
< i class = "fa fa-play" style = "margin-right: 10px;" > < / i > Send
2018-06-19 20:25:40 +00:00
< / button >
2018-06-20 13:00:05 +00:00
< button class = "button dark emptylog" type = "button" onclick = "$('#console').empty();" >
< i class = "fa fa-trash" > < / i >
2018-06-19 20:25:40 +00:00
< / button >
2018-06-20 13:00:05 +00:00
< / form >
2018-06-19 08:07:03 +00:00
< / div >
< / div >
2018-06-20 13:00:05 +00:00
<!-- Bottom StatusBar -->
< div class = "fixed-bottom ml-5" >
< form class = "inline-form" >
< span class = "badge inline bg-gray fg-white" >
< span class = "fa-layers" data-toggle = "tooltip" data-placement = "bottom" title = "Flashes red when machine has entered ALARM state, click Clear Alarm button" >
< i class = "far fa-bell" > < / i >
< i id = "navbell" class = "fas fa-bell text-danger" > < / i >
< / span >
< / span >
< span class = "badge inline bg-gray fg-white" id = "connectStatus" > Not Connected< / span >
< span class = "badge inline bg-gray fg-white" id = "runStatus" > Not Connected< / span >
< / form >
< / div >
<!-- <div style="display: none;" id="grblconfig"></div>
< div id = "grbl-placeholder" >
You need to connect to a compatible controller first!
2018-06-19 08:07:03 +00:00
< / div >
2018-06-20 13:00:05 +00:00
< button type = "button" id = "grblSaveBtn" onclick = "grblSaveSettings();" disabled > Save< / button > -->
2018-06-19 08:07:03 +00:00
< / div >
< / div >
2018-06-20 13:00:05 +00:00
2018-06-19 08:07:03 +00:00
< / body >
2018-06-19 20:25:40 +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 >
2018-06-20 13:00:05 +00:00
< script type = "text/javascript" src = "lib/metro4/js/metro.min.js" > < / script >
2018-06-19 20:25:40 +00:00
< script type = "text/javascript" src = "/lib/lodash.core.js" > < / script >
2018-06-19 08:07:03 +00:00
< script type = "text/javascript" src = "/socket.io/socket.io.js" > < / script >
2018-06-19 20:25:40 +00:00
< script type = "text/javascript" src = "js/websocket.js" > < / script >
2018-06-20 13:00:05 +00:00
< script type = "text/javascript" src = "js/grblsettings.js" > < / script >
< script type = "text/javascript" src = "js/metroactions.js" > < / script >
2018-06-19 08:07:03 +00:00
< / html >
