536 lines
39 KiB
HTML
536 lines
39 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title data-bind="text: title">OctoPrint</title>
|
|
|
|
<link rel="shortcut icon" href="{{ url_for('static', filename='img/tentacle-32x32.png') }}">
|
|
<link rel="apple-touch-icon" sizes="114x114" href="{{ url_for('static', filename='img/apple-touch-icon-114x114.png') }}">
|
|
<link rel="apple-touch-icon" sizes="144x144" href="{{ url_for('static', filename='img/apple-touch-icon-144x144.png') }}">
|
|
|
|
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet" media="screen">
|
|
<link href="{{ url_for('static', filename='css/jquery.fileupload-ui.css') }}" rel="stylesheet" media="screen">
|
|
<link href="{{ url_for('static', filename='css/ui.css') }}" rel="stylesheet" media="screen">
|
|
<link href="{{ url_for('static', filename='gcodeviewer/css/cupertino/jquery-ui-1.9.0.custom.css') }}" rel="stylesheet" media="screen">
|
|
<link href="{{ url_for('static', filename='gcodeviewer/css/style.css') }}" rel="stylesheet" media="screen">
|
|
|
|
<script lang="javascript">
|
|
var AJAX_BASEURL = "/ajax/";
|
|
var CONFIG_FILESPERPAGE = 5;
|
|
var CONFIG_WEBCAM_STREAM = "{{ webcamStream }}";
|
|
|
|
var WEB_SOCKET_SWF_LOCATION = "{{ url_for('static', filename='js/WebSocketMain.swf') }}";
|
|
var WEB_SOCKET_DEBUG = true;
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="navbar" class="navbar navbar-fixed-top">
|
|
<div class="navbar-inner" data-bind="css: color">
|
|
<div class="container">
|
|
<a class="brand" href="#"><img src="{{ url_for('static', filename='img/tentacle-20x20.png') }}"> <span data-bind="text: brand">OctoPrint</span></a>
|
|
<div class="nav-collapse">
|
|
<ul class="nav pull-right">
|
|
<li><a id="navbar_show_settings" class="pull-right" href="#settings_dialog"><i class="icon-wrench"></i> Settings</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container octoprint-container">
|
|
<div class="row">
|
|
<div class="accordion span4">
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" href="#connection"><i class="icon-signal"></i> Connection</a>
|
|
</div>
|
|
<div class="accordion-body collapse in" id="connection">
|
|
<div class="accordion-inner">
|
|
<label for="connection_ports" data-bind="css: {disabled: !isErrorOrClosed}, enable: isErrorOrClosed">Serial Port</label>
|
|
<select id="connection_ports" data-bind="options: portOptions, optionsCaption: 'AUTO', value: selectedPort, css: {disabled: !isErrorOrClosed}, enable: isErrorOrClosed"></select>
|
|
<label for="connection_baudrates" data-bind="css: {disabled: !isErrorOrClosed}, enable: isErrorOrClosed">Baudrate</label>
|
|
<select id="connection_baudrates" data-bind="options: baudrateOptions, optionsCaption: 'AUTO', value: selectedBaudrate, css: {disabled: !isErrorOrClosed}, enable: isErrorOrClosed"></select>
|
|
<label class="checkbox">
|
|
<input type="checkbox" id="connection_save" data-bind="checked: saveSettings, css: {disabled: !isErrorOrClosed}, enable: isErrorOrClosed"> Save connection settings
|
|
</label>
|
|
<button class="btn btn-block" id="printer_connect" data-bind="click: connect, text: buttonText()">Connect</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" href="#state"><i class="icon-info-sign"></i> State</a>
|
|
</div>
|
|
<div class="accordion-body collapse in" id="state">
|
|
<div class="accordion-inner">
|
|
Machine State: <strong data-bind="text: stateString"></strong><br>
|
|
File: <strong data-bind="text: filename"></strong><br>
|
|
Filament: <strong data-bind="text: filament"></strong><br>
|
|
Estimated Print Time: <strong data-bind="text: estimatedPrintTime"></strong><br>
|
|
Line: <strong data-bind="text: lineString"></strong><br>
|
|
Height: <strong data-bind="text: currentHeight"></strong><br>
|
|
Print Time: <strong data-bind="text: printTime"></strong><br>
|
|
Print Time Left: <strong data-bind="text: printTimeLeft"></strong><br>
|
|
|
|
<div class="progress">
|
|
<div class="bar" id="job_progressBar" data-bind="style: { width: progress() + '%' }"></div>
|
|
</div>
|
|
|
|
<div class="row-fluid print-control">
|
|
<button class="btn btn-primary span4" data-bind="enable: isOperational() && isReady() && !isPrinting(), css: {'btn-danger': isPaused()}" id="job_print"><i class="icon-print icon-white"></i> <span data-bind="text: (isPaused() ? 'Restart' : 'Print')">Print</span></button>
|
|
<button class="btn span4" id="job_pause" data-bind="css: {active: isPaused}"><i class="icon-pause"></i> <span>Pause</span></button>
|
|
<button class="btn span4" id="job_cancel"><i class="icon-stop"></i> Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading" id="files-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" href="#files"><i class="icon-list"></i> Files</a>
|
|
|
|
<div class="settings-trigger btn-group">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<i class="icon-wrench"></i>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#" data-bind="click: function() { $root.changeSorting('name'); }"><i class="icon-ok" data-bind="style: {visibility: currentSorting() == 'name' ? 'visible' : 'hidden'}"></i> Sort by name (ascending)</a></li>
|
|
<li><a href="#" data-bind="click: function() { $root.changeSorting('upload'); }"><i class="icon-ok" data-bind="style: {visibility: currentSorting() == 'upload' ? 'visible' : 'hidden'}"></i> Sort by upload date (descending)</a></li>
|
|
<li class="divider"></li>
|
|
<li><a href="#" data-bind="click: function() { $root.toggleFilter('printed'); }"><i class="icon-ok" data-bind="style: {visibility: _.contains(currentFilters(), 'printed') ? 'visible' : 'hidden'}"></i> Hide successfully printed files</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-body collapse in overflow_visible" id="files">
|
|
<div class="accordion-inner">
|
|
<table class="table table-condensed table-hover" id="gcode_files">
|
|
<thead>
|
|
<tr>
|
|
<th class="gcode_files_name">Name</th>
|
|
<th class="gcode_files_size">Size</th>
|
|
<th class="gcode_files_action">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody data-bind="foreach: paginatedFiles">
|
|
<tr data-bind="css: $root.getSuccessClass($data), popover: { title: name, animation: true, html: true, placement: 'right', trigger: 'hover', delay: 0, content: $root.getPopoverContent($data), html: true }">
|
|
<td class="gcode_files_name" data-bind="text: name"></td>
|
|
<td class="gcode_files_size" data-bind="text: size"></td>
|
|
<td class="gcode_files_action"><a href="#" class="icon-trash" data-bind="click: function() { $root.removeFile($data.name); }"></a> | <a href="#" class="icon-folder-open" data-bind="click: function() { $root.loadFile($data.name); }"></a></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<div class="pagination pagination-mini pagination-centered">
|
|
<ul>
|
|
<li data-bind="css: {disabled: currentPage() === 0}"><a href="#" data-bind="click: prevPage">«</a></li>
|
|
</ul>
|
|
<ul data-bind="foreach: pages">
|
|
<li data-bind="css: { active: $data.number === $root.currentPage(), disabled: $data.number === -1 }"><a href="#" data-bind="text: $data.text, click: function() { $root.changePage($data.number); }"></a></li>
|
|
</ul>
|
|
<ul>
|
|
<li data-bind="css: {disabled: currentPage() === lastPage()}"><a href="#" data-bind="click: nextPage">»</a></li>
|
|
</ul>
|
|
</div>
|
|
<span class="btn btn-primary btn-block fileinput-button" style="margin-bottom: 10px">
|
|
<i class="icon-upload icon-white"></i>
|
|
<span>Upload</span>
|
|
<input id="gcode_upload" type="file" name="gcode_file" class="fileinput-button" data-url="/ajax/gcodefiles/upload">
|
|
</span>
|
|
<div id="gcode_upload_progress" class="progress" style="width: 100%;">
|
|
<div class="bar" style="width: 0%"></div>
|
|
</div>
|
|
<div>
|
|
<small>Hint: You can also drag and drop files on this page to upload them.</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tabbable span8">
|
|
<ul class="nav nav-tabs" id="tabs">
|
|
<li class="active"><a href="#temp" data-toggle="tab">Temperature</a></li>
|
|
<li><a href="#controls" data-toggle="tab">Controls</a></li>
|
|
{% if enableGCodeVisualizer %}<li><a href="#gcode" data-toggle="tab">GCode Viewer</a></li>{% endif %}
|
|
<!--<li><a href="#speed" data-toggle="tab">Speed</a></li>-->
|
|
<li><a href="#term" data-toggle="tab">Terminal</a></li>
|
|
{% if webcamStream %}<li><a href="#webcam" data-toggle="tab">Webcam</a></li>{% endif %}
|
|
</ul>
|
|
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="temp">
|
|
<div class="row" style="padding-left: 20px">
|
|
<div id="temperature-graph"></div>
|
|
</div>
|
|
<div class="row-fluid" style="margin-bottom: 20px">
|
|
<div class="form-horizontal span6">
|
|
<h1>Temperature</h1>
|
|
|
|
<label>Current: <strong data-bind="html: tempString"></strong></label>
|
|
|
|
<label>Target: <strong data-bind="html: targetTempString"></strong></label>
|
|
|
|
<label for="temp_newTemp">New Target</label>
|
|
<div class="input-append">
|
|
<input type="text" id="temp_newTemp" data-bind="attr: {placeholder: targetTemp}" class="tempInput">
|
|
<span class="add-on">°C</span>
|
|
</div>
|
|
<div class="btn-group">
|
|
<button type="submit" class="btn" id="temp_newTemp_set">Set</button>
|
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
|
<span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu">
|
|
<!-- ko foreach: temperature_profiles -->
|
|
<li>
|
|
<a href="#" data-bind="click: $parent.setTempFromProfile, text: 'Set ' + name + ' (' + extruder + '°C)'"></a>
|
|
</li>
|
|
<!-- /ko -->
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#" data-bind="click: function() { $root.setTemp(0); }">Off</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="form-horizontal span6">
|
|
<h1>Bed Temperature</h1>
|
|
|
|
<label>Current: <strong data-bind="html: bedTempString"></strong></label>
|
|
|
|
<label>Target: <strong data-bind="html: bedTargetTempString"></strong></label>
|
|
|
|
<label for="temp_newBedTemp">New Target</label>
|
|
<div class="input-append">
|
|
<input type="text" id="temp_newBedTemp" data-bind="attr: {placeholder: bedTargetTemp}" class="tempInput">
|
|
<span class="add-on">°C</span>
|
|
</div>
|
|
<div class="btn-group">
|
|
<button type="submit" class="btn" id="temp_newBedTemp_set">Set</button>
|
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
|
<span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu">
|
|
<!-- ko foreach: temperature_profiles -->
|
|
<li>
|
|
<a href="#" data-bind="click: $parent.setBedTempFromProfile, text: 'Set ' + name + ' (' + bed + '°C)'"></a>
|
|
</li>
|
|
<!-- /ko -->
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#" data-bind="click: function(){ $root.setBedTemp(0); }">Off</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane" id="controls">
|
|
<div class="jog-panel">
|
|
<!-- XY jogging control panel -->
|
|
<div class="jog-panel">
|
|
<h1>X/Y</h1>
|
|
<div>
|
|
<button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y',1) }"><i class="icon-arrow-up"></i></button>
|
|
</div>
|
|
<div>
|
|
<button class="btn box pull-left" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x',-1) }"><i class="icon-arrow-left"></i></button>
|
|
<button class="btn box pull-left" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('XY') }"><i class="icon-home"></i></button>
|
|
<button class="btn box pull-left" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('x',1) }"><i class="icon-arrow-right"></i></button>
|
|
</div>
|
|
<div>
|
|
<button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('y',-1) }"><i class="icon-arrow-down"></i></button>
|
|
</div>
|
|
</div>
|
|
<!-- Z jogging control panel -->
|
|
<div class="jog-panel">
|
|
<h1>Z</h1>
|
|
<div>
|
|
<button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z',1) }"><i class="icon-arrow-up"></i></button>
|
|
</div>
|
|
<div>
|
|
<button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendHomeCommand('Z') }"><i class="icon-home"></i></button>
|
|
</div>
|
|
<div>
|
|
<button class="btn box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendJogCommand('z',-1) }"><i class="icon-arrow-down"></i></button>
|
|
</div>
|
|
</div>
|
|
<!-- Jog distance -->
|
|
<div class="distance">
|
|
<div class="btn-group" data-toggle="buttons-radio" id="jog_distance">
|
|
<button type="button" class="btn" data-distance="0.1">0.1</button>
|
|
<button type="button" class="btn" data-distance="1">1</button>
|
|
<button type="button" class="btn active" data-distance="10">10</button>
|
|
<button type="button" class="btn" data-distance="100">100</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Extrusion control panel -->
|
|
<div class="jog-panel">
|
|
<h1>E</h1>
|
|
<div>
|
|
<div class="input-append control-box">
|
|
<input type="text" class="input-mini text-right" data-bind="value: extrusionAmount, enable: isOperational() && !isPrinting(), attr: {placeholder: 5}">
|
|
<span class="add-on">mm</span>
|
|
</div>
|
|
<button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendExtrudeCommand() }">Extrude</button>
|
|
<button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendRetractCommand() }">Retract</button>
|
|
</div>
|
|
</div>
|
|
<!-- General control panel -->
|
|
<div class="jog-panel">
|
|
<h1>General</h1>
|
|
<div>
|
|
<button class="btn control-box" data-bind="enable: isOperational() && !isPrinting(), click: function() { $root.sendCustomCommand({type:'command',command:'M18'}) }"><i class="icon-off"></i> Motors off</button>
|
|
<button class="btn control-box" data-bind="enable: isOperational(), click: function() { $root.sendCustomCommand({type:'command',command:'M106'}) }">Fans on</button>
|
|
<button class="btn control-box" data-bind="enable: isOperational(), click: function() { $root.sendCustomCommand({type:'command',command:'M106 S0'}) }">Fans off</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Container for custom controls -->
|
|
<div style="clear: both;" data-bind="template: { name: $root.displayMode, foreach: controls }"></div>
|
|
|
|
<!-- Templates for custom controls -->
|
|
<script type="text/html" id="customControls_sectionTemplate">
|
|
<h1 data-bind="text: name"></h1>
|
|
|
|
<div data-bind="template: { name: $root.displayMode, foreach: children }"></div>
|
|
</script>
|
|
<script type="text/html" id="customControls_commandTemplate">
|
|
<form class="form-inline">
|
|
<button class="btn" data-bind="text: name, enable: $root.isOperational(), click: function() { $root.sendCustomCommand($data) }"></button>
|
|
</form>
|
|
</script>
|
|
<script type="text/html" id="customControls_parametricCommandTemplate">
|
|
<form class="form-inline">
|
|
<!-- ko foreach: input -->
|
|
<label data-bind="text: name"></label>
|
|
<input type="text" class="input-small" data-bind="attr: {placeholder: name}, value: value">
|
|
<!-- /ko -->
|
|
<button class="btn" data-bind="text: name, enable: $root.isOperational(), click: function() { $root.sendCustomCommand($data) }"></button>
|
|
</form>
|
|
</script>
|
|
<script type="text/html" id="customControls_emptyTemplate"><div></div></script>
|
|
<!-- End of templates for custom controls -->
|
|
</div>
|
|
<div class="tab-pane" id="speed">
|
|
<div class="form-horizontal" style="margin-bottom: 20px">
|
|
<label for="speed_outerWall">Outer Wall</label>
|
|
<div class="input-append">
|
|
<input type="text" id="speed_outerWall" class="input-mini" data-bind="enable: isOperational(), attr: {placeholder: outerWall}">
|
|
<span class="add-on">%</span>
|
|
<button type="submit" class="btn" id="speed_outerWall_set" data-bind="enable: isOperational()">Set</button>
|
|
</div>
|
|
|
|
<label for="speed_innerWall">Inner Wall</label>
|
|
<div class="input-append">
|
|
<input type="text" id="speed_innerWall" class="input-mini" data-bind="enable: isOperational(), attr: {placeholder: innerWall}">
|
|
<span class="add-on">%</span>
|
|
<button type="submit" class="btn" id="speed_innerWall_set" data-bind="enable: isOperational()">Set</button>
|
|
</div>
|
|
|
|
<label for="speed_fill">Fill</label>
|
|
<div class="input-append">
|
|
<input type="text" id="speed_fill" class="input-mini" data-bind="enable: isOperational(), attr: {placeholder: fill}">
|
|
<span class="add-on">%</span>
|
|
<button type="submit" class="btn" id="speed_fill_set" data-bind="enable: isOperational()">Set</button>
|
|
</div>
|
|
|
|
<label for="speed_support">Support</label>
|
|
<div class="input-append">
|
|
<input type="text" id="speed_support" class="input-mini" data-bind="enable: isOperational(), attr: {placeholder: support}">
|
|
<span class="add-on">%</span>
|
|
<button type="submit" class="btn" id="speed_support_set" data-bind="enable: isOperational()">Set</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane" id="gcode">
|
|
<canvas id="canvas" width="572" height="588"></canvas>
|
|
<div id="slider-vertical"></div>
|
|
<div id="slider-horizontal"></div>
|
|
|
|
<div id="gcode_accordion" class="accordion" style="margin-top: 20px">
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#progressAccordionTab">
|
|
Progress indicators
|
|
</a>
|
|
</div>
|
|
<div id="progressAccordionTab" class="accordion-body collapse">
|
|
<div class="accordion-inner">
|
|
<div id="progressBlock">
|
|
<div class="progress" >
|
|
<div id="loadProgress" class="bar" style="width: 0%;"></div>
|
|
</div>
|
|
<div class="progress" >
|
|
<div id="analyzeProgress" class="bar" style="width: 0%;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#infoAccordionTab">
|
|
Model info
|
|
</a>
|
|
</div>
|
|
<div id="infoAccordionTab" class="accordion-body collapse">
|
|
<div class="accordion-inner">
|
|
<p id="list"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#layerAccordionTab">
|
|
Layer Info
|
|
</a>
|
|
</div>
|
|
<div id="layerAccordionTab" class="accordion-body collapse">
|
|
<div class="accordion-inner">
|
|
<p id="layerInfo"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#options2DAccordionTab">
|
|
2D Render options
|
|
</a>
|
|
</div>
|
|
<div id="options2DAccordionTab" class="accordion-body collapse">
|
|
<div class="accordion-inner">
|
|
<input type="checkbox" id="showMovesCheckbox" value="1" onclick="GCODE.ui.processOptions()" checked>Show non-extrusion moves</input><br>
|
|
<input type="checkbox" id="showRetractsCheckbox" value="2" onclick="GCODE.ui.processOptions()" checked>Show retracts and restarts</input><br>
|
|
<input type="checkbox" id="moveModelCheckbox" value="3" onclick="GCODE.ui.processOptions()" checked>Move model to the center of the grid</input><br>
|
|
<input type="checkbox" id="differentiateColorsCheckbox" value="7" onclick="GCODE.ui.processOptions()" checked>Show different speeds with different colors</input><br>
|
|
<input type="checkbox" id="thickExtrusionCheckbox" value="8" onclick="GCODE.ui.processOptions()">Emulate extrusion width</input><br>
|
|
Width modifier: <input type="text" value="2" id="widthModifier" onchange="GCODE.ui.processOptions()"/><br>
|
|
<input type="checkbox" id="showNextLayer" value="9" onclick="GCODE.ui.processOptions()" >Show +1 layer</input><br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#analyzeOptionsAccordioinTab">
|
|
GCode analyzer options
|
|
</a>
|
|
</div>
|
|
<div id="analyzeOptionsAccordioinTab" class="accordion-body collapse">
|
|
<div class="accordion-inner">
|
|
These require re-analyzing file:<br>
|
|
<input type="checkbox" id="sortLayersCheckbox" value="4" onclick="GCODE.ui.processOptions()" checked>Sort layers by Z</input><br>
|
|
<input type="checkbox" id="purgeEmptyLayersCheckbox" value="5" onclick="GCODE.ui.processOptions()" checked>Hide empty layers</input><br>
|
|
<input type="checkbox" id="showGCodeCheckbox" value="6" onclick="GCODE.ui.processOptions()" checked>Show GCode in GCode tab (memory intensive!)</input><br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="tab-pane" id="term">
|
|
<pre id="terminal-output" class="pre-scrollable"></pre>
|
|
<label class="checkbox">
|
|
<input type="checkbox" id="terminal-autoscroll" data-bind="checked: autoscrollEnabled"> Autoscroll
|
|
</label>
|
|
|
|
<div class="input-append">
|
|
<input type="text" id="terminal-command">
|
|
<button class="btn" type="button" id="terminal-send">Send</button>
|
|
</div>
|
|
</div>
|
|
{% if webcamStream %}
|
|
<div class="tab-pane" id="webcam">
|
|
<div id="webcam_container">
|
|
<img id="webcam_image" src="{{ webcamStream }}">
|
|
</div>
|
|
|
|
{% if enableTimelapse %}
|
|
<h1>Timelapse Configuration</h1>
|
|
|
|
<label for="webcam_timelapse_mode">Timelapse Mode</label>
|
|
<select id="webcam_timelapse_mode" data-bind="value: timelapseType, enable: isOperational() && !isPrinting()">
|
|
<option value="off">Off</option>
|
|
<option value="zchange">On Z Change</option>
|
|
<option value="timed">Timed</option>
|
|
</select>
|
|
|
|
<div id="webcam_timelapse_timedsettings" data-bind="visible: intervalInputEnabled()">
|
|
<label for="webcam_timelapse_interval">Interval</label>
|
|
<div class="input-append">
|
|
<input type="text" class="input-mini" id="webcam_timelapse_interval" data-bind="value: timelapseTimedInterval, enable: isOperational() && !isPrinting()">
|
|
<span class="add-on">sec</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<button class="btn" data-bind="click: save, enable: isOperational() && !isPrinting()">Save Settings</button>
|
|
</div>
|
|
|
|
<h1>Finished Timelapses</h1>
|
|
|
|
<table class="table table-striped table-hover table-condensed table-hover" id="timelapse_files">
|
|
<thead>
|
|
<tr>
|
|
<th class="timelapse_files_name">Name</th>
|
|
<th class="timelapse_files_size">Size</th>
|
|
<th class="timelapse_files_action">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody data-bind="foreach: files">
|
|
<tr data-bind="attr: {title: name}">
|
|
<td class="timelapse_files_name" data-bind="text: name"></td>
|
|
<td class="timelapse_files_size" data-bind="text: size"></td>
|
|
<td class="timelapse_files_action"><a href="#" class="icon-trash" data-bind="click: $parent.removeFile"></a> | <a href="#" class="icon-download" data-bind="attr: {href: url}"></a></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="offline_overlay">
|
|
<div id="offline_overlay_background"></div>
|
|
<div id="offline_overlay_wrapper">
|
|
<div class="container">
|
|
<div class="hero-unit">
|
|
<h1>Server is offline</h1>
|
|
<p id="offline_overlay_message">
|
|
The server appears to be offline, at least I'm not getting any response from it. I'll try to reconnect
|
|
automatically <strong>over the next couple of minutes</strong>, however you are welcome to try a manual reconnect
|
|
anytime using the button below.
|
|
</p>
|
|
<p>
|
|
<a class="btn btn-primary btn-large" id="offline_overlay_reconnect">Attempt to reconnect</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% include 'settings.html' %}
|
|
|
|
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/underscore-min.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/knockout-2.2.1.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.ui.core.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.ui.widget.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.ui.mouse.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.ui.slider.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.flot.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.iframe-transport.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery.fileupload.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/socket.io.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/ui.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/lib/modernizr.custom.09684.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/js/ui.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/js/gCodeReader.js') }}"></script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/js/renderer.js') }}"></script>
|
|
|
|
</body>
|
|
</html>
|