Trying to build a contrast & saturation filter

This commit is contained in:
Devine Lu Linvega
2017-04-09 08:47:44 -10:00
parent 3562c81d57
commit 1454ef2dea
16 changed files with 97 additions and 107 deletions

View File

@@ -4,44 +4,18 @@ function Filter_Balance()
this.parameters = [Color];
this.render = function(cmd)
this.render = function(params)
{
if(!cmd.color()){ return; }
if(!cmd.color().rgb()){ return; }
this.draw(ronin.frame.context(),cmd.color().rgb());
}
this.preview = function(cmd)
{
if(!cmd.color()){ return; }
if(!cmd.color().rgb()){ return; }
this.draw(ronin.render.layer.context(),cmd.color().rgb());
}
this.draw = function(context = this.context(), color_rgb)
{
var imageObj = new Image();
imageObj.src = ronin.frame.active_layer.element.toDataURL('image/png');
var w = ronin.frame.settings["size"].width;
var h = ronin.frame.settings["size"].height;
var originalData = ronin.frame.context().getImageData(0, 0, w*2, h*2);
var color = params.color() ? params.color().floats() : new Color("#999999").floats();
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.settings["size"].width*2, ronin.frame.settings["size"].height*2);
var data = originalData.data;
var r = (color_rgb.r / 255) + 0.5;
var g = (color_rgb.g / 255) + 0.5;
var b = (color_rgb.b / 255) + 0.5;
for(var i = 0; i < data.length; i += 4) {
data[i] = data[i] * r;
data[i + 1] = data[i + 1] * g;
data[i + 2] = data[i + 2] * b;
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.render.layer.clear();
context.putImageData(originalData, 0, 0);
ronin.frame.context().putImageData(originalData, 0, 0);
}
}

View 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.settings["size"].width*2, ronin.frame.settings["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);
}
}

View File

@@ -4,50 +4,19 @@ function Filter_Grey()
this.parameters = [Color];
this.render = function(cmd)
this.render = function(params)
{
if(cmd.color() && cmd.color().rgb()){
this.draw(ronin.frame.context(),cmd.color().rgb());
}
else{
this.draw(ronin.frame.context());
}
}
this.preview = function(cmd)
{
if(cmd.color() && cmd.color().rgb()){
this.draw(ronin.render.layer.context(),cmd.color().rgb());
}
else{
this.draw(ronin.render.layer.context());
}
}
this.draw = function(context = this.context(), color_rgb = new Color("#36ba0e").rgb())
{
var imageObj = new Image();
imageObj.src = ronin.frame.active_layer.element.toDataURL('image/png');
var w = ronin.frame.settings["size"].width;
var h = ronin.frame.settings["size"].height;
var originalData = ronin.frame.context().getImageData(0, 0, w*2, h*2);
var color = params.color() ? params.color().floats() : new Color("#36ba0e").floats();
var originalData = ronin.frame.context().getImageData(0, 0, ronin.frame.settings["size"].width*2, ronin.frame.settings["size"].height*2);
var data = originalData.data;
var _r = (color_rgb.r / 255);
var _g = (color_rgb.g / 255);
var _b = (color_rgb.b / 255);
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 = _r*r + _g*g + _b*b;
var v = color.r*r + color.g*g + color.b*b;
data[i] = data[i+1] = data[i+2] = v
}
ronin.render.layer.clear();
context.putImageData(originalData, 0, 0);
ronin.frame.context().putImageData(originalData, 0, 0);
}
}

View 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.settings["size"].width*2, ronin.frame.settings["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);
}
}