improved preview of gcode generated through img2gcode

This commit is contained in:
Teja 2015-08-16 11:43:28 +02:00
parent b2555d3850
commit 8bb698c886
4 changed files with 32 additions and 13 deletions

View file

@ -269,8 +269,6 @@ $(function(){
data: JSON.stringify(data)
});
self.gcodeFilename(undefined);
self.svg = undefined;
}
};
@ -300,11 +298,16 @@ $(function(){
// gcode_location: "local"
// stl: "local/angelina_jolie_20091211_0193_11more_i1000s300.svg"
// time: 30.612739086151123
self.gcodeFilename(undefined);
self.svg = undefined;
$("#dialog_vector_graphics_conversion").modal("hide");
self.slicing_in_progress(false);
};
self.onEventSlicingCancelled = function(payload){
self.gcodeFilename(undefined);
self.svg = undefined;
self.slicing_in_progress(false);
$("#dialog_vector_graphics_conversion").modal("hide");
console.log("onSlicingCancelled" , payload);
};
self.onEventSlicingFailed = function(payload){

View file

@ -31,16 +31,17 @@ $(function() {
var l = gcode_lines[i];
if(l.startsWith(';Image')) {
withinPixelCode = true;
// ;Image: 24.71x18.58 @ 2.59,1.70
var re = /;Image: ([-+]?[0-9]*\.?[0-9]+)x([-+]?[0-9]*\.?[0-9]+) @ ([-+]?[0-9]*\.?[0-9]+),([-+]?[0-9]*\.?[0-9]+)/;
// ;Image: 24.71x18.58 @ 2.59,1.70|http://localhost:5000/serve/files/local/filename.png
var re = /;Image: ([-+]?[0-9]*\.?[0-9]+)x([-+]?[0-9]*\.?[0-9]+) @ ([-+]?[0-9]*\.?[0-9]+),([-+]?[0-9]*\.?[0-9]+)\|(.*)$/;
var match = l.match(re);
if(match){
var w = parseFloat(match[1]);
var h = parseFloat(match[2]);
var x = parseFloat(match[3]);
var y = parseFloat(match[4]);
var file_id = match[5];
if(typeof imgCallback === 'function'){
imgCallback(x,y,w,h);
imgCallback(x,y,w,h, file_id);
}
}
}

View file

@ -177,8 +177,8 @@ $(function(){
self.draw_gcode(points, intensity, '#'+previewId);
};
var imgCallback = function(x,y,w,h){
self.draw_gcode_img_placeholder(x,y,w,h, '#'+previewId)
var imgCallback = function(x,y,w,h, url){
self.draw_gcode_img_placeholder(x,y,w,h,url, '#'+previewId)
};
self.parser.parse(gcode, /(m0?3)|(m0?5)/i, pathCallback, imgCallback);
});
@ -407,7 +407,7 @@ $(function(){
var newImg = snap.image(url, 0, y, wPT, hPT);
var id = self.getEntryId(file);
var previewId = self.generateUniqueId(id); // appends # if multiple times the same design is placed.
newImg.attr({id: previewId, filter: 'url(#grayscale_filter)'});
newImg.attr({id: previewId, filter: 'url(#grayscale_filter)', 'data-serveurl': url});
snap.select("#userContent").append(newImg);
newImg.transformable();
newImg.ftDisableRotate();
@ -673,12 +673,20 @@ $(function(){
snap.select(target).append(p);
};
self.draw_gcode_img_placeholder = function(x,y,w,h, target){
self.draw_gcode_img_placeholder = function(x,y,w,h,url, target){
var i = snap.rect(x,y,w,h).attr({
fill: '#AAAAFF',
stroke: 'none'
stroke: '#AA0000',
'stroke-width': 1
});
snap.select(target).append(i);
if(url !== ""){
var p = snap.image(url,x,y,w,h).attr({
transform: 'matrix(1,0,0,-1,0,'+ String(h) +')',
filter: 'url(#gcimage_preview)'
});
}
snap.select(target).append(p);
};
self.clear_gcode = function(){

View file

@ -266,8 +266,15 @@
height: workingAreaHeightPx()+'px'
}
">
<filter id = "grayscale_filter">
<feColorMatrix in = "SourceGraphic" type = "saturate" values = "0"/>
<filter id="grayscale_filter">
<feColorMatrix in="SourceGraphic" type="saturate" values="0"/>
</filter>
<filter id="gcimage_preview">
<feComponentTransfer>
<feFuncR type="table" tableValues="1"></feFuncR>
<feFuncG type="table" tableValues="0.2 1"></feFuncG>
<feFuncB type="table" tableValues="0.2 1"></feFuncB>
</feComponentTransfer>
</filter>
<g id="scaleGroup" data-bind="attr: { transform: scaleMatrix() }">
<rect data-bind="click: move_laser"