Starting from a better base.
This commit is contained in:
21
archives/scripts/filters/balance.js
Normal file
21
archives/scripts/filters/balance.js
Normal file
@@ -0,0 +1,21 @@
|
||||
function Filter_Balance()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Color];
|
||||
|
||||
this.render = function(params)
|
||||
{
|
||||
var color = params.color() ? params.color().floats() : new Color("#999999").floats();
|
||||
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.size.width*2, ronin.frame.size.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.frame.context().putImageData(originalData, 0, 0);
|
||||
}
|
||||
}
|
||||
64
archives/scripts/filters/chromatic.js
Normal file
64
archives/scripts/filters/chromatic.js
Normal file
@@ -0,0 +1,64 @@
|
||||
function Filter_Chromatic()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Value, Position];
|
||||
//value is maximum distance pixels are shifted
|
||||
//position is where the pixels are shifted from, defaults to half the image
|
||||
|
||||
this.render = function(cmd)
|
||||
{
|
||||
var position = cmd.position() ? cmd.position() : new Position(ronin.frame.size.width,ronin.frame.size.height);
|
||||
var value = cmd.value() ? cmd.value().float : 5;
|
||||
|
||||
this.draw(this.context(),value,position);
|
||||
}
|
||||
|
||||
this.preview = function(cmd)
|
||||
{
|
||||
if(cmd.position()){
|
||||
ronin.overlay.draw(cmd.position());
|
||||
}
|
||||
}
|
||||
|
||||
this.draw = function(context = this.context(), value, position)
|
||||
{
|
||||
var w = ronin.frame.size.width;
|
||||
var h = ronin.frame.size.height;
|
||||
|
||||
//no longer letting you set how far each chanel is shifted, not sure how to receive extra data any more
|
||||
var s = {r:value,g:value*.5,b:0};
|
||||
|
||||
var context = ronin.frame.context();
|
||||
|
||||
//now need two imagedatas to sample off of, for some reason I cant just dump the new pixels into an empty array :/
|
||||
var originalData = context.getImageData(0, 0, w*2, h*2);
|
||||
var imageData = context.getImageData(0, 0, w*2, h*2);
|
||||
|
||||
var maxLength = Math.sqrt(w*w+h*h);
|
||||
for (var i=0; i<w*2; i++) {
|
||||
for(var j=0; j<h*2; j++){
|
||||
var x = i-position.x;
|
||||
var y = j-position.y;
|
||||
var a = Math.atan2(y,x);
|
||||
var d = Math.sqrt(x*x+y*y);
|
||||
var f = (d-s.r*d/maxLength);
|
||||
x = Math.cos(a)*f+position.x;
|
||||
y = Math.sin(a)*f+position.y;
|
||||
var r = this.get_color_bilinear(originalData, x, y);
|
||||
f = (d-s.g*d/maxLength);
|
||||
x = Math.cos(a)*f+position.x;
|
||||
y = Math.sin(a)*f+position.y;
|
||||
var g = this.get_color_bilinear(originalData, x, y);
|
||||
f = (d-s.b*d/maxLength);
|
||||
x = Math.cos(a)*f+position.x;
|
||||
y = Math.sin(a)*f+position.y;
|
||||
var b = this.get_color_bilinear(originalData, x, y);
|
||||
var c = {r:r.r, g:g.g, b:b.b,a:Math.max(r.a, Math.max(g.a,b.a))};
|
||||
this.set_color(imageData, c, i,j);
|
||||
}
|
||||
}
|
||||
ronin.frame.active_layer.clear();
|
||||
context.putImageData(imageData, 0, 0);
|
||||
}
|
||||
}
|
||||
23
archives/scripts/filters/contrast.js
Normal file
23
archives/scripts/filters/contrast.js
Normal file
@@ -0,0 +1,23 @@
|
||||
function Filter_Contrast()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Value];
|
||||
|
||||
this.render = function(params)
|
||||
{
|
||||
var color = params.color() ? params.color().floats() : new Color("#999999").floats();
|
||||
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.size.width*2, ronin.frame.size.height*2);
|
||||
var data = originalData.data;
|
||||
|
||||
for(var i = 0; i < data.length; i += 4) {
|
||||
var average = parseFloat(data[i] + data[i+1] + data[i+2])/3;
|
||||
var distance = 50;
|
||||
data[i] = data[i] + distance;
|
||||
data[i + 1] = data[i+1] + distance;
|
||||
data[i + 2] = data[i+2] + distance;
|
||||
}
|
||||
|
||||
ronin.frame.context().putImageData(originalData, 0, 0);
|
||||
}
|
||||
}
|
||||
93
archives/scripts/filters/filter.js
Normal file
93
archives/scripts/filters/filter.js
Normal file
@@ -0,0 +1,93 @@
|
||||
function Filter()
|
||||
{
|
||||
this.name = "Unknown";
|
||||
this.parameters = [];
|
||||
|
||||
this.render = function(cmd)
|
||||
{
|
||||
console.log("render: Nothing here.");
|
||||
}
|
||||
|
||||
this.preview = function(cmd)
|
||||
{
|
||||
console.log("render: Nothing here.");
|
||||
}
|
||||
|
||||
this.get_neighbors = function(pixels,x,y)
|
||||
{
|
||||
return [
|
||||
this.get_color(pixels,x-1,y-1),this.get_color(pixels,x,y-1),this.get_color(pixels,x+1,y-1),
|
||||
this.get_color(pixels,x-1,y),this.get_color(pixels,x,y),this.get_color(pixels,x+1,y),
|
||||
this.get_color(pixels,x-1,y+1),this.get_color(pixels,x,y+1),this.get_color(pixels,x+1,y+1),
|
||||
];
|
||||
}
|
||||
|
||||
this.get_neighbors_average = function(pixels,x,y,weight_map = [1,1,1,1,1,1,1,1,1])
|
||||
{
|
||||
var n = this.get_neighbors(pixels,x,y);
|
||||
var r = 0;
|
||||
var g = 0;
|
||||
var b = 0;
|
||||
for (var i = 0; i < n.length; i++){
|
||||
r += n[i].r * weight_map[i];
|
||||
g += n[i].g * weight_map[i];
|
||||
b += n[i].b * weight_map[i];
|
||||
}
|
||||
return {r:r/n.length,g:g/n.length,b:b/n.length}
|
||||
}
|
||||
|
||||
this.set_color = function(pixels, color, x, y)
|
||||
{
|
||||
x = Math.max(0,Math.min(x,pixels.width-1));
|
||||
y = Math.max(0,Math.min(y,pixels.height-1));
|
||||
var index = (x+y*pixels.width)*4;
|
||||
pixels.data[index] = color.r;
|
||||
pixels.data[index+1] = color.g;
|
||||
pixels.data[index+2] = color.b;
|
||||
pixels.data[index+3] = color.a;
|
||||
}
|
||||
|
||||
this.get_color = function(pixels,x,y)
|
||||
{
|
||||
x = Math.max(0,Math.min(x,pixels.width-1));
|
||||
y = Math.max(0,Math.min(y,pixels.height-1));
|
||||
var index = (x+y*pixels.width)*4;
|
||||
return {r:pixels.data[index], g:pixels.data[index+1], b:pixels.data[index+2], a:pixels.data[index+3]};
|
||||
}
|
||||
|
||||
this.get_color_bilinear = function(pixels, x, y)
|
||||
{
|
||||
var c1 = this.get_color(pixels, Math.floor(x),Math.floor(y));
|
||||
var c2 = this.get_color(pixels, Math.ceil(x),Math.floor(y));
|
||||
var c3 = this.get_color(pixels, Math.floor(x),Math.ceil(y));
|
||||
var c4 = this.get_color(pixels, Math.ceil(x),Math.ceil(y));
|
||||
return this.lerp_color(this.lerp_color(c1,c2, x%1),this.lerp_color(c3,c4, x%1), y%1);
|
||||
}
|
||||
|
||||
this.lerp_color = function(c1, c2, t)
|
||||
{
|
||||
return {r:c1.r+t*(c2.r-c1.r), g:c1.g+t*(c2.g-c1.g), b:c1.b+t*(c2.b-c1.b), a:c1.a+t*(c2.a-c1.a)};
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
this.context = function()
|
||||
{
|
||||
return ronin.frame.context();
|
||||
}
|
||||
|
||||
this.pixels = function()
|
||||
{
|
||||
return ronin.frame.context().getImageData(0,0,ronin.frame.size.width * 2,ronin.frame.size.height * 2);
|
||||
}
|
||||
|
||||
this.hint = function()
|
||||
{
|
||||
var html = "";
|
||||
|
||||
for(id in this.parameters){
|
||||
html += this.parameters[id]+" ";
|
||||
}
|
||||
return html;
|
||||
}
|
||||
}
|
||||
22
archives/scripts/filters/grey.js
Normal file
22
archives/scripts/filters/grey.js
Normal file
@@ -0,0 +1,22 @@
|
||||
function Filter_Grey()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Color];
|
||||
|
||||
this.render = function(params)
|
||||
{
|
||||
var color = params.color() ? params.color().floats() : new Color("#36ba0e").floats();
|
||||
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.size.width*2, ronin.frame.size.height*2);
|
||||
var data = originalData.data;
|
||||
|
||||
for(var i = 0; i < data.length; i += 4) {
|
||||
var r = data[i];
|
||||
var g = data[i+1];
|
||||
var b = data[i+2];
|
||||
var v = color.r*r + color.g*g + color.b*b;
|
||||
data[i] = data[i+1] = data[i+2] = v
|
||||
}
|
||||
ronin.frame.context().putImageData(originalData, 0, 0);
|
||||
}
|
||||
}
|
||||
27
archives/scripts/filters/invert.js
Normal file
27
archives/scripts/filters/invert.js
Normal file
@@ -0,0 +1,27 @@
|
||||
function Filter_Invert()
|
||||
{
|
||||
Filter.call(this);
|
||||
this.parameters = [];
|
||||
|
||||
this.render = function(cmd)
|
||||
{
|
||||
var imageObj = new Image();
|
||||
imageObj.src = ronin.frame.active_layer.element.toDataURL('image/png');
|
||||
|
||||
var w = ronin.frame.size.width;
|
||||
var h = ronin.frame.size.height;
|
||||
var context = ronin.frame.context();
|
||||
|
||||
var originalData = context.getImageData(0, 0, w*2, h*2);
|
||||
var data = originalData.data;
|
||||
|
||||
for(var i = 0; i < data.length; i += 4) {
|
||||
data[i] = 255 - data[i];
|
||||
data[i + 1] = 255 - data[i + 1];
|
||||
data[i + 2] = 255 - data[i + 2];
|
||||
}
|
||||
|
||||
ronin.frame.active_layer.clear();
|
||||
context.putImageData(originalData, 0, 0);
|
||||
}
|
||||
}
|
||||
22
archives/scripts/filters/saturate.js
Normal file
22
archives/scripts/filters/saturate.js
Normal file
@@ -0,0 +1,22 @@
|
||||
function Filter_Saturate()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Color];
|
||||
|
||||
this.render = function(params)
|
||||
{
|
||||
var color = params.color() ? params.color().floats() : new Color("#999999").floats();
|
||||
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.size.width*2, ronin.frame.size.height*2);
|
||||
var data = originalData.data;
|
||||
|
||||
for(var i = 0; i < data.length; i += 4) {
|
||||
var average = parseFloat(data[i] + data[i+1] + data[i+2])/3;
|
||||
data[i] = (average+(data[i]*color.r))/2;
|
||||
data[i + 1] = (average+(data[i+1]*color.g))/2;
|
||||
data[i + 2] = (average+(data[i+2]*color.b))/2;
|
||||
}
|
||||
|
||||
ronin.frame.context().putImageData(originalData, 0, 0);
|
||||
}
|
||||
}
|
||||
57
archives/scripts/filters/sharpen.js
Normal file
57
archives/scripts/filters/sharpen.js
Normal file
@@ -0,0 +1,57 @@
|
||||
function Filter_Sharpen()
|
||||
{
|
||||
Filter.call(this);
|
||||
|
||||
this.parameters = [Value];
|
||||
|
||||
this.render = function(cmd)
|
||||
{
|
||||
var imageObj = new Image();
|
||||
imageObj.src = ronin.frame.active_layer.element.toDataURL('image/png');
|
||||
|
||||
var w = ronin.frame.size.width;
|
||||
var h = ronin.frame.size.height;
|
||||
var context = ronin.frame.context();
|
||||
|
||||
var originalData = context.getImageData(0, 0, w*2, h*2);
|
||||
var data = originalData.data;
|
||||
var newImage = context.getImageData(0, 0, w*2, h*2);
|
||||
|
||||
var strenght = cmd.value() ? cmd.value().float : 1;
|
||||
|
||||
var ver = -1;
|
||||
var dia = 1;
|
||||
var cen = 8;
|
||||
|
||||
var weight_map = [
|
||||
dia * strenght, ver * strenght, dia * strenght,
|
||||
ver * strenght, cen * strenght, ver * strenght,
|
||||
dia * strenght, ver * strenght, dia * strenght
|
||||
];
|
||||
|
||||
for(var i = 0; i < data.length; i += 4) {
|
||||
var p = i / 4;
|
||||
var x = (p % originalData.width);
|
||||
var y = parseInt(p/originalData.width);
|
||||
|
||||
var average = this.get_neighbors_average(originalData,x,y,weight_map);
|
||||
newImage.data[i] = parseInt(average.r);
|
||||
newImage.data[i+1] = parseInt(average.g);
|
||||
newImage.data[i+2] = parseInt(average.b);
|
||||
}
|
||||
|
||||
ronin.frame.active_layer.clear();
|
||||
context.putImageData(newImage, 0, 0);
|
||||
}
|
||||
|
||||
this.preview = function(cmd)
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
this.draw = function(context = this.context(), value, position)
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
83
archives/scripts/filters/stencil.js
Normal file
83
archives/scripts/filters/stencil.js
Normal file
@@ -0,0 +1,83 @@
|
||||
function Filter_Stencil()
|
||||
{
|
||||
Filter.call(this);
|
||||
this.parameters = [Angle,Color];
|
||||
|
||||
this.render = function(cmd)
|
||||
{
|
||||
var angle = cmd.angle() ? cmd.angle().degrees : 20;
|
||||
var color = cmd.color() ? cmd.color().hex : "#000000";
|
||||
|
||||
this.draw(ronin.frame.context(),angle,color);
|
||||
if(ronin.render.layer){ ronin.render.layer.remove(this); }
|
||||
|
||||
return 1, "ok";
|
||||
}
|
||||
|
||||
this.preview = function(cmd)
|
||||
{
|
||||
var angle = cmd.angle() ? cmd.angle().degrees : 20;
|
||||
var color = cmd.color() ? cmd.color().hex : "#000000";
|
||||
|
||||
ronin.render.get_layer().clear();
|
||||
this.draw(ronin.render.layer.context(),angle,color);
|
||||
}
|
||||
|
||||
this.draw = function(context = this.context(), angle, color)
|
||||
{
|
||||
var w = ronin.frame.size.width;
|
||||
var h = ronin.frame.size.height;
|
||||
|
||||
context.translate(w/2,h/2);
|
||||
|
||||
context.rotate(angle*Math.PI/180);
|
||||
|
||||
this.line(context,-w,0,w,0,color);
|
||||
|
||||
this.line(context,w*0.4,-h,w*0.4,h,color);
|
||||
this.line(context,-w*0.4,-h,-w*0.4,h,color);
|
||||
|
||||
this.line(context,-w,h*0.25,w,h*0.25,color);
|
||||
this.line(context,-w,-h*0.25,w,-h*0.25,color);
|
||||
|
||||
this.line(context,w*0.1,0,w*0.1,h,color);
|
||||
this.line(context,-w*0.1,0,-w*0.1,-h,color);
|
||||
|
||||
this.circle(context,w*0.4,-h*0.25,w*0.05,1,1.5,color);
|
||||
this.circle(context,-w*0.4,h*0.25,w*0.05,0,0.5,color);
|
||||
|
||||
context.font = "5px Arial";
|
||||
context.fillStyle = color;
|
||||
context.fillText(angle+"'",(w*0.4)+10,10);
|
||||
|
||||
context.font = "5px Arial";
|
||||
context.fillStyle = color;
|
||||
context.fillText(angle+"'",(-w*0.4)-20,-10);
|
||||
|
||||
context.rotate(-angle*Math.PI/180);
|
||||
context.translate(-w/2,-h/2);
|
||||
}
|
||||
|
||||
this.line = function(context,x1,x2,y1,y2,color)
|
||||
{
|
||||
context.beginPath();
|
||||
context.moveTo(x1,x2);
|
||||
context.lineTo(y1,y2);
|
||||
context.lineCap="round";
|
||||
context.lineWidth = 0.5;
|
||||
context.strokeStyle = color;
|
||||
context.stroke();
|
||||
context.closePath();
|
||||
}
|
||||
|
||||
this.circle = function(context,x,y,r,c1,c2,color)
|
||||
{
|
||||
context.beginPath();
|
||||
context.arc(x,y,r,c1*Math.PI,c2*Math.PI);
|
||||
context.lineCap="round";
|
||||
context.lineWidth = 0.5;
|
||||
context.strokeStyle = color;
|
||||
context.stroke();
|
||||
context.closePath();
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user