Implemented filter

This commit is contained in:
Devine Lu Linvega
2017-11-07 20:39:55 +13:00
parent 021f2fc048
commit 806bcfc954
15 changed files with 155 additions and 190 deletions

View File

@@ -0,0 +1,18 @@
function Filter()
{
Module.call(this,"filter","Pixel filter");
this.methods.balance = new Method("balance","#ff0033","Filter color balance.",function(q){
var color = {r:1,g:0,b:0.5};
var originalData = ronin.render.context().getImageData(0, 0, ronin.frame.settings.width*2, ronin.frame.settings.height*2);
var data = originalData.data;
for(var i = 0; i < data.length; i += 4) {
data[i] = data[i] * (color.r + 0.5);
data[i + 1] = data[i + 1] * (color.g + 0.5);
data[i + 2] = data[i + 2] * (color.b + 0.5);
}
ronin.preview.context().putImageData(originalData, 0, 0);
});
}

View File

@@ -4,24 +4,14 @@ function Frame()
this.settings = {width:400,height:400};
this.methods = {};
this.methods.resize = new Method("resize","WxH");
this.methods.resize.run = function(q)
{
this.methods.resize = new Method("resize","WxH","Resize canvas to size.",function(q){
var data = ronin.render.select(0,0,ronin.frame.settings.width,ronin.frame.settings.height);
ronin.render.clear();
ronin.frame.resize_to(q);
ronin.render.context().putImageData(data, 0, 0);
}
});
this.methods.rescale = new Method("rescale","X,Y|WxH");
this.methods.rescale.run = function(p)
{
// Create a canvas copy
this.methods.rescale = new Method("rescale","0.5","Rescale canvas to float.",function(p){
var copy_canvas = document.createElement("canvas");
copy_canvas.width = ronin.frame.settings.width * 2;
copy_canvas.height = ronin.frame.settings.height * 2;
@@ -30,33 +20,25 @@ function Frame()
var new_size = {width:ronin.frame.settings.width * p,height:ronin.frame.settings.height * p};
// Paste
ronin.render.clear();
ronin.frame.resize_to(new_size);
ronin.render.context().drawImage(copy_ctx.canvas,0,0,new_size.width * 2,new_size.height * 2);
}
});
this.methods.crop = new Method("crop","X,Y|WxH");
this.methods.crop.run = function(p)
{
this.methods.crop = new Method("crop","X,Y|WxH","Crop canvas to rect.",function(p){
var data = ronin.render.select(p.x,p.y,p.width,p.height);
ronin.render.clear();
ronin.frame.resize_to(p);
ronin.render.context().putImageData(data, 0, 0);
}
});
this.methods.clear = new Method("clear","X,Y|WxH");
this.methods.clear.run = function(q)
{
ronin.render.fill("blue");
}
this.methods.clear = new Method("clear","","Erase entire canvas",function(q){
ronin.render.clear();
});
this.methods.fill = new Method("fill","X,Y|WxH");
this.methods.fill.run = function(q)
{
this.methods.fill = new Method("fill","#f00","Fill entire canvas with color",function(q){
ronin.render.fill(q);
}
});
this.resize_to = function(size)
{

View File

@@ -1,17 +1,10 @@
function IO()
{
Module.call(this,"io","File import/export tools.");
this.settings = {anchor:{x:0,y:0,width:200,height:200}};
this.methods = {};
this.image = null;
this.methods.load = new Method("load","browser","Press enter to open the file browser.");
this.methods.load.run = function(q)
{
this.methods.load = new Method("load","browser","Press enter to open the file browser.",function(q){
var filepath = dialog.showOpenDialog({properties: ['openFile']});
if(!filepath){ console.log("Nothing to load"); return; }
@@ -25,38 +18,17 @@ function IO()
ronin.commander.inject("io draw:20,20|100x100");
}
});
}
});
this.methods.draw = new Method("draw","X,Y|WxH","Draw the loaded image pixels.");
this.methods.draw.run = function(q)
{
this.methods.draw = new Method("draw","X,Y|WxH","Draw the loaded image pixels.",function(q){
if(!ronin.io.image){ return; }
ronin.io.draw_image(ronin.render.context(),ronin.io.image,ronin.commander.query().methods.draw);
ronin.io.image = null;
ronin.preview.clear();
}
});
this.methods.save = new Method("save","name");
this.methods.save.run = function(q)
{
// TODO
ronin.io.render();
}
this.preview = function(q)
{
ronin.preview.clear();
if(ronin.commander.query().methods.draw && this.image){
this.draw_image(ronin.preview.context(),this.image,ronin.commander.query().methods.draw);
}
}
this.render = function()
{
this.methods.save = new Method("save","name","Export canvas.",function(q){
var fs = require('fs');
var data = ronin.render.to_base64('jpg').replace(/^data:image\/\w+;base64,/, "");
var buf = new Buffer(data, 'base64');
@@ -65,54 +37,14 @@ function IO()
if (fileName === undefined){ return; }
fs.writeFile(fileName+'.jpg', buf);
});
}
});
this.drag_over = function(e)
this.preview = function(q)
{
e.stopPropagation();
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
}
ronin.preview.clear();
this.drop = function(e)
{
e.stopPropagation();
e.preventDefault();
var files = e.dataTransfer.files;
var file = files[0];
if (!file.type.match(/image.*/)) { console.log("Not image"); return false; }
var reader = new FileReader();
reader.onload = function(event)
{
ronin.io.inject(event.target.result);
}
reader.readAsDataURL(file);
}
this.inject = function(data_url)
{
var img = new Image();
img.src = data_url;
var width = parseInt(img.naturalWidth * 0.5);
var height = parseInt(img.naturalHeight * 0.5);
// if(height > 700){
// width *= 0.5;
// height *= 0.5;
// }
// if(height > 1400){
// width *= 0.25;
// height *= 0.25;
// }
ronin.frame.methods.resize({width:parseInt(width),height:parseInt(height)})
img.onload = function() {
ronin.render.context().drawImage(img, 0,0,width * 2,height * 2);
if(ronin.commander.query().methods.draw && this.image){
this.draw_image(ronin.preview.context(),this.image,ronin.commander.query().methods.draw);
}
}

View File

@@ -2,14 +2,14 @@ function Line()
{
Module.call(this,"line","Drawing lines. Tween expects something in the `$&$>>$&$` format.");
this.methods = {};
this.ports = {};
this.ports.step = new Port(this,"step",false,true,0,100,"The tween line index.");
this.ports.thickness = new Port(this,"thickness",true,true,1,100,"The tween line thickness.");
this.methods.tween = function(q) // line tween:$&$>>$&$ step->thickness
{
this.methods.stroke = new Method("stroke","x1,y1&x2,y2","Stroke positions.",function(q){
ronin.line.stroke_multi(q)
})
this.methods.tween = new Method("tween","tween:$&$>>$&$ step->thickness","Stroke lines between strokes.",function(q){
var from = q.from;
var to = q.to;
@@ -20,12 +20,7 @@ function Line()
ronin.line.stroke_multi(new_positions);
ronin.line.ports.step.write(ronin.line.ports.step.value+1);
}
}
this.methods.stroke = function(q)
{
ronin.line.stroke_multi(q)
}
})
this.preview = function(q)
{

View File

@@ -4,21 +4,17 @@ function Magnet()
this.settings = {size:0,step:4};
this.methods.lock = function(q)
{
this.methods.lock = new Method("lock","10x10","Magnetize cursor",function(q){
var size = parseInt(q);
ronin.magnet.settings.size = size;
if(size < 5){ this.unlock(); return; }
ronin.magnet.settings.size = size;
ronin.grid.draw(size,ronin.magnet.settings.step);
}
})
this.methods.unlock = function(q)
{
this.methods.unlock = new Method("unlock","","Release cursor",function(q){
ronin.magnet.settings.size = 0;
ronin.grid.clear();
}
})
this.filter = function(pos)
{

View File

@@ -4,9 +4,7 @@ function Path()
this.settings = {thickness:30,color:"black",cap:"square"};
this.methods.stroke = new Method("stroke","x,y&");
this.methods.stroke.run = function(q)
{
this.methods.stroke = new Method("stroke","x,y&","",function(q){
ronin.preview.clear();
var path = ronin.path.create_path(q);
@@ -19,11 +17,9 @@ function Path()
ctx.strokeStyle = "black";
ctx.stroke(new Path2D(path));
ctx.closePath();
}
});
this.methods.fill = new Method("fill","x,y&");
this.methods.fill.run = function(q)
{
this.methods.fill = new Method("fill","x,y&","",function(q){
ronin.preview.clear();
var path = ronin.path.create_path(q);
@@ -36,7 +32,7 @@ function Path()
ctx.fillStyle = "black";
ctx.fill(new Path2D(path));
ctx.closePath();
}
});
this.preview = function(q)
{