Hi all, im trying to code my own webgl filter plugin (brightness , contrast, gamma), but it's not work very well :
I try to change the brightness, but it follows that we no longer see the images, an idea?
Code
var krpanoplugin = function()
{
var local = this;
local.name = "filter";
local.version = "1.19.14";
var krpano = null;
var plugin = null;
var imageObj = null;
var canvas = null;
var context = null;
var shader_passes = 6;
var shaders = null;
var xml_brightness = null;
var xml_contrast = null;
var xml_gamma = null;
function get_shader_src()
{
return ""+
"precision mediump float;"+
"uniform sampler2D sm;"+ // sm = the screen as input texture sampler
"uniform float brightness;"+ // a custom uniform
"uniform float contrast;"+ // a custom uniform
"uniform float gamma;"+ // a custom uniform
"varying vec2 tx;"+ // tx = the texture coordinates (0.0,0.0 to 1.0,1.0)
"void main()"+
"{"+
"vec4 color = texture2D(sm,vec2(tx.x, tx.y));"+
"vec4 newcolor = vec4(0.0, 0.0, 0.0, 1.0);"+
"newcolor.r = (pow(color.r,gamma) - 0.5)*contrast + brightness + 0.5;"+
"newcolor.g = (pow(color.g,gamma) - 0.5)*contrast + brightness + 0.5;"+
"newcolor.b = (pow(color.b,gamma) - 0.5)*contrast + brightness + 0.5;"+
"gl_FragColor = newcolor;"+
"}";
}
local.registerplugin = function(krpanointerface, pluginpath, pluginobject)
{
krpano = krpanointerface;
plugin = pluginobject;
if (krpano.version < "1.19" || krpano.build < "2017-12-01")
{
krpano.trace(3, local.name+" - too old krpano version (min. 1.19.14)");
return;
}
if (krpano.webGL) {
shaders = new Array(shader_passes);
for (var i = 0; i < shader_passes; i++) {
shaders[i] = krpano.webGL.createPostProcessingShader(get_shader_src(), "brightness,contrast,gamma");
if (shaders[i]) {
krpano.webGL.ppShaderArray.push(shaders[i]);
}
}
}
plugin.registerattribute("brightness", xml_brightness, api_brightness_set, api_brightness_get);
plugin.registerattribute("contrast", xml_contrast, api_contrast_set, api_contrast_get);
plugin.registerattribute("gamma", xml_gamma, api_gamma_set, api_gamma_get);
plugin.setshader = setshader;
plugin.removeshader = removeshader;
}
function setshader(){
}
function removeshader()
{
krpano.webGL.useShader(null);
}
function remove_shader_from_krpano()
{
var ppShaderArray = krpano.webGL.ppShaderArray;
for (var i=0; i<ppShaderArray.length; i++)
for (var j=0; j<shader_passes; j++)
{
if ( ppShaderArray[i] === shaders[j] )
{
ppShaderArray.splice(i,1);
shaders[j] = null;
}
}
}
local.unloadplugin = function()
{
if (shaders)
{
for (var i=0; i<shader_passes; i++)
{
krpano.webGL.deleteShader(shaders[i]);
}
remove_shader_from_krpano();
shaders = null;
}
plugin = null;
krpano = null;
}
/*
* brightness
* */
function api_brightness_set(value)
{
// convert to number
value = Number(value);
// is a valid number?
if ( !isNaN(value) )
{
xml_brightness = value;
// update the shader uniform
api_shader_update();
}
}
function api_brightness_get()
{
return xml_brightness;
}
/*
* contrast
* */
function api_contrast_set(value)
{
// convert to number
value = Number(value);
// is a valid number?
if ( !isNaN(value) )
{
xml_contrast = value;
// update the shader uniform
// api_shader_update();
}
}
function api_contrast_get()
{
return xml_contrast;
}
/*
* gamma
* */
function api_gamma_set(value)
{
// convert to number
value = Number(value);
// is a valid number?
if ( !isNaN(value) )
{
xml_gamma = value;
// update the shader uniform
//api_shader_update();
}
}
function api_gamma_get()
{
return xml_gamma;
}
/**
*
* shader update
*/
function api_shader_update()
{
// update the shader
if (shaders)
{
for (var i=0; i<shader_passes; i++)
{
krpano.webGL.useShader(shaders[i]);
var pass_brightness = (((i >> 1)+1) / (shader_passes/2.0)) * xml_brightness;
var pass_contrast = (((i >> 1)+1) / (shader_passes/2.0)) * xml_contrast;
var pass_gamma = (((i >> 1)+1) / (shader_passes/2.0)) * xml_gamma;
var pass_tx = (i & 1) == 0 ? 1.0 : 0.0;
krpano.webGL.context.uniform1f(shaders[i].brightness, pass_brightness);
krpano.webGL.context.uniform1f(shaders[i].contrast, pass_contrast);
krpano.webGL.context.uniform1f(shaders[i].gamma, pass_gamma);
krpano.webGL.context.uniform2f(shaders[i].tx, pass_tx, 1.0 - pass_tx);
}
// restore
krpano.webGL.useShader(null);
// need a redraw
krpano.view.haschanged = true;
}
}
};
Alles anzeigen
result with brightness at 0.5