moved svg 'slicing' dialog to plugin code
added some more files
This commit is contained in:
Philipp Engel
parent
d80cbcdee5
commit
f61b6e8ad0
5 changed files with 179 additions and 39 deletions
|
|
@ -144,7 +144,7 @@ class SvgToGcodePlugin(octoprint.plugin.SlicerPlugin,
|
|||
|
||||
def get_assets(self):
|
||||
return {
|
||||
"js": ["js/svgtogcode.js"],
|
||||
"js": ["js/svgtogcode.js", "js/vectorgraphicsconversion.js"],
|
||||
"less": ["less/svgtogcode.less"],
|
||||
"css": ["css/svgtogcode.css"]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,153 @@
|
|||
$(function() {
|
||||
function VectorGraphicsConversionViewModel(loginStateViewModel) {
|
||||
var self = this;
|
||||
|
||||
self.loginState = loginStateViewModel;
|
||||
|
||||
self.target = undefined;
|
||||
self.file = undefined;
|
||||
self.data = undefined;
|
||||
|
||||
self.defaultSlicer = undefined;
|
||||
self.defaultProfile = undefined;
|
||||
|
||||
self.gcodeFilename = ko.observable();
|
||||
|
||||
self.title = ko.observable();
|
||||
self.slicer = ko.observable();
|
||||
self.slicers = ko.observableArray();
|
||||
self.profile = ko.observable();
|
||||
self.profiles = ko.observableArray();
|
||||
|
||||
self.show = function(target, file) {
|
||||
self.target = target;
|
||||
self.file = file;
|
||||
self.title(_.sprintf(gettext("Convert %(filename)s"), {filename: self.file}));
|
||||
self.gcodeFilename(self.file.substr(0, self.file.lastIndexOf(".")));
|
||||
$("#slicing_configuration_dialog").modal("show");
|
||||
};
|
||||
|
||||
self.slicer.subscribe(function(newValue) {
|
||||
self.profilesForSlicer(newValue);
|
||||
});
|
||||
|
||||
self.enableSliceButton = ko.computed(function() {
|
||||
return self.gcodeFilename() != undefined
|
||||
&& self.gcodeFilename().trim() != ""
|
||||
&& self.slicer() != undefined
|
||||
&& self.profile() != undefined;
|
||||
});
|
||||
|
||||
self.requestData = function() {
|
||||
$.ajax({
|
||||
url: API_BASEURL + "slicing",
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
success: self.fromResponse
|
||||
})
|
||||
};
|
||||
|
||||
self.fromResponse = function(data) {
|
||||
self.data = data;
|
||||
|
||||
var selectedSlicer = undefined;
|
||||
self.slicers.removeAll();
|
||||
_.each(_.values(data), function(slicer) {
|
||||
var name = slicer.displayName;
|
||||
if (name == undefined) {
|
||||
name = slicer.key;
|
||||
}
|
||||
|
||||
if (slicer.default) {
|
||||
selectedSlicer = slicer.key;
|
||||
}
|
||||
|
||||
self.slicers.push({
|
||||
key: slicer.key,
|
||||
name: name
|
||||
});
|
||||
});
|
||||
|
||||
if (selectedSlicer != undefined) {
|
||||
self.slicer(selectedSlicer);
|
||||
}
|
||||
|
||||
self.defaultSlicer = selectedSlicer;
|
||||
};
|
||||
|
||||
self.profilesForSlicer = function(key) {
|
||||
if (key == undefined) {
|
||||
key = self.slicer();
|
||||
}
|
||||
if (key == undefined || !self.data.hasOwnProperty(key)) {
|
||||
return;
|
||||
}
|
||||
var slicer = self.data[key];
|
||||
|
||||
var selectedProfile = undefined;
|
||||
self.profiles.removeAll();
|
||||
_.each(_.values(slicer.profiles), function(profile) {
|
||||
var name = profile.displayName;
|
||||
if (name == undefined) {
|
||||
name = profile.key;
|
||||
}
|
||||
|
||||
if (profile.default) {
|
||||
selectedProfile = profile.key;
|
||||
}
|
||||
|
||||
self.profiles.push({
|
||||
key: profile.key,
|
||||
name: name
|
||||
})
|
||||
});
|
||||
|
||||
if (selectedProfile != undefined) {
|
||||
self.profile(selectedProfile);
|
||||
}
|
||||
|
||||
self.defaultProfile = selectedProfile;
|
||||
};
|
||||
|
||||
self.slice = function() {
|
||||
var gcodeFilename = self._sanitize(self.gcodeFilename());
|
||||
if (!_.endsWith(gcodeFilename.toLowerCase(), ".gco")
|
||||
&& !_.endsWith(gcodeFilename.toLowerCase(), ".gcode")
|
||||
&& !_.endsWith(gcodeFilename.toLowerCase(), ".g")) {
|
||||
gcodeFilename = gcodeFilename + ".gco";
|
||||
}
|
||||
|
||||
var data = {
|
||||
command: "slice",
|
||||
slicer: self.slicer(),
|
||||
profile: self.profile(),
|
||||
gcode: gcodeFilename
|
||||
};
|
||||
|
||||
$.ajax({
|
||||
url: API_BASEURL + "files/" + self.target + "/" + self.file,
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
contentType: "application/json; charset=UTF-8",
|
||||
data: JSON.stringify(data)
|
||||
});
|
||||
|
||||
$("#slicing_configuration_dialog").modal("hide");
|
||||
|
||||
self.gcodeFilename(undefined);
|
||||
self.slicer(self.defaultSlicer);
|
||||
self.profile(self.defaultProfile);
|
||||
};
|
||||
|
||||
self._sanitize = function(name) {
|
||||
return name.replace(/[^a-zA-Z0-9\-_\.\(\) ]/g, "").replace(/ /g, "_");
|
||||
};
|
||||
|
||||
self.onStartup = function() {
|
||||
self.requestData();
|
||||
};
|
||||
}
|
||||
|
||||
ADDITIONAL_VIEWMODELS.push([VectorGraphicsConversionViewModel, ["loginStateViewModel", "settingsViewModel", "slicingViewModel"], document.getElementById("dialog_vector_graphics_conversion")]);
|
||||
|
||||
});
|
||||
24
src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2
Normal file
24
src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
<div id="dialog_vector_graphics_conversion" class="modal hide fade">
|
||||
<div class="modal-header">
|
||||
<a href="#" class="close" data-dismiss="modal" aria-hidden="true">×</a>
|
||||
<h3 data-bind="text: title"></h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{{ _('Please configure which slicer and which slicing profile to use and name the GCode file to slice to below, or click "Cancel" if you do not wish to slice the file now.') }}</p>
|
||||
<form class="form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">{{ _('GCode Filename') }}</label>
|
||||
<div class="controls">
|
||||
<div class="input-append">
|
||||
<input type="text" data-bind="value: gcodeFilename">
|
||||
<span class="add-on">.gco</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">{{ _('Cancel') }}</a>
|
||||
<a href="#" class="btn btn-primary" data-bind="click: function() { if ($root.enableSliceButton()) { $root.slice() } }, enabled: enableSliceButton, css: {disabled: !$root.enableSliceButton()}">{{ _('Slice') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -192,7 +192,7 @@ function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicing
|
|||
self.convertSVG = function(file) {
|
||||
if (!file) return;
|
||||
|
||||
self.slicing.show(file.origin, file.name);
|
||||
self.svgconversion.show(file.origin, file.name);
|
||||
};
|
||||
|
||||
self.initSdCard = function() {
|
||||
|
|
|
|||
|
|
@ -134,40 +134,3 @@
|
|||
<a href="#" class="btn btn-primary" data-bind="click: keepAccessControl, enable: validData(), css: {disabled: !validData()}">{{ _('Keep Access Control Enabled') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="svg_conversion_dialog" class="modal hide fade">
|
||||
<div class="modal-header">
|
||||
<a href="#" class="close" data-dismiss="modal" aria-hidden="true">×</a>
|
||||
<h3 data-bind="text: title"></h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{{ _('Please configure which slicer and which slicing profile to use and name the GCode file to slice to below, or click "Cancel" if you do not wish to slice the file now.') }}</p>
|
||||
<form class="form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">{{ _('Slicer') }}</label>
|
||||
<div class="controls">
|
||||
<select data-bind="options: slicers, optionsText: 'name', optionsValue: 'key', optionsCaption: '{{ _('Select a slicer...') }}', value: slicer, valueAllowUnset: true"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">{{ _('Slicing Profile') }}</label>
|
||||
<div class="controls">
|
||||
<select data-bind="options: profiles, optionsText: 'name', optionsValue: 'key', optionsCaption: '{{ _('Select a profile...') }}', value: profile, valueAllowUnset: true"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">{{ _('GCode Filename') }}</label>
|
||||
<div class="controls">
|
||||
<div class="input-append">
|
||||
<input type="text" data-bind="value: gcodeFilename">
|
||||
<span class="add-on">.gco</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">{{ _('Cancel') }}</a>
|
||||
<a href="#" class="btn btn-primary" data-bind="click: function() { if ($root.enableSliceButton()) { $root.slice() } }, enabled: enableSliceButton, css: {disabled: !$root.enableSliceButton()}">{{ _('Slice') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Reference in a new issue