slicing progress visualized
This commit is contained in:
Teja
parent
45a42c4972
commit
b2555d3850
5 changed files with 70 additions and 34 deletions
|
|
@ -301,7 +301,7 @@ class SvgToGcodePlugin(octoprint.plugin.SlicerPlugin,
|
|||
type="svgtogcode",
|
||||
name="svgtogcode",
|
||||
same_device=True,
|
||||
progress_report=False
|
||||
progress_report=True
|
||||
)
|
||||
|
||||
def get_slicer_default_profile(self):
|
||||
|
|
|
|||
|
|
@ -1815,3 +1815,16 @@ input.search-query,
|
|||
background-image: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.progress-striped .bar {
|
||||
background-color: #DD0000;
|
||||
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
|
||||
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
|
||||
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
|
||||
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
|
||||
-webkit-background-size: 40px 40px;
|
||||
-moz-background-size: 40px 40px;
|
||||
-o-background-size: 40px 40px;
|
||||
background-size: 40px 40px;
|
||||
}
|
||||
|
|
@ -12,7 +12,14 @@ $(function(){
|
|||
self.target = undefined;
|
||||
self.file = undefined;
|
||||
self.data = undefined;
|
||||
self.slicing_progress = ko.observable(0);
|
||||
self.slicing_in_progress = ko.observable(false);
|
||||
|
||||
self.title = ko.observable(undefined);
|
||||
self.slicer = ko.observable();
|
||||
self.slicers = ko.observableArray();
|
||||
self.profile = ko.observable();
|
||||
self.profiles = ko.observableArray();
|
||||
self.defaultSlicer = undefined;
|
||||
self.defaultProfile = undefined;
|
||||
|
||||
|
|
@ -27,11 +34,6 @@ $(function(){
|
|||
self.laserSpeed = ko.observable(undefined);
|
||||
self.maxSpeed = ko.observable(3000);
|
||||
self.minSpeed = ko.observable(20);
|
||||
self.title = ko.observable(undefined);
|
||||
self.slicer = ko.observable();
|
||||
self.slicers = ko.observableArray();
|
||||
self.profile = ko.observable();
|
||||
self.profiles = ko.observableArray();
|
||||
|
||||
// image engraving stuff
|
||||
// preset values are a good start for wood engraving
|
||||
|
|
@ -88,7 +90,6 @@ $(function(){
|
|||
self.laserSpeed(speed);
|
||||
}
|
||||
|
||||
// TODO: js svg conversion
|
||||
var gcodeFile = self.create_gcode_filename(self.workingArea.placedDesigns());
|
||||
self.gcodeFilename(gcodeFile);
|
||||
|
||||
|
|
@ -127,7 +128,6 @@ $(function(){
|
|||
|
||||
return gcode_name;
|
||||
} else {
|
||||
// return "tmp"+Date.now()+".gco";
|
||||
console.error("no designs placed.");
|
||||
return;
|
||||
}
|
||||
|
|
@ -269,8 +269,6 @@ $(function(){
|
|||
data: JSON.stringify(data)
|
||||
});
|
||||
|
||||
$("#dialog_vector_graphics_conversion").modal("hide");
|
||||
|
||||
self.gcodeFilename(undefined);
|
||||
self.svg = undefined;
|
||||
}
|
||||
|
|
@ -289,6 +287,31 @@ $(function(){
|
|||
self._configureImgSliders();
|
||||
};
|
||||
|
||||
self.onSlicingProgress = function(slicer, model_path, machinecode_path, progress){
|
||||
self.slicing_progress(progress);
|
||||
};
|
||||
self.onEventSlicingStarted = function(payload){
|
||||
self.slicing_in_progress(true);
|
||||
console.log("onSlicingDone" , payload);
|
||||
};
|
||||
self.onEventSlicingDone = function(payload){
|
||||
// payload
|
||||
// gcode: "angelina_20091211_0193_11more_i1000s300.gco"
|
||||
// gcode_location: "local"
|
||||
// stl: "local/angelina_jolie_20091211_0193_11more_i1000s300.svg"
|
||||
// time: 30.612739086151123
|
||||
$("#dialog_vector_graphics_conversion").modal("hide");
|
||||
self.slicing_in_progress(false);
|
||||
};
|
||||
self.onEventSlicingCancelled = function(payload){
|
||||
self.slicing_in_progress(false);
|
||||
console.log("onSlicingCancelled" , payload);
|
||||
};
|
||||
self.onEventSlicingFailed = function(payload){
|
||||
self.slicing_in_progress(false);
|
||||
console.log("onSlicingFailed" , payload);
|
||||
};
|
||||
|
||||
self._configureIntensitySlider = function() {
|
||||
self.intensitySlider = $("#svgtogcode_intensity_slider").slider({
|
||||
id: "svgtogcode_intensity_slider_impl",
|
||||
|
|
@ -351,7 +374,7 @@ $(function(){
|
|||
min: 1,
|
||||
max: self.contrastMax,
|
||||
value: 1,
|
||||
tooltip: 'hide',
|
||||
tooltip: 'hide'
|
||||
}).on("slide", function(ev){
|
||||
self.imgContrast(ev.value);
|
||||
});
|
||||
|
|
@ -362,19 +385,15 @@ $(function(){
|
|||
max: self.sharpeningMax,
|
||||
value: 1,
|
||||
class: 'img_slider',
|
||||
tooltip: 'hide',
|
||||
tooltip: 'hide'
|
||||
}).on("slide", function(ev){
|
||||
self.imgSharpening(ev.value);
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
// TODO debug this.
|
||||
self.showExpertSettings.subscribe(function(){
|
||||
// var wh = $(window).height();
|
||||
// var h = $('#dialog_vector_graphics_conversion').outerHeight();
|
||||
// var d = Math.max((wh - h) / 2, 10);
|
||||
// $('#dialog_vector_graphics_conversion').css('top', d + 'px');
|
||||
$('#dialog_vector_graphics_conversion').trigger('resize');
|
||||
});
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<h3 data-bind="text: title"></h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal">
|
||||
<form class="form-horizontal" data-bind="visible: !slicing_in_progress() ">
|
||||
<div data-bind="visible: show_vector_parameters ">
|
||||
<p>{{ _('Vector graphic parameters:') }}</p>
|
||||
|
||||
|
|
@ -111,6 +111,10 @@
|
|||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="slicing_progress" class="progress" style="width: 100%;" data-bind="visible: slicing_in_progress">
|
||||
<div class="bar" style="width: 0%" data-bind="style: {width: slicing_progress() + '%'} "></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<div class="pull-left">
|
||||
|
|
|
|||
|
|
@ -110,6 +110,8 @@ function DataUpdater(allViewModels) {
|
|||
|
||||
var gcodeUploadProgress = $("#gcode_upload_progress");
|
||||
var gcodeUploadProgressBar = $(".bar", gcodeUploadProgress);
|
||||
var slicingProgress = $("#slicing_progress");
|
||||
var slicingProgressBar = $(".bar", slicingProgress);
|
||||
|
||||
switch (prop) {
|
||||
case "connected": {
|
||||
|
|
@ -163,8 +165,7 @@ function DataUpdater(allViewModels) {
|
|||
break;
|
||||
}
|
||||
case "slicingProgress": {
|
||||
gcodeUploadProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: Math.round(data["progress"])}));
|
||||
|
||||
slicingProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: Math.round(data["progress"])}));
|
||||
_.each(self.allViewModels, function(viewModel) {
|
||||
if (viewModel.hasOwnProperty("onSlicingProgress")) {
|
||||
viewModel.onSlicingProgress(data["slicer"], data["model_path"], data["machinecode_path"], data["progress"]);
|
||||
|
|
@ -189,27 +190,26 @@ function DataUpdater(allViewModels) {
|
|||
html += pnotifyAdditionalInfo('<pre style="overflow: auto">' + payload.error + '</pre>');
|
||||
new PNotify({title: gettext("Rendering failed"), text: html, type: "error", hide: false});
|
||||
} else if (type == "SlicingStarted") {
|
||||
gcodeUploadProgress.addClass("progress-striped").addClass("active");
|
||||
gcodeUploadProgressBar.css("width", "100%");
|
||||
slicingProgressBar.css("width", "0%");
|
||||
slicingProgress.addClass("progress-striped").addClass("active");
|
||||
if (payload.progressAvailable) {
|
||||
gcodeUploadProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: 0}));
|
||||
slicingProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: 0}));
|
||||
} else {
|
||||
gcodeUploadProgressBar.text(gettext("Slicing ..."));
|
||||
slicingProgressBar.text(gettext("Slicing ..."));
|
||||
}
|
||||
} else if (type == "SlicingDone") {
|
||||
console.log("slicingDone Event: payload: ", payload);
|
||||
gcodeUploadProgress.removeClass("progress-striped").removeClass("active");
|
||||
gcodeUploadProgressBar.css("width", "0%");
|
||||
gcodeUploadProgressBar.text("");
|
||||
slicingProgress.removeClass("progress-striped").removeClass("active");
|
||||
slicingProgressBar.css("width", "0%");
|
||||
slicingProgressBar.text("");
|
||||
new PNotify({title: gettext("Slicing done"), text: _.sprintf(gettext("Sliced %(stl)s to %(gcode)s, took %(time).2f seconds"), payload), type: "success"});
|
||||
} else if (type == "SlicingCancelled") {
|
||||
gcodeUploadProgress.removeClass("progress-striped").removeClass("active");
|
||||
gcodeUploadProgressBar.css("width", "0%");
|
||||
gcodeUploadProgressBar.text("");
|
||||
slicingProgressBar.css("width", "0%");
|
||||
slicingProgress.removeClass("progress-striped").removeClass("active");
|
||||
slicingProgressBar.text("");
|
||||
} else if (type == "SlicingFailed") {
|
||||
gcodeUploadProgress.removeClass("progress-striped").removeClass("active");
|
||||
gcodeUploadProgressBar.css("width", "0%");
|
||||
gcodeUploadProgressBar.text("");
|
||||
slicingProgressBar.css("width", "0%");
|
||||
slicingProgress.removeClass("progress-striped").removeClass("active");
|
||||
slicingProgressBar.text("");
|
||||
|
||||
html = _.sprintf(gettext("Could not slice %(stl)s to %(gcode)s: %(reason)s"), payload);
|
||||
new PNotify({title: gettext("Slicing failed"), text: html, type: "error", hide: false});
|
||||
|
|
|
|||
Loading…
Reference in a new issue