diff --git a/src/octoprint/plugins/svgtogcode/static/css/svgtogcode.css b/src/octoprint/plugins/svgtogcode/static/css/svgtogcode.css index 6c994ff0..c4627248 100644 --- a/src/octoprint/plugins/svgtogcode/static/css/svgtogcode.css +++ b/src/octoprint/plugins/svgtogcode/static/css/svgtogcode.css @@ -28,7 +28,7 @@ table th.settings_plugin_svgtogcode_profiles_key,table td.settings_plugin_svgtog } .slider_manual_input.noleftspace{ - margin-left: 0em; + margin-left: 0; } svg text { @@ -38,4 +38,30 @@ svg text { cursor: default; pointer-events: none; -} \ No newline at end of file +} + +.img_slider{ + margin-bottom: 24px; +} + +.img_preprocessing_preview { + background-size: 150px; + display: inline-block; + width: 150px; + height: 150px; +} + +.img_preprocessing_preview.after { + position:relative; +} +.img_preprocessing_preview.after>div { + position: absolute; + top:0; + left:0; +} + +.img_preprocessing_preview.after .contrast, +.img_preprocessing_preview.after .sharpened, +.img_preprocessing_preview.after .sharpened_contrast { + opacity: 0; +} diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast.png new file mode 100644 index 00000000..a8c30064 Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast_sharpened.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast_sharpened.png new file mode 100644 index 00000000..e2e94b69 Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_contrast_sharpened.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered.png new file mode 100644 index 00000000..ec405f86 Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered_150.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered_150.png new file mode 100644 index 00000000..015ecaac Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_dithered_150.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_grayscale.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_grayscale.png new file mode 100644 index 00000000..35fb7e0f Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_grayscale.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened.png new file mode 100644 index 00000000..7cd0a60c Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened_contrast.png b/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened_contrast.png new file mode 100644 index 00000000..02989be8 Binary files /dev/null and b/src/octoprint/plugins/svgtogcode/static/img/kitty_sharpened_contrast.png differ diff --git a/src/octoprint/plugins/svgtogcode/static/js/convert.js b/src/octoprint/plugins/svgtogcode/static/js/convert.js index 9e1648f5..9e62eb75 100644 --- a/src/octoprint/plugins/svgtogcode/static/js/convert.js +++ b/src/octoprint/plugins/svgtogcode/static/js/convert.js @@ -42,6 +42,21 @@ $(function(){ self.imgDithering = ko.observable(false); self.imgSharpening = ko.observable(1); self.imgContrast = ko.observable(1); + + // preprocessing preview + self.sharpenedPreview = ko.computed(function(){ + if(self.imgDithering()) return 0; + else { + return (self.imgSharpening() - 1) - (self.imgContrast() - 1)/2; + } + }, self); + self.contrastPreview = ko.computed(function(){ + if(self.imgDithering()) return 0; + else { + return (self.imgContrast() - 1) - (self.imgSharpening() - 1)/2; + } + }, self); + self.maxSpeed.subscribe(function(val){ self._configureFeedrateSlider(); @@ -271,7 +286,7 @@ $(function(){ self.files.conversion = self; self._configureIntensitySlider(); self._configureFeedrateSlider(); -// self._configureImgSliders(); + self._configureImgSliders(); }; self._configureIntensitySlider = function() { @@ -331,24 +346,30 @@ $(function(){ }; self._configureImgSliders = function() { - self.intensitySlider = $("#svgtogcode_img_intensity_slider").slider({ - //id: "svgtogcode_img_intensity_slider_impl", - //reversed: false, - //selection: "after", -// orientation: "horizontal", -// min: 0, -// max: 1000, -// step: 1, - value: [200,500], -// enabled: true, - //formatter: function(value) { return "" ; } - }).on("slideStop", function(ev){ - //self.imgIntensity(ev.value); - //console.log(ev.value); + self.contrastSlider = $("#svgtogcode_contrast_slider").slider({ + step: .1, + min: 1, + max: 2, + value: 1, + tooltip: 'hide', + }).on("slide", function(ev){ + self.imgContrast(ev.value); + }); + + self.sharpeningSlider = $("#svgtogcode_sharpening_slider").slider({ + step: .1, + min: 1, + max: 2, + value: 1, + class: 'img_slider', + tooltip: 'hide', + }).on("slide", function(ev){ + self.imgSharpening(ev.value); }); }; + } ADDITIONAL_VIEWMODELS.push([VectorConversionViewModel, diff --git a/src/octoprint/plugins/svgtogcode/static/js/drag_scale_rotate.js b/src/octoprint/plugins/svgtogcode/static/js/drag_scale_rotate.js index 55c692af..a23966b9 100644 --- a/src/octoprint/plugins/svgtogcode/static/js/drag_scale_rotate.js +++ b/src/octoprint/plugins/svgtogcode/static/js/drag_scale_rotate.js @@ -231,10 +231,14 @@ Snap.plugin(function (Snap, Element, Paper, global) { this.data('ftCallbacks').push(callback); } }; + + Element.prototype.ftDisableRotate = function(){ + this.data('block_rotation', true); + }; }); function rectObjFromBB ( bb ) { - return { x: bb.x, y: bb.y, width: bb.width, height: bb.height } + return { x: bb.x, y: bb.y, width: bb.width, height: bb.height }; } function elementDragStart( mainEl, x, y, ev ) { @@ -292,11 +296,13 @@ Snap.plugin(function (Snap, Element, Paper, global) { var unscale = mainEl.data('unscale'); handle.attr({ cx: +handle.data('ocx') + dx*unscale, cy: +handle.data('ocy') + dy*unscale }); - var angle = Snap.angle( mainBB.cx, mainBB.cy, handle.attr('cx'), handle.attr('cy') ) - 180; - if(event.shiftKey){ - angle = Math.round(angle/30) * 30; - } - mainEl.data("angle", angle ); + if(!mainEl.data('block_rotation')){ + var angle = Snap.angle( mainBB.cx, mainBB.cy, handle.attr('cx'), handle.attr('cy') ) - 180; + if(event.shiftKey){ + angle = Math.round(angle/30) * 30; + } + mainEl.data("angle", angle ); + } var distance = calcDistance( mainBB.cx, mainBB.cy, handle.attr('cx'), handle.attr('cy') ); var scale = distance / mainEl.data("scaleFactor"); diff --git a/src/octoprint/plugins/svgtogcode/static/js/working_area.js b/src/octoprint/plugins/svgtogcode/static/js/working_area.js index 855fe25a..045728fc 100644 --- a/src/octoprint/plugins/svgtogcode/static/js/working_area.js +++ b/src/octoprint/plugins/svgtogcode/static/js/working_area.js @@ -406,6 +406,7 @@ $(function(){ newImg.attr({id: previewId, filter: 'url(#grayscale_filter)'}); snap.select("#userContent").append(newImg); newImg.transformable(); + newImg.ftDisableRotate(); newImg.ftRegisterCallback(self.svgTransformUpdate); file.id = previewId; file.previewId = previewId; diff --git a/src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2 b/src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2 index b1ae3073..f62f8975 100644 --- a/src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2 +++ b/src/octoprint/plugins/svgtogcode/templates/svgtogcode.jinja2 @@ -58,28 +58,41 @@
- +

{{ _('Image Preprocessing') }}

+
+
before
+
after +
+
+
+ +
+
+ +
+ +
+ +
+
+ + +
+ +
+
+
+ +
- - -
- -
- -
- -
- + +

{{ _('Store GCode after conversion:') }}