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
Gina Häußge 2013-02-03 22:01:11 +01:00
parent ea52bbfb14
commit 959feba9ca
4 changed files with 20 additions and 27 deletions

View File

@ -232,7 +232,7 @@ def getCustomControls():
def readGcodeFiles():
return jsonify(files=gcodeManager.getAllFileData())
@app.route("/gcodefile/<path:filename>", methods=["GET"])
@app.route(BASEURL + "gcodefiles/<path:filename>", methods=["GET"])
def readGcodeFile(filename):
return send_from_directory(UPLOAD_FOLDER, filename, as_attachment=True)

View File

@ -39,14 +39,14 @@
margin-left: 5px;
margin-bottom: 5px;
}
#gcode {
/*#gcode {
background: #ffffff;
float:right;
width: 680px;
height: 680px;
border-width: 2px;
border-style: none none none solid;
}
}*/
#canvas{
/*float: left;*/

View File

@ -825,10 +825,10 @@ function GcodeViewModel() {
}
self.loadFile = function(filename){
if(self.status == 'idle'){
if (self.status == 'idle') {
self.status = 'request';
$.ajax({
url: "gcodefile/"+filename,
url: AJAX_BASEURL + "gcodefiles/" + filename,
type: "GET",
success: function(response, rstatus) {
if(rstatus === 'success'){
@ -844,7 +844,7 @@ function GcodeViewModel() {
}
}
self.showGCodeViewer = function(response, rstatus){
self.showGCodeViewer = function(response, rstatus) {
var par = {};
par.target = {};
par.target.result = response;
@ -862,13 +862,13 @@ function GcodeViewModel() {
self._processData = function(data) {
if(!self.enabled)return;
if(self.loadedFilename == data.job.filename){
if(self.loadedFilename == data.job.filename) {
var cmdIndex = GCODE.gCodeReader.getLinesCmdIndex(data.progress.progress);
if(cmdIndex){
GCODE.renderer.render(cmdIndex.layer, 0, cmdIndex.cmd);
GCODE.ui.updateLayerInfo(cmdIndex.layer);
}
}else{
} else if (data.job.filename) {
self.loadFile(data.job.filename);
}
}
@ -951,6 +951,7 @@ $(function() {
var gcodeFilesViewModel = new GcodeFilesViewModel();
var webcamViewModel = new WebcamViewModel();
var gcodeViewModel = new GcodeViewModel();
var dataUpdater = new DataUpdater(
connectionViewModel,
printerStateViewModel,
@ -963,16 +964,6 @@ $(function() {
gcodeViewModel
);
var dataUpdater = new DataUpdater(
connectionViewModel,
printerStateViewModel,
temperatureViewModel,
controlsViewModel,
speedViewModel,
terminalViewModel,
gcodeFilesViewModel,
webcamViewModel);
//~~ Print job control
$("#job_print").click(function() {
@ -1120,12 +1111,13 @@ $(function() {
ko.applyBindings(controlsViewModel, document.getElementById("controls"));
ko.applyBindings(terminalViewModel, document.getElementById("term"));
ko.applyBindings(speedViewModel, document.getElementById("speed"));
ko.applyBindings(gcodeViewModel, document.getElementById("gcode"));
var webcamElement = document.getElementById("webcam");
if (webcamElement) {
ko.applyBindings(webcamViewModel, document.getElementById("webcam"));
}
var gCodeVisualizerElement = document.getElementById("tab2d");
var gCodeVisualizerElement = document.getElementById("gcode");
if(gCodeVisualizerElement){
gcodeViewModel.initialize();
}

View File

@ -126,7 +126,7 @@
<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 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="#term" data-toggle="tab">Terminal</a></li>
{% if webcamStream %}<li><a href="#webcam" data-toggle="tab">Webcam</a></li>{% endif %}
@ -244,14 +244,15 @@
</div>
</div>
</div>
<div class="tab-pane" id="tab2d">
<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="accordion2" class="accordion">
<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="#accordion2" href="#progressAccordionTab">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#gcode_accordion" href="#progressAccordionTab">
Progress indicators
</a>
</div>
@ -270,7 +271,7 @@
</div>
<div class="accordion-group">
<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
</a>
</div>
@ -282,7 +283,7 @@
</div>
<div class="accordion-group">
<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
</a>
</div>
@ -294,7 +295,7 @@
</div>
<div class="accordion-group">
<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
</a>
</div>
@ -313,7 +314,7 @@
<div class="accordion-group">
<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
</a>
</div>