720f3b3eb6
The location of the config folder has changed. OctoPrint will try to migrate the configuration from its old location (~/.printerwebui, ...) to its new one (~/.octoprint, ...). For this to work the following conditions must be met: 1) the old config folder exists and is a directory 2) the new config folder does not exist at all. The migration functionality will be in the future.
294 lines
No EOL
20 KiB
HTML
294 lines
No EOL
20 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>OctoPrint</title>
|
|
|
|
<link rel="shortcut icon" href="{{ url_for('static', filename='img/tentacle-32x32.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">
|
|
|
|
<script lang="javascript">
|
|
var AJAX_BASEURL = '/ajax/';
|
|
|
|
var WEB_SOCKET_SWF_LOCATION = "{{ url_for('static', filename='js/WebSocketMain.swf') }}";
|
|
var WEB_SOCKET_DEBUG = true;
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="navbar navbar-fixed-top">
|
|
<div class="navbar-inner">
|
|
<div class="container">
|
|
<a class="brand" href="#"><img src="{{ url_for('static', filename='img/tentacle-20x20.png') }}"> OctoPrint</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="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>
|
|
{% if enableEstimations %}
|
|
Filament: <strong data-bind="text: filament"></strong><br>
|
|
Estimated Print Time: <strong data-bind="text: estimatedPrintTime"></strong><br>
|
|
{% endif %}
|
|
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>
|
|
|
|
<button class="btn btn-primary" data-bind="enable: isOperational() && isReady() && !isPrinting() && !isPaused()" id="job_print"><i class="icon-print icon-white"></i> <span>Print</span></button>
|
|
<button class="btn" id="job_pause" data-bind="css: {active: isPaused}"><i class="icon-pause"></i> <span>Pause</span></button>
|
|
<button class="btn" id="job_cancel"><i class="icon-stop"></i> Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-group">
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" data-toggle="collapse" href="#files"><i class="icon-list"></i> Files</a>
|
|
</div>
|
|
<div class="accordion-body collapse in" id="files">
|
|
<div class="accordion-inner">
|
|
<table class="table table-striped table-hover 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: files">
|
|
<tr data-bind="attr: {title: name}, event: {dblclick: $parent.loadFile}">
|
|
<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: $parent.removeFile"></a> | <a href="#" class="icon-folder-open" data-bind="click: $parent.loadFile"></a></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<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>
|
|
</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="#jog" data-toggle="tab">Controls</a></li>
|
|
<!--<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>
|
|
<div class="form-horizontal" style="width: 49%; float: left; margin-bottom: 20px;">
|
|
<h1>Temperature</h1>
|
|
|
|
<label>Current: <strong data-bind="text: tempString"></strong></label>
|
|
|
|
<label>Target: <strong data-bind="text: targetTempString"></strong></label>
|
|
|
|
<label for="temp_newTemp">New Target</label>
|
|
<div class="input-append">
|
|
<input class="span1" type="text" id="temp_newTemp" data-bind="attr: {placeholder: targetTemp}">
|
|
<span class="add-on">°C</span>
|
|
</div>
|
|
<button type="submit" class="btn" id="temp_newTemp_set">Set</button>
|
|
</div>
|
|
<div class="form-horizontal" style="width: 49%; margin-left: 2%; float: left; margin-bottom: 20px;">
|
|
<h1>Bed Temperature</h1>
|
|
|
|
<label>Current: <strong data-bind="text: bedTempString"></strong></label>
|
|
|
|
<label>Target: <strong data-bind="text: bedTargetTempString"></strong></label>
|
|
|
|
<label for="temp_newBedTemp">New Target</label>
|
|
<div class="input-append">
|
|
<input class="span1" type="text" id="temp_newBedTemp" data-bind="attr: {placeholder: bedTargetTemp}">
|
|
<span class="add-on">°C</span>
|
|
</div>
|
|
<button type="submit" class="btn" id="temp_newBedTemp_set">Set</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane" id="jog">
|
|
<div style="width: 350px; height: 70px">
|
|
<div style="width: 70px; float: left;"> </div>
|
|
<div style="width: 70px; float: left;"><button class="btn btn-block" id="jog_y_inc" data-bind="enable: isOperational() && !isPrinting()">Up</button></div>
|
|
<div style="width: 70px; float: left;"> </div>
|
|
<div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" id="jog_z_inc" data-bind="enable: isOperational() && !isPrinting()">Z+</button></div>
|
|
</div>
|
|
<div style="width: 350px; height: 70px">
|
|
<div style="width: 70px; float: left;"><button class="btn btn-block" id="jog_x_dec" data-bind="enable: isOperational() && !isPrinting()">Left</button></div>
|
|
<div style="width: 70px; float: left;"><button class="btn btn-block" id="jog_xy_home" data-bind="enable: isOperational() && !isPrinting()">Home</button></div>
|
|
<div style="width: 70px; float: left;"><button class="btn btn-block" id="jog_x_inc" data-bind="enable: isOperational() && !isPrinting()">Right</button></div>
|
|
<div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" id="jog_z_home" data-bind="enable: isOperational() && !isPrinting()">Home</button></div>
|
|
</div>
|
|
<div style="width: 350px; height: 70px">
|
|
<div style="width: 70px; float: left;"> </div>
|
|
<div style="width: 70px; float: left;"><button class="btn btn-block" id="jog_y_dec" data-bind="enable: isOperational() && !isPrinting()">Down</button></div>
|
|
<div style="width: 70px; float: left;"> </div>
|
|
<div style="width: 70px; float: left; margin-left: 20px"><button class="btn btn-block" id="jog_z_dec" data-bind="enable: isOperational() && !isPrinting()">Z-</button></div>
|
|
</div>
|
|
</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="term">
|
|
<pre id="terminal-output" class="pre-scrollable"></pre>
|
|
<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>
|
|
|
|
<script src="http://code.jquery.com/jquery-latest.js"></script>
|
|
<script src="{{ url_for('static', filename='js/knockout-2.2.0.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.ui.widget.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.flot.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.iframe-transport.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.fileupload.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/socket.io.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/ui.js') }}"></script>
|
|
</body>
|
|
</html> |