First version with gcode viewer integration.
Did some minor changes: renamed gcode tab, renamed gcode file download endpoint, added some margin for gcode viewer accordion. Not sure yet what to do about the gcode viewer controls/settings, until I figure this out they'll stay where they are now ,)master
parent
ea52bbfb14
commit
959feba9ca
|
@ -232,7 +232,7 @@ def getCustomControls():
|
||||||
def readGcodeFiles():
|
def readGcodeFiles():
|
||||||
return jsonify(files=gcodeManager.getAllFileData())
|
return jsonify(files=gcodeManager.getAllFileData())
|
||||||
|
|
||||||
@app.route("/gcodefile/<path:filename>", methods=["GET"])
|
@app.route(BASEURL + "gcodefiles/<path:filename>", methods=["GET"])
|
||||||
def readGcodeFile(filename):
|
def readGcodeFile(filename):
|
||||||
return send_from_directory(UPLOAD_FOLDER, filename, as_attachment=True)
|
return send_from_directory(UPLOAD_FOLDER, filename, as_attachment=True)
|
||||||
|
|
||||||
|
|
|
@ -39,14 +39,14 @@
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
#gcode {
|
/*#gcode {
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
float:right;
|
float:right;
|
||||||
width: 680px;
|
width: 680px;
|
||||||
height: 680px;
|
height: 680px;
|
||||||
border-width: 2px;
|
border-width: 2px;
|
||||||
border-style: none none none solid;
|
border-style: none none none solid;
|
||||||
}
|
}*/
|
||||||
|
|
||||||
#canvas{
|
#canvas{
|
||||||
/*float: left;*/
|
/*float: left;*/
|
||||||
|
|
|
@ -825,10 +825,10 @@ function GcodeViewModel() {
|
||||||
}
|
}
|
||||||
|
|
||||||
self.loadFile = function(filename){
|
self.loadFile = function(filename){
|
||||||
if(self.status == 'idle'){
|
if (self.status == 'idle') {
|
||||||
self.status = 'request';
|
self.status = 'request';
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: "gcodefile/"+filename,
|
url: AJAX_BASEURL + "gcodefiles/" + filename,
|
||||||
type: "GET",
|
type: "GET",
|
||||||
success: function(response, rstatus) {
|
success: function(response, rstatus) {
|
||||||
if(rstatus === 'success'){
|
if(rstatus === 'success'){
|
||||||
|
@ -844,7 +844,7 @@ function GcodeViewModel() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
self.showGCodeViewer = function(response, rstatus){
|
self.showGCodeViewer = function(response, rstatus) {
|
||||||
var par = {};
|
var par = {};
|
||||||
par.target = {};
|
par.target = {};
|
||||||
par.target.result = response;
|
par.target.result = response;
|
||||||
|
@ -862,13 +862,13 @@ function GcodeViewModel() {
|
||||||
self._processData = function(data) {
|
self._processData = function(data) {
|
||||||
if(!self.enabled)return;
|
if(!self.enabled)return;
|
||||||
|
|
||||||
if(self.loadedFilename == data.job.filename){
|
if(self.loadedFilename == data.job.filename) {
|
||||||
var cmdIndex = GCODE.gCodeReader.getLinesCmdIndex(data.progress.progress);
|
var cmdIndex = GCODE.gCodeReader.getLinesCmdIndex(data.progress.progress);
|
||||||
if(cmdIndex){
|
if(cmdIndex){
|
||||||
GCODE.renderer.render(cmdIndex.layer, 0, cmdIndex.cmd);
|
GCODE.renderer.render(cmdIndex.layer, 0, cmdIndex.cmd);
|
||||||
GCODE.ui.updateLayerInfo(cmdIndex.layer);
|
GCODE.ui.updateLayerInfo(cmdIndex.layer);
|
||||||
}
|
}
|
||||||
}else{
|
} else if (data.job.filename) {
|
||||||
self.loadFile(data.job.filename);
|
self.loadFile(data.job.filename);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -951,6 +951,7 @@ $(function() {
|
||||||
var gcodeFilesViewModel = new GcodeFilesViewModel();
|
var gcodeFilesViewModel = new GcodeFilesViewModel();
|
||||||
var webcamViewModel = new WebcamViewModel();
|
var webcamViewModel = new WebcamViewModel();
|
||||||
var gcodeViewModel = new GcodeViewModel();
|
var gcodeViewModel = new GcodeViewModel();
|
||||||
|
|
||||||
var dataUpdater = new DataUpdater(
|
var dataUpdater = new DataUpdater(
|
||||||
connectionViewModel,
|
connectionViewModel,
|
||||||
printerStateViewModel,
|
printerStateViewModel,
|
||||||
|
@ -963,16 +964,6 @@ $(function() {
|
||||||
gcodeViewModel
|
gcodeViewModel
|
||||||
);
|
);
|
||||||
|
|
||||||
var dataUpdater = new DataUpdater(
|
|
||||||
connectionViewModel,
|
|
||||||
printerStateViewModel,
|
|
||||||
temperatureViewModel,
|
|
||||||
controlsViewModel,
|
|
||||||
speedViewModel,
|
|
||||||
terminalViewModel,
|
|
||||||
gcodeFilesViewModel,
|
|
||||||
webcamViewModel);
|
|
||||||
|
|
||||||
//~~ Print job control
|
//~~ Print job control
|
||||||
|
|
||||||
$("#job_print").click(function() {
|
$("#job_print").click(function() {
|
||||||
|
@ -1120,12 +1111,13 @@ $(function() {
|
||||||
ko.applyBindings(controlsViewModel, document.getElementById("controls"));
|
ko.applyBindings(controlsViewModel, document.getElementById("controls"));
|
||||||
ko.applyBindings(terminalViewModel, document.getElementById("term"));
|
ko.applyBindings(terminalViewModel, document.getElementById("term"));
|
||||||
ko.applyBindings(speedViewModel, document.getElementById("speed"));
|
ko.applyBindings(speedViewModel, document.getElementById("speed"));
|
||||||
|
ko.applyBindings(gcodeViewModel, document.getElementById("gcode"));
|
||||||
|
|
||||||
var webcamElement = document.getElementById("webcam");
|
var webcamElement = document.getElementById("webcam");
|
||||||
if (webcamElement) {
|
if (webcamElement) {
|
||||||
ko.applyBindings(webcamViewModel, document.getElementById("webcam"));
|
ko.applyBindings(webcamViewModel, document.getElementById("webcam"));
|
||||||
}
|
}
|
||||||
var gCodeVisualizerElement = document.getElementById("tab2d");
|
var gCodeVisualizerElement = document.getElementById("gcode");
|
||||||
if(gCodeVisualizerElement){
|
if(gCodeVisualizerElement){
|
||||||
gcodeViewModel.initialize();
|
gcodeViewModel.initialize();
|
||||||
}
|
}
|
||||||
|
|
|
@ -126,7 +126,7 @@
|
||||||
<ul class="nav nav-tabs" id="tabs">
|
<ul class="nav nav-tabs" id="tabs">
|
||||||
<li class="active"><a href="#temp" data-toggle="tab">Temperature</a></li>
|
<li class="active"><a href="#temp" data-toggle="tab">Temperature</a></li>
|
||||||
<li><a href="#controls" data-toggle="tab">Controls</a></li>
|
<li><a href="#controls" data-toggle="tab">Controls</a></li>
|
||||||
{% if gCodeVisualizer %}<li><a href="#tab2d" data-toggle="tab">GCode Viewer</a></li>{% endif %}
|
{% 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="#speed" data-toggle="tab">Speed</a></li>-->
|
||||||
<li><a href="#term" data-toggle="tab">Terminal</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 %}
|
{% if webcamStream %}<li><a href="#webcam" data-toggle="tab">Webcam</a></li>{% endif %}
|
||||||
|
@ -244,14 +244,15 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="tab-pane" id="tab2d">
|
<div class="tab-pane" id="gcode">
|
||||||
<canvas id="canvas" width="572" height="588"></canvas>
|
<canvas id="canvas" width="572" height="588"></canvas>
|
||||||
<div id="slider-vertical"></div>
|
<div id="slider-vertical"></div>
|
||||||
<div id="slider-horizontal"></div>
|
<div id="slider-horizontal"></div>
|
||||||
<div id="accordion2" class="accordion">
|
|
||||||
|
<div id="gcode_accordion" class="accordion" style="margin-top: 20px">
|
||||||
<div class="accordion-group">
|
<div class="accordion-group">
|
||||||
<div class="accordion-heading">
|
<div class="accordion-heading">
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#progressAccordionTab">
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#progressAccordionTab">
|
||||||
Progress indicators
|
Progress indicators
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -270,7 +271,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="accordion-group">
|
<div class="accordion-group">
|
||||||
<div class="accordion-heading">
|
<div class="accordion-heading">
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#infoAccordionTab">
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#infoAccordionTab">
|
||||||
Model info
|
Model info
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -282,7 +283,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="accordion-group">
|
<div class="accordion-group">
|
||||||
<div class="accordion-heading">
|
<div class="accordion-heading">
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#layerAccordionTab">
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#layerAccordionTab">
|
||||||
Layer Info
|
Layer Info
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -294,7 +295,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="accordion-group">
|
<div class="accordion-group">
|
||||||
<div class="accordion-heading">
|
<div class="accordion-heading">
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#options2DAccordionTab">
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#options2DAccordionTab">
|
||||||
2D Render options
|
2D Render options
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -313,7 +314,7 @@
|
||||||
|
|
||||||
<div class="accordion-group">
|
<div class="accordion-group">
|
||||||
<div class="accordion-heading">
|
<div class="accordion-heading">
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#analyzeOptionsAccordioinTab">
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#analyzeOptionsAccordioinTab">
|
||||||
GCode analyzer options
|
GCode analyzer options
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue