=": result = A>=B; break;
+ }
+
+ this.setOutputData(0, result );
+}
+
+LiteGraph.registerNodeType("math/condition", MathCondition);
+
+
+function MathAccumulate()
+{
+ this.addInput("inc","number");
+ this.addOutput("total","number");
+ this.addProperty( "increment", 1 );
+ this.addProperty( "value", 0 );
+}
+
+MathAccumulate.title = "Accumulate";
+MathAccumulate.desc = "Increments a value every time";
+
+MathAccumulate.prototype.onExecute = function()
+{
+ if(this.properties.value === null)
+ this.properties.value = 0;
+
+ var inc = this.getInputData(0);
+ if(inc !== null)
+ this.properties.value += inc;
+ else
+ this.properties.value += this.properties.increment;
+ this.setOutputData(0, this.properties.value );
+}
+
+LiteGraph.registerNodeType("math/accumulate", MathAccumulate);
+
+//Math Trigonometry
+function MathTrigonometry()
+{
+ this.addInput("v","number");
+ this.addOutput("sin","number");
+
+ this.addProperty( "amplitude", 1 );
+ this.addProperty( "offset", 0 );
+ this.bgImageUrl = "nodes/imgs/icon-sin.png";
+}
+
+MathTrigonometry.title = "Trigonometry";
+MathTrigonometry.desc = "Sin Cos Tan";
+MathTrigonometry.filter = "shader";
+
+MathTrigonometry.prototype.onExecute = function()
+{
+ var v = this.getInputData(0);
+ if(v == null)
+ v = 0;
+ var amplitude = this.properties["amplitude"];
+ var slot = this.findInputSlot("amplitude");
+ if(slot != -1)
+ amplitude = this.getInputData(slot);
+ var offset = this.properties["offset"];
+ slot = this.findInputSlot("offset");
+ if(slot != -1)
+ offset = this.getInputData(slot);
+
+ for(var i = 0, l = this.outputs.length; i < l; ++i)
+ {
+ var output = this.outputs[i];
+ switch( output.name )
+ {
+ case "sin": value = Math.sin(v); break;
+ case "cos": value = Math.cos(v); break;
+ case "tan": value = Math.tan(v); break;
+ case "asin": value = Math.asin(v); break;
+ case "acos": value = Math.acos(v); break;
+ case "atan": value = Math.atan(v); break;
+ }
+ this.setOutputData(i, amplitude * value + offset);
+ }
+}
+
+MathTrigonometry.prototype.onGetInputs = function()
+{
+ return [["v","number"],["amplitude","number"],["offset","number"]];
+}
+
+
+MathTrigonometry.prototype.onGetOutputs = function()
+{
+ return [["sin","number"],["cos","number"],["tan","number"],["asin","number"],["acos","number"],["atan","number"]];
+}
+
+
+LiteGraph.registerNodeType("math/trigonometry", MathTrigonometry );
+
+
+
+//math library for safe math operations without eval
+if(typeof(math) != undefined)
+{
+ function MathFormula()
+ {
+ this.addInputs("x","number");
+ this.addInputs("y","number");
+ this.addOutputs("","number");
+ this.properties = {x:1.0, y:1.0, formula:"x+y"};
+ }
+
+ MathFormula.title = "Formula";
+ MathFormula.desc = "Compute safe formula";
+
+ MathFormula.prototype.onExecute = function()
+ {
+ var x = this.getInputData(0);
+ var y = this.getInputData(1);
+ if(x != null)
+ this.properties["x"] = x;
+ else
+ x = this.properties["x"];
+
+ if(y!=null)
+ this.properties["y"] = y;
+ else
+ y = this.properties["y"];
+
+ var f = this.properties["formula"];
+ var value = math.eval(f,{x:x,y:y,T: this.graph.globaltime });
+ this.setOutputData(0, value );
+ }
+
+ MathFormula.prototype.onDrawBackground = function()
+ {
+ var f = this.properties["formula"];
+ this.outputs[0].label = f;
+ }
+
+ MathFormula.prototype.onGetOutputs = function()
+ {
+ return [["A-B","number"],["A*B","number"],["A/B","number"]];
+ }
+
+ LiteGraph.registerNodeType("math/formula", MathFormula );
+}
+
+
+function Math3DVec2ToXYZ()
+{
+ this.addInput("vec2","vec2");
+ this.addOutput("x","number");
+ this.addOutput("y","number");
+}
+
+Math3DVec2ToXYZ.title = "Vec2->XY";
+Math3DVec2ToXYZ.desc = "vector 2 to components";
+
+Math3DVec2ToXYZ.prototype.onExecute = function()
+{
+ var v = this.getInputData(0);
+ if(v == null) return;
+
+ this.setOutputData( 0, v[0] );
+ this.setOutputData( 1, v[1] );
+}
+
+LiteGraph.registerNodeType("math3d/vec2-to-xyz", Math3DVec2ToXYZ );
+
+
+function Math3DXYToVec2()
+{
+ this.addInputs([["x","number"],["y","number"]]);
+ this.addOutput("vec2","vec2");
+ this.properties = {x:0, y:0};
+ this._data = new Float32Array(2);
+}
+
+Math3DXYToVec2.title = "XY->Vec2";
+Math3DXYToVec2.desc = "components to vector2";
+
+Math3DXYToVec2.prototype.onExecute = function()
+{
+ var x = this.getInputData(0);
+ if(x == null) x = this.properties.x;
+ var y = this.getInputData(1);
+ if(y == null) y = this.properties.y;
+
+ var data = this._data;
+ data[0] = x;
+ data[1] = y;
+
+ this.setOutputData( 0, data );
+}
+
+LiteGraph.registerNodeType("math3d/xy-to-vec2", Math3DXYToVec2 );
+
+
+
+
+function Math3DVec3ToXYZ()
+{
+ this.addInput("vec3","vec3");
+ this.addOutput("x","number");
+ this.addOutput("y","number");
+ this.addOutput("z","number");
+}
+
+Math3DVec3ToXYZ.title = "Vec3->XYZ";
+Math3DVec3ToXYZ.desc = "vector 3 to components";
+
+Math3DVec3ToXYZ.prototype.onExecute = function()
+{
+ var v = this.getInputData(0);
+ if(v == null) return;
+
+ this.setOutputData( 0, v[0] );
+ this.setOutputData( 1, v[1] );
+ this.setOutputData( 2, v[2] );
+}
+
+LiteGraph.registerNodeType("math3d/vec3-to-xyz", Math3DVec3ToXYZ );
+
+
+function Math3DXYZToVec3()
+{
+ this.addInputs([["x","number"],["y","number"],["z","number"]]);
+ this.addOutput("vec3","vec3");
+ this.properties = {x:0, y:0, z:0};
+ this._data = new Float32Array(3);
+}
+
+Math3DXYZToVec3.title = "XYZ->Vec3";
+Math3DXYZToVec3.desc = "components to vector3";
+
+Math3DXYZToVec3.prototype.onExecute = function()
+{
+ var x = this.getInputData(0);
+ if(x == null) x = this.properties.x;
+ var y = this.getInputData(1);
+ if(y == null) y = this.properties.y;
+ var z = this.getInputData(2);
+ if(z == null) z = this.properties.z;
+
+ var data = this._data;
+ data[0] = x;
+ data[1] = y;
+ data[2] = z;
+
+ this.setOutputData( 0, data );
+}
+
+LiteGraph.registerNodeType("math3d/xyz-to-vec3", Math3DXYZToVec3 );
+
+
+
+function Math3DVec4ToXYZW()
+{
+ this.addInput("vec4","vec4");
+ this.addOutput("x","number");
+ this.addOutput("y","number");
+ this.addOutput("z","number");
+ this.addOutput("w","number");
+}
+
+Math3DVec4ToXYZW.title = "Vec4->XYZW";
+Math3DVec4ToXYZW.desc = "vector 4 to components";
+
+Math3DVec4ToXYZW.prototype.onExecute = function()
+{
+ var v = this.getInputData(0);
+ if(v == null) return;
+
+ this.setOutputData( 0, v[0] );
+ this.setOutputData( 1, v[1] );
+ this.setOutputData( 2, v[2] );
+ this.setOutputData( 3, v[3] );
+}
+
+LiteGraph.registerNodeType("math3d/vec4-to-xyzw", Math3DVec4ToXYZW );
+
+
+function Math3DXYZWToVec4()
+{
+ this.addInputs([["x","number"],["y","number"],["z","number"],["w","number"]]);
+ this.addOutput("vec4","vec4");
+ this.properties = {x:0, y:0, z:0, w:0};
+ this._data = new Float32Array(4);
+}
+
+Math3DXYZWToVec4.title = "XYZW->Vec4";
+Math3DXYZWToVec4.desc = "components to vector4";
+
+Math3DXYZWToVec4.prototype.onExecute = function()
+{
+ var x = this.getInputData(0);
+ if(x == null) x = this.properties.x;
+ var y = this.getInputData(1);
+ if(y == null) y = this.properties.y;
+ var z = this.getInputData(2);
+ if(z == null) z = this.properties.z;
+ var w = this.getInputData(3);
+ if(w == null) w = this.properties.w;
+
+ var data = this._data;
+ data[0] = x;
+ data[1] = y;
+ data[2] = z;
+ data[3] = w;
+
+ this.setOutputData( 0, data );
+}
+
+LiteGraph.registerNodeType("math3d/xyzw-to-vec4", Math3DXYZWToVec4 );
+
+
+
+
+//if glMatrix is installed...
+if(global.glMatrix)
+{
+
+ function Math3DQuaternion()
+ {
+ this.addOutput("quat","quat");
+ this.properties = { x:0, y:0, z:0, w: 1 };
+ this._value = quat.create();
+ }
+
+ Math3DQuaternion.title = "Quaternion";
+ Math3DQuaternion.desc = "quaternion";
+
+ Math3DQuaternion.prototype.onExecute = function()
+ {
+ this._value[0] = this.properties.x;
+ this._value[1] = this.properties.y;
+ this._value[2] = this.properties.z;
+ this._value[3] = this.properties.w;
+ this.setOutputData( 0, this._value );
+ }
+
+ LiteGraph.registerNodeType("math3d/quaternion", Math3DQuaternion );
+
+
+ function Math3DRotation()
+ {
+ this.addInputs([["degrees","number"],["axis","vec3"]]);
+ this.addOutput("quat","quat");
+ this.properties = { angle:90.0, axis: vec3.fromValues(0,1,0) };
+
+ this._value = quat.create();
+ }
+
+ Math3DRotation.title = "Rotation";
+ Math3DRotation.desc = "quaternion rotation";
+
+ Math3DRotation.prototype.onExecute = function()
+ {
+ var angle = this.getInputData(0);
+ if(angle == null) angle = this.properties.angle;
+ var axis = this.getInputData(1);
+ if(axis == null) axis = this.properties.axis;
+
+ var R = quat.setAxisAngle( this._value, axis, angle * 0.0174532925 );
+ this.setOutputData( 0, R );
+ }
+
+
+ LiteGraph.registerNodeType("math3d/rotation", Math3DRotation );
+
+
+ //Math3D rotate vec3
+ function Math3DRotateVec3()
+ {
+ this.addInputs([["vec3","vec3"],["quat","quat"]]);
+ this.addOutput("result","vec3");
+ this.properties = { vec: [0,0,1] };
+ }
+
+ Math3DRotateVec3.title = "Rot. Vec3";
+ Math3DRotateVec3.desc = "rotate a point";
+
+ Math3DRotateVec3.prototype.onExecute = function()
+ {
+ var vec = this.getInputData(0);
+ if(vec == null) vec = this.properties.vec;
+ var quat = this.getInputData(1);
+ if(quat == null)
+ this.setOutputData(vec);
+ else
+ this.setOutputData( 0, vec3.transformQuat( vec3.create(), vec, quat ) );
+ }
+
+ LiteGraph.registerNodeType("math3d/rotate_vec3", Math3DRotateVec3);
+
+
+
+ function Math3DMultQuat()
+ {
+ this.addInputs( [["A","quat"],["B","quat"]] );
+ this.addOutput( "A*B","quat" );
+
+ this._value = quat.create();
+ }
+
+ Math3DMultQuat.title = "Mult. Quat";
+ Math3DMultQuat.desc = "rotate quaternion";
+
+ Math3DMultQuat.prototype.onExecute = function()
+ {
+ var A = this.getInputData(0);
+ if(A == null) return;
+ var B = this.getInputData(1);
+ if(B == null) return;
+
+ var R = quat.multiply( this._value, A, B );
+ this.setOutputData( 0, R );
+ }
+
+ LiteGraph.registerNodeType("math3d/mult-quat", Math3DMultQuat );
+
+
+ function Math3DQuatSlerp()
+ {
+ this.addInputs( [["A","quat"],["B","quat"],["factor","number"]] );
+ this.addOutput( "slerp","quat" );
+ this.addProperty( "factor", 0.5 );
+
+ this._value = quat.create();
+ }
+
+ Math3DQuatSlerp.title = "Quat Slerp";
+ Math3DQuatSlerp.desc = "quaternion spherical interpolation";
+
+ Math3DQuatSlerp.prototype.onExecute = function()
+ {
+ var A = this.getInputData(0);
+ if(A == null)
+ return;
+ var B = this.getInputData(1);
+ if(B == null)
+ return;
+ var factor = this.properties.factor;
+ if( this.getInputData(2) != null )
+ factor = this.getInputData(2);
+
+ var R = quat.slerp( this._value, A, B, factor );
+ this.setOutputData( 0, R );
+ }
+
+ LiteGraph.registerNodeType("math3d/quat-slerp", Math3DQuatSlerp );
+
+} //glMatrix
+
})(this);
(function(global){
var LiteGraph = global.LiteGraph;
@@ -11423,6163 +11421,6163 @@ LiteGraph.registerNodeType("graphics/webcam", ImageWebcam );
})(this);
-(function(global){
-var LiteGraph = global.LiteGraph;
-
-//Works with Litegl.js to create WebGL nodes
-global.LGraphTexture = null;
-
-if(typeof(GL) != "undefined")
-{
- function LGraphTexture()
- {
- this.addOutput("Texture","Texture");
- this.properties = { name:"", filter: true };
- this.size = [LGraphTexture.image_preview_size, LGraphTexture.image_preview_size];
- }
-
- global.LGraphTexture = LGraphTexture;
-
- LGraphTexture.title = "Texture";
- LGraphTexture.desc = "Texture";
- LGraphTexture.widgets_info = {"name": { widget:"texture"}, "filter": { widget:"checkbox"} };
-
- //REPLACE THIS TO INTEGRATE WITH YOUR FRAMEWORK
- LGraphTexture.loadTextureCallback = null; //function in charge of loading textures when not present in the container
- LGraphTexture.image_preview_size = 256;
-
- //flags to choose output texture type
- LGraphTexture.PASS_THROUGH = 1; //do not apply FX
- LGraphTexture.COPY = 2; //create new texture with the same properties as the origin texture
- LGraphTexture.LOW = 3; //create new texture with low precision (byte)
- LGraphTexture.HIGH = 4; //create new texture with high precision (half-float)
- LGraphTexture.REUSE = 5; //reuse input texture
- LGraphTexture.DEFAULT = 2;
-
- LGraphTexture.MODE_VALUES = {
- "pass through": LGraphTexture.PASS_THROUGH,
- "copy": LGraphTexture.COPY,
- "low": LGraphTexture.LOW,
- "high": LGraphTexture.HIGH,
- "reuse": LGraphTexture.REUSE,
- "default": LGraphTexture.DEFAULT
- };
-
- //returns the container where all the loaded textures are stored (overwrite if you have a Resources Manager)
- LGraphTexture.getTexturesContainer = function()
- {
- return gl.textures;
- }
-
- //process the loading of a texture (overwrite it if you have a Resources Manager)
- LGraphTexture.loadTexture = function(name, options)
- {
- options = options || {};
- var url = name;
- if(url.substr(0,7) == "http://")
- {
- if(LiteGraph.proxy) //proxy external files
- url = LiteGraph.proxy + url.substr(7);
- }
-
- var container = LGraphTexture.getTexturesContainer();
- var tex = container[ name ] = GL.Texture.fromURL(url, options);
- return tex;
- }
-
- LGraphTexture.getTexture = function(name)
- {
- var container = this.getTexturesContainer();
-
- if(!container)
- throw("Cannot load texture, container of textures not found");
-
- var tex = container[ name ];
- if(!tex && name && name[0] != ":")
- return this.loadTexture(name);
-
- return tex;
- }
-
- //used to compute the appropiate output texture
- LGraphTexture.getTargetTexture = function( origin, target, mode )
- {
- if(!origin)
- throw("LGraphTexture.getTargetTexture expects a reference texture");
-
- var tex_type = null;
-
- switch(mode)
- {
- case LGraphTexture.LOW: tex_type = gl.UNSIGNED_BYTE; break;
- case LGraphTexture.HIGH: tex_type = gl.HIGH_PRECISION_FORMAT; break;
- case LGraphTexture.REUSE: return origin; break;
- case LGraphTexture.COPY:
- default: tex_type = origin ? origin.type : gl.UNSIGNED_BYTE; break;
- }
-
- if(!target || target.width != origin.width || target.height != origin.height || target.type != tex_type )
- target = new GL.Texture( origin.width, origin.height, { type: tex_type, format: gl.RGBA, filter: gl.LINEAR });
-
- return target;
- }
-
-
- LGraphTexture.getTextureType = function( precision, ref_texture )
- {
- var type = ref_texture ? ref_texture.type : gl.UNSIGNED_BYTE;
- switch( precision )
- {
- case LGraphTexture.HIGH: type = gl.HIGH_PRECISION_FORMAT; break;
- case LGraphTexture.LOW: type = gl.UNSIGNED_BYTE; break;
- //no default
- }
- return type;
- }
-
- LGraphTexture.getNoiseTexture = function()
- {
- if(this._noise_texture)
- return this._noise_texture;
-
- var noise = new Uint8Array(512*512*4);
- for(var i = 0; i < 512*512*4; ++i)
- noise[i] = Math.random() * 255;
-
- var texture = GL.Texture.fromMemory(512,512,noise,{ format: gl.RGBA, wrap: gl.REPEAT, filter: gl.NEAREST });
- this._noise_texture = texture;
- return texture;
- }
-
- LGraphTexture.prototype.onDropFile = function(data, filename, file)
- {
- if(!data)
- {
- this._drop_texture = null;
- this.properties.name = "";
- }
- else
- {
- var texture = null;
- if( typeof(data) == "string" )
- texture = GL.Texture.fromURL( data );
- else if( filename.toLowerCase().indexOf(".dds") != -1 )
- texture = GL.Texture.fromDDSInMemory(data);
- else
- {
- var blob = new Blob([file]);
- var url = URL.createObjectURL(blob);
- texture = GL.Texture.fromURL( url );
- }
-
- this._drop_texture = texture;
- this.properties.name = filename;
- }
- }
-
- LGraphTexture.prototype.getExtraMenuOptions = function(graphcanvas)
- {
- var that = this;
- if(!this._drop_texture)
- return;
- return [ {content:"Clear", callback:
- function() {
- that._drop_texture = null;
- that.properties.name = "";
- }
- }];
- }
-
- LGraphTexture.prototype.onExecute = function()
- {
- var tex = null;
- if(this.isOutputConnected(1))
- tex = this.getInputData(0);
-
- if(!tex && this._drop_texture)
- tex = this._drop_texture;
-
- if(!tex && this.properties.name)
- tex = LGraphTexture.getTexture( this.properties.name );
-
- if(!tex)
- return;
-
- this._last_tex = tex;
-
- if(this.properties.filter === false)
- tex.setParameter( gl.TEXTURE_MAG_FILTER, gl.NEAREST );
- else
- tex.setParameter( gl.TEXTURE_MAG_FILTER, gl.LINEAR );
-
- this.setOutputData(0, tex);
-
- for(var i = 1; i < this.outputs.length; i++)
- {
- var output = this.outputs[i];
- if(!output)
- continue;
- var v = null;
- if(output.name == "width")
- v = tex.width;
- else if(output.name == "height")
- v = tex.height;
- else if(output.name == "aspect")
- v = tex.width / tex.height;
- this.setOutputData(i, v);
- }
- }
-
- LGraphTexture.prototype.onResourceRenamed = function(old_name,new_name)
- {
- if(this.properties.name == old_name)
- this.properties.name = new_name;
- }
-
- LGraphTexture.prototype.onDrawBackground = function(ctx)
- {
- if( this.flags.collapsed || this.size[1] <= 20 )
- return;
-
- if( this._drop_texture && ctx.webgl )
- {
- ctx.drawImage( this._drop_texture, 0,0,this.size[0],this.size[1]);
- //this._drop_texture.renderQuad(this.pos[0],this.pos[1],this.size[0],this.size[1]);
- return;
- }
-
-
- //Different texture? then get it from the GPU
- if(this._last_preview_tex != this._last_tex)
- {
- if(ctx.webgl)
- {
- this._canvas = this._last_tex;
- }
- else
- {
- var tex_canvas = LGraphTexture.generateLowResTexturePreview(this._last_tex);
- if(!tex_canvas)
- return;
-
- this._last_preview_tex = this._last_tex;
- this._canvas = cloneCanvas(tex_canvas);
- }
- }
-
- if(!this._canvas)
- return;
-
- //render to graph canvas
- ctx.save();
- if(!ctx.webgl) //reverse image
- {
- ctx.translate(0,this.size[1]);
- ctx.scale(1,-1);
- }
- ctx.drawImage(this._canvas,0,0,this.size[0],this.size[1]);
- ctx.restore();
- }
-
-
- //very slow, used at your own risk
- LGraphTexture.generateLowResTexturePreview = function(tex)
- {
- if(!tex)
- return null;
-
- var size = LGraphTexture.image_preview_size;
- var temp_tex = tex;
-
- if(tex.format == gl.DEPTH_COMPONENT)
- return null; //cannot generate from depth
-
- //Generate low-level version in the GPU to speed up
- if(tex.width > size || tex.height > size)
- {
- temp_tex = this._preview_temp_tex;
- if(!this._preview_temp_tex)
- {
- temp_tex = new GL.Texture(size,size, { minFilter: gl.NEAREST });
- this._preview_temp_tex = temp_tex;
- }
-
- //copy
- tex.copyTo(temp_tex);
- tex = temp_tex;
- }
-
- //create intermediate canvas with lowquality version
- var tex_canvas = this._preview_canvas;
- if(!tex_canvas)
- {
- tex_canvas = createCanvas(size,size);
- this._preview_canvas = tex_canvas;
- }
-
- if(temp_tex)
- temp_tex.toCanvas(tex_canvas);
- return tex_canvas;
- }
-
- LGraphTexture.prototype.getResources = function(res)
- {
- res[ this.properties.name ] = GL.Texture;
- return res;
- }
-
- LGraphTexture.prototype.onGetInputs = function()
- {
- return [["in","Texture"]];
- }
-
-
- LGraphTexture.prototype.onGetOutputs = function()
- {
- return [["width","number"],["height","number"],["aspect","number"]];
- }
-
- LiteGraph.registerNodeType("texture/texture", LGraphTexture );
-
- //**************************
- function LGraphTexturePreview()
- {
- this.addInput("Texture","Texture");
- this.properties = { flipY: false };
- this.size = [LGraphTexture.image_preview_size, LGraphTexture.image_preview_size];
- }
-
- LGraphTexturePreview.title = "Preview";
- LGraphTexturePreview.desc = "Show a texture in the graph canvas";
- LGraphTexturePreview.allow_preview = false;
-
- LGraphTexturePreview.prototype.onDrawBackground = function(ctx)
- {
- if(this.flags.collapsed)
- return;
-
- if(!ctx.webgl && !LGraphTexturePreview.allow_preview)
- return; //not working well
-
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- var tex_canvas = null;
-
- if(!tex.handle && ctx.webgl)
- tex_canvas = tex;
- else
- tex_canvas = LGraphTexture.generateLowResTexturePreview(tex);
-
- //render to graph canvas
- ctx.save();
- if(this.properties.flipY)
- {
- ctx.translate(0,this.size[1]);
- ctx.scale(1,-1);
- }
- ctx.drawImage(tex_canvas,0,0,this.size[0],this.size[1]);
- ctx.restore();
- }
-
- LiteGraph.registerNodeType("texture/preview", LGraphTexturePreview );
-
- //**************************************
-
- function LGraphTextureSave()
- {
- this.addInput("Texture","Texture");
- this.addOutput("","Texture");
- this.properties = {name:""};
- }
-
- LGraphTextureSave.title = "Save";
- LGraphTextureSave.desc = "Save a texture in the repository";
-
- LGraphTextureSave.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(this.properties.name)
- {
- //for cases where we want to perform something when storing it
- if( LGraphTexture.storeTexture )
- LGraphTexture.storeTexture( this.properties.name, tex );
- else
- {
- var container = LGraphTexture.getTexturesContainer();
- container[ this.properties.name ] = tex;
- }
- }
-
- this.setOutputData(0, tex);
- }
-
- LiteGraph.registerNodeType("texture/save", LGraphTextureSave );
-
- //****************************************************
-
- function LGraphTextureOperation()
- {
- this.addInput("Texture","Texture");
- this.addInput("TextureB","Texture");
- this.addInput("value","number");
- this.addOutput("Texture","Texture");
- this.help = "pixelcode must be vec3
\
- uvcode must be vec2, is optional
\
- uv: tex. coords
color: texture
colorB: textureB
time: scene time
value: input value
";
-
- this.properties = {value:1, uvcode:"", pixelcode:"color + colorB * value", precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureOperation.widgets_info = {
- "uvcode": { widget:"textarea", height: 100 },
- "pixelcode": { widget:"textarea", height: 100 },
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureOperation.title = "Operation";
- LGraphTextureOperation.desc = "Texture shader operation";
-
- LGraphTextureOperation.prototype.getExtraMenuOptions = function(graphcanvas)
- {
- var that = this;
- var txt = !that.properties.show ? "Show Texture" : "Hide Texture";
- return [ {content: txt, callback:
- function() {
- that.properties.show = !that.properties.show;
- }
- }];
- }
-
- LGraphTextureOperation.prototype.onDrawBackground = function(ctx)
- {
- if(this.flags.collapsed || this.size[1] <= 20 || !this.properties.show)
- return;
-
- if(!this._tex)
- return;
-
- //only works if using a webgl renderer
- if(this._tex.gl != ctx)
- return;
-
- //render to graph canvas
- ctx.save();
- ctx.drawImage(this._tex, 0, 0, this.size[0], this.size[1]);
- ctx.restore();
- }
-
- LGraphTextureOperation.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH)
- {
- this.setOutputData(0, tex);
- return;
- }
-
- var texB = this.getInputData(1);
-
- if(!this.properties.uvcode && !this.properties.pixelcode)
- return;
-
- var width = 512;
- var height = 512;
- if(tex)
- {
- width = tex.width;
- height = tex.height;
- }
- else if (texB)
- {
- width = texB.width;
- height = texB.height;
- }
-
- var type = LGraphTexture.getTextureType( this.properties.precision, tex );
-
- if(!tex && !this._tex )
- this._tex = new GL.Texture( width, height, { type: type, format: gl.RGBA, filter: gl.LINEAR });
- else
- this._tex = LGraphTexture.getTargetTexture( tex || this._tex, this._tex, this.properties.precision );
-
- var uvcode = "";
- if(this.properties.uvcode)
- {
- uvcode = "uv = " + this.properties.uvcode;
- if(this.properties.uvcode.indexOf(";") != -1) //there are line breaks, means multiline code
- uvcode = this.properties.uvcode;
- }
-
- var pixelcode = "";
- if(this.properties.pixelcode)
- {
- pixelcode = "result = " + this.properties.pixelcode;
- if(this.properties.pixelcode.indexOf(";") != -1) //there are line breaks, means multiline code
- pixelcode = this.properties.pixelcode;
- }
-
- var shader = this._shader;
-
- if(!shader || this._shader_code != (uvcode + "|" + pixelcode) )
- {
- try
- {
- this._shader = new GL.Shader(Shader.SCREEN_VERTEX_SHADER, LGraphTextureOperation.pixel_shader, { UV_CODE: uvcode, PIXEL_CODE: pixelcode });
- this.boxcolor = "#00FF00";
- }
- catch (err)
- {
- console.log("Error compiling shader: ", err);
- this.boxcolor = "#FF0000";
- return;
- }
- this.boxcolor = "#FF0000";
-
- this._shader_code = (uvcode + "|" + pixelcode);
- shader = this._shader;
- }
-
- if(!shader)
- {
- this.boxcolor = "red";
- return;
- }
- else
- this.boxcolor = "green";
-
- var value = this.getInputData(2);
- if(value != null)
- this.properties.value = value;
- else
- value = parseFloat( this.properties.value );
-
- var time = this.graph.getTime();
-
- this._tex.drawTo(function() {
- gl.disable( gl.DEPTH_TEST );
- gl.disable( gl.CULL_FACE );
- gl.disable( gl.BLEND );
- if(tex) tex.bind(0);
- if(texB) texB.bind(1);
- var mesh = Mesh.getScreenQuad();
- shader.uniforms({u_texture:0, u_textureB:1, value: value, texSize:[width,height], time: time}).draw(mesh);
- });
-
- this.setOutputData(0, this._tex);
- }
-
- LGraphTextureOperation.pixel_shader = "precision highp float;\n\
- \n\
- uniform sampler2D u_texture;\n\
- uniform sampler2D u_textureB;\n\
- varying vec2 v_coord;\n\
- uniform vec2 texSize;\n\
- uniform float time;\n\
- uniform float value;\n\
- \n\
- void main() {\n\
- vec2 uv = v_coord;\n\
- UV_CODE;\n\
- vec4 color4 = texture2D(u_texture, uv);\n\
- vec3 color = color4.rgb;\n\
- vec4 color4B = texture2D(u_textureB, uv);\n\
- vec3 colorB = color4B.rgb;\n\
- vec3 result = color;\n\
- float alpha = 1.0;\n\
- PIXEL_CODE;\n\
- gl_FragColor = vec4(result, alpha);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/operation", LGraphTextureOperation );
-
- //****************************************************
-
- function LGraphTextureShader()
- {
- this.addOutput("out","Texture");
- this.properties = {code:"", width: 512, height: 512, precision: LGraphTexture.DEFAULT };
-
- this.properties.code = "\nvoid main() {\n vec2 uv = v_coord;\n vec3 color = vec3(0.0);\n//your code here\n\ngl_FragColor = vec4(color, 1.0);\n}\n";
- this._uniforms = { in_texture:0, texSize: vec2.create(), time: 0 };
- }
-
- LGraphTextureShader.title = "Shader";
- LGraphTextureShader.desc = "Texture shader";
- LGraphTextureShader.widgets_info = {
- "code": { type:"code" },
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureShader.prototype.onPropertyChanged = function(name, value)
- {
- if(name != "code")
- return;
-
- var shader = this.getShader();
- if(!shader)
- return;
-
- //update connections
- var uniforms = shader.uniformInfo;
-
- //remove deprecated slots
- if(this.inputs)
- {
- var already = {};
- for(var i = 0; i < this.inputs.length; ++i)
- {
- var info = this.getInputInfo(i);
- if(!info)
- continue;
-
- if( uniforms[ info.name ] && !already[ info.name ] )
- {
- already[ info.name ] = true;
- continue;
- }
- this.removeInput(i);
- i--;
- }
- }
-
- //update existing ones
- for(var i in uniforms)
- {
- var info = shader.uniformInfo[i];
- if(info.loc === null)
- continue; //is an attribute, not a uniform
- if(i == "time") //default one
- continue;
-
- var type = "number";
- if( this._shader.samplers[i] )
- type = "texture";
- else
- {
- switch(info.size)
- {
- case 1: type = "number"; break;
- case 2: type = "vec2"; break;
- case 3: type = "vec3"; break;
- case 4: type = "vec4"; break;
- case 9: type = "mat3"; break;
- case 16: type = "mat4"; break;
- default: continue;
- }
- }
-
- var slot = this.findInputSlot(i);
- if(slot == -1)
- {
- this.addInput(i,type);
- continue;
- }
-
- var input_info = this.getInputInfo(slot);
- if(!input_info)
- this.addInput(i,type);
- else
- {
- if(input_info.type == type)
- continue;
- this.removeInput(slot,type);
- this.addInput(i,type);
- }
- }
- }
-
- LGraphTextureShader.prototype.getShader = function()
- {
- //replug
- if(this._shader && this._shader_code == this.properties.code)
- return this._shader;
-
- this._shader_code = this.properties.code;
- this._shader = new GL.Shader(Shader.SCREEN_VERTEX_SHADER, LGraphTextureShader.pixel_shader + this.properties.code );
- if(!this._shader) {
- this.boxcolor = "red";
- return null;
- }
- else
- this.boxcolor = "green";
- return this._shader;
- }
-
- LGraphTextureShader.prototype.onExecute = function()
- {
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var shader = this.getShader();
- if(!shader)
- return;
-
- var tex_slot = 0;
- var in_tex = null;
-
- //set uniforms
- for(var i = 0; i < this.inputs.length; ++i)
- {
- var info = this.getInputInfo(i);
- var data = this.getInputData(i);
- if(data == null)
- continue;
-
- if(data.constructor === GL.Texture)
- {
- data.bind(tex_slot);
- if(!in_tex)
- in_tex = data;
- data = tex_slot;
- tex_slot++;
- }
- shader.setUniform( info.name, data ); //data is tex_slot
- }
-
- var uniforms = this._uniforms;
- var type = LGraphTexture.getTextureType( this.properties.precision, in_tex );
-
- //render to texture
- var w = this.properties.width|0;
- var h = this.properties.height|0;
- if(w == 0)
- w = in_tex ? in_tex.width : gl.canvas.width;
- if(h == 0)
- h = in_tex ? in_tex.height : gl.canvas.height;
- uniforms.texSize[0] = w;
- uniforms.texSize[1] = h;
- uniforms.time = this.graph.getTime();
-
- if(!this._tex || this._tex.type != type || this._tex.width != w || this._tex.height != h )
- this._tex = new GL.Texture( w, h, { type: type, format: gl.RGBA, filter: gl.LINEAR });
- var tex = this._tex;
- tex.drawTo(function() {
- shader.uniforms( uniforms ).draw( GL.Mesh.getScreenQuad() );
- });
-
- this.setOutputData( 0, this._tex );
- }
-
- LGraphTextureShader.pixel_shader = "precision highp float;\n\
- \n\
- varying vec2 v_coord;\n\
- uniform float time;\n\
- ";
-
- LiteGraph.registerNodeType("texture/shader", LGraphTextureShader );
-
- // Texture Scale Offset
-
- function LGraphTextureScaleOffset()
- {
- this.addInput("in","Texture");
- this.addInput("scale","vec2");
- this.addInput("offset","vec2");
- this.addOutput("out","Texture");
- this.properties = { offset: vec2.fromValues(0,0), scale: vec2.fromValues(1,1), precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureScaleOffset.widgets_info = {
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureScaleOffset.title = "Scale/Offset";
- LGraphTextureScaleOffset.desc = "Applies an scaling and offseting";
-
- LGraphTextureScaleOffset.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
-
- if(!this.isOutputConnected(0) || !tex)
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH)
- {
- this.setOutputData(0, tex);
- return;
- }
-
- var width = tex.width;
- var height = tex.height;
- var type = this.precision === LGraphTexture.LOW ? gl.UNSIGNED_BYTE : gl.HIGH_PRECISION_FORMAT;
- if (this.precision === LGraphTexture.DEFAULT)
- type = tex.type;
-
- if(!this._tex || this._tex.width != width || this._tex.height != height || this._tex.type != type )
- this._tex = new GL.Texture( width, height, { type: type, format: gl.RGBA, filter: gl.LINEAR });
-
- var shader = this._shader;
-
- if(!shader)
- shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureScaleOffset.pixel_shader );
-
- var scale = this.getInputData(1);
- if(scale)
- {
- this.properties.scale[0] = scale[0];
- this.properties.scale[1] = scale[1];
- }
- else
- scale = this.properties.scale;
-
- var offset = this.getInputData(2);
- if(offset)
- {
- this.properties.offset[0] = offset[0];
- this.properties.offset[1] = offset[1];
- }
- else
- offset = this.properties.offset;
-
- this._tex.drawTo(function() {
- gl.disable( gl.DEPTH_TEST );
- gl.disable( gl.CULL_FACE );
- gl.disable( gl.BLEND );
- tex.bind(0);
- var mesh = Mesh.getScreenQuad();
- shader.uniforms({u_texture:0, u_scale: scale, u_offset: offset}).draw( mesh );
- });
-
- this.setOutputData( 0, this._tex );
- }
-
- LGraphTextureScaleOffset.pixel_shader = "precision highp float;\n\
- \n\
- uniform sampler2D u_texture;\n\
- uniform sampler2D u_textureB;\n\
- varying vec2 v_coord;\n\
- uniform vec2 u_scale;\n\
- uniform vec2 u_offset;\n\
- \n\
- void main() {\n\
- vec2 uv = v_coord;\n\
- uv = uv / u_scale - u_offset;\n\
- gl_FragColor = texture2D(u_texture, uv);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/scaleOffset", LGraphTextureScaleOffset );
-
-
-
- // Warp (distort a texture) *************************
-
- function LGraphTextureWarp()
- {
- this.addInput("in","Texture");
- this.addInput("warp","Texture");
- this.addInput("factor","number");
- this.addOutput("out","Texture");
- this.properties = { factor: 0.01, precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureWarp.widgets_info = {
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureWarp.title = "Warp";
- LGraphTextureWarp.desc = "Texture warp operation";
-
- LGraphTextureWarp.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH)
- {
- this.setOutputData(0, tex);
- return;
- }
-
- var texB = this.getInputData(1);
-
- var width = 512;
- var height = 512;
- var type = gl.UNSIGNED_BYTE;
- if(tex)
- {
- width = tex.width;
- height = tex.height;
- type = tex.type;
- }
- else if (texB)
- {
- width = texB.width;
- height = texB.height;
- type = texB.type;
- }
-
- if(!tex && !this._tex )
- this._tex = new GL.Texture( width, height, { type: this.precision === LGraphTexture.LOW ? gl.UNSIGNED_BYTE : gl.HIGH_PRECISION_FORMAT, format: gl.RGBA, filter: gl.LINEAR });
- else
- this._tex = LGraphTexture.getTargetTexture( tex || this._tex, this._tex, this.properties.precision );
-
- var shader = this._shader;
-
- if(!shader)
- shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureWarp.pixel_shader );
-
- var factor = this.getInputData(2);
- if(factor != null)
- this.properties.factor = factor;
- else
- factor = parseFloat( this.properties.factor );
-
- this._tex.drawTo(function() {
- gl.disable( gl.DEPTH_TEST );
- gl.disable( gl.CULL_FACE );
- gl.disable( gl.BLEND );
- if(tex) tex.bind(0);
- if(texB) texB.bind(1);
- var mesh = Mesh.getScreenQuad();
- shader.uniforms({u_texture:0, u_textureB:1, u_factor: factor }).draw( mesh );
- });
-
- this.setOutputData(0, this._tex);
- }
-
- LGraphTextureWarp.pixel_shader = "precision highp float;\n\
- \n\
- uniform sampler2D u_texture;\n\
- uniform sampler2D u_textureB;\n\
- varying vec2 v_coord;\n\
- uniform float u_factor;\n\
- \n\
- void main() {\n\
- vec2 uv = v_coord;\n\
- uv += ( texture2D(u_textureB, uv).rg - vec2(0.5)) * u_factor;\n\
- gl_FragColor = texture2D(u_texture, uv);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/warp", LGraphTextureWarp );
-
- //****************************************************
-
- // Texture to Viewport *****************************************
- function LGraphTextureToViewport()
- {
- this.addInput("Texture","Texture");
- this.properties = { additive: false, antialiasing: false, filter: true, disable_alpha: false, gamma: 1.0 };
- this.size[0] = 130;
- }
-
- LGraphTextureToViewport.title = "to Viewport";
- LGraphTextureToViewport.desc = "Texture to viewport";
-
- LGraphTextureToViewport.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(this.properties.disable_alpha)
- gl.disable( gl.BLEND );
- else
- {
- gl.enable( gl.BLEND );
- if(this.properties.additive)
- gl.blendFunc( gl.SRC_ALPHA, gl.ONE );
- else
- gl.blendFunc( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA );
- }
-
- gl.disable( gl.DEPTH_TEST );
- var gamma = this.properties.gamma || 1.0;
- if( this.isInputConnected(1) )
- gamma = this.getInputData(1);
-
- tex.setParameter( gl.TEXTURE_MAG_FILTER, this.properties.filter ? gl.LINEAR : gl.NEAREST );
-
- if(this.properties.antialiasing)
- {
- if(!LGraphTextureToViewport._shader)
- LGraphTextureToViewport._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureToViewport.aa_pixel_shader );
-
- var viewport = gl.getViewport(); //gl.getParameter(gl.VIEWPORT);
- var mesh = Mesh.getScreenQuad();
- tex.bind(0);
- LGraphTextureToViewport._shader.uniforms({u_texture:0, uViewportSize:[tex.width,tex.height], u_igamma: 1 / gamma, inverseVP: [1/tex.width,1/tex.height] }).draw(mesh);
- }
- else
- {
- if(gamma != 1.0)
- {
- if(!LGraphTextureToViewport._gamma_shader)
- LGraphTextureToViewport._gamma_shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureToViewport.gamma_pixel_shader );
- tex.toViewport(LGraphTextureToViewport._gamma_shader, { u_texture:0, u_igamma: 1 / gamma });
- }
- else
- tex.toViewport();
- }
- }
-
- LGraphTextureToViewport.prototype.onGetInputs = function()
- {
- return [["gamma","number"]];
- }
-
- LGraphTextureToViewport.aa_pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 uViewportSize;\n\
- uniform vec2 inverseVP;\n\
- uniform float u_igamma;\n\
- #define FXAA_REDUCE_MIN (1.0/ 128.0)\n\
- #define FXAA_REDUCE_MUL (1.0 / 8.0)\n\
- #define FXAA_SPAN_MAX 8.0\n\
- \n\
- /* from mitsuhiko/webgl-meincraft based on the code on geeks3d.com */\n\
- vec4 applyFXAA(sampler2D tex, vec2 fragCoord)\n\
- {\n\
- vec4 color = vec4(0.0);\n\
- /*vec2 inverseVP = vec2(1.0 / uViewportSize.x, 1.0 / uViewportSize.y);*/\n\
- vec3 rgbNW = texture2D(tex, (fragCoord + vec2(-1.0, -1.0)) * inverseVP).xyz;\n\
- vec3 rgbNE = texture2D(tex, (fragCoord + vec2(1.0, -1.0)) * inverseVP).xyz;\n\
- vec3 rgbSW = texture2D(tex, (fragCoord + vec2(-1.0, 1.0)) * inverseVP).xyz;\n\
- vec3 rgbSE = texture2D(tex, (fragCoord + vec2(1.0, 1.0)) * inverseVP).xyz;\n\
- vec3 rgbM = texture2D(tex, fragCoord * inverseVP).xyz;\n\
- vec3 luma = vec3(0.299, 0.587, 0.114);\n\
- float lumaNW = dot(rgbNW, luma);\n\
- float lumaNE = dot(rgbNE, luma);\n\
- float lumaSW = dot(rgbSW, luma);\n\
- float lumaSE = dot(rgbSE, luma);\n\
- float lumaM = dot(rgbM, luma);\n\
- float lumaMin = min(lumaM, min(min(lumaNW, lumaNE), min(lumaSW, lumaSE)));\n\
- float lumaMax = max(lumaM, max(max(lumaNW, lumaNE), max(lumaSW, lumaSE)));\n\
- \n\
- vec2 dir;\n\
- dir.x = -((lumaNW + lumaNE) - (lumaSW + lumaSE));\n\
- dir.y = ((lumaNW + lumaSW) - (lumaNE + lumaSE));\n\
- \n\
- float dirReduce = max((lumaNW + lumaNE + lumaSW + lumaSE) * (0.25 * FXAA_REDUCE_MUL), FXAA_REDUCE_MIN);\n\
- \n\
- float rcpDirMin = 1.0 / (min(abs(dir.x), abs(dir.y)) + dirReduce);\n\
- dir = min(vec2(FXAA_SPAN_MAX, FXAA_SPAN_MAX), max(vec2(-FXAA_SPAN_MAX, -FXAA_SPAN_MAX), dir * rcpDirMin)) * inverseVP;\n\
- \n\
- vec3 rgbA = 0.5 * (texture2D(tex, fragCoord * inverseVP + dir * (1.0 / 3.0 - 0.5)).xyz + \n\
- texture2D(tex, fragCoord * inverseVP + dir * (2.0 / 3.0 - 0.5)).xyz);\n\
- vec3 rgbB = rgbA * 0.5 + 0.25 * (texture2D(tex, fragCoord * inverseVP + dir * -0.5).xyz + \n\
- texture2D(tex, fragCoord * inverseVP + dir * 0.5).xyz);\n\
- \n\
- //return vec4(rgbA,1.0);\n\
- float lumaB = dot(rgbB, luma);\n\
- if ((lumaB < lumaMin) || (lumaB > lumaMax))\n\
- color = vec4(rgbA, 1.0);\n\
- else\n\
- color = vec4(rgbB, 1.0);\n\
- if(u_igamma != 1.0)\n\
- color.xyz = pow( color.xyz, vec3(u_igamma) );\n\
- return color;\n\
- }\n\
- \n\
- void main() {\n\
- gl_FragColor = applyFXAA( u_texture, v_coord * uViewportSize) ;\n\
- }\n\
- ";
-
- LGraphTextureToViewport.gamma_pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform float u_igamma;\n\
- void main() {\n\
- vec4 color = texture2D( u_texture, v_coord);\n\
- color.xyz = pow(color.xyz, vec3(u_igamma) );\n\
- gl_FragColor = color;\n\
- }\n\
- ";
-
-
- LiteGraph.registerNodeType("texture/toviewport", LGraphTextureToViewport );
-
-
- // Texture Copy *****************************************
- function LGraphTextureCopy()
- {
- this.addInput("Texture","Texture");
- this.addOutput("","Texture");
- this.properties = { size: 0, generate_mipmaps: false, precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureCopy.title = "Copy";
- LGraphTextureCopy.desc = "Copy Texture";
- LGraphTextureCopy.widgets_info = {
- size: { widget:"combo", values:[0,32,64,128,256,512,1024,2048]},
- precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureCopy.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex && !this._temp_texture)
- return;
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- //copy the texture
- if(tex)
- {
- var width = tex.width;
- var height = tex.height;
-
- if(this.properties.size != 0)
- {
- width = this.properties.size;
- height = this.properties.size;
- }
-
- var temp = this._temp_texture;
-
- var type = tex.type;
- if(this.properties.precision === LGraphTexture.LOW)
- type = gl.UNSIGNED_BYTE;
- else if(this.properties.precision === LGraphTexture.HIGH)
- type = gl.HIGH_PRECISION_FORMAT;
-
- if(!temp || temp.width != width || temp.height != height || temp.type != type )
- {
- var minFilter = gl.LINEAR;
- if( this.properties.generate_mipmaps && isPowerOfTwo(width) && isPowerOfTwo(height) )
- minFilter = gl.LINEAR_MIPMAP_LINEAR;
- this._temp_texture = new GL.Texture( width, height, { type: type, format: gl.RGBA, minFilter: minFilter, magFilter: gl.LINEAR });
- }
- tex.copyTo(this._temp_texture);
-
- if(this.properties.generate_mipmaps)
- {
- this._temp_texture.bind(0);
- gl.generateMipmap(this._temp_texture.texture_type);
- this._temp_texture.unbind(0);
- }
- }
-
-
- this.setOutputData(0,this._temp_texture);
- }
-
- LiteGraph.registerNodeType("texture/copy", LGraphTextureCopy );
-
-
- // Texture Downsample *****************************************
- function LGraphTextureDownsample()
- {
- this.addInput("Texture","Texture");
- this.addOutput("","Texture");
- this.properties = { iterations: 1, generate_mipmaps: false, precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureDownsample.title = "Downsample";
- LGraphTextureDownsample.desc = "Downsample Texture";
- LGraphTextureDownsample.widgets_info = {
- iterations: { type:"number", step: 1, precision: 0, min: 1 },
- precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureDownsample.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex && !this._temp_texture)
- return;
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- //we do not allow any texture different than texture 2D
- if(!tex || tex.texture_type !== GL.TEXTURE_2D )
- return;
-
- var shader = LGraphTextureDownsample._shader;
- if(!shader)
- LGraphTextureDownsample._shader = shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureDownsample.pixel_shader );
-
- var width = tex.width|0;
- var height = tex.height|0;
- var type = tex.type;
- if(this.properties.precision === LGraphTexture.LOW)
- type = gl.UNSIGNED_BYTE;
- else if(this.properties.precision === LGraphTexture.HIGH)
- type = gl.HIGH_PRECISION_FORMAT;
- var iterations = this.properties.iterations || 1;
-
- var origin = tex;
- var target = null;
-
- var temp = [];
- var options = {
- type: type,
- format: tex.format
- };
-
- var offset = vec2.create();
- var uniforms = {
- u_offset: offset
- };
-
- if( this._texture )
- GL.Texture.releaseTemporary( this._texture );
-
- for(var i = 0; i < iterations; ++i)
- {
- offset[0] = 1/width;
- offset[1] = 1/height;
- width = width>>1 || 0;
- height = height>>1 || 0;
- target = GL.Texture.getTemporary( width, height, options );
- temp.push( target );
- origin.setParameter( GL.TEXTURE_MAG_FILTER, GL.NEAREST );
- origin.copyTo( target, shader, uniforms );
- if(width == 1 && height == 1)
- break; //nothing else to do
- origin = target;
- }
-
- //keep the last texture used
- this._texture = temp.pop();
-
- //free the rest
- for(var i = 0; i < temp.length; ++i)
- GL.Texture.releaseTemporary( temp[i] );
-
- if(this.properties.generate_mipmaps)
- {
- this._texture.bind(0);
- gl.generateMipmap(this._texture.texture_type);
- this._texture.unbind(0);
- }
-
- this.setOutputData(0,this._texture);
- }
-
- LGraphTextureDownsample.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 u_offset;\n\
- varying vec2 v_coord;\n\
- \n\
- void main() {\n\
- vec4 color = texture2D(u_texture, v_coord );\n\
- color += texture2D(u_texture, v_coord + vec2( u_offset.x, 0.0 ) );\n\
- color += texture2D(u_texture, v_coord + vec2( 0.0, u_offset.y ) );\n\
- color += texture2D(u_texture, v_coord + vec2( u_offset.x, u_offset.y ) );\n\
- gl_FragColor = color * 0.25;\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/downsample", LGraphTextureDownsample );
-
-
-
- // Texture Copy *****************************************
- function LGraphTextureAverage()
- {
- this.addInput("Texture","Texture");
- this.addOutput("tex","Texture");
- this.addOutput("avg","vec4");
- this.addOutput("lum","number");
- this.properties = { mipmap_offset: 0, low_precision: false };
-
- this._uniforms = { u_texture: 0, u_mipmap_offset: this.properties.mipmap_offset };
- this._luminance = new Float32Array(4);
- }
-
- LGraphTextureAverage.title = "Average";
- LGraphTextureAverage.desc = "Compute a partial average (32 random samples) of a texture and stores it as a 1x1 pixel texture";
-
- LGraphTextureAverage.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(!this.isOutputConnected(0) && !this.isOutputConnected(1) && !this.isOutputConnected(2))
- return; //saves work
-
- if(!LGraphTextureAverage._shader)
- {
- LGraphTextureAverage._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureAverage.pixel_shader);
- //creates 32 random numbers and stores the, in two mat4
- var samples = new Float32Array(32);
- for(var i = 0; i < 32; ++i)
- samples[i] = Math.random();
- LGraphTextureAverage._shader.uniforms({u_samples_a: samples.subarray(0,16), u_samples_b: samples.subarray(16,32) });
- }
-
- var temp = this._temp_texture;
- var type = gl.UNSIGNED_BYTE;
- if(tex.type != type) //force floats, half floats cannot be read with gl.readPixels
- type = gl.FLOAT;
-
- if(!temp || temp.type != type )
- this._temp_texture = new GL.Texture( 1, 1, { type: type, format: gl.RGBA, filter: gl.NEAREST });
-
- var shader = LGraphTextureAverage._shader;
- var uniforms = this._uniforms;
- uniforms.u_mipmap_offset = this.properties.mipmap_offset;
- this._temp_texture.drawTo(function(){
- tex.toViewport( shader, uniforms );
- });
-
- this.setOutputData(0,this._temp_texture);
-
- if(this.isOutputConnected(1) || this.isOutputConnected(2))
- {
- var pixel = this._temp_texture.getPixels();
- if(pixel)
- {
- var v = this._luminance;
- var type = this._temp_texture.type;
- v.set( pixel );
- if(type == gl.UNSIGNED_BYTE)
- vec4.scale( v,v, 1/255 );
- else if(type == GL.HALF_FLOAT || type == GL.HALF_FLOAT_OES)
- vec4.scale( v,v, 1/(255*255) ); //is this correct?
- this.setOutputData(1,v);
- this.setOutputData(2,(v[0] + v[1] + v[2]) / 3);
- }
-
- }
- }
-
- LGraphTextureAverage.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- uniform mat4 u_samples_a;\n\
- uniform mat4 u_samples_b;\n\
- uniform sampler2D u_texture;\n\
- uniform float u_mipmap_offset;\n\
- varying vec2 v_coord;\n\
- \n\
- void main() {\n\
- vec4 color = vec4(0.0);\n\
- for(int i = 0; i < 4; ++i)\n\
- for(int j = 0; j < 4; ++j)\n\
- {\n\
- color += texture2D(u_texture, vec2( u_samples_a[i][j], u_samples_b[i][j] ), u_mipmap_offset );\n\
- color += texture2D(u_texture, vec2( 1.0 - u_samples_a[i][j], 1.0 - u_samples_b[i][j] ), u_mipmap_offset );\n\
- }\n\
- gl_FragColor = color * 0.03125;\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/average", LGraphTextureAverage );
-
- // Image To Texture *****************************************
- function LGraphImageToTexture()
- {
- this.addInput("Image","image");
- this.addOutput("","Texture");
- this.properties = {};
- }
-
- LGraphImageToTexture.title = "Image to Texture";
- LGraphImageToTexture.desc = "Uploads an image to the GPU";
- //LGraphImageToTexture.widgets_info = { size: { widget:"combo", values:[0,32,64,128,256,512,1024,2048]} };
-
- LGraphImageToTexture.prototype.onExecute = function()
- {
- var img = this.getInputData(0);
- if(!img)
- return;
-
- var width = img.videoWidth || img.width;
- var height = img.videoHeight || img.height;
-
- //this is in case we are using a webgl canvas already, no need to reupload it
- if(img.gltexture)
- {
- this.setOutputData(0,img.gltexture);
- return;
- }
-
-
- var temp = this._temp_texture;
- if(!temp || temp.width != width || temp.height != height )
- this._temp_texture = new GL.Texture( width, height, { format: gl.RGBA, filter: gl.LINEAR });
-
- try
- {
- this._temp_texture.uploadImage(img);
- }
- catch(err)
- {
- console.error("image comes from an unsafe location, cannot be uploaded to webgl: " + err);
- return;
- }
-
- this.setOutputData(0,this._temp_texture);
- }
-
- LiteGraph.registerNodeType("texture/imageToTexture", LGraphImageToTexture );
-
-
- // Texture LUT *****************************************
- function LGraphTextureLUT()
- {
- this.addInput("Texture","Texture");
- this.addInput("LUT","Texture");
- this.addInput("Intensity","number");
- this.addOutput("","Texture");
- this.properties = { intensity: 1, precision: LGraphTexture.DEFAULT, texture: null };
-
- if(!LGraphTextureLUT._shader)
- LGraphTextureLUT._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureLUT.pixel_shader );
- }
-
- LGraphTextureLUT.widgets_info = {
- "texture": { widget:"texture"},
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureLUT.title = "LUT";
- LGraphTextureLUT.desc = "Apply LUT to Texture";
-
- LGraphTextureLUT.prototype.onExecute = function()
- {
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var tex = this.getInputData(0);
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH )
- {
- this.setOutputData(0,tex);
- return;
- }
-
- if(!tex)
- return;
-
- var lut_tex = this.getInputData(1);
-
- if(!lut_tex)
- lut_tex = LGraphTexture.getTexture( this.properties.texture );
-
- if(!lut_tex)
- {
- this.setOutputData(0,tex);
- return;
- }
-
- lut_tex.bind(0);
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR );
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE );
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE );
- gl.bindTexture(gl.TEXTURE_2D, null);
-
- var intensity = this.properties.intensity;
- if( this.isInputConnected(2) )
- this.properties.intensity = intensity = this.getInputData(2);
-
- this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
-
- //var mesh = Mesh.getScreenQuad();
-
- this._tex.drawTo(function() {
- lut_tex.bind(1);
- tex.toViewport( LGraphTextureLUT._shader, {u_texture:0, u_textureB:1, u_amount: intensity} );
- });
-
- this.setOutputData(0,this._tex);
- }
-
- LGraphTextureLUT.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform sampler2D u_textureB;\n\
- uniform float u_amount;\n\
- \n\
- void main() {\n\
- lowp vec4 textureColor = clamp( texture2D(u_texture, v_coord), vec4(0.0), vec4(1.0) );\n\
- mediump float blueColor = textureColor.b * 63.0;\n\
- mediump vec2 quad1;\n\
- quad1.y = floor(floor(blueColor) / 8.0);\n\
- quad1.x = floor(blueColor) - (quad1.y * 8.0);\n\
- mediump vec2 quad2;\n\
- quad2.y = floor(ceil(blueColor) / 8.0);\n\
- quad2.x = ceil(blueColor) - (quad2.y * 8.0);\n\
- highp vec2 texPos1;\n\
- texPos1.x = (quad1.x * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.r);\n\
- texPos1.y = 1.0 - ((quad1.y * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.g));\n\
- highp vec2 texPos2;\n\
- texPos2.x = (quad2.x * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.r);\n\
- texPos2.y = 1.0 - ((quad2.y * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.g));\n\
- lowp vec4 newColor1 = texture2D(u_textureB, texPos1);\n\
- lowp vec4 newColor2 = texture2D(u_textureB, texPos2);\n\
- lowp vec4 newColor = mix(newColor1, newColor2, fract(blueColor));\n\
- gl_FragColor = vec4( mix( textureColor.rgb, newColor.rgb, u_amount), textureColor.w);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/LUT", LGraphTextureLUT );
-
- // Texture Channels *****************************************
- function LGraphTextureChannels()
- {
- this.addInput("Texture","Texture");
-
- this.addOutput("R","Texture");
- this.addOutput("G","Texture");
- this.addOutput("B","Texture");
- this.addOutput("A","Texture");
-
- this.properties = {};
- if(!LGraphTextureChannels._shader)
- LGraphTextureChannels._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureChannels.pixel_shader );
- }
-
- LGraphTextureChannels.title = "Texture to Channels";
- LGraphTextureChannels.desc = "Split texture channels";
-
- LGraphTextureChannels.prototype.onExecute = function()
- {
- var texA = this.getInputData(0);
- if(!texA) return;
-
- if(!this._channels)
- this._channels = Array(4);
-
- var connections = 0;
- for(var i = 0; i < 4; i++)
- {
- if(this.isOutputConnected(i))
- {
- if(!this._channels[i] || this._channels[i].width != texA.width || this._channels[i].height != texA.height || this._channels[i].type != texA.type)
- this._channels[i] = new GL.Texture( texA.width, texA.height, { type: texA.type, format: gl.RGBA, filter: gl.LINEAR });
- connections++;
- }
- else
- this._channels[i] = null;
- }
-
- if(!connections)
- return;
-
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
-
- var mesh = Mesh.getScreenQuad();
- var shader = LGraphTextureChannels._shader;
- var masks = [[1,0,0,0],[0,1,0,0],[0,0,1,0],[0,0,0,1]];
-
- for(var i = 0; i < 4; i++)
- {
- if(!this._channels[i])
- continue;
-
- this._channels[i].drawTo( function() {
- texA.bind(0);
- shader.uniforms({u_texture:0, u_mask: masks[i]}).draw(mesh);
- });
- this.setOutputData(i, this._channels[i]);
- }
- }
-
- LGraphTextureChannels.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec4 u_mask;\n\
- \n\
- void main() {\n\
- gl_FragColor = vec4( vec3( length( texture2D(u_texture, v_coord) * u_mask )), 1.0 );\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/textureChannels", LGraphTextureChannels );
-
-
- // Texture Channels to Texture *****************************************
- function LGraphChannelsTexture()
- {
- this.addInput("R","Texture");
- this.addInput("G","Texture");
- this.addInput("B","Texture");
- this.addInput("A","Texture");
-
- this.addOutput("Texture","Texture");
-
- this.properties = {};
- if(!LGraphChannelsTexture._shader)
- LGraphChannelsTexture._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphChannelsTexture.pixel_shader );
- }
-
- LGraphChannelsTexture.title = "Channels to Texture";
- LGraphChannelsTexture.desc = "Split texture channels";
-
- LGraphChannelsTexture.prototype.onExecute = function()
- {
- var tex = [ this.getInputData(0),
- this.getInputData(1),
- this.getInputData(2),
- this.getInputData(3) ];
-
- if(!tex[0] || !tex[1] || !tex[2] || !tex[3])
- return;
-
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
-
- var mesh = Mesh.getScreenQuad();
- var shader = LGraphChannelsTexture._shader;
-
- this._tex = LGraphTexture.getTargetTexture( tex[0], this._tex );
-
- this._tex.drawTo( function() {
- tex[0].bind(0);
- tex[1].bind(1);
- tex[2].bind(2);
- tex[3].bind(3);
- shader.uniforms({u_textureR:0, u_textureG:1, u_textureB:2, u_textureA:3 }).draw(mesh);
- });
- this.setOutputData(0, this._tex);
- }
-
- LGraphChannelsTexture.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_textureR;\n\
- uniform sampler2D u_textureG;\n\
- uniform sampler2D u_textureB;\n\
- uniform sampler2D u_textureA;\n\
- \n\
- void main() {\n\
- gl_FragColor = vec4( \
- texture2D(u_textureR, v_coord).r,\
- texture2D(u_textureG, v_coord).r,\
- texture2D(u_textureB, v_coord).r,\
- texture2D(u_textureA, v_coord).r);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/channelsTexture", LGraphChannelsTexture );
-
- // Texture Channels to Texture *****************************************
- function LGraphTextureGradient()
- {
- this.addInput("A","color");
- this.addInput("B","color");
- this.addOutput("Texture","Texture");
-
- this.properties = { angle: 0, scale: 1, A:[0,0,0], B:[1,1,1], texture_size:32 };
- if(!LGraphTextureGradient._shader)
- LGraphTextureGradient._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureGradient.pixel_shader );
-
- this._uniforms = { u_angle: 0, u_colorA: vec3.create(), u_colorB: vec3.create()};
- }
-
- LGraphTextureGradient.title = "Gradient";
- LGraphTextureGradient.desc = "Generates a gradient";
- LGraphTextureGradient["@A"] = { type:"color" };
- LGraphTextureGradient["@B"] = { type:"color" };
- LGraphTextureGradient["@texture_size"] = { type:"enum", values:[32,64,128,256,512] };
-
- LGraphTextureGradient.prototype.onExecute = function()
- {
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
-
- var mesh = GL.Mesh.getScreenQuad();
- var shader = LGraphTextureGradient._shader;
-
- var A = this.getInputData(0);
- if(!A)
- A = this.properties.A;
- var B = this.getInputData(1);
- if(!B)
- B = this.properties.B;
-
- //angle and scale
- for(var i = 2; i < this.inputs.length; i++)
- {
- var input = this.inputs[i];
- var v = this.getInputData(i);
- if(v === undefined)
- continue;
- this.properties[ input.name ] = v;
- }
-
- var uniforms = this._uniforms;
- this._uniforms.u_angle = this.properties.angle * DEG2RAD;
- this._uniforms.u_scale = this.properties.scale;
- vec3.copy( uniforms.u_colorA, A );
- vec3.copy( uniforms.u_colorB, B );
-
- var size = parseInt( this.properties.texture_size );
- if(!this._tex || this._tex.width != size )
- this._tex = new GL.Texture( size, size, { format: gl.RGB, filter: gl.LINEAR });
-
- this._tex.drawTo( function() {
- shader.uniforms(uniforms).draw(mesh);
- });
- this.setOutputData(0, this._tex);
- }
-
- LGraphTextureGradient.prototype.onGetInputs = function()
- {
- return [["angle","number"],["scale","number"]];
- }
-
- LGraphTextureGradient.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform float u_angle;\n\
- uniform float u_scale;\n\
- uniform vec3 u_colorA;\n\
- uniform vec3 u_colorB;\n\
- \n\
- vec2 rotate(vec2 v, float angle)\n\
- {\n\
- vec2 result;\n\
- float _cos = cos(angle);\n\
- float _sin = sin(angle);\n\
- result.x = v.x * _cos - v.y * _sin;\n\
- result.y = v.x * _sin + v.y * _cos;\n\
- return result;\n\
- }\n\
- void main() {\n\
- float f = (rotate(u_scale * (v_coord - vec2(0.5)), u_angle) + vec2(0.5)).x;\n\
- vec3 color = mix(u_colorA,u_colorB,clamp(f,0.0,1.0));\n\
- gl_FragColor = vec4(color,1.0);\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/gradient", LGraphTextureGradient );
-
- // Texture Mix *****************************************
- function LGraphTextureMix()
- {
- this.addInput("A","Texture");
- this.addInput("B","Texture");
- this.addInput("Mixer","Texture");
-
- this.addOutput("Texture","Texture");
- this.properties = { precision: LGraphTexture.DEFAULT };
-
- if(!LGraphTextureMix._shader)
- LGraphTextureMix._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureMix.pixel_shader );
- }
-
- LGraphTextureMix.title = "Mix";
- LGraphTextureMix.desc = "Generates a texture mixing two textures";
-
- LGraphTextureMix.widgets_info = {
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureMix.prototype.onExecute = function()
- {
- var texA = this.getInputData(0);
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH )
- {
- this.setOutputData(0,texA);
- return;
- }
-
- var texB = this.getInputData(1);
- var texMix = this.getInputData(2);
- if(!texA || !texB || !texMix) return;
-
- this._tex = LGraphTexture.getTargetTexture( texA, this._tex, this.properties.precision );
-
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
-
- var mesh = Mesh.getScreenQuad();
- var shader = LGraphTextureMix._shader;
-
- this._tex.drawTo( function() {
- texA.bind(0);
- texB.bind(1);
- texMix.bind(2);
- shader.uniforms({u_textureA:0,u_textureB:1,u_textureMix:2}).draw(mesh);
- });
-
- this.setOutputData(0, this._tex);
- }
-
- LGraphTextureMix.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_textureA;\n\
- uniform sampler2D u_textureB;\n\
- uniform sampler2D u_textureMix;\n\
- \n\
- void main() {\n\
- gl_FragColor = mix( texture2D(u_textureA, v_coord), texture2D(u_textureB, v_coord), texture2D(u_textureMix, v_coord) );\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/mix", LGraphTextureMix );
-
- // Texture Edges detection *****************************************
- function LGraphTextureEdges()
- {
- this.addInput("Tex.","Texture");
-
- this.addOutput("Edges","Texture");
- this.properties = { invert: true, threshold: false, factor: 1, precision: LGraphTexture.DEFAULT };
-
- if(!LGraphTextureEdges._shader)
- LGraphTextureEdges._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureEdges.pixel_shader );
- }
-
- LGraphTextureEdges.title = "Edges";
- LGraphTextureEdges.desc = "Detects edges";
-
- LGraphTextureEdges.widgets_info = {
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureEdges.prototype.onExecute = function()
- {
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var tex = this.getInputData(0);
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH )
- {
- this.setOutputData(0,tex);
- return;
- }
-
- if(!tex) return;
-
- this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
-
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
-
- var mesh = Mesh.getScreenQuad();
- var shader = LGraphTextureEdges._shader;
- var invert = this.properties.invert;
- var factor = this.properties.factor;
- var threshold = this.properties.threshold ? 1 : 0;
-
- this._tex.drawTo( function() {
- tex.bind(0);
- shader.uniforms({u_texture:0, u_isize:[1/tex.width,1/tex.height], u_factor: factor, u_threshold: threshold, u_invert: invert ? 1 : 0}).draw(mesh);
- });
-
- this.setOutputData(0, this._tex);
- }
-
- LGraphTextureEdges.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 u_isize;\n\
- uniform int u_invert;\n\
- uniform float u_factor;\n\
- uniform float u_threshold;\n\
- \n\
- void main() {\n\
- vec4 center = texture2D(u_texture, v_coord);\n\
- vec4 up = texture2D(u_texture, v_coord + u_isize * vec2(0.0,1.0) );\n\
- vec4 down = texture2D(u_texture, v_coord + u_isize * vec2(0.0,-1.0) );\n\
- vec4 left = texture2D(u_texture, v_coord + u_isize * vec2(1.0,0.0) );\n\
- vec4 right = texture2D(u_texture, v_coord + u_isize * vec2(-1.0,0.0) );\n\
- vec4 diff = abs(center - up) + abs(center - down) + abs(center - left) + abs(center - right);\n\
- diff *= u_factor;\n\
- if(u_invert == 1)\n\
- diff.xyz = vec3(1.0) - diff.xyz;\n\
- if( u_threshold == 0.0 )\n\
- gl_FragColor = vec4( diff.xyz, center.a );\n\
- else\n\
- gl_FragColor = vec4( diff.x > 0.5 ? 1.0 : 0.0, diff.y > 0.5 ? 1.0 : 0.0, diff.z > 0.5 ? 1.0 : 0.0, center.a );\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/edges", LGraphTextureEdges );
-
- // Texture Depth *****************************************
- function LGraphTextureDepthRange()
- {
- this.addInput("Texture","Texture");
- this.addInput("Distance","number");
- this.addInput("Range","number");
- this.addOutput("Texture","Texture");
- this.properties = { distance:100, range: 50, only_depth: false, high_precision: false };
- this._uniforms = {u_texture:0, u_distance: 100, u_range: 50, u_camera_planes: null };
- }
-
- LGraphTextureDepthRange.title = "Depth Range";
- LGraphTextureDepthRange.desc = "Generates a texture with a depth range";
-
- LGraphTextureDepthRange.prototype.onExecute = function()
- {
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var tex = this.getInputData(0);
- if(!tex) return;
-
- var precision = gl.UNSIGNED_BYTE;
- if(this.properties.high_precision)
- precision = gl.half_float_ext ? gl.HALF_FLOAT_OES : gl.FLOAT;
-
- if(!this._temp_texture || this._temp_texture.type != precision ||
- this._temp_texture.width != tex.width || this._temp_texture.height != tex.height)
- this._temp_texture = new GL.Texture( tex.width, tex.height, { type: precision, format: gl.RGBA, filter: gl.LINEAR });
-
- var uniforms = this._uniforms;
-
- //iterations
- var distance = this.properties.distance;
- if( this.isInputConnected(1) )
- {
- distance = this.getInputData(1);
- this.properties.distance = distance;
- }
-
- var range = this.properties.range;
- if( this.isInputConnected(2) )
- {
- range = this.getInputData(2);
- this.properties.range = range;
- }
-
- uniforms.u_distance = distance;
- uniforms.u_range = range;
-
- gl.disable( gl.BLEND );
- gl.disable( gl.DEPTH_TEST );
- var mesh = Mesh.getScreenQuad();
- if(!LGraphTextureDepthRange._shader)
- {
- LGraphTextureDepthRange._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureDepthRange.pixel_shader );
- LGraphTextureDepthRange._shader_onlydepth = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureDepthRange.pixel_shader, { ONLY_DEPTH:""} );
- }
- var shader = this.properties.only_depth ? LGraphTextureDepthRange._shader_onlydepth : LGraphTextureDepthRange._shader;
-
- //NEAR AND FAR PLANES
- var planes = null;
- if( tex.near_far_planes )
- planes = tex.near_far_planes;
- else if( window.LS && LS.Renderer._main_camera )
- planes = LS.Renderer._main_camera._uniforms.u_camera_planes;
- else
- planes = [0.1,1000]; //hardcoded
- uniforms.u_camera_planes = planes;
-
-
- this._temp_texture.drawTo( function() {
- tex.bind(0);
- shader.uniforms( uniforms ).draw(mesh);
- });
-
- this._temp_texture.near_far_planes = planes;
- this.setOutputData(0, this._temp_texture );
- }
-
- LGraphTextureDepthRange.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 u_camera_planes;\n\
- uniform float u_distance;\n\
- uniform float u_range;\n\
- \n\
- float LinearDepth()\n\
- {\n\
- float zNear = u_camera_planes.x;\n\
- float zFar = u_camera_planes.y;\n\
- float depth = texture2D(u_texture, v_coord).x;\n\
- depth = depth * 2.0 - 1.0;\n\
- return zNear * (depth + 1.0) / (zFar + zNear - depth * (zFar - zNear));\n\
- }\n\
- \n\
- void main() {\n\
- float depth = LinearDepth();\n\
- #ifdef ONLY_DEPTH\n\
- gl_FragColor = vec4(depth);\n\
- #else\n\
- float diff = abs(depth * u_camera_planes.y - u_distance);\n\
- float dof = 1.0;\n\
- if(diff <= u_range)\n\
- dof = diff / u_range;\n\
- gl_FragColor = vec4(dof);\n\
- #endif\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/depth_range", LGraphTextureDepthRange );
-
- // Texture Blur *****************************************
- function LGraphTextureBlur()
- {
- this.addInput("Texture","Texture");
- this.addInput("Iterations","number");
- this.addInput("Intensity","number");
- this.addOutput("Blurred","Texture");
- this.properties = { intensity: 1, iterations: 1, preserve_aspect: false, scale:[1,1], precision: LGraphTexture.DEFAULT };
- }
-
- LGraphTextureBlur.title = "Blur";
- LGraphTextureBlur.desc = "Blur a texture";
-
- LGraphTextureBlur.widgets_info = {
- precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureBlur.max_iterations = 20;
-
- LGraphTextureBlur.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var temp = this._final_texture;
-
- if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
- {
- //we need two textures to do the blurring
- //this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
- temp = this._final_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
- }
-
- //iterations
- var iterations = this.properties.iterations;
- if( this.isInputConnected(1) )
- {
- iterations = this.getInputData(1);
- this.properties.iterations = iterations;
- }
- iterations = Math.min( Math.floor(iterations), LGraphTextureBlur.max_iterations );
- if(iterations == 0) //skip blurring
- {
- this.setOutputData(0, tex);
- return;
- }
-
- var intensity = this.properties.intensity;
- if( this.isInputConnected(2) )
- {
- intensity = this.getInputData(2);
- this.properties.intensity = intensity;
- }
-
- //blur sometimes needs an aspect correction
- var aspect = LiteGraph.camera_aspect;
- if(!aspect && window.gl !== undefined)
- aspect = gl.canvas.height / gl.canvas.width;
- if(!aspect)
- aspect = 1;
- aspect = this.properties.preserve_aspect ? aspect : 1;
-
- var scale = this.properties.scale || [1,1];
- tex.applyBlur( aspect * scale[0], scale[1], intensity, temp );
- for(var i = 1; i < iterations; ++i)
- temp.applyBlur( aspect * scale[0] * (i+1), scale[1] * (i+1), intensity );
-
- this.setOutputData(0, temp );
- }
-
- /*
- LGraphTextureBlur.pixel_shader = "precision highp float;\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 u_offset;\n\
- uniform float u_intensity;\n\
- void main() {\n\
- vec4 sum = vec4(0.0);\n\
- vec4 center = texture2D(u_texture, v_coord);\n\
- sum += texture2D(u_texture, v_coord + u_offset * -4.0) * 0.05/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * -3.0) * 0.09/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * -2.0) * 0.12/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * -1.0) * 0.15/0.98;\n\
- sum += center * 0.16/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * 4.0) * 0.05/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * 3.0) * 0.09/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * 2.0) * 0.12/0.98;\n\
- sum += texture2D(u_texture, v_coord + u_offset * 1.0) * 0.15/0.98;\n\
- gl_FragColor = u_intensity * sum;\n\
- }\n\
- ";
- */
-
- LiteGraph.registerNodeType("texture/blur", LGraphTextureBlur );
-
-
- // Texture Glow *****************************************
- //based in https://catlikecoding.com/unity/tutorials/advanced-rendering/bloom/
- function LGraphTextureGlow()
- {
- this.addInput("in","Texture");
- this.addInput("dirt","Texture");
- this.addOutput("out","Texture");
- this.addOutput("glow","Texture");
- this.properties = { enabled: true, intensity: 1, persistence: 0.99, iterations:16, threshold:0, scale: 1, dirt_factor: 0.5, precision: LGraphTexture.DEFAULT };
- this._textures = [];
- this._uniforms = { u_intensity: 1, u_texture: 0, u_glow_texture: 1, u_threshold: 0, u_texel_size: vec2.create() };
- }
-
- LGraphTextureGlow.title = "Glow";
- LGraphTextureGlow.desc = "Filters a texture giving it a glow effect";
- LGraphTextureGlow.weights = new Float32Array( [0.5,0.4,0.3,0.2] );
-
- LGraphTextureGlow.widgets_info = {
- "iterations": { type:"number", min: 0, max: 16, step: 1, precision: 0 },
- "threshold": { type:"number", min: 0, max: 10, step: 0.01, precision: 2 },
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphTextureGlow.prototype.onGetInputs = function(){
- return [["enabled","boolean"],["threshold","number"],["intensity","number"],["persistence","number"],["iterations","number"],["dirt_factor","number"]];
- }
-
- LGraphTextureGlow.prototype.onGetOutputs = function(){
- return [["average","Texture"]];
- }
-
- LGraphTextureGlow.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(!this.isAnyOutputConnected())
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH || this.getInputOrProperty("enabled" ) === false )
- {
- this.setOutputData(0,tex);
- return;
- }
-
- var width = tex.width;
- var height = tex.height;
-
- var texture_info = { format: tex.format, type: tex.type, minFilter: GL.LINEAR, magFilter: GL.LINEAR, wrap: gl.CLAMP_TO_EDGE };
- var type = LGraphTexture.getTextureType( this.properties.precision, tex );
-
- var uniforms = this._uniforms;
- var textures = this._textures;
-
- //cut
- var shader = LGraphTextureGlow._cut_shader;
- if(!shader)
- shader = LGraphTextureGlow._cut_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.cut_pixel_shader );
-
- gl.disable( gl.DEPTH_TEST );
- gl.disable( gl.BLEND );
-
- uniforms.u_threshold = this.getInputOrProperty("threshold");
- var currentDestination = textures[0] = GL.Texture.getTemporary( width, height, texture_info );
- tex.blit( currentDestination, shader.uniforms(uniforms) );
- var currentSource = currentDestination;
-
- var iterations = this.getInputOrProperty("iterations");
- iterations = Math.clamp( iterations, 1, 16) | 0;
- var texel_size = uniforms.u_texel_size;
- var intensity = this.getInputOrProperty("intensity");
-
- uniforms.u_intensity = 1;
- uniforms.u_delta = this.properties.scale; //1
-
- //downscale/upscale shader
- var shader = LGraphTextureGlow._shader;
- if(!shader)
- shader = LGraphTextureGlow._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.scale_pixel_shader );
-
- var i = 1;
- //downscale
- for (;i < iterations; i++) {
- width = width>>1;
- if( (height|0) > 1 )
- height = height>>1;
- if( width < 2 )
- break;
- currentDestination = textures[i] = GL.Texture.getTemporary( width, height, texture_info );
- texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
- currentSource.blit( currentDestination, shader.uniforms(uniforms) );
- currentSource = currentDestination;
- }
-
- //average
- if(this.isOutputConnected(2))
- {
- var average_texture = this._average_texture;
- if(!average_texture || average_texture.type != tex.type || average_texture.format != tex.format )
- average_texture = this._average_texture = new GL.Texture( 1, 1, { type: tex.type, format: tex.format, filter: gl.LINEAR });
- texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
- uniforms.u_intensity = intensity;
- uniforms.u_delta = 1;
- currentSource.blit( average_texture, shader.uniforms(uniforms) );
- this.setOutputData( 2, average_texture );
- }
-
- //upscale and blend
- gl.enable( gl.BLEND );
- gl.blendFunc( gl.ONE, gl.ONE );
- uniforms.u_intensity = this.getInputOrProperty("persistence");
- uniforms.u_delta = 0.5;
-
- for (i -= 2; i >= 0; i--) // i-=2 => -1 to point to last element in array, -1 to go to texture above
- {
- currentDestination = textures[i];
- textures[i] = null;
- texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
- currentSource.blit( currentDestination, shader.uniforms(uniforms) );
- GL.Texture.releaseTemporary( currentSource );
- currentSource = currentDestination;
- }
- gl.disable( gl.BLEND );
-
- //glow
- if(this.isOutputConnected(1))
- {
- var glow_texture = this._glow_texture;
- if(!glow_texture || glow_texture.width != tex.width || glow_texture.height != tex.height || glow_texture.type != type || glow_texture.format != tex.format )
- glow_texture = this._glow_texture = new GL.Texture( tex.width, tex.height, { type: type, format: tex.format, filter: gl.LINEAR });
- currentSource.blit( glow_texture );
- this.setOutputData( 1, glow_texture);
- }
-
- //final composition
- if(this.isOutputConnected(0))
- {
- var final_texture = this._final_texture;
- if(!final_texture || final_texture.width != tex.width || final_texture.height != tex.height || final_texture.type != type || final_texture.format != tex.format )
- final_texture = this._final_texture = new GL.Texture( tex.width, tex.height, { type: type, format: tex.format, filter: gl.LINEAR });
-
- var dirt_texture = this.getInputData(1);
- var dirt_factor = this.getInputOrProperty("dirt_factor");
-
- uniforms.u_intensity = intensity;
-
- shader = dirt_texture ? LGraphTextureGlow._dirt_final_shader : LGraphTextureGlow._final_shader;
- if(!shader)
- {
- if(dirt_texture)
- shader = LGraphTextureGlow._dirt_final_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.final_pixel_shader, { USE_DIRT: "" } );
- else
- shader = LGraphTextureGlow._final_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.final_pixel_shader );
- }
-
- final_texture.drawTo( function(){
- tex.bind(0);
- currentSource.bind(1);
- if(dirt_texture)
- {
- shader.setUniform( "u_dirt_factor", dirt_factor );
- shader.setUniform( "u_dirt_texture", dirt_texture.bind(2) );
- }
- shader.toViewport( uniforms );
- });
- this.setOutputData( 0, final_texture );
- }
-
- GL.Texture.releaseTemporary( currentSource );
- }
-
- LGraphTextureGlow.cut_pixel_shader = "precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform float u_threshold;\n\
- void main() {\n\
- gl_FragColor = max( texture2D( u_texture, v_coord ) - vec4( u_threshold ), vec4(0.0) );\n\
- }"
-
- LGraphTextureGlow.scale_pixel_shader = "precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform vec2 u_texel_size;\n\
- uniform float u_delta;\n\
- uniform float u_intensity;\n\
- \n\
- vec4 sampleBox(vec2 uv) {\n\
- vec4 o = u_texel_size.xyxy * vec2(-u_delta, u_delta).xxyy;\n\
- vec4 s = texture2D( u_texture, uv + o.xy ) + texture2D( u_texture, uv + o.zy) + texture2D( u_texture, uv + o.xw) + texture2D( u_texture, uv + o.zw);\n\
- return s * 0.25;\n\
- }\n\
- void main() {\n\
- gl_FragColor = u_intensity * sampleBox( v_coord );\n\
- }"
-
- LGraphTextureGlow.final_pixel_shader = "precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform sampler2D u_glow_texture;\n\
- #ifdef USE_DIRT\n\
- uniform sampler2D u_dirt_texture;\n\
- #endif\n\
- uniform vec2 u_texel_size;\n\
- uniform float u_delta;\n\
- uniform float u_intensity;\n\
- uniform float u_dirt_factor;\n\
- \n\
- vec4 sampleBox(vec2 uv) {\n\
- vec4 o = u_texel_size.xyxy * vec2(-u_delta, u_delta).xxyy;\n\
- vec4 s = texture2D( u_glow_texture, uv + o.xy ) + texture2D( u_glow_texture, uv + o.zy) + texture2D( u_glow_texture, uv + o.xw) + texture2D( u_glow_texture, uv + o.zw);\n\
- return s * 0.25;\n\
- }\n\
- void main() {\n\
- vec4 glow = sampleBox( v_coord );\n\
- #ifdef USE_DIRT\n\
- glow = mix( glow, glow * texture2D( u_dirt_texture, v_coord ), u_dirt_factor );\n\
- #endif\n\
- gl_FragColor = texture2D( u_texture, v_coord ) + u_intensity * glow;\n\
- }"
-
- LiteGraph.registerNodeType("texture/glow", LGraphTextureGlow );
-
-
- // Texture Blur *****************************************
- function LGraphTextureKuwaharaFilter()
- {
- this.addInput("Texture","Texture");
- this.addOutput("Filtered","Texture");
- this.properties = { intensity: 1, radius: 5 };
- }
-
- LGraphTextureKuwaharaFilter.title = "Kuwahara Filter";
- LGraphTextureKuwaharaFilter.desc = "Filters a texture giving an artistic oil canvas painting";
-
- LGraphTextureKuwaharaFilter.max_radius = 10;
- LGraphTextureKuwaharaFilter._shaders = [];
-
- LGraphTextureKuwaharaFilter.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- var temp = this._temp_texture;
-
- if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
- {
- //we need two textures to do the blurring
- this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
- //this._final_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
- }
-
- //iterations
- var radius = this.properties.radius;
- radius = Math.min( Math.floor(radius), LGraphTextureKuwaharaFilter.max_radius );
- if(radius == 0) //skip blurring
- {
- this.setOutputData(0, tex);
- return;
- }
-
- var intensity = this.properties.intensity;
-
- //blur sometimes needs an aspect correction
- var aspect = LiteGraph.camera_aspect;
- if(!aspect && window.gl !== undefined)
- aspect = gl.canvas.height / gl.canvas.width;
- if(!aspect)
- aspect = 1;
- aspect = this.properties.preserve_aspect ? aspect : 1;
-
- if(!LGraphTextureKuwaharaFilter._shaders[ radius ])
- LGraphTextureKuwaharaFilter._shaders[ radius ] = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureKuwaharaFilter.pixel_shader, { RADIUS: radius.toFixed(0) });
-
- var shader = LGraphTextureKuwaharaFilter._shaders[ radius ];
- var mesh = GL.Mesh.getScreenQuad();
- tex.bind(0);
-
- this._temp_texture.drawTo( function() {
- shader.uniforms({ u_texture: 0, u_intensity: intensity, u_resolution: [tex.width, tex.height], u_iResolution: [1/tex.width,1/tex.height]}).draw(mesh);
- });
-
- this.setOutputData(0, this._temp_texture);
- }
-
-//from https://www.shadertoy.com/view/MsXSz4
-LGraphTextureKuwaharaFilter.pixel_shader = "\n\
- precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform float u_intensity;\n\
- uniform vec2 u_resolution;\n\
- uniform vec2 u_iResolution;\n\
- #ifndef RADIUS\n\
- #define RADIUS 7\n\
- #endif\n\
- void main() {\n\
- \n\
- const int radius = RADIUS;\n\
- vec2 fragCoord = v_coord;\n\
- vec2 src_size = u_iResolution;\n\
- vec2 uv = v_coord;\n\
- float n = float((radius + 1) * (radius + 1));\n\
- int i;\n\
- int j;\n\
- vec3 m0 = vec3(0.0); vec3 m1 = vec3(0.0); vec3 m2 = vec3(0.0); vec3 m3 = vec3(0.0);\n\
- vec3 s0 = vec3(0.0); vec3 s1 = vec3(0.0); vec3 s2 = vec3(0.0); vec3 s3 = vec3(0.0);\n\
- vec3 c;\n\
- \n\
- for (int j = -radius; j <= 0; ++j) {\n\
- for (int i = -radius; i <= 0; ++i) {\n\
- c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
- m0 += c;\n\
- s0 += c * c;\n\
- }\n\
- }\n\
- \n\
- for (int j = -radius; j <= 0; ++j) {\n\
- for (int i = 0; i <= radius; ++i) {\n\
- c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
- m1 += c;\n\
- s1 += c * c;\n\
- }\n\
- }\n\
- \n\
- for (int j = 0; j <= radius; ++j) {\n\
- for (int i = 0; i <= radius; ++i) {\n\
- c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
- m2 += c;\n\
- s2 += c * c;\n\
- }\n\
- }\n\
- \n\
- for (int j = 0; j <= radius; ++j) {\n\
- for (int i = -radius; i <= 0; ++i) {\n\
- c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
- m3 += c;\n\
- s3 += c * c;\n\
- }\n\
- }\n\
- \n\
- float min_sigma2 = 1e+2;\n\
- m0 /= n;\n\
- s0 = abs(s0 / n - m0 * m0);\n\
- \n\
- float sigma2 = s0.r + s0.g + s0.b;\n\
- if (sigma2 < min_sigma2) {\n\
- min_sigma2 = sigma2;\n\
- gl_FragColor = vec4(m0, 1.0);\n\
- }\n\
- \n\
- m1 /= n;\n\
- s1 = abs(s1 / n - m1 * m1);\n\
- \n\
- sigma2 = s1.r + s1.g + s1.b;\n\
- if (sigma2 < min_sigma2) {\n\
- min_sigma2 = sigma2;\n\
- gl_FragColor = vec4(m1, 1.0);\n\
- }\n\
- \n\
- m2 /= n;\n\
- s2 = abs(s2 / n - m2 * m2);\n\
- \n\
- sigma2 = s2.r + s2.g + s2.b;\n\
- if (sigma2 < min_sigma2) {\n\
- min_sigma2 = sigma2;\n\
- gl_FragColor = vec4(m2, 1.0);\n\
- }\n\
- \n\
- m3 /= n;\n\
- s3 = abs(s3 / n - m3 * m3);\n\
- \n\
- sigma2 = s3.r + s3.g + s3.b;\n\
- if (sigma2 < min_sigma2) {\n\
- min_sigma2 = sigma2;\n\
- gl_FragColor = vec4(m3, 1.0);\n\
- }\n\
- }\n\
- ";
-
- LiteGraph.registerNodeType("texture/kuwahara", LGraphTextureKuwaharaFilter );
-
-
- // Texture Webcam *****************************************
- function LGraphTextureWebcam()
- {
- this.addOutput("Webcam","Texture");
- this.properties = { texture_name: "" };
- }
-
- LGraphTextureWebcam.title = "Webcam";
- LGraphTextureWebcam.desc = "Webcam texture";
-
-
- LGraphTextureWebcam.prototype.openStream = function()
- {
- //Vendor prefixes hell
- navigator.getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
- window.URL = window.URL || window.webkitURL;
-
- if (!navigator.getUserMedia) {
- //console.log('getUserMedia() is not supported in your browser, use chrome and enable WebRTC from about://flags');
- return;
- }
-
- this._waiting_confirmation = true;
- var that = this;
-
- // Not showing vendor prefixes.
- navigator.getUserMedia({video: true}, this.streamReady.bind(this), onFailSoHard);
-
- function onFailSoHard(e) {
- console.log('Webcam rejected', e);
- that._webcam_stream = false;
- that.box_color = "red";
- };
- }
-
- LGraphTextureWebcam.prototype.streamReady = function(localMediaStream)
- {
- this._webcam_stream = localMediaStream;
- //this._waiting_confirmation = false;
-
- var video = this._video;
- if(!video)
- {
- video = document.createElement("video");
- video.autoplay = true;
- video.src = window.URL.createObjectURL( localMediaStream );
- this._video = video;
- //document.body.appendChild( video ); //debug
- //when video info is loaded (size and so)
- video.onloadedmetadata = function(e) {
- // Ready to go. Do some stuff.
- console.log(e);
- };
- }
- }
-
- LGraphTextureWebcam.prototype.onRemoved = function()
- {
- if(!this._webcam_stream)
- return;
-
- var video_streams = this._webcam_stream.getVideoTracks();
- if(video_streams.length)
- {
- var webcam = video_streams[0];
- if( webcam.stop )
- webcam.stop();
- }
-
- this._webcam_stream = null;
- this._video = null;
- }
-
- LGraphTextureWebcam.prototype.onDrawBackground = function(ctx)
- {
- if(this.flags.collapsed || this.size[1] <= 20)
- return;
-
- if(!this._video)
- return;
-
- //render to graph canvas
- ctx.save();
- if(!ctx.webgl) //reverse image
- {
- ctx.translate(0,this.size[1]);
- ctx.scale(1,-1);
- ctx.drawImage(this._video, 0, 0, this.size[0], this.size[1]);
- }
- else
- {
- if(this._temp_texture)
- ctx.drawImage(this._temp_texture, 0, 0, this.size[0], this.size[1]);
- }
- ctx.restore();
- }
-
- LGraphTextureWebcam.prototype.onExecute = function()
- {
- if(this._webcam_stream == null && !this._waiting_confirmation)
- this.openStream();
-
- if(!this._video || !this._video.videoWidth)
- return;
-
- var width = this._video.videoWidth;
- var height = this._video.videoHeight;
-
- var temp = this._temp_texture;
- if(!temp || temp.width != width || temp.height != height )
- this._temp_texture = new GL.Texture( width, height, { format: gl.RGB, filter: gl.LINEAR });
-
- this._temp_texture.uploadImage( this._video );
-
- if(this.properties.texture_name)
- {
- var container = LGraphTexture.getTexturesContainer();
- container[ this.properties.texture_name ] = this._temp_texture;
- }
-
- this.setOutputData(0,this._temp_texture);
- }
-
- LiteGraph.registerNodeType("texture/webcam", LGraphTextureWebcam );
-
-
-
- //from https://github.com/spite/Wagner
- function LGraphLensFX()
- {
- this.addInput("in","Texture");
- this.addInput("f","number");
- this.addOutput("out","Texture");
- this.properties = { enabled: true, factor: 1, precision: LGraphTexture.LOW };
-
- this._uniforms = { u_texture: 0, u_factor: 1 };
- }
-
- LGraphLensFX.title = "Lens FX";
- LGraphLensFX.desc = "distortion and chromatic aberration";
-
- LGraphLensFX.widgets_info = {
- "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
- };
-
- LGraphLensFX.prototype.onGetInputs = function() { return [["enabled","boolean"]]; }
-
- LGraphLensFX.prototype.onExecute = function()
- {
- var tex = this.getInputData(0);
- if(!tex)
- return;
-
- if(!this.isOutputConnected(0))
- return; //saves work
-
- if(this.properties.precision === LGraphTexture.PASS_THROUGH || this.getInputOrProperty("enabled" ) === false )
- {
- this.setOutputData(0, tex );
- return;
- }
-
- var temp = this._temp_texture;
- if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
- temp = this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
-
- var shader = LGraphLensFX._shader;
- if(!shader)
- shader = LGraphLensFX._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphLensFX.pixel_shader );
-
- var factor = this.getInputData(1);
- if(factor == null)
- factor = this.properties.factor;
-
- var uniforms = this._uniforms;
- uniforms.u_factor = factor;
-
- //apply shader
- gl.disable( gl.DEPTH_TEST );
- temp.drawTo(function(){
- tex.bind(0);
- shader.uniforms(uniforms).draw( GL.Mesh.getScreenQuad() );
- });
-
- this.setOutputData(0,temp);
- }
-
- LGraphLensFX.pixel_shader = "precision highp float;\n\
- varying vec2 v_coord;\n\
- uniform sampler2D u_texture;\n\
- uniform float u_factor;\n\
- vec2 barrelDistortion(vec2 coord, float amt) {\n\
- vec2 cc = coord - 0.5;\n\
- float dist = dot(cc, cc);\n\
- return coord + cc * dist * amt;\n\
- }\n\
- \n\
- float sat( float t )\n\
- {\n\
- return clamp( t, 0.0, 1.0 );\n\
- }\n\
- \n\
- float linterp( float t ) {\n\
- return sat( 1.0 - abs( 2.0*t - 1.0 ) );\n\
- }\n\
- \n\
- float remap( float t, float a, float b ) {\n\
- return sat( (t - a) / (b - a) );\n\
- }\n\
- \n\
- vec4 spectrum_offset( float t ) {\n\
- vec4 ret;\n\
- float lo = step(t,0.5);\n\
- float hi = 1.0-lo;\n\
- float w = linterp( remap( t, 1.0/6.0, 5.0/6.0 ) );\n\
- ret = vec4(lo,1.0,hi, 1.) * vec4(1.0-w, w, 1.0-w, 1.);\n\
- \n\
- return pow( ret, vec4(1.0/2.2) );\n\
- }\n\
- \n\
- const float max_distort = 2.2;\n\
- const int num_iter = 12;\n\
- const float reci_num_iter_f = 1.0 / float(num_iter);\n\
- \n\
- void main()\n\
- { \n\
- vec2 uv=v_coord;\n\
- vec4 sumcol = vec4(0.0);\n\
- vec4 sumw = vec4(0.0); \n\
- for ( int i=0; i size || tex.height > size)
+ {
+ temp_tex = this._preview_temp_tex;
+ if(!this._preview_temp_tex)
+ {
+ temp_tex = new GL.Texture(size,size, { minFilter: gl.NEAREST });
+ this._preview_temp_tex = temp_tex;
+ }
+
+ //copy
+ tex.copyTo(temp_tex);
+ tex = temp_tex;
+ }
+
+ //create intermediate canvas with lowquality version
+ var tex_canvas = this._preview_canvas;
+ if(!tex_canvas)
+ {
+ tex_canvas = createCanvas(size,size);
+ this._preview_canvas = tex_canvas;
+ }
+
+ if(temp_tex)
+ temp_tex.toCanvas(tex_canvas);
+ return tex_canvas;
+ }
+
+ LGraphTexture.prototype.getResources = function(res)
+ {
+ res[ this.properties.name ] = GL.Texture;
+ return res;
+ }
+
+ LGraphTexture.prototype.onGetInputs = function()
+ {
+ return [["in","Texture"]];
+ }
+
+
+ LGraphTexture.prototype.onGetOutputs = function()
+ {
+ return [["width","number"],["height","number"],["aspect","number"]];
+ }
+
+ LiteGraph.registerNodeType("texture/texture", LGraphTexture );
+
+ //**************************
+ function LGraphTexturePreview()
+ {
+ this.addInput("Texture","Texture");
+ this.properties = { flipY: false };
+ this.size = [LGraphTexture.image_preview_size, LGraphTexture.image_preview_size];
+ }
+
+ LGraphTexturePreview.title = "Preview";
+ LGraphTexturePreview.desc = "Show a texture in the graph canvas";
+ LGraphTexturePreview.allow_preview = false;
+
+ LGraphTexturePreview.prototype.onDrawBackground = function(ctx)
+ {
+ if(this.flags.collapsed)
+ return;
+
+ if(!ctx.webgl && !LGraphTexturePreview.allow_preview)
+ return; //not working well
+
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ var tex_canvas = null;
+
+ if(!tex.handle && ctx.webgl)
+ tex_canvas = tex;
+ else
+ tex_canvas = LGraphTexture.generateLowResTexturePreview(tex);
+
+ //render to graph canvas
+ ctx.save();
+ if(this.properties.flipY)
+ {
+ ctx.translate(0,this.size[1]);
+ ctx.scale(1,-1);
+ }
+ ctx.drawImage(tex_canvas,0,0,this.size[0],this.size[1]);
+ ctx.restore();
+ }
+
+ LiteGraph.registerNodeType("texture/preview", LGraphTexturePreview );
+
+ //**************************************
+
+ function LGraphTextureSave()
+ {
+ this.addInput("Texture","Texture");
+ this.addOutput("","Texture");
+ this.properties = {name:""};
+ }
+
+ LGraphTextureSave.title = "Save";
+ LGraphTextureSave.desc = "Save a texture in the repository";
+
+ LGraphTextureSave.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(this.properties.name)
+ {
+ //for cases where we want to perform something when storing it
+ if( LGraphTexture.storeTexture )
+ LGraphTexture.storeTexture( this.properties.name, tex );
+ else
+ {
+ var container = LGraphTexture.getTexturesContainer();
+ container[ this.properties.name ] = tex;
+ }
+ }
+
+ this.setOutputData(0, tex);
+ }
+
+ LiteGraph.registerNodeType("texture/save", LGraphTextureSave );
+
+ //****************************************************
+
+ function LGraphTextureOperation()
+ {
+ this.addInput("Texture","Texture");
+ this.addInput("TextureB","Texture");
+ this.addInput("value","number");
+ this.addOutput("Texture","Texture");
+ this.help = "pixelcode must be vec3
\
+ uvcode must be vec2, is optional
\
+ uv: tex. coords
color: texture
colorB: textureB
time: scene time
value: input value
";
+
+ this.properties = {value:1, uvcode:"", pixelcode:"color + colorB * value", precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureOperation.widgets_info = {
+ "uvcode": { widget:"textarea", height: 100 },
+ "pixelcode": { widget:"textarea", height: 100 },
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureOperation.title = "Operation";
+ LGraphTextureOperation.desc = "Texture shader operation";
+
+ LGraphTextureOperation.prototype.getExtraMenuOptions = function(graphcanvas)
+ {
+ var that = this;
+ var txt = !that.properties.show ? "Show Texture" : "Hide Texture";
+ return [ {content: txt, callback:
+ function() {
+ that.properties.show = !that.properties.show;
+ }
+ }];
+ }
+
+ LGraphTextureOperation.prototype.onDrawBackground = function(ctx)
+ {
+ if(this.flags.collapsed || this.size[1] <= 20 || !this.properties.show)
+ return;
+
+ if(!this._tex)
+ return;
+
+ //only works if using a webgl renderer
+ if(this._tex.gl != ctx)
+ return;
+
+ //render to graph canvas
+ ctx.save();
+ ctx.drawImage(this._tex, 0, 0, this.size[0], this.size[1]);
+ ctx.restore();
+ }
+
+ LGraphTextureOperation.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH)
+ {
+ this.setOutputData(0, tex);
+ return;
+ }
+
+ var texB = this.getInputData(1);
+
+ if(!this.properties.uvcode && !this.properties.pixelcode)
+ return;
+
+ var width = 512;
+ var height = 512;
+ if(tex)
+ {
+ width = tex.width;
+ height = tex.height;
+ }
+ else if (texB)
+ {
+ width = texB.width;
+ height = texB.height;
+ }
+
+ var type = LGraphTexture.getTextureType( this.properties.precision, tex );
+
+ if(!tex && !this._tex )
+ this._tex = new GL.Texture( width, height, { type: type, format: gl.RGBA, filter: gl.LINEAR });
+ else
+ this._tex = LGraphTexture.getTargetTexture( tex || this._tex, this._tex, this.properties.precision );
+
+ var uvcode = "";
+ if(this.properties.uvcode)
+ {
+ uvcode = "uv = " + this.properties.uvcode;
+ if(this.properties.uvcode.indexOf(";") != -1) //there are line breaks, means multiline code
+ uvcode = this.properties.uvcode;
+ }
+
+ var pixelcode = "";
+ if(this.properties.pixelcode)
+ {
+ pixelcode = "result = " + this.properties.pixelcode;
+ if(this.properties.pixelcode.indexOf(";") != -1) //there are line breaks, means multiline code
+ pixelcode = this.properties.pixelcode;
+ }
+
+ var shader = this._shader;
+
+ if(!shader || this._shader_code != (uvcode + "|" + pixelcode) )
+ {
+ try
+ {
+ this._shader = new GL.Shader(Shader.SCREEN_VERTEX_SHADER, LGraphTextureOperation.pixel_shader, { UV_CODE: uvcode, PIXEL_CODE: pixelcode });
+ this.boxcolor = "#00FF00";
+ }
+ catch (err)
+ {
+ console.log("Error compiling shader: ", err);
+ this.boxcolor = "#FF0000";
+ return;
+ }
+ this.boxcolor = "#FF0000";
+
+ this._shader_code = (uvcode + "|" + pixelcode);
+ shader = this._shader;
+ }
+
+ if(!shader)
+ {
+ this.boxcolor = "red";
+ return;
+ }
+ else
+ this.boxcolor = "green";
+
+ var value = this.getInputData(2);
+ if(value != null)
+ this.properties.value = value;
+ else
+ value = parseFloat( this.properties.value );
+
+ var time = this.graph.getTime();
+
+ this._tex.drawTo(function() {
+ gl.disable( gl.DEPTH_TEST );
+ gl.disable( gl.CULL_FACE );
+ gl.disable( gl.BLEND );
+ if(tex) tex.bind(0);
+ if(texB) texB.bind(1);
+ var mesh = Mesh.getScreenQuad();
+ shader.uniforms({u_texture:0, u_textureB:1, value: value, texSize:[width,height], time: time}).draw(mesh);
+ });
+
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphTextureOperation.pixel_shader = "precision highp float;\n\
+ \n\
+ uniform sampler2D u_texture;\n\
+ uniform sampler2D u_textureB;\n\
+ varying vec2 v_coord;\n\
+ uniform vec2 texSize;\n\
+ uniform float time;\n\
+ uniform float value;\n\
+ \n\
+ void main() {\n\
+ vec2 uv = v_coord;\n\
+ UV_CODE;\n\
+ vec4 color4 = texture2D(u_texture, uv);\n\
+ vec3 color = color4.rgb;\n\
+ vec4 color4B = texture2D(u_textureB, uv);\n\
+ vec3 colorB = color4B.rgb;\n\
+ vec3 result = color;\n\
+ float alpha = 1.0;\n\
+ PIXEL_CODE;\n\
+ gl_FragColor = vec4(result, alpha);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/operation", LGraphTextureOperation );
+
+ //****************************************************
+
+ function LGraphTextureShader()
+ {
+ this.addOutput("out","Texture");
+ this.properties = {code:"", width: 512, height: 512, precision: LGraphTexture.DEFAULT };
+
+ this.properties.code = "\nvoid main() {\n vec2 uv = v_coord;\n vec3 color = vec3(0.0);\n//your code here\n\ngl_FragColor = vec4(color, 1.0);\n}\n";
+ this._uniforms = { in_texture:0, texSize: vec2.create(), time: 0 };
+ }
+
+ LGraphTextureShader.title = "Shader";
+ LGraphTextureShader.desc = "Texture shader";
+ LGraphTextureShader.widgets_info = {
+ "code": { type:"code" },
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureShader.prototype.onPropertyChanged = function(name, value)
+ {
+ if(name != "code")
+ return;
+
+ var shader = this.getShader();
+ if(!shader)
+ return;
+
+ //update connections
+ var uniforms = shader.uniformInfo;
+
+ //remove deprecated slots
+ if(this.inputs)
+ {
+ var already = {};
+ for(var i = 0; i < this.inputs.length; ++i)
+ {
+ var info = this.getInputInfo(i);
+ if(!info)
+ continue;
+
+ if( uniforms[ info.name ] && !already[ info.name ] )
+ {
+ already[ info.name ] = true;
+ continue;
+ }
+ this.removeInput(i);
+ i--;
+ }
+ }
+
+ //update existing ones
+ for(var i in uniforms)
+ {
+ var info = shader.uniformInfo[i];
+ if(info.loc === null)
+ continue; //is an attribute, not a uniform
+ if(i == "time") //default one
+ continue;
+
+ var type = "number";
+ if( this._shader.samplers[i] )
+ type = "texture";
+ else
+ {
+ switch(info.size)
+ {
+ case 1: type = "number"; break;
+ case 2: type = "vec2"; break;
+ case 3: type = "vec3"; break;
+ case 4: type = "vec4"; break;
+ case 9: type = "mat3"; break;
+ case 16: type = "mat4"; break;
+ default: continue;
+ }
+ }
+
+ var slot = this.findInputSlot(i);
+ if(slot == -1)
+ {
+ this.addInput(i,type);
+ continue;
+ }
+
+ var input_info = this.getInputInfo(slot);
+ if(!input_info)
+ this.addInput(i,type);
+ else
+ {
+ if(input_info.type == type)
+ continue;
+ this.removeInput(slot,type);
+ this.addInput(i,type);
+ }
+ }
+ }
+
+ LGraphTextureShader.prototype.getShader = function()
+ {
+ //replug
+ if(this._shader && this._shader_code == this.properties.code)
+ return this._shader;
+
+ this._shader_code = this.properties.code;
+ this._shader = new GL.Shader(Shader.SCREEN_VERTEX_SHADER, LGraphTextureShader.pixel_shader + this.properties.code );
+ if(!this._shader) {
+ this.boxcolor = "red";
+ return null;
+ }
+ else
+ this.boxcolor = "green";
+ return this._shader;
+ }
+
+ LGraphTextureShader.prototype.onExecute = function()
+ {
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var shader = this.getShader();
+ if(!shader)
+ return;
+
+ var tex_slot = 0;
+ var in_tex = null;
+
+ //set uniforms
+ for(var i = 0; i < this.inputs.length; ++i)
+ {
+ var info = this.getInputInfo(i);
+ var data = this.getInputData(i);
+ if(data == null)
+ continue;
+
+ if(data.constructor === GL.Texture)
+ {
+ data.bind(tex_slot);
+ if(!in_tex)
+ in_tex = data;
+ data = tex_slot;
+ tex_slot++;
+ }
+ shader.setUniform( info.name, data ); //data is tex_slot
+ }
+
+ var uniforms = this._uniforms;
+ var type = LGraphTexture.getTextureType( this.properties.precision, in_tex );
+
+ //render to texture
+ var w = this.properties.width|0;
+ var h = this.properties.height|0;
+ if(w == 0)
+ w = in_tex ? in_tex.width : gl.canvas.width;
+ if(h == 0)
+ h = in_tex ? in_tex.height : gl.canvas.height;
+ uniforms.texSize[0] = w;
+ uniforms.texSize[1] = h;
+ uniforms.time = this.graph.getTime();
+
+ if(!this._tex || this._tex.type != type || this._tex.width != w || this._tex.height != h )
+ this._tex = new GL.Texture( w, h, { type: type, format: gl.RGBA, filter: gl.LINEAR });
+ var tex = this._tex;
+ tex.drawTo(function() {
+ shader.uniforms( uniforms ).draw( GL.Mesh.getScreenQuad() );
+ });
+
+ this.setOutputData( 0, this._tex );
+ }
+
+ LGraphTextureShader.pixel_shader = "precision highp float;\n\
+ \n\
+ varying vec2 v_coord;\n\
+ uniform float time;\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/shader", LGraphTextureShader );
+
+ // Texture Scale Offset
+
+ function LGraphTextureScaleOffset()
+ {
+ this.addInput("in","Texture");
+ this.addInput("scale","vec2");
+ this.addInput("offset","vec2");
+ this.addOutput("out","Texture");
+ this.properties = { offset: vec2.fromValues(0,0), scale: vec2.fromValues(1,1), precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureScaleOffset.widgets_info = {
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureScaleOffset.title = "Scale/Offset";
+ LGraphTextureScaleOffset.desc = "Applies an scaling and offseting";
+
+ LGraphTextureScaleOffset.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+
+ if(!this.isOutputConnected(0) || !tex)
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH)
+ {
+ this.setOutputData(0, tex);
+ return;
+ }
+
+ var width = tex.width;
+ var height = tex.height;
+ var type = this.precision === LGraphTexture.LOW ? gl.UNSIGNED_BYTE : gl.HIGH_PRECISION_FORMAT;
+ if (this.precision === LGraphTexture.DEFAULT)
+ type = tex.type;
+
+ if(!this._tex || this._tex.width != width || this._tex.height != height || this._tex.type != type )
+ this._tex = new GL.Texture( width, height, { type: type, format: gl.RGBA, filter: gl.LINEAR });
+
+ var shader = this._shader;
+
+ if(!shader)
+ shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureScaleOffset.pixel_shader );
+
+ var scale = this.getInputData(1);
+ if(scale)
+ {
+ this.properties.scale[0] = scale[0];
+ this.properties.scale[1] = scale[1];
+ }
+ else
+ scale = this.properties.scale;
+
+ var offset = this.getInputData(2);
+ if(offset)
+ {
+ this.properties.offset[0] = offset[0];
+ this.properties.offset[1] = offset[1];
+ }
+ else
+ offset = this.properties.offset;
+
+ this._tex.drawTo(function() {
+ gl.disable( gl.DEPTH_TEST );
+ gl.disable( gl.CULL_FACE );
+ gl.disable( gl.BLEND );
+ tex.bind(0);
+ var mesh = Mesh.getScreenQuad();
+ shader.uniforms({u_texture:0, u_scale: scale, u_offset: offset}).draw( mesh );
+ });
+
+ this.setOutputData( 0, this._tex );
+ }
+
+ LGraphTextureScaleOffset.pixel_shader = "precision highp float;\n\
+ \n\
+ uniform sampler2D u_texture;\n\
+ uniform sampler2D u_textureB;\n\
+ varying vec2 v_coord;\n\
+ uniform vec2 u_scale;\n\
+ uniform vec2 u_offset;\n\
+ \n\
+ void main() {\n\
+ vec2 uv = v_coord;\n\
+ uv = uv / u_scale - u_offset;\n\
+ gl_FragColor = texture2D(u_texture, uv);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/scaleOffset", LGraphTextureScaleOffset );
+
+
+
+ // Warp (distort a texture) *************************
+
+ function LGraphTextureWarp()
+ {
+ this.addInput("in","Texture");
+ this.addInput("warp","Texture");
+ this.addInput("factor","number");
+ this.addOutput("out","Texture");
+ this.properties = { factor: 0.01, precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureWarp.widgets_info = {
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureWarp.title = "Warp";
+ LGraphTextureWarp.desc = "Texture warp operation";
+
+ LGraphTextureWarp.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH)
+ {
+ this.setOutputData(0, tex);
+ return;
+ }
+
+ var texB = this.getInputData(1);
+
+ var width = 512;
+ var height = 512;
+ var type = gl.UNSIGNED_BYTE;
+ if(tex)
+ {
+ width = tex.width;
+ height = tex.height;
+ type = tex.type;
+ }
+ else if (texB)
+ {
+ width = texB.width;
+ height = texB.height;
+ type = texB.type;
+ }
+
+ if(!tex && !this._tex )
+ this._tex = new GL.Texture( width, height, { type: this.precision === LGraphTexture.LOW ? gl.UNSIGNED_BYTE : gl.HIGH_PRECISION_FORMAT, format: gl.RGBA, filter: gl.LINEAR });
+ else
+ this._tex = LGraphTexture.getTargetTexture( tex || this._tex, this._tex, this.properties.precision );
+
+ var shader = this._shader;
+
+ if(!shader)
+ shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureWarp.pixel_shader );
+
+ var factor = this.getInputData(2);
+ if(factor != null)
+ this.properties.factor = factor;
+ else
+ factor = parseFloat( this.properties.factor );
+
+ this._tex.drawTo(function() {
+ gl.disable( gl.DEPTH_TEST );
+ gl.disable( gl.CULL_FACE );
+ gl.disable( gl.BLEND );
+ if(tex) tex.bind(0);
+ if(texB) texB.bind(1);
+ var mesh = Mesh.getScreenQuad();
+ shader.uniforms({u_texture:0, u_textureB:1, u_factor: factor }).draw( mesh );
+ });
+
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphTextureWarp.pixel_shader = "precision highp float;\n\
+ \n\
+ uniform sampler2D u_texture;\n\
+ uniform sampler2D u_textureB;\n\
+ varying vec2 v_coord;\n\
+ uniform float u_factor;\n\
+ \n\
+ void main() {\n\
+ vec2 uv = v_coord;\n\
+ uv += ( texture2D(u_textureB, uv).rg - vec2(0.5)) * u_factor;\n\
+ gl_FragColor = texture2D(u_texture, uv);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/warp", LGraphTextureWarp );
+
+ //****************************************************
+
+ // Texture to Viewport *****************************************
+ function LGraphTextureToViewport()
+ {
+ this.addInput("Texture","Texture");
+ this.properties = { additive: false, antialiasing: false, filter: true, disable_alpha: false, gamma: 1.0 };
+ this.size[0] = 130;
+ }
+
+ LGraphTextureToViewport.title = "to Viewport";
+ LGraphTextureToViewport.desc = "Texture to viewport";
+
+ LGraphTextureToViewport.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(this.properties.disable_alpha)
+ gl.disable( gl.BLEND );
+ else
+ {
+ gl.enable( gl.BLEND );
+ if(this.properties.additive)
+ gl.blendFunc( gl.SRC_ALPHA, gl.ONE );
+ else
+ gl.blendFunc( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA );
+ }
+
+ gl.disable( gl.DEPTH_TEST );
+ var gamma = this.properties.gamma || 1.0;
+ if( this.isInputConnected(1) )
+ gamma = this.getInputData(1);
+
+ tex.setParameter( gl.TEXTURE_MAG_FILTER, this.properties.filter ? gl.LINEAR : gl.NEAREST );
+
+ if(this.properties.antialiasing)
+ {
+ if(!LGraphTextureToViewport._shader)
+ LGraphTextureToViewport._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureToViewport.aa_pixel_shader );
+
+ var viewport = gl.getViewport(); //gl.getParameter(gl.VIEWPORT);
+ var mesh = Mesh.getScreenQuad();
+ tex.bind(0);
+ LGraphTextureToViewport._shader.uniforms({u_texture:0, uViewportSize:[tex.width,tex.height], u_igamma: 1 / gamma, inverseVP: [1/tex.width,1/tex.height] }).draw(mesh);
+ }
+ else
+ {
+ if(gamma != 1.0)
+ {
+ if(!LGraphTextureToViewport._gamma_shader)
+ LGraphTextureToViewport._gamma_shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureToViewport.gamma_pixel_shader );
+ tex.toViewport(LGraphTextureToViewport._gamma_shader, { u_texture:0, u_igamma: 1 / gamma });
+ }
+ else
+ tex.toViewport();
+ }
+ }
+
+ LGraphTextureToViewport.prototype.onGetInputs = function()
+ {
+ return [["gamma","number"]];
+ }
+
+ LGraphTextureToViewport.aa_pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 uViewportSize;\n\
+ uniform vec2 inverseVP;\n\
+ uniform float u_igamma;\n\
+ #define FXAA_REDUCE_MIN (1.0/ 128.0)\n\
+ #define FXAA_REDUCE_MUL (1.0 / 8.0)\n\
+ #define FXAA_SPAN_MAX 8.0\n\
+ \n\
+ /* from mitsuhiko/webgl-meincraft based on the code on geeks3d.com */\n\
+ vec4 applyFXAA(sampler2D tex, vec2 fragCoord)\n\
+ {\n\
+ vec4 color = vec4(0.0);\n\
+ /*vec2 inverseVP = vec2(1.0 / uViewportSize.x, 1.0 / uViewportSize.y);*/\n\
+ vec3 rgbNW = texture2D(tex, (fragCoord + vec2(-1.0, -1.0)) * inverseVP).xyz;\n\
+ vec3 rgbNE = texture2D(tex, (fragCoord + vec2(1.0, -1.0)) * inverseVP).xyz;\n\
+ vec3 rgbSW = texture2D(tex, (fragCoord + vec2(-1.0, 1.0)) * inverseVP).xyz;\n\
+ vec3 rgbSE = texture2D(tex, (fragCoord + vec2(1.0, 1.0)) * inverseVP).xyz;\n\
+ vec3 rgbM = texture2D(tex, fragCoord * inverseVP).xyz;\n\
+ vec3 luma = vec3(0.299, 0.587, 0.114);\n\
+ float lumaNW = dot(rgbNW, luma);\n\
+ float lumaNE = dot(rgbNE, luma);\n\
+ float lumaSW = dot(rgbSW, luma);\n\
+ float lumaSE = dot(rgbSE, luma);\n\
+ float lumaM = dot(rgbM, luma);\n\
+ float lumaMin = min(lumaM, min(min(lumaNW, lumaNE), min(lumaSW, lumaSE)));\n\
+ float lumaMax = max(lumaM, max(max(lumaNW, lumaNE), max(lumaSW, lumaSE)));\n\
+ \n\
+ vec2 dir;\n\
+ dir.x = -((lumaNW + lumaNE) - (lumaSW + lumaSE));\n\
+ dir.y = ((lumaNW + lumaSW) - (lumaNE + lumaSE));\n\
+ \n\
+ float dirReduce = max((lumaNW + lumaNE + lumaSW + lumaSE) * (0.25 * FXAA_REDUCE_MUL), FXAA_REDUCE_MIN);\n\
+ \n\
+ float rcpDirMin = 1.0 / (min(abs(dir.x), abs(dir.y)) + dirReduce);\n\
+ dir = min(vec2(FXAA_SPAN_MAX, FXAA_SPAN_MAX), max(vec2(-FXAA_SPAN_MAX, -FXAA_SPAN_MAX), dir * rcpDirMin)) * inverseVP;\n\
+ \n\
+ vec3 rgbA = 0.5 * (texture2D(tex, fragCoord * inverseVP + dir * (1.0 / 3.0 - 0.5)).xyz + \n\
+ texture2D(tex, fragCoord * inverseVP + dir * (2.0 / 3.0 - 0.5)).xyz);\n\
+ vec3 rgbB = rgbA * 0.5 + 0.25 * (texture2D(tex, fragCoord * inverseVP + dir * -0.5).xyz + \n\
+ texture2D(tex, fragCoord * inverseVP + dir * 0.5).xyz);\n\
+ \n\
+ //return vec4(rgbA,1.0);\n\
+ float lumaB = dot(rgbB, luma);\n\
+ if ((lumaB < lumaMin) || (lumaB > lumaMax))\n\
+ color = vec4(rgbA, 1.0);\n\
+ else\n\
+ color = vec4(rgbB, 1.0);\n\
+ if(u_igamma != 1.0)\n\
+ color.xyz = pow( color.xyz, vec3(u_igamma) );\n\
+ return color;\n\
+ }\n\
+ \n\
+ void main() {\n\
+ gl_FragColor = applyFXAA( u_texture, v_coord * uViewportSize) ;\n\
+ }\n\
+ ";
+
+ LGraphTextureToViewport.gamma_pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform float u_igamma;\n\
+ void main() {\n\
+ vec4 color = texture2D( u_texture, v_coord);\n\
+ color.xyz = pow(color.xyz, vec3(u_igamma) );\n\
+ gl_FragColor = color;\n\
+ }\n\
+ ";
+
+
+ LiteGraph.registerNodeType("texture/toviewport", LGraphTextureToViewport );
+
+
+ // Texture Copy *****************************************
+ function LGraphTextureCopy()
+ {
+ this.addInput("Texture","Texture");
+ this.addOutput("","Texture");
+ this.properties = { size: 0, generate_mipmaps: false, precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureCopy.title = "Copy";
+ LGraphTextureCopy.desc = "Copy Texture";
+ LGraphTextureCopy.widgets_info = {
+ size: { widget:"combo", values:[0,32,64,128,256,512,1024,2048]},
+ precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureCopy.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex && !this._temp_texture)
+ return;
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ //copy the texture
+ if(tex)
+ {
+ var width = tex.width;
+ var height = tex.height;
+
+ if(this.properties.size != 0)
+ {
+ width = this.properties.size;
+ height = this.properties.size;
+ }
+
+ var temp = this._temp_texture;
+
+ var type = tex.type;
+ if(this.properties.precision === LGraphTexture.LOW)
+ type = gl.UNSIGNED_BYTE;
+ else if(this.properties.precision === LGraphTexture.HIGH)
+ type = gl.HIGH_PRECISION_FORMAT;
+
+ if(!temp || temp.width != width || temp.height != height || temp.type != type )
+ {
+ var minFilter = gl.LINEAR;
+ if( this.properties.generate_mipmaps && isPowerOfTwo(width) && isPowerOfTwo(height) )
+ minFilter = gl.LINEAR_MIPMAP_LINEAR;
+ this._temp_texture = new GL.Texture( width, height, { type: type, format: gl.RGBA, minFilter: minFilter, magFilter: gl.LINEAR });
+ }
+ tex.copyTo(this._temp_texture);
+
+ if(this.properties.generate_mipmaps)
+ {
+ this._temp_texture.bind(0);
+ gl.generateMipmap(this._temp_texture.texture_type);
+ this._temp_texture.unbind(0);
+ }
+ }
+
+
+ this.setOutputData(0,this._temp_texture);
+ }
+
+ LiteGraph.registerNodeType("texture/copy", LGraphTextureCopy );
+
+
+ // Texture Downsample *****************************************
+ function LGraphTextureDownsample()
+ {
+ this.addInput("Texture","Texture");
+ this.addOutput("","Texture");
+ this.properties = { iterations: 1, generate_mipmaps: false, precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureDownsample.title = "Downsample";
+ LGraphTextureDownsample.desc = "Downsample Texture";
+ LGraphTextureDownsample.widgets_info = {
+ iterations: { type:"number", step: 1, precision: 0, min: 1 },
+ precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureDownsample.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex && !this._temp_texture)
+ return;
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ //we do not allow any texture different than texture 2D
+ if(!tex || tex.texture_type !== GL.TEXTURE_2D )
+ return;
+
+ var shader = LGraphTextureDownsample._shader;
+ if(!shader)
+ LGraphTextureDownsample._shader = shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureDownsample.pixel_shader );
+
+ var width = tex.width|0;
+ var height = tex.height|0;
+ var type = tex.type;
+ if(this.properties.precision === LGraphTexture.LOW)
+ type = gl.UNSIGNED_BYTE;
+ else if(this.properties.precision === LGraphTexture.HIGH)
+ type = gl.HIGH_PRECISION_FORMAT;
+ var iterations = this.properties.iterations || 1;
+
+ var origin = tex;
+ var target = null;
+
+ var temp = [];
+ var options = {
+ type: type,
+ format: tex.format
+ };
+
+ var offset = vec2.create();
+ var uniforms = {
+ u_offset: offset
+ };
+
+ if( this._texture )
+ GL.Texture.releaseTemporary( this._texture );
+
+ for(var i = 0; i < iterations; ++i)
+ {
+ offset[0] = 1/width;
+ offset[1] = 1/height;
+ width = width>>1 || 0;
+ height = height>>1 || 0;
+ target = GL.Texture.getTemporary( width, height, options );
+ temp.push( target );
+ origin.setParameter( GL.TEXTURE_MAG_FILTER, GL.NEAREST );
+ origin.copyTo( target, shader, uniforms );
+ if(width == 1 && height == 1)
+ break; //nothing else to do
+ origin = target;
+ }
+
+ //keep the last texture used
+ this._texture = temp.pop();
+
+ //free the rest
+ for(var i = 0; i < temp.length; ++i)
+ GL.Texture.releaseTemporary( temp[i] );
+
+ if(this.properties.generate_mipmaps)
+ {
+ this._texture.bind(0);
+ gl.generateMipmap(this._texture.texture_type);
+ this._texture.unbind(0);
+ }
+
+ this.setOutputData(0,this._texture);
+ }
+
+ LGraphTextureDownsample.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 u_offset;\n\
+ varying vec2 v_coord;\n\
+ \n\
+ void main() {\n\
+ vec4 color = texture2D(u_texture, v_coord );\n\
+ color += texture2D(u_texture, v_coord + vec2( u_offset.x, 0.0 ) );\n\
+ color += texture2D(u_texture, v_coord + vec2( 0.0, u_offset.y ) );\n\
+ color += texture2D(u_texture, v_coord + vec2( u_offset.x, u_offset.y ) );\n\
+ gl_FragColor = color * 0.25;\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/downsample", LGraphTextureDownsample );
+
+
+
+ // Texture Copy *****************************************
+ function LGraphTextureAverage()
+ {
+ this.addInput("Texture","Texture");
+ this.addOutput("tex","Texture");
+ this.addOutput("avg","vec4");
+ this.addOutput("lum","number");
+ this.properties = { mipmap_offset: 0, low_precision: false };
+
+ this._uniforms = { u_texture: 0, u_mipmap_offset: this.properties.mipmap_offset };
+ this._luminance = new Float32Array(4);
+ }
+
+ LGraphTextureAverage.title = "Average";
+ LGraphTextureAverage.desc = "Compute a partial average (32 random samples) of a texture and stores it as a 1x1 pixel texture";
+
+ LGraphTextureAverage.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(!this.isOutputConnected(0) && !this.isOutputConnected(1) && !this.isOutputConnected(2))
+ return; //saves work
+
+ if(!LGraphTextureAverage._shader)
+ {
+ LGraphTextureAverage._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureAverage.pixel_shader);
+ //creates 32 random numbers and stores the, in two mat4
+ var samples = new Float32Array(32);
+ for(var i = 0; i < 32; ++i)
+ samples[i] = Math.random();
+ LGraphTextureAverage._shader.uniforms({u_samples_a: samples.subarray(0,16), u_samples_b: samples.subarray(16,32) });
+ }
+
+ var temp = this._temp_texture;
+ var type = gl.UNSIGNED_BYTE;
+ if(tex.type != type) //force floats, half floats cannot be read with gl.readPixels
+ type = gl.FLOAT;
+
+ if(!temp || temp.type != type )
+ this._temp_texture = new GL.Texture( 1, 1, { type: type, format: gl.RGBA, filter: gl.NEAREST });
+
+ var shader = LGraphTextureAverage._shader;
+ var uniforms = this._uniforms;
+ uniforms.u_mipmap_offset = this.properties.mipmap_offset;
+ this._temp_texture.drawTo(function(){
+ tex.toViewport( shader, uniforms );
+ });
+
+ this.setOutputData(0,this._temp_texture);
+
+ if(this.isOutputConnected(1) || this.isOutputConnected(2))
+ {
+ var pixel = this._temp_texture.getPixels();
+ if(pixel)
+ {
+ var v = this._luminance;
+ var type = this._temp_texture.type;
+ v.set( pixel );
+ if(type == gl.UNSIGNED_BYTE)
+ vec4.scale( v,v, 1/255 );
+ else if(type == GL.HALF_FLOAT || type == GL.HALF_FLOAT_OES)
+ vec4.scale( v,v, 1/(255*255) ); //is this correct?
+ this.setOutputData(1,v);
+ this.setOutputData(2,(v[0] + v[1] + v[2]) / 3);
+ }
+
+ }
+ }
+
+ LGraphTextureAverage.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ uniform mat4 u_samples_a;\n\
+ uniform mat4 u_samples_b;\n\
+ uniform sampler2D u_texture;\n\
+ uniform float u_mipmap_offset;\n\
+ varying vec2 v_coord;\n\
+ \n\
+ void main() {\n\
+ vec4 color = vec4(0.0);\n\
+ for(int i = 0; i < 4; ++i)\n\
+ for(int j = 0; j < 4; ++j)\n\
+ {\n\
+ color += texture2D(u_texture, vec2( u_samples_a[i][j], u_samples_b[i][j] ), u_mipmap_offset );\n\
+ color += texture2D(u_texture, vec2( 1.0 - u_samples_a[i][j], 1.0 - u_samples_b[i][j] ), u_mipmap_offset );\n\
+ }\n\
+ gl_FragColor = color * 0.03125;\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/average", LGraphTextureAverage );
+
+ // Image To Texture *****************************************
+ function LGraphImageToTexture()
+ {
+ this.addInput("Image","image");
+ this.addOutput("","Texture");
+ this.properties = {};
+ }
+
+ LGraphImageToTexture.title = "Image to Texture";
+ LGraphImageToTexture.desc = "Uploads an image to the GPU";
+ //LGraphImageToTexture.widgets_info = { size: { widget:"combo", values:[0,32,64,128,256,512,1024,2048]} };
+
+ LGraphImageToTexture.prototype.onExecute = function()
+ {
+ var img = this.getInputData(0);
+ if(!img)
+ return;
+
+ var width = img.videoWidth || img.width;
+ var height = img.videoHeight || img.height;
+
+ //this is in case we are using a webgl canvas already, no need to reupload it
+ if(img.gltexture)
+ {
+ this.setOutputData(0,img.gltexture);
+ return;
+ }
+
+
+ var temp = this._temp_texture;
+ if(!temp || temp.width != width || temp.height != height )
+ this._temp_texture = new GL.Texture( width, height, { format: gl.RGBA, filter: gl.LINEAR });
+
+ try
+ {
+ this._temp_texture.uploadImage(img);
+ }
+ catch(err)
+ {
+ console.error("image comes from an unsafe location, cannot be uploaded to webgl: " + err);
+ return;
+ }
+
+ this.setOutputData(0,this._temp_texture);
+ }
+
+ LiteGraph.registerNodeType("texture/imageToTexture", LGraphImageToTexture );
+
+
+ // Texture LUT *****************************************
+ function LGraphTextureLUT()
+ {
+ this.addInput("Texture","Texture");
+ this.addInput("LUT","Texture");
+ this.addInput("Intensity","number");
+ this.addOutput("","Texture");
+ this.properties = { intensity: 1, precision: LGraphTexture.DEFAULT, texture: null };
+
+ if(!LGraphTextureLUT._shader)
+ LGraphTextureLUT._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureLUT.pixel_shader );
+ }
+
+ LGraphTextureLUT.widgets_info = {
+ "texture": { widget:"texture"},
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureLUT.title = "LUT";
+ LGraphTextureLUT.desc = "Apply LUT to Texture";
+
+ LGraphTextureLUT.prototype.onExecute = function()
+ {
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var tex = this.getInputData(0);
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH )
+ {
+ this.setOutputData(0,tex);
+ return;
+ }
+
+ if(!tex)
+ return;
+
+ var lut_tex = this.getInputData(1);
+
+ if(!lut_tex)
+ lut_tex = LGraphTexture.getTexture( this.properties.texture );
+
+ if(!lut_tex)
+ {
+ this.setOutputData(0,tex);
+ return;
+ }
+
+ lut_tex.bind(0);
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR );
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE );
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE );
+ gl.bindTexture(gl.TEXTURE_2D, null);
+
+ var intensity = this.properties.intensity;
+ if( this.isInputConnected(2) )
+ this.properties.intensity = intensity = this.getInputData(2);
+
+ this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
+
+ //var mesh = Mesh.getScreenQuad();
+
+ this._tex.drawTo(function() {
+ lut_tex.bind(1);
+ tex.toViewport( LGraphTextureLUT._shader, {u_texture:0, u_textureB:1, u_amount: intensity} );
+ });
+
+ this.setOutputData(0,this._tex);
+ }
+
+ LGraphTextureLUT.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform sampler2D u_textureB;\n\
+ uniform float u_amount;\n\
+ \n\
+ void main() {\n\
+ lowp vec4 textureColor = clamp( texture2D(u_texture, v_coord), vec4(0.0), vec4(1.0) );\n\
+ mediump float blueColor = textureColor.b * 63.0;\n\
+ mediump vec2 quad1;\n\
+ quad1.y = floor(floor(blueColor) / 8.0);\n\
+ quad1.x = floor(blueColor) - (quad1.y * 8.0);\n\
+ mediump vec2 quad2;\n\
+ quad2.y = floor(ceil(blueColor) / 8.0);\n\
+ quad2.x = ceil(blueColor) - (quad2.y * 8.0);\n\
+ highp vec2 texPos1;\n\
+ texPos1.x = (quad1.x * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.r);\n\
+ texPos1.y = 1.0 - ((quad1.y * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.g));\n\
+ highp vec2 texPos2;\n\
+ texPos2.x = (quad2.x * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.r);\n\
+ texPos2.y = 1.0 - ((quad2.y * 0.125) + 0.5/512.0 + ((0.125 - 1.0/512.0) * textureColor.g));\n\
+ lowp vec4 newColor1 = texture2D(u_textureB, texPos1);\n\
+ lowp vec4 newColor2 = texture2D(u_textureB, texPos2);\n\
+ lowp vec4 newColor = mix(newColor1, newColor2, fract(blueColor));\n\
+ gl_FragColor = vec4( mix( textureColor.rgb, newColor.rgb, u_amount), textureColor.w);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/LUT", LGraphTextureLUT );
+
+ // Texture Channels *****************************************
+ function LGraphTextureChannels()
+ {
+ this.addInput("Texture","Texture");
+
+ this.addOutput("R","Texture");
+ this.addOutput("G","Texture");
+ this.addOutput("B","Texture");
+ this.addOutput("A","Texture");
+
+ this.properties = {};
+ if(!LGraphTextureChannels._shader)
+ LGraphTextureChannels._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureChannels.pixel_shader );
+ }
+
+ LGraphTextureChannels.title = "Texture to Channels";
+ LGraphTextureChannels.desc = "Split texture channels";
+
+ LGraphTextureChannels.prototype.onExecute = function()
+ {
+ var texA = this.getInputData(0);
+ if(!texA) return;
+
+ if(!this._channels)
+ this._channels = Array(4);
+
+ var connections = 0;
+ for(var i = 0; i < 4; i++)
+ {
+ if(this.isOutputConnected(i))
+ {
+ if(!this._channels[i] || this._channels[i].width != texA.width || this._channels[i].height != texA.height || this._channels[i].type != texA.type)
+ this._channels[i] = new GL.Texture( texA.width, texA.height, { type: texA.type, format: gl.RGBA, filter: gl.LINEAR });
+ connections++;
+ }
+ else
+ this._channels[i] = null;
+ }
+
+ if(!connections)
+ return;
+
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+
+ var mesh = Mesh.getScreenQuad();
+ var shader = LGraphTextureChannels._shader;
+ var masks = [[1,0,0,0],[0,1,0,0],[0,0,1,0],[0,0,0,1]];
+
+ for(var i = 0; i < 4; i++)
+ {
+ if(!this._channels[i])
+ continue;
+
+ this._channels[i].drawTo( function() {
+ texA.bind(0);
+ shader.uniforms({u_texture:0, u_mask: masks[i]}).draw(mesh);
+ });
+ this.setOutputData(i, this._channels[i]);
+ }
+ }
+
+ LGraphTextureChannels.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec4 u_mask;\n\
+ \n\
+ void main() {\n\
+ gl_FragColor = vec4( vec3( length( texture2D(u_texture, v_coord) * u_mask )), 1.0 );\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/textureChannels", LGraphTextureChannels );
+
+
+ // Texture Channels to Texture *****************************************
+ function LGraphChannelsTexture()
+ {
+ this.addInput("R","Texture");
+ this.addInput("G","Texture");
+ this.addInput("B","Texture");
+ this.addInput("A","Texture");
+
+ this.addOutput("Texture","Texture");
+
+ this.properties = {};
+ if(!LGraphChannelsTexture._shader)
+ LGraphChannelsTexture._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphChannelsTexture.pixel_shader );
+ }
+
+ LGraphChannelsTexture.title = "Channels to Texture";
+ LGraphChannelsTexture.desc = "Split texture channels";
+
+ LGraphChannelsTexture.prototype.onExecute = function()
+ {
+ var tex = [ this.getInputData(0),
+ this.getInputData(1),
+ this.getInputData(2),
+ this.getInputData(3) ];
+
+ if(!tex[0] || !tex[1] || !tex[2] || !tex[3])
+ return;
+
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+
+ var mesh = Mesh.getScreenQuad();
+ var shader = LGraphChannelsTexture._shader;
+
+ this._tex = LGraphTexture.getTargetTexture( tex[0], this._tex );
+
+ this._tex.drawTo( function() {
+ tex[0].bind(0);
+ tex[1].bind(1);
+ tex[2].bind(2);
+ tex[3].bind(3);
+ shader.uniforms({u_textureR:0, u_textureG:1, u_textureB:2, u_textureA:3 }).draw(mesh);
+ });
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphChannelsTexture.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_textureR;\n\
+ uniform sampler2D u_textureG;\n\
+ uniform sampler2D u_textureB;\n\
+ uniform sampler2D u_textureA;\n\
+ \n\
+ void main() {\n\
+ gl_FragColor = vec4( \
+ texture2D(u_textureR, v_coord).r,\
+ texture2D(u_textureG, v_coord).r,\
+ texture2D(u_textureB, v_coord).r,\
+ texture2D(u_textureA, v_coord).r);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/channelsTexture", LGraphChannelsTexture );
+
+ // Texture Channels to Texture *****************************************
+ function LGraphTextureGradient()
+ {
+ this.addInput("A","color");
+ this.addInput("B","color");
+ this.addOutput("Texture","Texture");
+
+ this.properties = { angle: 0, scale: 1, A:[0,0,0], B:[1,1,1], texture_size:32 };
+ if(!LGraphTextureGradient._shader)
+ LGraphTextureGradient._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureGradient.pixel_shader );
+
+ this._uniforms = { u_angle: 0, u_colorA: vec3.create(), u_colorB: vec3.create()};
+ }
+
+ LGraphTextureGradient.title = "Gradient";
+ LGraphTextureGradient.desc = "Generates a gradient";
+ LGraphTextureGradient["@A"] = { type:"color" };
+ LGraphTextureGradient["@B"] = { type:"color" };
+ LGraphTextureGradient["@texture_size"] = { type:"enum", values:[32,64,128,256,512] };
+
+ LGraphTextureGradient.prototype.onExecute = function()
+ {
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+
+ var mesh = GL.Mesh.getScreenQuad();
+ var shader = LGraphTextureGradient._shader;
+
+ var A = this.getInputData(0);
+ if(!A)
+ A = this.properties.A;
+ var B = this.getInputData(1);
+ if(!B)
+ B = this.properties.B;
+
+ //angle and scale
+ for(var i = 2; i < this.inputs.length; i++)
+ {
+ var input = this.inputs[i];
+ var v = this.getInputData(i);
+ if(v === undefined)
+ continue;
+ this.properties[ input.name ] = v;
+ }
+
+ var uniforms = this._uniforms;
+ this._uniforms.u_angle = this.properties.angle * DEG2RAD;
+ this._uniforms.u_scale = this.properties.scale;
+ vec3.copy( uniforms.u_colorA, A );
+ vec3.copy( uniforms.u_colorB, B );
+
+ var size = parseInt( this.properties.texture_size );
+ if(!this._tex || this._tex.width != size )
+ this._tex = new GL.Texture( size, size, { format: gl.RGB, filter: gl.LINEAR });
+
+ this._tex.drawTo( function() {
+ shader.uniforms(uniforms).draw(mesh);
+ });
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphTextureGradient.prototype.onGetInputs = function()
+ {
+ return [["angle","number"],["scale","number"]];
+ }
+
+ LGraphTextureGradient.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform float u_angle;\n\
+ uniform float u_scale;\n\
+ uniform vec3 u_colorA;\n\
+ uniform vec3 u_colorB;\n\
+ \n\
+ vec2 rotate(vec2 v, float angle)\n\
+ {\n\
+ vec2 result;\n\
+ float _cos = cos(angle);\n\
+ float _sin = sin(angle);\n\
+ result.x = v.x * _cos - v.y * _sin;\n\
+ result.y = v.x * _sin + v.y * _cos;\n\
+ return result;\n\
+ }\n\
+ void main() {\n\
+ float f = (rotate(u_scale * (v_coord - vec2(0.5)), u_angle) + vec2(0.5)).x;\n\
+ vec3 color = mix(u_colorA,u_colorB,clamp(f,0.0,1.0));\n\
+ gl_FragColor = vec4(color,1.0);\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/gradient", LGraphTextureGradient );
+
+ // Texture Mix *****************************************
+ function LGraphTextureMix()
+ {
+ this.addInput("A","Texture");
+ this.addInput("B","Texture");
+ this.addInput("Mixer","Texture");
+
+ this.addOutput("Texture","Texture");
+ this.properties = { precision: LGraphTexture.DEFAULT };
+
+ if(!LGraphTextureMix._shader)
+ LGraphTextureMix._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureMix.pixel_shader );
+ }
+
+ LGraphTextureMix.title = "Mix";
+ LGraphTextureMix.desc = "Generates a texture mixing two textures";
+
+ LGraphTextureMix.widgets_info = {
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureMix.prototype.onExecute = function()
+ {
+ var texA = this.getInputData(0);
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH )
+ {
+ this.setOutputData(0,texA);
+ return;
+ }
+
+ var texB = this.getInputData(1);
+ var texMix = this.getInputData(2);
+ if(!texA || !texB || !texMix) return;
+
+ this._tex = LGraphTexture.getTargetTexture( texA, this._tex, this.properties.precision );
+
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+
+ var mesh = Mesh.getScreenQuad();
+ var shader = LGraphTextureMix._shader;
+
+ this._tex.drawTo( function() {
+ texA.bind(0);
+ texB.bind(1);
+ texMix.bind(2);
+ shader.uniforms({u_textureA:0,u_textureB:1,u_textureMix:2}).draw(mesh);
+ });
+
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphTextureMix.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_textureA;\n\
+ uniform sampler2D u_textureB;\n\
+ uniform sampler2D u_textureMix;\n\
+ \n\
+ void main() {\n\
+ gl_FragColor = mix( texture2D(u_textureA, v_coord), texture2D(u_textureB, v_coord), texture2D(u_textureMix, v_coord) );\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/mix", LGraphTextureMix );
+
+ // Texture Edges detection *****************************************
+ function LGraphTextureEdges()
+ {
+ this.addInput("Tex.","Texture");
+
+ this.addOutput("Edges","Texture");
+ this.properties = { invert: true, threshold: false, factor: 1, precision: LGraphTexture.DEFAULT };
+
+ if(!LGraphTextureEdges._shader)
+ LGraphTextureEdges._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureEdges.pixel_shader );
+ }
+
+ LGraphTextureEdges.title = "Edges";
+ LGraphTextureEdges.desc = "Detects edges";
+
+ LGraphTextureEdges.widgets_info = {
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureEdges.prototype.onExecute = function()
+ {
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var tex = this.getInputData(0);
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH )
+ {
+ this.setOutputData(0,tex);
+ return;
+ }
+
+ if(!tex) return;
+
+ this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
+
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+
+ var mesh = Mesh.getScreenQuad();
+ var shader = LGraphTextureEdges._shader;
+ var invert = this.properties.invert;
+ var factor = this.properties.factor;
+ var threshold = this.properties.threshold ? 1 : 0;
+
+ this._tex.drawTo( function() {
+ tex.bind(0);
+ shader.uniforms({u_texture:0, u_isize:[1/tex.width,1/tex.height], u_factor: factor, u_threshold: threshold, u_invert: invert ? 1 : 0}).draw(mesh);
+ });
+
+ this.setOutputData(0, this._tex);
+ }
+
+ LGraphTextureEdges.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 u_isize;\n\
+ uniform int u_invert;\n\
+ uniform float u_factor;\n\
+ uniform float u_threshold;\n\
+ \n\
+ void main() {\n\
+ vec4 center = texture2D(u_texture, v_coord);\n\
+ vec4 up = texture2D(u_texture, v_coord + u_isize * vec2(0.0,1.0) );\n\
+ vec4 down = texture2D(u_texture, v_coord + u_isize * vec2(0.0,-1.0) );\n\
+ vec4 left = texture2D(u_texture, v_coord + u_isize * vec2(1.0,0.0) );\n\
+ vec4 right = texture2D(u_texture, v_coord + u_isize * vec2(-1.0,0.0) );\n\
+ vec4 diff = abs(center - up) + abs(center - down) + abs(center - left) + abs(center - right);\n\
+ diff *= u_factor;\n\
+ if(u_invert == 1)\n\
+ diff.xyz = vec3(1.0) - diff.xyz;\n\
+ if( u_threshold == 0.0 )\n\
+ gl_FragColor = vec4( diff.xyz, center.a );\n\
+ else\n\
+ gl_FragColor = vec4( diff.x > 0.5 ? 1.0 : 0.0, diff.y > 0.5 ? 1.0 : 0.0, diff.z > 0.5 ? 1.0 : 0.0, center.a );\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/edges", LGraphTextureEdges );
+
+ // Texture Depth *****************************************
+ function LGraphTextureDepthRange()
+ {
+ this.addInput("Texture","Texture");
+ this.addInput("Distance","number");
+ this.addInput("Range","number");
+ this.addOutput("Texture","Texture");
+ this.properties = { distance:100, range: 50, only_depth: false, high_precision: false };
+ this._uniforms = {u_texture:0, u_distance: 100, u_range: 50, u_camera_planes: null };
+ }
+
+ LGraphTextureDepthRange.title = "Depth Range";
+ LGraphTextureDepthRange.desc = "Generates a texture with a depth range";
+
+ LGraphTextureDepthRange.prototype.onExecute = function()
+ {
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var tex = this.getInputData(0);
+ if(!tex) return;
+
+ var precision = gl.UNSIGNED_BYTE;
+ if(this.properties.high_precision)
+ precision = gl.half_float_ext ? gl.HALF_FLOAT_OES : gl.FLOAT;
+
+ if(!this._temp_texture || this._temp_texture.type != precision ||
+ this._temp_texture.width != tex.width || this._temp_texture.height != tex.height)
+ this._temp_texture = new GL.Texture( tex.width, tex.height, { type: precision, format: gl.RGBA, filter: gl.LINEAR });
+
+ var uniforms = this._uniforms;
+
+ //iterations
+ var distance = this.properties.distance;
+ if( this.isInputConnected(1) )
+ {
+ distance = this.getInputData(1);
+ this.properties.distance = distance;
+ }
+
+ var range = this.properties.range;
+ if( this.isInputConnected(2) )
+ {
+ range = this.getInputData(2);
+ this.properties.range = range;
+ }
+
+ uniforms.u_distance = distance;
+ uniforms.u_range = range;
+
+ gl.disable( gl.BLEND );
+ gl.disable( gl.DEPTH_TEST );
+ var mesh = Mesh.getScreenQuad();
+ if(!LGraphTextureDepthRange._shader)
+ {
+ LGraphTextureDepthRange._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureDepthRange.pixel_shader );
+ LGraphTextureDepthRange._shader_onlydepth = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureDepthRange.pixel_shader, { ONLY_DEPTH:""} );
+ }
+ var shader = this.properties.only_depth ? LGraphTextureDepthRange._shader_onlydepth : LGraphTextureDepthRange._shader;
+
+ //NEAR AND FAR PLANES
+ var planes = null;
+ if( tex.near_far_planes )
+ planes = tex.near_far_planes;
+ else if( window.LS && LS.Renderer._main_camera )
+ planes = LS.Renderer._main_camera._uniforms.u_camera_planes;
+ else
+ planes = [0.1,1000]; //hardcoded
+ uniforms.u_camera_planes = planes;
+
+
+ this._temp_texture.drawTo( function() {
+ tex.bind(0);
+ shader.uniforms( uniforms ).draw(mesh);
+ });
+
+ this._temp_texture.near_far_planes = planes;
+ this.setOutputData(0, this._temp_texture );
+ }
+
+ LGraphTextureDepthRange.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 u_camera_planes;\n\
+ uniform float u_distance;\n\
+ uniform float u_range;\n\
+ \n\
+ float LinearDepth()\n\
+ {\n\
+ float zNear = u_camera_planes.x;\n\
+ float zFar = u_camera_planes.y;\n\
+ float depth = texture2D(u_texture, v_coord).x;\n\
+ depth = depth * 2.0 - 1.0;\n\
+ return zNear * (depth + 1.0) / (zFar + zNear - depth * (zFar - zNear));\n\
+ }\n\
+ \n\
+ void main() {\n\
+ float depth = LinearDepth();\n\
+ #ifdef ONLY_DEPTH\n\
+ gl_FragColor = vec4(depth);\n\
+ #else\n\
+ float diff = abs(depth * u_camera_planes.y - u_distance);\n\
+ float dof = 1.0;\n\
+ if(diff <= u_range)\n\
+ dof = diff / u_range;\n\
+ gl_FragColor = vec4(dof);\n\
+ #endif\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/depth_range", LGraphTextureDepthRange );
+
+ // Texture Blur *****************************************
+ function LGraphTextureBlur()
+ {
+ this.addInput("Texture","Texture");
+ this.addInput("Iterations","number");
+ this.addInput("Intensity","number");
+ this.addOutput("Blurred","Texture");
+ this.properties = { intensity: 1, iterations: 1, preserve_aspect: false, scale:[1,1], precision: LGraphTexture.DEFAULT };
+ }
+
+ LGraphTextureBlur.title = "Blur";
+ LGraphTextureBlur.desc = "Blur a texture";
+
+ LGraphTextureBlur.widgets_info = {
+ precision: { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureBlur.max_iterations = 20;
+
+ LGraphTextureBlur.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var temp = this._final_texture;
+
+ if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
+ {
+ //we need two textures to do the blurring
+ //this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
+ temp = this._final_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
+ }
+
+ //iterations
+ var iterations = this.properties.iterations;
+ if( this.isInputConnected(1) )
+ {
+ iterations = this.getInputData(1);
+ this.properties.iterations = iterations;
+ }
+ iterations = Math.min( Math.floor(iterations), LGraphTextureBlur.max_iterations );
+ if(iterations == 0) //skip blurring
+ {
+ this.setOutputData(0, tex);
+ return;
+ }
+
+ var intensity = this.properties.intensity;
+ if( this.isInputConnected(2) )
+ {
+ intensity = this.getInputData(2);
+ this.properties.intensity = intensity;
+ }
+
+ //blur sometimes needs an aspect correction
+ var aspect = LiteGraph.camera_aspect;
+ if(!aspect && window.gl !== undefined)
+ aspect = gl.canvas.height / gl.canvas.width;
+ if(!aspect)
+ aspect = 1;
+ aspect = this.properties.preserve_aspect ? aspect : 1;
+
+ var scale = this.properties.scale || [1,1];
+ tex.applyBlur( aspect * scale[0], scale[1], intensity, temp );
+ for(var i = 1; i < iterations; ++i)
+ temp.applyBlur( aspect * scale[0] * (i+1), scale[1] * (i+1), intensity );
+
+ this.setOutputData(0, temp );
+ }
+
+ /*
+ LGraphTextureBlur.pixel_shader = "precision highp float;\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 u_offset;\n\
+ uniform float u_intensity;\n\
+ void main() {\n\
+ vec4 sum = vec4(0.0);\n\
+ vec4 center = texture2D(u_texture, v_coord);\n\
+ sum += texture2D(u_texture, v_coord + u_offset * -4.0) * 0.05/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * -3.0) * 0.09/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * -2.0) * 0.12/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * -1.0) * 0.15/0.98;\n\
+ sum += center * 0.16/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * 4.0) * 0.05/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * 3.0) * 0.09/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * 2.0) * 0.12/0.98;\n\
+ sum += texture2D(u_texture, v_coord + u_offset * 1.0) * 0.15/0.98;\n\
+ gl_FragColor = u_intensity * sum;\n\
+ }\n\
+ ";
+ */
+
+ LiteGraph.registerNodeType("texture/blur", LGraphTextureBlur );
+
+
+ // Texture Glow *****************************************
+ //based in https://catlikecoding.com/unity/tutorials/advanced-rendering/bloom/
+ function LGraphTextureGlow()
+ {
+ this.addInput("in","Texture");
+ this.addInput("dirt","Texture");
+ this.addOutput("out","Texture");
+ this.addOutput("glow","Texture");
+ this.properties = { enabled: true, intensity: 1, persistence: 0.99, iterations:16, threshold:0, scale: 1, dirt_factor: 0.5, precision: LGraphTexture.DEFAULT };
+ this._textures = [];
+ this._uniforms = { u_intensity: 1, u_texture: 0, u_glow_texture: 1, u_threshold: 0, u_texel_size: vec2.create() };
+ }
+
+ LGraphTextureGlow.title = "Glow";
+ LGraphTextureGlow.desc = "Filters a texture giving it a glow effect";
+ LGraphTextureGlow.weights = new Float32Array( [0.5,0.4,0.3,0.2] );
+
+ LGraphTextureGlow.widgets_info = {
+ "iterations": { type:"number", min: 0, max: 16, step: 1, precision: 0 },
+ "threshold": { type:"number", min: 0, max: 10, step: 0.01, precision: 2 },
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphTextureGlow.prototype.onGetInputs = function(){
+ return [["enabled","boolean"],["threshold","number"],["intensity","number"],["persistence","number"],["iterations","number"],["dirt_factor","number"]];
+ }
+
+ LGraphTextureGlow.prototype.onGetOutputs = function(){
+ return [["average","Texture"]];
+ }
+
+ LGraphTextureGlow.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(!this.isAnyOutputConnected())
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH || this.getInputOrProperty("enabled" ) === false )
+ {
+ this.setOutputData(0,tex);
+ return;
+ }
+
+ var width = tex.width;
+ var height = tex.height;
+
+ var texture_info = { format: tex.format, type: tex.type, minFilter: GL.LINEAR, magFilter: GL.LINEAR, wrap: gl.CLAMP_TO_EDGE };
+ var type = LGraphTexture.getTextureType( this.properties.precision, tex );
+
+ var uniforms = this._uniforms;
+ var textures = this._textures;
+
+ //cut
+ var shader = LGraphTextureGlow._cut_shader;
+ if(!shader)
+ shader = LGraphTextureGlow._cut_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.cut_pixel_shader );
+
+ gl.disable( gl.DEPTH_TEST );
+ gl.disable( gl.BLEND );
+
+ uniforms.u_threshold = this.getInputOrProperty("threshold");
+ var currentDestination = textures[0] = GL.Texture.getTemporary( width, height, texture_info );
+ tex.blit( currentDestination, shader.uniforms(uniforms) );
+ var currentSource = currentDestination;
+
+ var iterations = this.getInputOrProperty("iterations");
+ iterations = Math.clamp( iterations, 1, 16) | 0;
+ var texel_size = uniforms.u_texel_size;
+ var intensity = this.getInputOrProperty("intensity");
+
+ uniforms.u_intensity = 1;
+ uniforms.u_delta = this.properties.scale; //1
+
+ //downscale/upscale shader
+ var shader = LGraphTextureGlow._shader;
+ if(!shader)
+ shader = LGraphTextureGlow._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.scale_pixel_shader );
+
+ var i = 1;
+ //downscale
+ for (;i < iterations; i++) {
+ width = width>>1;
+ if( (height|0) > 1 )
+ height = height>>1;
+ if( width < 2 )
+ break;
+ currentDestination = textures[i] = GL.Texture.getTemporary( width, height, texture_info );
+ texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
+ currentSource.blit( currentDestination, shader.uniforms(uniforms) );
+ currentSource = currentDestination;
+ }
+
+ //average
+ if(this.isOutputConnected(2))
+ {
+ var average_texture = this._average_texture;
+ if(!average_texture || average_texture.type != tex.type || average_texture.format != tex.format )
+ average_texture = this._average_texture = new GL.Texture( 1, 1, { type: tex.type, format: tex.format, filter: gl.LINEAR });
+ texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
+ uniforms.u_intensity = intensity;
+ uniforms.u_delta = 1;
+ currentSource.blit( average_texture, shader.uniforms(uniforms) );
+ this.setOutputData( 2, average_texture );
+ }
+
+ //upscale and blend
+ gl.enable( gl.BLEND );
+ gl.blendFunc( gl.ONE, gl.ONE );
+ uniforms.u_intensity = this.getInputOrProperty("persistence");
+ uniforms.u_delta = 0.5;
+
+ for (i -= 2; i >= 0; i--) // i-=2 => -1 to point to last element in array, -1 to go to texture above
+ {
+ currentDestination = textures[i];
+ textures[i] = null;
+ texel_size[0] = 1 / currentSource.width; texel_size[1] = 1 / currentSource.height;
+ currentSource.blit( currentDestination, shader.uniforms(uniforms) );
+ GL.Texture.releaseTemporary( currentSource );
+ currentSource = currentDestination;
+ }
+ gl.disable( gl.BLEND );
+
+ //glow
+ if(this.isOutputConnected(1))
+ {
+ var glow_texture = this._glow_texture;
+ if(!glow_texture || glow_texture.width != tex.width || glow_texture.height != tex.height || glow_texture.type != type || glow_texture.format != tex.format )
+ glow_texture = this._glow_texture = new GL.Texture( tex.width, tex.height, { type: type, format: tex.format, filter: gl.LINEAR });
+ currentSource.blit( glow_texture );
+ this.setOutputData( 1, glow_texture);
+ }
+
+ //final composition
+ if(this.isOutputConnected(0))
+ {
+ var final_texture = this._final_texture;
+ if(!final_texture || final_texture.width != tex.width || final_texture.height != tex.height || final_texture.type != type || final_texture.format != tex.format )
+ final_texture = this._final_texture = new GL.Texture( tex.width, tex.height, { type: type, format: tex.format, filter: gl.LINEAR });
+
+ var dirt_texture = this.getInputData(1);
+ var dirt_factor = this.getInputOrProperty("dirt_factor");
+
+ uniforms.u_intensity = intensity;
+
+ shader = dirt_texture ? LGraphTextureGlow._dirt_final_shader : LGraphTextureGlow._final_shader;
+ if(!shader)
+ {
+ if(dirt_texture)
+ shader = LGraphTextureGlow._dirt_final_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.final_pixel_shader, { USE_DIRT: "" } );
+ else
+ shader = LGraphTextureGlow._final_shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphTextureGlow.final_pixel_shader );
+ }
+
+ final_texture.drawTo( function(){
+ tex.bind(0);
+ currentSource.bind(1);
+ if(dirt_texture)
+ {
+ shader.setUniform( "u_dirt_factor", dirt_factor );
+ shader.setUniform( "u_dirt_texture", dirt_texture.bind(2) );
+ }
+ shader.toViewport( uniforms );
+ });
+ this.setOutputData( 0, final_texture );
+ }
+
+ GL.Texture.releaseTemporary( currentSource );
+ }
+
+ LGraphTextureGlow.cut_pixel_shader = "precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform float u_threshold;\n\
+ void main() {\n\
+ gl_FragColor = max( texture2D( u_texture, v_coord ) - vec4( u_threshold ), vec4(0.0) );\n\
+ }"
+
+ LGraphTextureGlow.scale_pixel_shader = "precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform vec2 u_texel_size;\n\
+ uniform float u_delta;\n\
+ uniform float u_intensity;\n\
+ \n\
+ vec4 sampleBox(vec2 uv) {\n\
+ vec4 o = u_texel_size.xyxy * vec2(-u_delta, u_delta).xxyy;\n\
+ vec4 s = texture2D( u_texture, uv + o.xy ) + texture2D( u_texture, uv + o.zy) + texture2D( u_texture, uv + o.xw) + texture2D( u_texture, uv + o.zw);\n\
+ return s * 0.25;\n\
+ }\n\
+ void main() {\n\
+ gl_FragColor = u_intensity * sampleBox( v_coord );\n\
+ }"
+
+ LGraphTextureGlow.final_pixel_shader = "precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform sampler2D u_glow_texture;\n\
+ #ifdef USE_DIRT\n\
+ uniform sampler2D u_dirt_texture;\n\
+ #endif\n\
+ uniform vec2 u_texel_size;\n\
+ uniform float u_delta;\n\
+ uniform float u_intensity;\n\
+ uniform float u_dirt_factor;\n\
+ \n\
+ vec4 sampleBox(vec2 uv) {\n\
+ vec4 o = u_texel_size.xyxy * vec2(-u_delta, u_delta).xxyy;\n\
+ vec4 s = texture2D( u_glow_texture, uv + o.xy ) + texture2D( u_glow_texture, uv + o.zy) + texture2D( u_glow_texture, uv + o.xw) + texture2D( u_glow_texture, uv + o.zw);\n\
+ return s * 0.25;\n\
+ }\n\
+ void main() {\n\
+ vec4 glow = sampleBox( v_coord );\n\
+ #ifdef USE_DIRT\n\
+ glow = mix( glow, glow * texture2D( u_dirt_texture, v_coord ), u_dirt_factor );\n\
+ #endif\n\
+ gl_FragColor = texture2D( u_texture, v_coord ) + u_intensity * glow;\n\
+ }"
+
+ LiteGraph.registerNodeType("texture/glow", LGraphTextureGlow );
+
+
+ // Texture Blur *****************************************
+ function LGraphTextureKuwaharaFilter()
+ {
+ this.addInput("Texture","Texture");
+ this.addOutput("Filtered","Texture");
+ this.properties = { intensity: 1, radius: 5 };
+ }
+
+ LGraphTextureKuwaharaFilter.title = "Kuwahara Filter";
+ LGraphTextureKuwaharaFilter.desc = "Filters a texture giving an artistic oil canvas painting";
+
+ LGraphTextureKuwaharaFilter.max_radius = 10;
+ LGraphTextureKuwaharaFilter._shaders = [];
+
+ LGraphTextureKuwaharaFilter.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ var temp = this._temp_texture;
+
+ if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
+ {
+ //we need two textures to do the blurring
+ this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
+ //this._final_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
+ }
+
+ //iterations
+ var radius = this.properties.radius;
+ radius = Math.min( Math.floor(radius), LGraphTextureKuwaharaFilter.max_radius );
+ if(radius == 0) //skip blurring
+ {
+ this.setOutputData(0, tex);
+ return;
+ }
+
+ var intensity = this.properties.intensity;
+
+ //blur sometimes needs an aspect correction
+ var aspect = LiteGraph.camera_aspect;
+ if(!aspect && window.gl !== undefined)
+ aspect = gl.canvas.height / gl.canvas.width;
+ if(!aspect)
+ aspect = 1;
+ aspect = this.properties.preserve_aspect ? aspect : 1;
+
+ if(!LGraphTextureKuwaharaFilter._shaders[ radius ])
+ LGraphTextureKuwaharaFilter._shaders[ radius ] = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphTextureKuwaharaFilter.pixel_shader, { RADIUS: radius.toFixed(0) });
+
+ var shader = LGraphTextureKuwaharaFilter._shaders[ radius ];
+ var mesh = GL.Mesh.getScreenQuad();
+ tex.bind(0);
+
+ this._temp_texture.drawTo( function() {
+ shader.uniforms({ u_texture: 0, u_intensity: intensity, u_resolution: [tex.width, tex.height], u_iResolution: [1/tex.width,1/tex.height]}).draw(mesh);
+ });
+
+ this.setOutputData(0, this._temp_texture);
+ }
+
+//from https://www.shadertoy.com/view/MsXSz4
+LGraphTextureKuwaharaFilter.pixel_shader = "\n\
+ precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform float u_intensity;\n\
+ uniform vec2 u_resolution;\n\
+ uniform vec2 u_iResolution;\n\
+ #ifndef RADIUS\n\
+ #define RADIUS 7\n\
+ #endif\n\
+ void main() {\n\
+ \n\
+ const int radius = RADIUS;\n\
+ vec2 fragCoord = v_coord;\n\
+ vec2 src_size = u_iResolution;\n\
+ vec2 uv = v_coord;\n\
+ float n = float((radius + 1) * (radius + 1));\n\
+ int i;\n\
+ int j;\n\
+ vec3 m0 = vec3(0.0); vec3 m1 = vec3(0.0); vec3 m2 = vec3(0.0); vec3 m3 = vec3(0.0);\n\
+ vec3 s0 = vec3(0.0); vec3 s1 = vec3(0.0); vec3 s2 = vec3(0.0); vec3 s3 = vec3(0.0);\n\
+ vec3 c;\n\
+ \n\
+ for (int j = -radius; j <= 0; ++j) {\n\
+ for (int i = -radius; i <= 0; ++i) {\n\
+ c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
+ m0 += c;\n\
+ s0 += c * c;\n\
+ }\n\
+ }\n\
+ \n\
+ for (int j = -radius; j <= 0; ++j) {\n\
+ for (int i = 0; i <= radius; ++i) {\n\
+ c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
+ m1 += c;\n\
+ s1 += c * c;\n\
+ }\n\
+ }\n\
+ \n\
+ for (int j = 0; j <= radius; ++j) {\n\
+ for (int i = 0; i <= radius; ++i) {\n\
+ c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
+ m2 += c;\n\
+ s2 += c * c;\n\
+ }\n\
+ }\n\
+ \n\
+ for (int j = 0; j <= radius; ++j) {\n\
+ for (int i = -radius; i <= 0; ++i) {\n\
+ c = texture2D(u_texture, uv + vec2(i,j) * src_size).rgb;\n\
+ m3 += c;\n\
+ s3 += c * c;\n\
+ }\n\
+ }\n\
+ \n\
+ float min_sigma2 = 1e+2;\n\
+ m0 /= n;\n\
+ s0 = abs(s0 / n - m0 * m0);\n\
+ \n\
+ float sigma2 = s0.r + s0.g + s0.b;\n\
+ if (sigma2 < min_sigma2) {\n\
+ min_sigma2 = sigma2;\n\
+ gl_FragColor = vec4(m0, 1.0);\n\
+ }\n\
+ \n\
+ m1 /= n;\n\
+ s1 = abs(s1 / n - m1 * m1);\n\
+ \n\
+ sigma2 = s1.r + s1.g + s1.b;\n\
+ if (sigma2 < min_sigma2) {\n\
+ min_sigma2 = sigma2;\n\
+ gl_FragColor = vec4(m1, 1.0);\n\
+ }\n\
+ \n\
+ m2 /= n;\n\
+ s2 = abs(s2 / n - m2 * m2);\n\
+ \n\
+ sigma2 = s2.r + s2.g + s2.b;\n\
+ if (sigma2 < min_sigma2) {\n\
+ min_sigma2 = sigma2;\n\
+ gl_FragColor = vec4(m2, 1.0);\n\
+ }\n\
+ \n\
+ m3 /= n;\n\
+ s3 = abs(s3 / n - m3 * m3);\n\
+ \n\
+ sigma2 = s3.r + s3.g + s3.b;\n\
+ if (sigma2 < min_sigma2) {\n\
+ min_sigma2 = sigma2;\n\
+ gl_FragColor = vec4(m3, 1.0);\n\
+ }\n\
+ }\n\
+ ";
+
+ LiteGraph.registerNodeType("texture/kuwahara", LGraphTextureKuwaharaFilter );
+
+
+ // Texture Webcam *****************************************
+ function LGraphTextureWebcam()
+ {
+ this.addOutput("Webcam","Texture");
+ this.properties = { texture_name: "" };
+ }
+
+ LGraphTextureWebcam.title = "Webcam";
+ LGraphTextureWebcam.desc = "Webcam texture";
+
+
+ LGraphTextureWebcam.prototype.openStream = function()
+ {
+ //Vendor prefixes hell
+ navigator.getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
+ window.URL = window.URL || window.webkitURL;
+
+ if (!navigator.getUserMedia) {
+ //console.log('getUserMedia() is not supported in your browser, use chrome and enable WebRTC from about://flags');
+ return;
+ }
+
+ this._waiting_confirmation = true;
+ var that = this;
+
+ // Not showing vendor prefixes.
+ navigator.getUserMedia({video: true}, this.streamReady.bind(this), onFailSoHard);
+
+ function onFailSoHard(e) {
+ console.log('Webcam rejected', e);
+ that._webcam_stream = false;
+ that.box_color = "red";
+ };
+ }
+
+ LGraphTextureWebcam.prototype.streamReady = function(localMediaStream)
+ {
+ this._webcam_stream = localMediaStream;
+ //this._waiting_confirmation = false;
+
+ var video = this._video;
+ if(!video)
+ {
+ video = document.createElement("video");
+ video.autoplay = true;
+ video.src = window.URL.createObjectURL( localMediaStream );
+ this._video = video;
+ //document.body.appendChild( video ); //debug
+ //when video info is loaded (size and so)
+ video.onloadedmetadata = function(e) {
+ // Ready to go. Do some stuff.
+ console.log(e);
+ };
+ }
+ }
+
+ LGraphTextureWebcam.prototype.onRemoved = function()
+ {
+ if(!this._webcam_stream)
+ return;
+
+ var video_streams = this._webcam_stream.getVideoTracks();
+ if(video_streams.length)
+ {
+ var webcam = video_streams[0];
+ if( webcam.stop )
+ webcam.stop();
+ }
+
+ this._webcam_stream = null;
+ this._video = null;
+ }
+
+ LGraphTextureWebcam.prototype.onDrawBackground = function(ctx)
+ {
+ if(this.flags.collapsed || this.size[1] <= 20)
+ return;
+
+ if(!this._video)
+ return;
+
+ //render to graph canvas
+ ctx.save();
+ if(!ctx.webgl) //reverse image
+ {
+ ctx.translate(0,this.size[1]);
+ ctx.scale(1,-1);
+ ctx.drawImage(this._video, 0, 0, this.size[0], this.size[1]);
+ }
+ else
+ {
+ if(this._temp_texture)
+ ctx.drawImage(this._temp_texture, 0, 0, this.size[0], this.size[1]);
+ }
+ ctx.restore();
+ }
+
+ LGraphTextureWebcam.prototype.onExecute = function()
+ {
+ if(this._webcam_stream == null && !this._waiting_confirmation)
+ this.openStream();
+
+ if(!this._video || !this._video.videoWidth)
+ return;
+
+ var width = this._video.videoWidth;
+ var height = this._video.videoHeight;
+
+ var temp = this._temp_texture;
+ if(!temp || temp.width != width || temp.height != height )
+ this._temp_texture = new GL.Texture( width, height, { format: gl.RGB, filter: gl.LINEAR });
+
+ this._temp_texture.uploadImage( this._video );
+
+ if(this.properties.texture_name)
+ {
+ var container = LGraphTexture.getTexturesContainer();
+ container[ this.properties.texture_name ] = this._temp_texture;
+ }
+
+ this.setOutputData(0,this._temp_texture);
+ }
+
+ LiteGraph.registerNodeType("texture/webcam", LGraphTextureWebcam );
+
+
+
+ //from https://github.com/spite/Wagner
+ function LGraphLensFX()
+ {
+ this.addInput("in","Texture");
+ this.addInput("f","number");
+ this.addOutput("out","Texture");
+ this.properties = { enabled: true, factor: 1, precision: LGraphTexture.LOW };
+
+ this._uniforms = { u_texture: 0, u_factor: 1 };
+ }
+
+ LGraphLensFX.title = "Lens FX";
+ LGraphLensFX.desc = "distortion and chromatic aberration";
+
+ LGraphLensFX.widgets_info = {
+ "precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
+ };
+
+ LGraphLensFX.prototype.onGetInputs = function() { return [["enabled","boolean"]]; }
+
+ LGraphLensFX.prototype.onExecute = function()
+ {
+ var tex = this.getInputData(0);
+ if(!tex)
+ return;
+
+ if(!this.isOutputConnected(0))
+ return; //saves work
+
+ if(this.properties.precision === LGraphTexture.PASS_THROUGH || this.getInputOrProperty("enabled" ) === false )
+ {
+ this.setOutputData(0, tex );
+ return;
+ }
+
+ var temp = this._temp_texture;
+ if(!temp || temp.width != tex.width || temp.height != tex.height || temp.type != tex.type )
+ temp = this._temp_texture = new GL.Texture( tex.width, tex.height, { type: tex.type, format: gl.RGBA, filter: gl.LINEAR });
+
+ var shader = LGraphLensFX._shader;
+ if(!shader)
+ shader = LGraphLensFX._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphLensFX.pixel_shader );
+
+ var factor = this.getInputData(1);
+ if(factor == null)
+ factor = this.properties.factor;
+
+ var uniforms = this._uniforms;
+ uniforms.u_factor = factor;
+
+ //apply shader
+ gl.disable( gl.DEPTH_TEST );
+ temp.drawTo(function(){
+ tex.bind(0);
+ shader.uniforms(uniforms).draw( GL.Mesh.getScreenQuad() );
+ });
+
+ this.setOutputData(0,temp);
+ }
+
+ LGraphLensFX.pixel_shader = "precision highp float;\n\
+ varying vec2 v_coord;\n\
+ uniform sampler2D u_texture;\n\
+ uniform float u_factor;\n\
+ vec2 barrelDistortion(vec2 coord, float amt) {\n\
+ vec2 cc = coord - 0.5;\n\
+ float dist = dot(cc, cc);\n\
+ return coord + cc * dist * amt;\n\
+ }\n\
+ \n\
+ float sat( float t )\n\
+ {\n\
+ return clamp( t, 0.0, 1.0 );\n\
+ }\n\
+ \n\
+ float linterp( float t ) {\n\
+ return sat( 1.0 - abs( 2.0*t - 1.0 ) );\n\
+ }\n\
+ \n\
+ float remap( float t, float a, float b ) {\n\
+ return sat( (t - a) / (b - a) );\n\
+ }\n\
+ \n\
+ vec4 spectrum_offset( float t ) {\n\
+ vec4 ret;\n\
+ float lo = step(t,0.5);\n\
+ float hi = 1.0-lo;\n\
+ float w = linterp( remap( t, 1.0/6.0, 5.0/6.0 ) );\n\
+ ret = vec4(lo,1.0,hi, 1.) * vec4(1.0-w, w, 1.0-w, 1.);\n\
+ \n\
+ return pow( ret, vec4(1.0/2.2) );\n\
+ }\n\
+ \n\
+ const float max_distort = 2.2;\n\
+ const int num_iter = 12;\n\
+ const float reci_num_iter_f = 1.0 / float(num_iter);\n\
+ \n\
+ void main()\n\
+ { \n\
+ vec2 uv=v_coord;\n\
+ vec4 sumcol = vec4(0.0);\n\
+ vec4 sumw = vec4(0.0); \n\
+ for ( int i=0; i= 0xF0)
- this.cmd = midiStatus;
- else
- this.cmd = midiCommand;
-
- if(this.cmd == MIDIEvent.NOTEON && this.velocity == 0)
- this.cmd = MIDIEvent.NOTEOFF;
-
- this.cmd_str = MIDIEvent.commands[ this.cmd ] || "";
-
- if ( midiCommand >= MIDIEvent.NOTEON || midiCommand <= MIDIEvent.NOTEOFF ) {
- this.channel = midiStatus & 0x0F;
- }
-}
-
-Object.defineProperty( MIDIEvent.prototype, "velocity", {
- get: function() {
- if(this.cmd == MIDIEvent.NOTEON)
- return this.data[2];
- return -1;
- },
- set: function(v) {
- this.data[2] = v; // v / 127;
- },
- enumerable: true
-});
-
-MIDIEvent.notes = ["A","A#","B","C","C#","D","D#","E","F","F#","G","G#"];
-
-//returns HZs
-MIDIEvent.prototype.getPitch = function()
-{
- return Math.pow(2, (this.data[1] - 69) / 12 ) * 440;
-}
-
-MIDIEvent.computePitch = function( note )
-{
- return Math.pow(2, (note - 69) / 12 ) * 440;
-}
-
-MIDIEvent.prototype.getCC = function()
-{
- return this.data[1];
-}
-
-MIDIEvent.prototype.getCCValue = function()
-{
- return this.data[2];
-}
-
-//not tested, there is a formula missing here
-MIDIEvent.prototype.getPitchBend = function()
-{
- return this.data[1] + (this.data[2] << 7) - 8192;
-}
-
-MIDIEvent.computePitchBend = function(v1,v2)
-{
- return v1 + (v2 << 7) - 8192;
-}
-
-MIDIEvent.prototype.setCommandFromString = function( str )
-{
- this.cmd = MIDIEvent.computeCommandFromString(str);
-}
-
-MIDIEvent.computeCommandFromString = function( str )
-{
- if(!str)
- return 0;
-
- if(str && str.constructor === Number)
- return str;
-
- str = str.toUpperCase();
- switch( str )
- {
- case "NOTE ON":
- case "NOTEON": return MIDIEvent.NOTEON; break;
- case "NOTE OFF":
- case "NOTEOFF": return MIDIEvent.NOTEON; break;
- case "KEY PRESSURE":
- case "KEYPRESSURE": return MIDIEvent.KEYPRESSURE; break;
- case "CONTROLLER CHANGE":
- case "CONTROLLERCHANGE":
- case "CC": return MIDIEvent.CONTROLLERCHANGE; break;
- case "PROGRAM CHANGE":
- case "PROGRAMCHANGE":
- case "PC": return MIDIEvent.PROGRAMCHANGE; break;
- case "CHANNEL PRESSURE":
- case "CHANNELPRESSURE": return MIDIEvent.CHANNELPRESSURE; break;
- case "PITCH BEND":
- case "PITCHBEND": return MIDIEvent.PITCHBEND; break;
- case "TIME TICK":
- case "TIMETICK": return MIDIEvent.TIMETICK; break;
- default: return Number(str); //asume its a hex code
- }
-}
-
-MIDIEvent.toNoteString = function(d)
-{
- var note = d - 21;
- var octave = d - 24;
- note = note % 12;
- if(note < 0)
- note = 12 + note;
- return MIDIEvent.notes[ note ] + Math.floor(octave / 12 + 1);
-}
-
-MIDIEvent.prototype.toString = function()
-{
- var str = "" + this.channel + ". " ;
- switch( this.cmd )
- {
- case MIDIEvent.NOTEON: str += "NOTEON " + MIDIEvent.toNoteString( this.data[1] ); break;
- case MIDIEvent.NOTEOFF: str += "NOTEOFF " + MIDIEvent.toNoteString( this.data[1] ); break;
- case MIDIEvent.CONTROLLERCHANGE: str += "CC " + this.data[1] + " " + this.data[2]; break;
- case MIDIEvent.PROGRAMCHANGE: str += "PC " + this.data[1]; break;
- case MIDIEvent.PITCHBEND: str += "PITCHBEND " + this.getPitchBend(); break;
- case MIDIEvent.KEYPRESSURE: str += "KEYPRESS " + this.data[1]; break;
- }
-
- return str;
-}
-
-MIDIEvent.prototype.toHexString = function()
-{
- var str = "";
- for(var i = 0; i < this.data.length; i++)
- str += this.data[i].toString(16) + " ";
-}
-
-MIDIEvent.NOTEOFF = 0x80;
-MIDIEvent.NOTEON = 0x90;
-MIDIEvent.KEYPRESSURE = 0xA0;
-MIDIEvent.CONTROLLERCHANGE = 0xB0;
-MIDIEvent.PROGRAMCHANGE = 0xC0;
-MIDIEvent.CHANNELPRESSURE = 0xD0;
-MIDIEvent.PITCHBEND = 0xE0;
-MIDIEvent.TIMETICK = 0xF8;
-
-MIDIEvent.commands = {
- 0x80: "note off",
- 0x90: "note on",
- 0xA0: "key pressure",
- 0xB0: "controller change",
- 0xC0: "program change",
- 0xD0: "channel pressure",
- 0xE0: "pitch bend",
- 0xF0: "system",
- 0xF2: "Song pos",
- 0xF3: "Song select",
- 0xF6: "Tune request",
- 0xF8: "time tick",
- 0xFA: "Start Song",
- 0xFB: "Continue Song",
- 0xFC: "Stop Song",
- 0xFE: "Sensing",
- 0xFF: "Reset"
-}
-
-//MIDI wrapper
-function MIDIInterface( on_ready, on_error )
-{
- if(!navigator.requestMIDIAccess)
- {
- this.error = "not suppoorted";
- if(on_error)
- on_error("Not supported");
- else
- console.error("MIDI NOT SUPPORTED, enable by chrome://flags");
- return;
- }
-
- this.on_ready = on_ready;
-
- this.state = {
- note: [],
- cc: []
- };
-
-
-
- navigator.requestMIDIAccess().then( this.onMIDISuccess.bind(this), this.onMIDIFailure.bind(this) );
-}
-
-MIDIInterface.input = null;
-
-MIDIInterface.MIDIEvent = MIDIEvent;
-
-MIDIInterface.prototype.onMIDISuccess = function(midiAccess)
-{
- console.log( "MIDI ready!" );
- console.log( midiAccess );
- this.midi = midiAccess; // store in the global (in real usage, would probably keep in an object instance)
- this.updatePorts();
-
- if (this.on_ready)
- this.on_ready(this);
-}
-
-MIDIInterface.prototype.updatePorts = function()
-{
- var midi = this.midi;
- this.input_ports = midi.inputs;
- var num = 0;
-
- var it = this.input_ports.values();
- var it_value = it.next();
- while( it_value && it_value.done === false )
- {
- var port_info = it_value.value;
- console.log( "Input port [type:'" + port_info.type + "'] id:'" + port_info.id +
- "' manufacturer:'" + port_info.manufacturer + "' name:'" + port_info.name +
- "' version:'" + port_info.version + "'" );
- num++;
- it_value = it.next();
- }
- this.num_input_ports = num;
-
- num = 0;
- this.output_ports = midi.outputs;
- var it = this.output_ports.values();
- var it_value = it.next();
- while( it_value && it_value.done === false )
- {
- var port_info = it_value.value;
- console.log( "Output port [type:'" + port_info.type + "'] id:'" + port_info.id +
- "' manufacturer:'" + port_info.manufacturer + "' name:'" + port_info.name +
- "' version:'" + port_info.version + "'" );
- num++;
- it_value = it.next();
- }
- this.num_output_ports = num;
-
-
- /* OLD WAY
- for (var i = 0; i < this.input_ports.size; ++i) {
- var input = this.input_ports.get(i);
- if(!input)
- continue; //sometimes it is null?!
- console.log( "Input port [type:'" + input.type + "'] id:'" + input.id +
- "' manufacturer:'" + input.manufacturer + "' name:'" + input.name +
- "' version:'" + input.version + "'" );
- num++;
- }
- this.num_input_ports = num;
-
-
- num = 0;
- this.output_ports = midi.outputs;
- for (var i = 0; i < this.output_ports.size; ++i) {
- var output = this.output_ports.get(i);
- if(!output)
- continue;
- console.log( "Output port [type:'" + output.type + "'] id:'" + output.id +
- "' manufacturer:'" + output.manufacturer + "' name:'" + output.name +
- "' version:'" + output.version + "'" );
- num++;
- }
- this.num_output_ports = num;
- */
-}
-
-MIDIInterface.prototype.onMIDIFailure = function(msg)
-{
- console.error( "Failed to get MIDI access - " + msg );
-}
-
-MIDIInterface.prototype.openInputPort = function( port, callback )
-{
- var input_port = this.input_ports.get( "input-" + port );
- if(!input_port)
- return false;
- MIDIInterface.input = this;
- var that = this;
-
- input_port.onmidimessage = function(a) {
- var midi_event = new MIDIEvent(a.data);
- that.updateState( midi_event );
- if(callback)
- callback(a.data, midi_event );
- if(MIDIInterface.on_message)
- MIDIInterface.on_message( a.data, midi_event );
- }
- console.log("port open: ", input_port);
- return true;
-}
-
-MIDIInterface.parseMsg = function(data)
-{
-
-}
-
-MIDIInterface.prototype.updateState = function( midi_event )
-{
- switch( midi_event.cmd )
- {
- case MIDIEvent.NOTEON: this.state.note[ midi_event.value1|0 ] = midi_event.value2; break;
- case MIDIEvent.NOTEOFF: this.state.note[ midi_event.value1|0 ] = 0; break;
- case MIDIEvent.CONTROLLERCHANGE: this.state.cc[ midi_event.getCC() ] = midi_event.getCCValue(); break;
- }
-}
-
-MIDIInterface.prototype.sendMIDI = function( port, midi_data )
-{
- if( !midi_data )
- return;
-
- var output_port = this.output_ports.get( "output-" + port );
- if(!output_port)
- return;
-
- MIDIInterface.output = this;
-
- if( midi_data.constructor === MIDIEvent)
- output_port.send( midi_data.data );
- else
- output_port.send( midi_data );
-}
-
-
-
-function LGMIDIIn()
-{
- this.addOutput( "on_midi", LiteGraph.EVENT );
- this.addOutput( "out", "midi" );
- this.properties = {port: 0};
- this._last_midi_event = null;
- this._current_midi_event = null;
-
- var that = this;
- new MIDIInterface( function( midi ){
- //open
- that._midi = midi;
- if(that._waiting)
- that.onStart();
- that._waiting = false;
- });
-}
-
-LGMIDIIn.MIDIInterface = MIDIInterface;
-
-LGMIDIIn.title = "MIDI Input";
-LGMIDIIn.desc = "Reads MIDI from a input port";
-
-LGMIDIIn.prototype.getPropertyInfo = function(name)
-{
- if(!this._midi)
- return;
-
- if(name == "port")
- {
- var values = {};
- for (var i = 0; i < this._midi.input_ports.size; ++i)
- {
- var input = this._midi.input_ports.get( "input-" + i);
- values[i] = i + ".- " + input.name + " version:" + input.version;
- }
- return { type: "enum", values: values };
- }
-}
-
-LGMIDIIn.prototype.onStart = function()
-{
- if(this._midi)
- this._midi.openInputPort( this.properties.port, this.onMIDIEvent.bind(this) );
- else
- this._waiting = true;
-}
-
-LGMIDIIn.prototype.onMIDIEvent = function( data, midi_event )
-{
- this._last_midi_event = midi_event;
-
- this.trigger( "on_midi", midi_event );
- if(midi_event.cmd == MIDIEvent.NOTEON)
- this.trigger( "on_noteon", midi_event );
- else if(midi_event.cmd == MIDIEvent.NOTEOFF)
- this.trigger( "on_noteoff", midi_event );
- else if(midi_event.cmd == MIDIEvent.CONTROLLERCHANGE)
- this.trigger( "on_cc", midi_event );
- else if(midi_event.cmd == MIDIEvent.PROGRAMCHANGE)
- this.trigger( "on_pc", midi_event );
- else if(midi_event.cmd == MIDIEvent.PITCHBEND)
- this.trigger( "on_pitchbend", midi_event );
-}
-
-LGMIDIIn.prototype.onExecute = function()
-{
- if(this.outputs)
- {
- var last = this._last_midi_event;
- for(var i = 0; i < this.outputs.length; ++i)
- {
- var output = this.outputs[i];
- var v = null;
- switch (output.name)
- {
- case "midi": v = this._midi; break;
- case "last_midi": v = last; break;
- default:
- continue;
- }
- this.setOutputData( i, v );
- }
- }
-}
-
-LGMIDIIn.prototype.onGetOutputs = function() {
- return [
- ["last_midi","midi"],
- ["on_midi",LiteGraph.EVENT],
- ["on_noteon",LiteGraph.EVENT],
- ["on_noteoff",LiteGraph.EVENT],
- ["on_cc",LiteGraph.EVENT],
- ["on_pc",LiteGraph.EVENT],
- ["on_pitchbend",LiteGraph.EVENT]
- ];
-}
-
-LiteGraph.registerNodeType("midi/input", LGMIDIIn);
-
-
-function LGMIDIOut()
-{
- this.addInput( "send", LiteGraph.EVENT );
- this.properties = {port: 0};
-
- var that = this;
- new MIDIInterface( function( midi ){
- that._midi = midi;
- });
-}
-
-LGMIDIOut.MIDIInterface = MIDIInterface;
-
-LGMIDIOut.title = "MIDI Output";
-LGMIDIOut.desc = "Sends MIDI to output channel";
-
-LGMIDIOut.prototype.getPropertyInfo = function(name)
-{
- if(!this._midi)
- return;
-
- if(name == "port")
- {
- var values = {};
- for (var i = 0; i < this._midi.output_ports.size; ++i)
- {
- var output = this._midi.output_ports.get(i);
- values[i] = i + ".- " + output.name + " version:" + output.version;
- }
- return { type: "enum", values: values };
- }
-}
-
-
-LGMIDIOut.prototype.onAction = function(event, midi_event )
-{
- console.log(midi_event);
- if(!this._midi)
- return;
- if(event == "send")
- this._midi.sendMIDI( this.port, midi_event );
- this.trigger("midi",midi_event);
-}
-
-LGMIDIOut.prototype.onGetInputs = function() {
- return [["send",LiteGraph.ACTION]];
-}
-
-LGMIDIOut.prototype.onGetOutputs = function() {
- return [["on_midi",LiteGraph.EVENT]];
-}
-
-LiteGraph.registerNodeType("midi/output", LGMIDIOut);
-
-
-function LGMIDIShow()
-{
- this.addInput( "on_midi", LiteGraph.EVENT );
- this._str = "";
- this.size = [200,40]
-}
-
-LGMIDIShow.title = "MIDI Show";
-LGMIDIShow.desc = "Shows MIDI in the graph";
-
-LGMIDIShow.prototype.onAction = function(event, midi_event )
-{
- if(!midi_event)
- return;
- if(midi_event.constructor === MIDIEvent)
- this._str = midi_event.toString();
- else
- this._str = "???";
-}
-
-LGMIDIShow.prototype.onDrawForeground = function( ctx )
-{
- if( !this._str )
- return;
-
- ctx.font = "30px Arial";
- ctx.fillText( this._str, 10, this.size[1] * 0.8 );
-}
-
-LGMIDIShow.prototype.onGetInputs = function() {
- return [["in",LiteGraph.ACTION]];
-}
-
-LGMIDIShow.prototype.onGetOutputs = function() {
- return [["on_midi",LiteGraph.EVENT]];
-}
-
-LiteGraph.registerNodeType("midi/show", LGMIDIShow);
-
-
-
-function LGMIDIFilter()
-{
- this.properties = {
- channel: -1,
- cmd: -1,
- min_value: -1,
- max_value: -1
- };
-
- this.addInput( "in", LiteGraph.EVENT );
- this.addOutput( "on_midi", LiteGraph.EVENT );
-}
-
-LGMIDIFilter.title = "MIDI Filter";
-LGMIDIFilter.desc = "Filters MIDI messages";
-
-LGMIDIFilter.prototype.onAction = function(event, midi_event )
-{
- if(!midi_event || midi_event.constructor !== MIDIEvent)
- return;
-
- if( this.properties.channel != -1 && midi_event.channel != this.properties.channel)
- return;
- if(this.properties.cmd != -1 && midi_event.cmd != this.properties.cmd)
- return;
- if(this.properties.min_value != -1 && midi_event.data[1] < this.properties.min_value)
- return;
- if(this.properties.max_value != -1 && midi_event.data[1] > this.properties.max_value)
- return;
- this.trigger("on_midi",midi_event);
-}
-
-LiteGraph.registerNodeType("midi/filter", LGMIDIFilter);
-
-
-function LGMIDIEvent()
-{
- this.properties = {
- channel: 0,
- cmd: "CC",
- value1: 1,
- value2: 1
- };
-
- this.addInput( "send", LiteGraph.EVENT );
- this.addInput( "assign", LiteGraph.EVENT );
- this.addOutput( "on_midi", LiteGraph.EVENT );
-}
-
-LGMIDIEvent.title = "MIDIEvent";
-LGMIDIEvent.desc = "Create a MIDI Event";
-
-LGMIDIEvent.prototype.onAction = function( event, midi_event )
-{
- if(event == "assign")
- {
- this.properties.channel = midi_event.channel;
- this.properties.cmd = midi_event.cmd;
- this.properties.value1 = midi_event.data[1];
- this.properties.value2 = midi_event.data[2];
- return;
- }
-
- //send
- var midi_event = new MIDIEvent();
- midi_event.channel = this.properties.channel;
- if(this.properties.cmd && this.properties.cmd.constructor === String)
- midi_event.setCommandFromString( this.properties.cmd );
- else
- midi_event.cmd = this.properties.cmd;
- midi_event.data[0] = midi_event.cmd | midi_event.channel;
- midi_event.data[1] = Number(this.properties.value1);
- midi_event.data[2] = Number(this.properties.value2);
- this.trigger("on_midi",midi_event);
-}
-
-LGMIDIEvent.prototype.onExecute = function()
-{
- var props = this.properties;
-
- if(this.outputs)
- {
- for(var i = 0; i < this.outputs.length; ++i)
- {
- var output = this.outputs[i];
- var v = null;
- switch (output.name)
- {
- case "midi":
- v = new MIDIEvent();
- v.setup([ props.cmd, props.value1, props.value2 ]);
- v.channel = props.channel;
- break;
- case "command": v = props.cmd; break;
- case "cc": v = props.value1; break;
- case "cc_value": v = props.value2; break;
- case "note": v = (props.cmd == MIDIEvent.NOTEON || props.cmd == MIDIEvent.NOTEOFF) ? props.value1 : null; break;
- case "velocity": v = props.cmd == MIDIEvent.NOTEON ? props.value2 : null; break;
- case "pitch": v = props.cmd == MIDIEvent.NOTEON ? MIDIEvent.computePitch( props.value1 ) : null; break;
- case "pitchbend": v = props.cmd == MIDIEvent.PITCHBEND ? MIDIEvent.computePitchBend( props.value1, props.value2 ) : null; break;
- default:
- continue;
- }
- if(v !== null)
- this.setOutputData( i, v );
- }
- }
-}
-
-LGMIDIEvent.prototype.onPropertyChanged = function(name,value)
-{
- if(name == "cmd")
- this.properties.cmd = MIDIEvent.computeCommandFromString( value );
-}
-
-
-LGMIDIEvent.prototype.onGetOutputs = function() {
- return [
- ["midi","midi"],
- ["on_midi",LiteGraph.EVENT],
- ["command","number"],
- ["note","number"],
- ["velocity","number"],
- ["cc","number"],
- ["cc_value","number"],
- ["pitch","number"],
- ["pitchbend","number"]
- ];
-}
-
-
-LiteGraph.registerNodeType("midi/event", LGMIDIEvent);
-
-
-function LGMIDICC()
-{
- this.properties = {
-// channel: 0,
- cc: 1,
- value: 0
- };
-
- this.addOutput( "value", "number" );
-}
-
-LGMIDICC.title = "MIDICC";
-LGMIDICC.desc = "gets a Controller Change";
-
-LGMIDICC.prototype.onExecute = function()
-{
- var props = this.properties;
- if( MIDIInterface.input )
- this.properties.value = MIDIInterface.input.state.cc[ this.properties.cc ];
- this.setOutputData( 0, this.properties.value );
-}
-
-LiteGraph.registerNodeType("midi/cc", LGMIDICC);
-
-
-
-
-function now() { return window.performance.now() }
-
+(function( global )
+{
+var LiteGraph = global.LiteGraph;
+
+function MIDIEvent( data )
+{
+ this.channel = 0;
+ this.cmd = 0;
+
+ if(data)
+ this.setup(data)
+ else
+ this.data = [0,0,0];
+}
+
+MIDIEvent.prototype.setup = function( raw_data )
+{
+ this.data = raw_data;
+
+ var midiStatus = raw_data[0];
+ this.status = midiStatus;
+
+ var midiCommand = midiStatus & 0xF0;
+
+ if(midiStatus >= 0xF0)
+ this.cmd = midiStatus;
+ else
+ this.cmd = midiCommand;
+
+ if(this.cmd == MIDIEvent.NOTEON && this.velocity == 0)
+ this.cmd = MIDIEvent.NOTEOFF;
+
+ this.cmd_str = MIDIEvent.commands[ this.cmd ] || "";
+
+ if ( midiCommand >= MIDIEvent.NOTEON || midiCommand <= MIDIEvent.NOTEOFF ) {
+ this.channel = midiStatus & 0x0F;
+ }
+}
+
+Object.defineProperty( MIDIEvent.prototype, "velocity", {
+ get: function() {
+ if(this.cmd == MIDIEvent.NOTEON)
+ return this.data[2];
+ return -1;
+ },
+ set: function(v) {
+ this.data[2] = v; // v / 127;
+ },
+ enumerable: true
+});
+
+MIDIEvent.notes = ["A","A#","B","C","C#","D","D#","E","F","F#","G","G#"];
+
+//returns HZs
+MIDIEvent.prototype.getPitch = function()
+{
+ return Math.pow(2, (this.data[1] - 69) / 12 ) * 440;
+}
+
+MIDIEvent.computePitch = function( note )
+{
+ return Math.pow(2, (note - 69) / 12 ) * 440;
+}
+
+MIDIEvent.prototype.getCC = function()
+{
+ return this.data[1];
+}
+
+MIDIEvent.prototype.getCCValue = function()
+{
+ return this.data[2];
+}
+
+//not tested, there is a formula missing here
+MIDIEvent.prototype.getPitchBend = function()
+{
+ return this.data[1] + (this.data[2] << 7) - 8192;
+}
+
+MIDIEvent.computePitchBend = function(v1,v2)
+{
+ return v1 + (v2 << 7) - 8192;
+}
+
+MIDIEvent.prototype.setCommandFromString = function( str )
+{
+ this.cmd = MIDIEvent.computeCommandFromString(str);
+}
+
+MIDIEvent.computeCommandFromString = function( str )
+{
+ if(!str)
+ return 0;
+
+ if(str && str.constructor === Number)
+ return str;
+
+ str = str.toUpperCase();
+ switch( str )
+ {
+ case "NOTE ON":
+ case "NOTEON": return MIDIEvent.NOTEON; break;
+ case "NOTE OFF":
+ case "NOTEOFF": return MIDIEvent.NOTEON; break;
+ case "KEY PRESSURE":
+ case "KEYPRESSURE": return MIDIEvent.KEYPRESSURE; break;
+ case "CONTROLLER CHANGE":
+ case "CONTROLLERCHANGE":
+ case "CC": return MIDIEvent.CONTROLLERCHANGE; break;
+ case "PROGRAM CHANGE":
+ case "PROGRAMCHANGE":
+ case "PC": return MIDIEvent.PROGRAMCHANGE; break;
+ case "CHANNEL PRESSURE":
+ case "CHANNELPRESSURE": return MIDIEvent.CHANNELPRESSURE; break;
+ case "PITCH BEND":
+ case "PITCHBEND": return MIDIEvent.PITCHBEND; break;
+ case "TIME TICK":
+ case "TIMETICK": return MIDIEvent.TIMETICK; break;
+ default: return Number(str); //asume its a hex code
+ }
+}
+
+MIDIEvent.toNoteString = function(d)
+{
+ var note = d - 21;
+ var octave = d - 24;
+ note = note % 12;
+ if(note < 0)
+ note = 12 + note;
+ return MIDIEvent.notes[ note ] + Math.floor(octave / 12 + 1);
+}
+
+MIDIEvent.prototype.toString = function()
+{
+ var str = "" + this.channel + ". " ;
+ switch( this.cmd )
+ {
+ case MIDIEvent.NOTEON: str += "NOTEON " + MIDIEvent.toNoteString( this.data[1] ); break;
+ case MIDIEvent.NOTEOFF: str += "NOTEOFF " + MIDIEvent.toNoteString( this.data[1] ); break;
+ case MIDIEvent.CONTROLLERCHANGE: str += "CC " + this.data[1] + " " + this.data[2]; break;
+ case MIDIEvent.PROGRAMCHANGE: str += "PC " + this.data[1]; break;
+ case MIDIEvent.PITCHBEND: str += "PITCHBEND " + this.getPitchBend(); break;
+ case MIDIEvent.KEYPRESSURE: str += "KEYPRESS " + this.data[1]; break;
+ }
+
+ return str;
+}
+
+MIDIEvent.prototype.toHexString = function()
+{
+ var str = "";
+ for(var i = 0; i < this.data.length; i++)
+ str += this.data[i].toString(16) + " ";
+}
+
+MIDIEvent.NOTEOFF = 0x80;
+MIDIEvent.NOTEON = 0x90;
+MIDIEvent.KEYPRESSURE = 0xA0;
+MIDIEvent.CONTROLLERCHANGE = 0xB0;
+MIDIEvent.PROGRAMCHANGE = 0xC0;
+MIDIEvent.CHANNELPRESSURE = 0xD0;
+MIDIEvent.PITCHBEND = 0xE0;
+MIDIEvent.TIMETICK = 0xF8;
+
+MIDIEvent.commands = {
+ 0x80: "note off",
+ 0x90: "note on",
+ 0xA0: "key pressure",
+ 0xB0: "controller change",
+ 0xC0: "program change",
+ 0xD0: "channel pressure",
+ 0xE0: "pitch bend",
+ 0xF0: "system",
+ 0xF2: "Song pos",
+ 0xF3: "Song select",
+ 0xF6: "Tune request",
+ 0xF8: "time tick",
+ 0xFA: "Start Song",
+ 0xFB: "Continue Song",
+ 0xFC: "Stop Song",
+ 0xFE: "Sensing",
+ 0xFF: "Reset"
+}
+
+//MIDI wrapper
+function MIDIInterface( on_ready, on_error )
+{
+ if(!navigator.requestMIDIAccess)
+ {
+ this.error = "not suppoorted";
+ if(on_error)
+ on_error("Not supported");
+ else
+ console.error("MIDI NOT SUPPORTED, enable by chrome://flags");
+ return;
+ }
+
+ this.on_ready = on_ready;
+
+ this.state = {
+ note: [],
+ cc: []
+ };
+
+
+
+ navigator.requestMIDIAccess().then( this.onMIDISuccess.bind(this), this.onMIDIFailure.bind(this) );
+}
+
+MIDIInterface.input = null;
+
+MIDIInterface.MIDIEvent = MIDIEvent;
+
+MIDIInterface.prototype.onMIDISuccess = function(midiAccess)
+{
+ console.log( "MIDI ready!" );
+ console.log( midiAccess );
+ this.midi = midiAccess; // store in the global (in real usage, would probably keep in an object instance)
+ this.updatePorts();
+
+ if (this.on_ready)
+ this.on_ready(this);
+}
+
+MIDIInterface.prototype.updatePorts = function()
+{
+ var midi = this.midi;
+ this.input_ports = midi.inputs;
+ var num = 0;
+
+ var it = this.input_ports.values();
+ var it_value = it.next();
+ while( it_value && it_value.done === false )
+ {
+ var port_info = it_value.value;
+ console.log( "Input port [type:'" + port_info.type + "'] id:'" + port_info.id +
+ "' manufacturer:'" + port_info.manufacturer + "' name:'" + port_info.name +
+ "' version:'" + port_info.version + "'" );
+ num++;
+ it_value = it.next();
+ }
+ this.num_input_ports = num;
+
+ num = 0;
+ this.output_ports = midi.outputs;
+ var it = this.output_ports.values();
+ var it_value = it.next();
+ while( it_value && it_value.done === false )
+ {
+ var port_info = it_value.value;
+ console.log( "Output port [type:'" + port_info.type + "'] id:'" + port_info.id +
+ "' manufacturer:'" + port_info.manufacturer + "' name:'" + port_info.name +
+ "' version:'" + port_info.version + "'" );
+ num++;
+ it_value = it.next();
+ }
+ this.num_output_ports = num;
+
+
+ /* OLD WAY
+ for (var i = 0; i < this.input_ports.size; ++i) {
+ var input = this.input_ports.get(i);
+ if(!input)
+ continue; //sometimes it is null?!
+ console.log( "Input port [type:'" + input.type + "'] id:'" + input.id +
+ "' manufacturer:'" + input.manufacturer + "' name:'" + input.name +
+ "' version:'" + input.version + "'" );
+ num++;
+ }
+ this.num_input_ports = num;
+
+
+ num = 0;
+ this.output_ports = midi.outputs;
+ for (var i = 0; i < this.output_ports.size; ++i) {
+ var output = this.output_ports.get(i);
+ if(!output)
+ continue;
+ console.log( "Output port [type:'" + output.type + "'] id:'" + output.id +
+ "' manufacturer:'" + output.manufacturer + "' name:'" + output.name +
+ "' version:'" + output.version + "'" );
+ num++;
+ }
+ this.num_output_ports = num;
+ */
+}
+
+MIDIInterface.prototype.onMIDIFailure = function(msg)
+{
+ console.error( "Failed to get MIDI access - " + msg );
+}
+
+MIDIInterface.prototype.openInputPort = function( port, callback )
+{
+ var input_port = this.input_ports.get( "input-" + port );
+ if(!input_port)
+ return false;
+ MIDIInterface.input = this;
+ var that = this;
+
+ input_port.onmidimessage = function(a) {
+ var midi_event = new MIDIEvent(a.data);
+ that.updateState( midi_event );
+ if(callback)
+ callback(a.data, midi_event );
+ if(MIDIInterface.on_message)
+ MIDIInterface.on_message( a.data, midi_event );
+ }
+ console.log("port open: ", input_port);
+ return true;
+}
+
+MIDIInterface.parseMsg = function(data)
+{
+
+}
+
+MIDIInterface.prototype.updateState = function( midi_event )
+{
+ switch( midi_event.cmd )
+ {
+ case MIDIEvent.NOTEON: this.state.note[ midi_event.value1|0 ] = midi_event.value2; break;
+ case MIDIEvent.NOTEOFF: this.state.note[ midi_event.value1|0 ] = 0; break;
+ case MIDIEvent.CONTROLLERCHANGE: this.state.cc[ midi_event.getCC() ] = midi_event.getCCValue(); break;
+ }
+}
+
+MIDIInterface.prototype.sendMIDI = function( port, midi_data )
+{
+ if( !midi_data )
+ return;
+
+ var output_port = this.output_ports.get( "output-" + port );
+ if(!output_port)
+ return;
+
+ MIDIInterface.output = this;
+
+ if( midi_data.constructor === MIDIEvent)
+ output_port.send( midi_data.data );
+ else
+ output_port.send( midi_data );
+}
+
+
+
+function LGMIDIIn()
+{
+ this.addOutput( "on_midi", LiteGraph.EVENT );
+ this.addOutput( "out", "midi" );
+ this.properties = {port: 0};
+ this._last_midi_event = null;
+ this._current_midi_event = null;
+
+ var that = this;
+ new MIDIInterface( function( midi ){
+ //open
+ that._midi = midi;
+ if(that._waiting)
+ that.onStart();
+ that._waiting = false;
+ });
+}
+
+LGMIDIIn.MIDIInterface = MIDIInterface;
+
+LGMIDIIn.title = "MIDI Input";
+LGMIDIIn.desc = "Reads MIDI from a input port";
+
+LGMIDIIn.prototype.getPropertyInfo = function(name)
+{
+ if(!this._midi)
+ return;
+
+ if(name == "port")
+ {
+ var values = {};
+ for (var i = 0; i < this._midi.input_ports.size; ++i)
+ {
+ var input = this._midi.input_ports.get( "input-" + i);
+ values[i] = i + ".- " + input.name + " version:" + input.version;
+ }
+ return { type: "enum", values: values };
+ }
+}
+
+LGMIDIIn.prototype.onStart = function()
+{
+ if(this._midi)
+ this._midi.openInputPort( this.properties.port, this.onMIDIEvent.bind(this) );
+ else
+ this._waiting = true;
+}
+
+LGMIDIIn.prototype.onMIDIEvent = function( data, midi_event )
+{
+ this._last_midi_event = midi_event;
+
+ this.trigger( "on_midi", midi_event );
+ if(midi_event.cmd == MIDIEvent.NOTEON)
+ this.trigger( "on_noteon", midi_event );
+ else if(midi_event.cmd == MIDIEvent.NOTEOFF)
+ this.trigger( "on_noteoff", midi_event );
+ else if(midi_event.cmd == MIDIEvent.CONTROLLERCHANGE)
+ this.trigger( "on_cc", midi_event );
+ else if(midi_event.cmd == MIDIEvent.PROGRAMCHANGE)
+ this.trigger( "on_pc", midi_event );
+ else if(midi_event.cmd == MIDIEvent.PITCHBEND)
+ this.trigger( "on_pitchbend", midi_event );
+}
+
+LGMIDIIn.prototype.onExecute = function()
+{
+ if(this.outputs)
+ {
+ var last = this._last_midi_event;
+ for(var i = 0; i < this.outputs.length; ++i)
+ {
+ var output = this.outputs[i];
+ var v = null;
+ switch (output.name)
+ {
+ case "midi": v = this._midi; break;
+ case "last_midi": v = last; break;
+ default:
+ continue;
+ }
+ this.setOutputData( i, v );
+ }
+ }
+}
+
+LGMIDIIn.prototype.onGetOutputs = function() {
+ return [
+ ["last_midi","midi"],
+ ["on_midi",LiteGraph.EVENT],
+ ["on_noteon",LiteGraph.EVENT],
+ ["on_noteoff",LiteGraph.EVENT],
+ ["on_cc",LiteGraph.EVENT],
+ ["on_pc",LiteGraph.EVENT],
+ ["on_pitchbend",LiteGraph.EVENT]
+ ];
+}
+
+LiteGraph.registerNodeType("midi/input", LGMIDIIn);
+
+
+function LGMIDIOut()
+{
+ this.addInput( "send", LiteGraph.EVENT );
+ this.properties = {port: 0};
+
+ var that = this;
+ new MIDIInterface( function( midi ){
+ that._midi = midi;
+ });
+}
+
+LGMIDIOut.MIDIInterface = MIDIInterface;
+
+LGMIDIOut.title = "MIDI Output";
+LGMIDIOut.desc = "Sends MIDI to output channel";
+
+LGMIDIOut.prototype.getPropertyInfo = function(name)
+{
+ if(!this._midi)
+ return;
+
+ if(name == "port")
+ {
+ var values = {};
+ for (var i = 0; i < this._midi.output_ports.size; ++i)
+ {
+ var output = this._midi.output_ports.get(i);
+ values[i] = i + ".- " + output.name + " version:" + output.version;
+ }
+ return { type: "enum", values: values };
+ }
+}
+
+
+LGMIDIOut.prototype.onAction = function(event, midi_event )
+{
+ console.log(midi_event);
+ if(!this._midi)
+ return;
+ if(event == "send")
+ this._midi.sendMIDI( this.port, midi_event );
+ this.trigger("midi",midi_event);
+}
+
+LGMIDIOut.prototype.onGetInputs = function() {
+ return [["send",LiteGraph.ACTION]];
+}
+
+LGMIDIOut.prototype.onGetOutputs = function() {
+ return [["on_midi",LiteGraph.EVENT]];
+}
+
+LiteGraph.registerNodeType("midi/output", LGMIDIOut);
+
+
+function LGMIDIShow()
+{
+ this.addInput( "on_midi", LiteGraph.EVENT );
+ this._str = "";
+ this.size = [200,40]
+}
+
+LGMIDIShow.title = "MIDI Show";
+LGMIDIShow.desc = "Shows MIDI in the graph";
+
+LGMIDIShow.prototype.onAction = function(event, midi_event )
+{
+ if(!midi_event)
+ return;
+ if(midi_event.constructor === MIDIEvent)
+ this._str = midi_event.toString();
+ else
+ this._str = "???";
+}
+
+LGMIDIShow.prototype.onDrawForeground = function( ctx )
+{
+ if( !this._str )
+ return;
+
+ ctx.font = "30px Arial";
+ ctx.fillText( this._str, 10, this.size[1] * 0.8 );
+}
+
+LGMIDIShow.prototype.onGetInputs = function() {
+ return [["in",LiteGraph.ACTION]];
+}
+
+LGMIDIShow.prototype.onGetOutputs = function() {
+ return [["on_midi",LiteGraph.EVENT]];
+}
+
+LiteGraph.registerNodeType("midi/show", LGMIDIShow);
+
+
+
+function LGMIDIFilter()
+{
+ this.properties = {
+ channel: -1,
+ cmd: -1,
+ min_value: -1,
+ max_value: -1
+ };
+
+ this.addInput( "in", LiteGraph.EVENT );
+ this.addOutput( "on_midi", LiteGraph.EVENT );
+}
+
+LGMIDIFilter.title = "MIDI Filter";
+LGMIDIFilter.desc = "Filters MIDI messages";
+
+LGMIDIFilter.prototype.onAction = function(event, midi_event )
+{
+ if(!midi_event || midi_event.constructor !== MIDIEvent)
+ return;
+
+ if( this.properties.channel != -1 && midi_event.channel != this.properties.channel)
+ return;
+ if(this.properties.cmd != -1 && midi_event.cmd != this.properties.cmd)
+ return;
+ if(this.properties.min_value != -1 && midi_event.data[1] < this.properties.min_value)
+ return;
+ if(this.properties.max_value != -1 && midi_event.data[1] > this.properties.max_value)
+ return;
+ this.trigger("on_midi",midi_event);
+}
+
+LiteGraph.registerNodeType("midi/filter", LGMIDIFilter);
+
+
+function LGMIDIEvent()
+{
+ this.properties = {
+ channel: 0,
+ cmd: "CC",
+ value1: 1,
+ value2: 1
+ };
+
+ this.addInput( "send", LiteGraph.EVENT );
+ this.addInput( "assign", LiteGraph.EVENT );
+ this.addOutput( "on_midi", LiteGraph.EVENT );
+}
+
+LGMIDIEvent.title = "MIDIEvent";
+LGMIDIEvent.desc = "Create a MIDI Event";
+
+LGMIDIEvent.prototype.onAction = function( event, midi_event )
+{
+ if(event == "assign")
+ {
+ this.properties.channel = midi_event.channel;
+ this.properties.cmd = midi_event.cmd;
+ this.properties.value1 = midi_event.data[1];
+ this.properties.value2 = midi_event.data[2];
+ return;
+ }
+
+ //send
+ var midi_event = new MIDIEvent();
+ midi_event.channel = this.properties.channel;
+ if(this.properties.cmd && this.properties.cmd.constructor === String)
+ midi_event.setCommandFromString( this.properties.cmd );
+ else
+ midi_event.cmd = this.properties.cmd;
+ midi_event.data[0] = midi_event.cmd | midi_event.channel;
+ midi_event.data[1] = Number(this.properties.value1);
+ midi_event.data[2] = Number(this.properties.value2);
+ this.trigger("on_midi",midi_event);
+}
+
+LGMIDIEvent.prototype.onExecute = function()
+{
+ var props = this.properties;
+
+ if(this.outputs)
+ {
+ for(var i = 0; i < this.outputs.length; ++i)
+ {
+ var output = this.outputs[i];
+ var v = null;
+ switch (output.name)
+ {
+ case "midi":
+ v = new MIDIEvent();
+ v.setup([ props.cmd, props.value1, props.value2 ]);
+ v.channel = props.channel;
+ break;
+ case "command": v = props.cmd; break;
+ case "cc": v = props.value1; break;
+ case "cc_value": v = props.value2; break;
+ case "note": v = (props.cmd == MIDIEvent.NOTEON || props.cmd == MIDIEvent.NOTEOFF) ? props.value1 : null; break;
+ case "velocity": v = props.cmd == MIDIEvent.NOTEON ? props.value2 : null; break;
+ case "pitch": v = props.cmd == MIDIEvent.NOTEON ? MIDIEvent.computePitch( props.value1 ) : null; break;
+ case "pitchbend": v = props.cmd == MIDIEvent.PITCHBEND ? MIDIEvent.computePitchBend( props.value1, props.value2 ) : null; break;
+ default:
+ continue;
+ }
+ if(v !== null)
+ this.setOutputData( i, v );
+ }
+ }
+}
+
+LGMIDIEvent.prototype.onPropertyChanged = function(name,value)
+{
+ if(name == "cmd")
+ this.properties.cmd = MIDIEvent.computeCommandFromString( value );
+}
+
+
+LGMIDIEvent.prototype.onGetOutputs = function() {
+ return [
+ ["midi","midi"],
+ ["on_midi",LiteGraph.EVENT],
+ ["command","number"],
+ ["note","number"],
+ ["velocity","number"],
+ ["cc","number"],
+ ["cc_value","number"],
+ ["pitch","number"],
+ ["pitchbend","number"]
+ ];
+}
+
+
+LiteGraph.registerNodeType("midi/event", LGMIDIEvent);
+
+
+function LGMIDICC()
+{
+ this.properties = {
+// channel: 0,
+ cc: 1,
+ value: 0
+ };
+
+ this.addOutput( "value", "number" );
+}
+
+LGMIDICC.title = "MIDICC";
+LGMIDICC.desc = "gets a Controller Change";
+
+LGMIDICC.prototype.onExecute = function()
+{
+ var props = this.properties;
+ if( MIDIInterface.input )
+ this.properties.value = MIDIInterface.input.state.cc[ this.properties.cc ];
+ this.setOutputData( 0, this.properties.value );
+}
+
+LiteGraph.registerNodeType("midi/cc", LGMIDICC);
+
+
+
+
+function now() { return window.performance.now() }
+
})( this );
-(function( global )
-{
-var LiteGraph = global.LiteGraph;
-
-var LGAudio = {};
-global.LGAudio = LGAudio;
-
-LGAudio.getAudioContext = function()
-{
- if(!this._audio_context)
- {
- window.AudioContext = window.AudioContext || window.webkitAudioContext;
- if(!window.AudioContext)
- {
- console.error("AudioContext not supported by browser");
- return null;
- }
- this._audio_context = new AudioContext();
- this._audio_context.onmessage = function(msg) { console.log("msg",msg);};
- this._audio_context.onended = function(msg) { console.log("ended",msg);};
- this._audio_context.oncomplete = function(msg) { console.log("complete",msg);};
- }
-
- //in case it crashes
- //if(this._audio_context.state == "suspended")
- // this._audio_context.resume();
- return this._audio_context;
-}
-
-LGAudio.connect = function( audionodeA, audionodeB )
-{
- try
- {
- audionodeA.connect( audionodeB );
- }
- catch (err)
- {
- console.warn("LGraphAudio:",err);
- }
-}
-
-LGAudio.disconnect = function( audionodeA, audionodeB )
-{
- try
- {
- audionodeA.disconnect( audionodeB );
- }
- catch (err)
- {
- console.warn("LGraphAudio:",err);
- }
-}
-
-LGAudio.changeAllAudiosConnections = function( node, connect )
-{
- if(node.inputs)
- {
- for(var i = 0; i < node.inputs.length; ++i)
- {
- var input = node.inputs[i];
- var link_info = node.graph.links[ input.link ];
- if(!link_info)
- continue;
-
- var origin_node = node.graph.getNodeById( link_info.origin_id );
- var origin_audionode = null;
- if( origin_node.getAudioNodeInOutputSlot )
- origin_audionode = origin_node.getAudioNodeInOutputSlot( link_info.origin_slot );
- else
- origin_audionode = origin_node.audionode;
-
- var target_audionode = null;
- if( node.getAudioNodeInInputSlot )
- target_audionode = node.getAudioNodeInInputSlot( i );
- else
- target_audionode = node.audionode;
-
- if(connect)
- LGAudio.connect( origin_audionode, target_audionode );
- else
- LGAudio.disconnect( origin_audionode, target_audionode );
- }
- }
-
- if(node.outputs)
- {
- for(var i = 0; i < node.outputs.length; ++i)
- {
- var output = node.outputs[i];
- for(var j = 0; j < output.links.length; ++j)
- {
- var link_info = node.graph.links[ output.links[j] ];
- if(!link_info)
- continue;
-
- var origin_audionode = null;
- if( node.getAudioNodeInOutputSlot )
- origin_audionode = node.getAudioNodeInOutputSlot( i );
- else
- origin_audionode = node.audionode;
-
- var target_node = node.graph.getNodeById( link_info.target_id );
- var target_audionode = null;
- if( target_node.getAudioNodeInInputSlot )
- target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
- else
- target_audionode = target_node.audionode;
-
- if(connect)
- LGAudio.connect( origin_audionode, target_audionode );
- else
- LGAudio.disconnect( origin_audionode, target_audionode );
- }
- }
- }
-}
-
-//used by many nodes
-LGAudio.onConnectionsChange = function( connection, slot, connected, link_info )
-{
- //only process the outputs events
- if(connection != LiteGraph.OUTPUT)
- return;
-
- var target_node = null;
- if( link_info )
- target_node = this.graph.getNodeById( link_info.target_id );
-
- if( !target_node )
- return;
-
- //get origin audionode
- var local_audionode = null;
- if(this.getAudioNodeInOutputSlot)
- local_audionode = this.getAudioNodeInOutputSlot( slot );
- else
- local_audionode = this.audionode;
-
- //get target audionode
- var target_audionode = null;
- if(target_node.getAudioNodeInInputSlot)
- target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
- else
- target_audionode = target_node.audionode;
-
- //do the connection/disconnection
- if( connected )
- LGAudio.connect( local_audionode, target_audionode );
- else
- LGAudio.disconnect( local_audionode, target_audionode );
-}
-
-//this function helps creating wrappers to existing classes
-LGAudio.createAudioNodeWrapper = function( class_object )
-{
- var old_func = class_object.prototype.onPropertyChanged;
-
- class_object.prototype.onPropertyChanged = function(name, value)
- {
- if(old_func)
- old_func.call(this,name,value);
-
- if(!this.audionode)
- return;
-
- if( this.audionode[ name ] === undefined )
- return;
-
- if( this.audionode[ name ].value !== undefined )
- this.audionode[ name ].value = value;
- else
- this.audionode[ name ] = value;
- }
-
- class_object.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
-}
-
-//contains the samples decoded of the loaded audios in AudioBuffer format
-LGAudio.cached_audios = {};
-
-LGAudio.loadSound = function( url, on_complete, on_error )
-{
- if( LGAudio.cached_audios[ url ] && url.indexOf("blob:") == -1 )
- {
- if(on_complete)
- on_complete( LGAudio.cached_audios[ url ] );
- return;
- }
-
- if( LGAudio.onProcessAudioURL )
- url = LGAudio.onProcessAudioURL( url );
-
- //load new sample
- var request = new XMLHttpRequest();
- request.open('GET', url, true);
- request.responseType = 'arraybuffer';
-
- var context = LGAudio.getAudioContext();
-
- // Decode asynchronously
- request.onload = function() {
- console.log("AudioSource loaded");
- context.decodeAudioData( request.response, function( buffer ) {
- console.log("AudioSource decoded");
- LGAudio.cached_audios[ url ] = buffer;
- if(on_complete)
- on_complete( buffer );
- }, onError);
- }
- request.send();
-
- function onError(err)
- {
- console.log("Audio loading sample error:",err);
- if(on_error)
- on_error(err);
- }
-
- return request;
-}
-
-
-//****************************************************
-
-function LGAudioSource()
-{
- this.properties = {
- src: "",
- gain: 0.5,
- loop: true,
- autoplay: true,
- playbackRate: 1
- };
-
- this._loading_audio = false;
- this._audiobuffer = null; //points to AudioBuffer with the audio samples decoded
- this._audionodes = [];
- this._last_sourcenode = null; //the last AudioBufferSourceNode (there could be more if there are several sounds playing)
-
- this.addOutput( "out", "audio" );
- this.addInput( "gain", "number" );
-
- //init context
- var context = LGAudio.getAudioContext();
-
- //create gain node to control volume
- this.audionode = context.createGain();
- this.audionode.graphnode = this;
- this.audionode.gain.value = this.properties.gain;
-
- //debug
- if(this.properties.src)
- this.loadSound( this.properties.src );
-}
-
-LGAudioSource["@src"] = { widget: "resource" };
-LGAudioSource.supported_extensions = ["wav","ogg","mp3"];
-
-
-LGAudioSource.prototype.onAdded = function(graph)
-{
- if(graph.status === LGraph.STATUS_RUNNING)
- this.onStart();
-}
-
-LGAudioSource.prototype.onStart = function()
-{
- if(!this._audiobuffer)
- return;
-
- if(this.properties.autoplay)
- this.playBuffer( this._audiobuffer );
-}
-
-LGAudioSource.prototype.onStop = function()
-{
- this.stopAllSounds();
-}
-
-LGAudioSource.prototype.onPause = function()
-{
- this.pauseAllSounds();
-}
-
-LGAudioSource.prototype.onUnpause = function()
-{
- this.unpauseAllSounds();
- //this.onStart();
-}
-
-
-LGAudioSource.prototype.onRemoved = function()
-{
- this.stopAllSounds();
- if(this._dropped_url)
- URL.revokeObjectURL( this._url );
-}
-
-LGAudioSource.prototype.stopAllSounds = function()
-{
- //iterate and stop
- for(var i = 0; i < this._audionodes.length; ++i )
- {
- if(this._audionodes[i].started)
- {
- this._audionodes[i].started = false;
- this._audionodes[i].stop();
- }
- //this._audionodes[i].disconnect( this.audionode );
- }
- this._audionodes.length = 0;
-}
-
-LGAudioSource.prototype.pauseAllSounds = function()
-{
- LGAudio.getAudioContext().suspend();
-}
-
-LGAudioSource.prototype.unpauseAllSounds = function()
-{
- LGAudio.getAudioContext().resume();
-}
-
-LGAudioSource.prototype.onExecute = function()
-{
- if(this.inputs)
- for(var i = 0; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- if(input.link == null)
- continue;
- var v = this.getInputData(i);
- if( v === undefined )
- continue;
- if( input.name == "gain" )
- this.audionode.gain.value = v;
- else if( input.name == "playbackRate" )
- {
- this.properties.playbackRate = v;
- for(var j = 0; j < this._audionodes.length; ++j)
- this._audionodes[j].playbackRate.value = v;
- }
- }
-
- if(this.outputs)
- for(var i = 0; i < this.outputs.length; ++i)
- {
- var output = this.outputs[i];
- if( output.name == "buffer" && this._audiobuffer )
- this.setOutputData( i, this._audiobuffer );
- }
-}
-
-LGAudioSource.prototype.onAction = function(event)
-{
- if(this._audiobuffer)
- {
- if(event == "Play")
- this.playBuffer(this._audiobuffer);
- else if(event == "Stop")
- this.stopAllSounds();
- }
-}
-
-LGAudioSource.prototype.onPropertyChanged = function( name, value )
-{
- if( name == "src" )
- this.loadSound( value );
- else if(name == "gain")
- this.audionode.gain.value = value;
- else if(name == "playbackRate")
- {
- for(var j = 0; j < this._audionodes.length; ++j)
- this._audionodes[j].playbackRate.value = value;
- }
-}
-
-LGAudioSource.prototype.playBuffer = function( buffer )
-{
- var that = this;
- var context = LGAudio.getAudioContext();
-
- //create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
- var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
- this._last_sourcenode = audionode;
- audionode.graphnode = this;
- audionode.buffer = buffer;
- audionode.loop = this.properties.loop;
- audionode.playbackRate.value = this.properties.playbackRate;
- this._audionodes.push( audionode );
- audionode.connect( this.audionode ); //connect to gain
- this._audionodes.push( audionode );
-
- audionode.onended = function()
- {
- //console.log("ended!");
- that.trigger("ended");
- //remove
- var index = that._audionodes.indexOf( audionode );
- if(index != -1)
- that._audionodes.splice(index,1);
- }
-
- if(!audionode.started)
- {
- audionode.started = true;
- audionode.start();
- }
- return audionode;
-}
-
-LGAudioSource.prototype.loadSound = function( url )
-{
- var that = this;
-
- //kill previous load
- if(this._request)
- {
- this._request.abort();
- this._request = null;
- }
-
- this._audiobuffer = null; //points to the audiobuffer once the audio is loaded
- this._loading_audio = false;
-
- if(!url)
- return;
-
- this._request = LGAudio.loadSound( url, inner );
-
- this._loading_audio = true;
- this.boxcolor = "#AA4";
-
- function inner( buffer )
- {
- this.boxcolor = LiteGraph.NODE_DEFAULT_BOXCOLOR;
- that._audiobuffer = buffer;
- that._loading_audio = false;
- //if is playing, then play it
- if(that.graph && that.graph.status === LGraph.STATUS_RUNNING)
- that.onStart(); //this controls the autoplay already
- }
-}
-
-//Helps connect/disconnect AudioNodes when new connections are made in the node
-LGAudioSource.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
-
-LGAudioSource.prototype.onGetInputs = function()
-{
- return [["playbackRate","number"],["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
-}
-
-LGAudioSource.prototype.onGetOutputs = function()
-{
- return [["buffer","audiobuffer"],["ended",LiteGraph.EVENT]];
-}
-
-LGAudioSource.prototype.onDropFile = function(file)
-{
- if(this._dropped_url)
- URL.revokeObjectURL( this._dropped_url );
- var url = URL.createObjectURL( file );
- this.properties.src = url;
- this.loadSound( url );
- this._dropped_url = url;
-}
-
-
-LGAudioSource.title = "Source";
-LGAudioSource.desc = "Plays audio";
-LiteGraph.registerNodeType("audio/source", LGAudioSource);
-
-
-//*****************************************************
-
-function LGAudioAnalyser()
-{
- this.properties = {
- fftSize: 2048,
- minDecibels: -100,
- maxDecibels: -10,
- smoothingTimeConstant: 0.5
- };
-
- var context = LGAudio.getAudioContext();
-
- this.audionode = context.createAnalyser();
- this.audionode.graphnode = this;
- this.audionode.fftSize = this.properties.fftSize;
- this.audionode.minDecibels = this.properties.minDecibels;
- this.audionode.maxDecibels = this.properties.maxDecibels;
- this.audionode.smoothingTimeConstant = this.properties.smoothingTimeConstant;
-
- this.addInput("in","audio");
- this.addOutput("freqs","array");
- this.addOutput("samples","array");
-
- this._freq_bin = null;
- this._time_bin = null;
-}
-
-LGAudioAnalyser.prototype.onPropertyChanged = function(name, value)
-{
- this.audionode[ name ] = value;
-}
-
-LGAudioAnalyser.prototype.onExecute = function()
-{
- if(this.isOutputConnected(0))
- {
- //send FFT
- var bufferLength = this.audionode.frequencyBinCount;
- if( !this._freq_bin || this._freq_bin.length != bufferLength )
- this._freq_bin = new Uint8Array( bufferLength );
- this.audionode.getByteFrequencyData( this._freq_bin );
- this.setOutputData(0,this._freq_bin);
- }
-
- //send analyzer
- if(this.isOutputConnected(1))
- {
- //send Samples
- var bufferLength = this.audionode.frequencyBinCount;
- if( !this._time_bin || this._time_bin.length != bufferLength )
- this._time_bin = new Uint8Array( bufferLength );
- this.audionode.getByteTimeDomainData( this._time_bin );
- this.setOutputData(1,this._time_bin);
- }
-
-
- //properties
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- if(input.link == null)
- continue;
- var v = this.getInputData(i);
- if (v !== undefined)
- this.audionode[ input.name ].value = v;
- }
-
-
-
- //time domain
- //this.audionode.getFloatTimeDomainData( dataArray );
-}
-
-LGAudioAnalyser.prototype.onGetInputs = function()
-{
- return [["minDecibels","number"],["maxDecibels","number"],["smoothingTimeConstant","number"]];
-}
-
-LGAudioAnalyser.prototype.onGetOutputs = function()
-{
- return [["freqs","array"],["samples","array"]];
-}
-
-
-LGAudioAnalyser.title = "Analyser";
-LGAudioAnalyser.desc = "Audio Analyser";
-LiteGraph.registerNodeType( "audio/analyser", LGAudioAnalyser );
-
-//*****************************************************
-
-function LGAudioGain()
-{
- //default
- this.properties = {
- gain: 1
- };
-
- this.audionode = LGAudio.getAudioContext().createGain();
- this.addInput("in","audio");
- this.addInput("gain","number");
- this.addOutput("out","audio");
-}
-
-LGAudioGain.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
-
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- var v = this.getInputData(i);
- if(v !== undefined)
- this.audionode[ input.name ].value = v;
- }
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioGain );
-
-LGAudioGain.title = "Gain";
-LGAudioGain.desc = "Audio gain";
-LiteGraph.registerNodeType("audio/gain", LGAudioGain);
-
-
-function LGAudioConvolver()
-{
- //default
- this.properties = {
- impulse_src:"",
- normalize: true
- };
-
- this.audionode = LGAudio.getAudioContext().createConvolver();
- this.addInput("in","audio");
- this.addOutput("out","audio");
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioConvolver );
-
-LGAudioConvolver.prototype.onRemove = function()
-{
- if(this._dropped_url)
- URL.revokeObjectURL( this._dropped_url );
-}
-
-LGAudioConvolver.prototype.onPropertyChanged = function( name, value )
-{
- if( name == "impulse_src" )
- this.loadImpulse( value );
- else if( name == "normalize" )
- this.audionode.normalize = value;
-}
-
-LGAudioConvolver.prototype.onDropFile = function(file)
-{
- if(this._dropped_url)
- URL.revokeObjectURL( this._dropped_url );
- this._dropped_url = URL.createObjectURL( file );
- this.properties.impulse_src = this._dropped_url;
- this.loadImpulse( this._dropped_url );
-}
-
-LGAudioConvolver.prototype.loadImpulse = function( url )
-{
- var that = this;
-
- //kill previous load
- if(this._request)
- {
- this._request.abort();
- this._request = null;
- }
-
- this._impulse_buffer = null;
- this._loading_impulse = false;
-
- if(!url)
- return;
-
- //load new sample
- this._request = LGAudio.loadSound( url, inner );
- this._loading_impulse = true;
-
- // Decode asynchronously
- function inner( buffer ) {
- that._impulse_buffer = buffer;
- that.audionode.buffer = buffer;
- console.log("Impulse signal set");
- that._loading_impulse = false;
- }
-}
-
-LGAudioConvolver.title = "Convolver";
-LGAudioConvolver.desc = "Convolves the signal (used for reverb)";
-LiteGraph.registerNodeType("audio/convolver", LGAudioConvolver);
-
-
-function LGAudioDynamicsCompressor()
-{
- //default
- this.properties = {
- threshold: -50,
- knee: 40,
- ratio: 12,
- reduction: -20,
- attack: 0,
- release: 0.25
- };
-
- this.audionode = LGAudio.getAudioContext().createDynamicsCompressor();
- this.addInput("in","audio");
- this.addOutput("out","audio");
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioDynamicsCompressor );
-
-LGAudioDynamicsCompressor.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- if(input.link == null)
- continue;
- var v = this.getInputData(i);
- if(v !== undefined)
- this.audionode[ input.name ].value = v;
- }
-}
-
-LGAudioDynamicsCompressor.prototype.onGetInputs = function()
-{
- return [["threshold","number"],["knee","number"],["ratio","number"],["reduction","number"],["attack","number"],["release","number"]];
-}
-
-LGAudioDynamicsCompressor.title = "DynamicsCompressor";
-LGAudioDynamicsCompressor.desc = "Dynamics Compressor";
-LiteGraph.registerNodeType("audio/dynamicsCompressor", LGAudioDynamicsCompressor);
-
-
-function LGAudioWaveShaper()
-{
- //default
- this.properties = {
- };
-
- this.audionode = LGAudio.getAudioContext().createWaveShaper();
- this.addInput("in","audio");
- this.addInput("shape","waveshape");
- this.addOutput("out","audio");
-}
-
-LGAudioWaveShaper.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
- var v = this.getInputData(1);
- if(v === undefined)
- return;
- this.audionode.curve = v;
-}
-
-LGAudioWaveShaper.prototype.setWaveShape = function(shape)
-{
- this.audionode.curve = shape;
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioWaveShaper );
-
-/* disabled till I dont find a way to do a wave shape
-LGAudioWaveShaper.title = "WaveShaper";
-LGAudioWaveShaper.desc = "Distortion using wave shape";
-LiteGraph.registerNodeType("audio/waveShaper", LGAudioWaveShaper);
-*/
-
-function LGAudioMixer()
-{
- //default
- this.properties = {
- gain1: 0.5,
- gain2: 0.5
- };
-
- this.audionode = LGAudio.getAudioContext().createGain();
-
- this.audionode1 = LGAudio.getAudioContext().createGain();
- this.audionode1.gain.value = this.properties.gain1;
- this.audionode2 = LGAudio.getAudioContext().createGain();
- this.audionode2.gain.value = this.properties.gain2;
-
- this.audionode1.connect( this.audionode );
- this.audionode2.connect( this.audionode );
-
- this.addInput("in1","audio");
- this.addInput("in1 gain","number");
- this.addInput("in2","audio");
- this.addInput("in2 gain","number");
-
- this.addOutput("out","audio");
-}
-
-LGAudioMixer.prototype.getAudioNodeInInputSlot = function( slot )
-{
- if(slot == 0)
- return this.audionode1;
- else if(slot == 2)
- return this.audionode2;
-}
-
-LGAudioMixer.prototype.onPropertyChanged = function( name, value )
-{
- if( name == "gain1" )
- this.audionode1.gain.value = value;
- else if( name == "gain2" )
- this.audionode2.gain.value = value;
-}
-
-
-LGAudioMixer.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
-
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
-
- if(input.link == null || input.type == "audio")
- continue;
-
- var v = this.getInputData(i);
- if(v === undefined)
- continue;
-
- if(i == 1)
- this.audionode1.gain.value = v;
- else if(i == 3)
- this.audionode2.gain.value = v;
- }
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioMixer );
-
-LGAudioMixer.title = "Mixer";
-LGAudioMixer.desc = "Audio mixer";
-LiteGraph.registerNodeType("audio/mixer", LGAudioMixer);
-
-
-function LGAudioDelay()
-{
- //default
- this.properties = {
- delayTime: 0.5
- };
-
- this.audionode = LGAudio.getAudioContext().createDelay( 10 );
- this.audionode.delayTime.value = this.properties.delayTime;
- this.addInput("in","audio");
- this.addInput("time","number");
- this.addOutput("out","audio");
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioDelay );
-
-LGAudioDelay.prototype.onExecute = function()
-{
- var v = this.getInputData(1);
- if(v !== undefined )
- this.audionode.delayTime.value = v;
-}
-
-LGAudioDelay.title = "Delay";
-LGAudioDelay.desc = "Audio delay";
-LiteGraph.registerNodeType("audio/delay", LGAudioDelay);
-
-
-function LGAudioBiquadFilter()
-{
- //default
- this.properties = {
- frequency: 350,
- detune: 0,
- Q: 1
- };
- this.addProperty("type","lowpass","enum",{values:["lowpass","highpass","bandpass","lowshelf","highshelf","peaking","notch","allpass"]});
-
- //create node
- this.audionode = LGAudio.getAudioContext().createBiquadFilter();
-
- //slots
- this.addInput("in","audio");
- this.addOutput("out","audio");
-}
-
-LGAudioBiquadFilter.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
-
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- if(input.link == null)
- continue;
- var v = this.getInputData(i);
- if(v !== undefined)
- this.audionode[ input.name ].value = v;
- }
-}
-
-LGAudioBiquadFilter.prototype.onGetInputs = function()
-{
- return [["frequency","number"],["detune","number"],["Q","number"]];
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioBiquadFilter );
-
-LGAudioBiquadFilter.title = "BiquadFilter";
-LGAudioBiquadFilter.desc = "Audio filter";
-LiteGraph.registerNodeType("audio/biquadfilter", LGAudioBiquadFilter);
-
-
-
-
-function LGAudioOscillatorNode()
-{
- //default
- this.properties = {
- frequency: 440,
- detune: 0,
- type: "sine"
- };
- this.addProperty("type","sine","enum",{values:["sine","square","sawtooth","triangle","custom"]});
-
- //create node
- this.audionode = LGAudio.getAudioContext().createOscillator();
-
- //slots
- this.addOutput("out","audio");
-}
-
-LGAudioOscillatorNode.prototype.onStart = function()
-{
- if(!this.audionode.started)
- {
- this.audionode.started = true;
- this.audionode.start();
- }
-}
-
-LGAudioOscillatorNode.prototype.onStop = function()
-{
- if(this.audionode.started)
- {
- this.audionode.started = false;
- this.audionode.stop();
- }
-}
-
-LGAudioOscillatorNode.prototype.onPause = function()
-{
- this.onStop();
-}
-
-LGAudioOscillatorNode.prototype.onUnpause = function()
-{
- this.onStart();
-}
-
-LGAudioOscillatorNode.prototype.onExecute = function()
-{
- if(!this.inputs || !this.inputs.length)
- return;
-
- for(var i = 0; i < this.inputs.length; ++i)
- {
- var input = this.inputs[i];
- if(input.link == null)
- continue;
- var v = this.getInputData(i);
- if(v !== undefined)
- this.audionode[ input.name ].value = v;
- }
-}
-
-LGAudioOscillatorNode.prototype.onGetInputs = function()
-{
- return [["frequency","number"],["detune","number"],["type","string"]];
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioOscillatorNode );
-
-LGAudioOscillatorNode.title = "Oscillator";
-LGAudioOscillatorNode.desc = "Oscillator";
-LiteGraph.registerNodeType("audio/oscillator", LGAudioOscillatorNode);
-
-
-//*****************************************************
-
-//EXTRA
-
-
-function LGAudioVisualization()
-{
- this.properties = {
- continuous: true,
- mark: -1
- };
-
- this.addInput("data","array");
- this.addInput("mark","number");
- this.size = [300,200];
- this._last_buffer = null;
-}
-
-LGAudioVisualization.prototype.onExecute = function()
-{
- this._last_buffer = this.getInputData(0);
- var v = this.getInputData(1);
- if(v !== undefined)
- this.properties.mark = v;
- this.setDirtyCanvas(true,false);
-}
-
-LGAudioVisualization.prototype.onDrawForeground = function(ctx)
-{
- if(!this._last_buffer)
- return;
-
- var buffer = this._last_buffer;
-
- //delta represents how many samples we advance per pixel
- var delta = buffer.length / this.size[0];
- var h = this.size[1];
-
- ctx.fillStyle = "black";
- ctx.fillRect(0,0,this.size[0],this.size[1]);
- ctx.strokeStyle = "white";
- ctx.beginPath();
- var x = 0;
-
- if(this.properties.continuous)
- {
- ctx.moveTo(x,h);
- for(var i = 0; i < buffer.length; i+= delta)
- {
- ctx.lineTo(x,h - (buffer[i|0]/255) * h);
- x++;
- }
- }
- else
- {
- for(var i = 0; i < buffer.length; i+= delta)
- {
- ctx.moveTo(x+0.5,h);
- ctx.lineTo(x+0.5,h - (buffer[i|0]/255) * h);
- x++;
- }
- }
- ctx.stroke();
-
- if(this.properties.mark >= 0)
- {
- var samplerate = LGAudio.getAudioContext().sampleRate;
- var binfreq = samplerate / buffer.length;
- var x = 2 * (this.properties.mark / binfreq) / delta;
- if(x >= this.size[0])
- x = this.size[0]-1;
- ctx.strokeStyle = "red";
- ctx.beginPath();
- ctx.moveTo(x,h);
- ctx.lineTo(x,0);
- ctx.stroke();
- }
-}
-
-LGAudioVisualization.title = "Visualization";
-LGAudioVisualization.desc = "Audio Visualization";
-LiteGraph.registerNodeType("audio/visualization", LGAudioVisualization);
-
-
-function LGAudioBandSignal()
-{
- //default
- this.properties = {
- band: 440,
- amplitude: 1
- };
-
- this.addInput("freqs","array");
- this.addOutput("signal","number");
-}
-
-LGAudioBandSignal.prototype.onExecute = function()
-{
- this._freqs = this.getInputData(0);
- if( !this._freqs )
- return;
-
- var band = this.properties.band;
- var v = this.getInputData(1);
- if(v !== undefined)
- band = v;
-
- var samplerate = LGAudio.getAudioContext().sampleRate;
- var binfreq = samplerate / this._freqs.length;
- var index = 2 * (band / binfreq);
- var v = 0;
- if( index < 0 )
- v = this._freqs[ 0 ];
- if( index >= this._freqs.length )
- v = this._freqs[ this._freqs.length - 1];
- else
- {
- var pos = index|0;
- var v0 = this._freqs[ pos ];
- var v1 = this._freqs[ pos+1 ];
- var f = index - pos;
- v = v0 * (1-f) + v1 * f;
- }
-
- this.setOutputData( 0, (v/255) * this.properties.amplitude );
-}
-
-LGAudioBandSignal.prototype.onGetInputs = function()
-{
- return [["band","number"]];
-}
-
-LGAudioBandSignal.title = "Signal";
-LGAudioBandSignal.desc = "extract the signal of some frequency";
-LiteGraph.registerNodeType("audio/signal", LGAudioBandSignal);
-
-
-function LGAudioScript()
-{
- if(!LGAudioScript.default_code)
- {
- var code = LGAudioScript.default_function.toString();
- var index = code.indexOf("{")+1;
- var index2 = code.lastIndexOf("}");
- LGAudioScript.default_code = code.substr(index, index2 - index);
- }
-
- //default
- this.properties = {
- code: LGAudioScript.default_code
- };
-
- //create node
- var ctx = LGAudio.getAudioContext();
- if(ctx.createScriptProcessor)
- this.audionode = ctx.createScriptProcessor(4096,1,1); //buffer size, input channels, output channels
- else
- {
- console.warn("ScriptProcessorNode deprecated");
- this.audionode = ctx.createGain(); //bypass audio
- }
-
- this.processCode();
- if(!LGAudioScript._bypass_function)
- LGAudioScript._bypass_function = this.audionode.onaudioprocess;
-
- //slots
- this.addInput("in","audio");
- this.addOutput("out","audio");
-}
-
-LGAudioScript.prototype.onAdded = function( graph )
-{
- if(graph.status == LGraph.STATUS_RUNNING)
- this.audionode.onaudioprocess = this._callback;
-}
-
-LGAudioScript["@code"] = { widget: "code" };
-
-LGAudioScript.prototype.onStart = function()
-{
- this.audionode.onaudioprocess = this._callback;
-}
-
-LGAudioScript.prototype.onStop = function()
-{
- this.audionode.onaudioprocess = LGAudioScript._bypass_function;
-}
-
-LGAudioScript.prototype.onPause = function()
-{
- this.audionode.onaudioprocess = LGAudioScript._bypass_function;
-}
-
-LGAudioScript.prototype.onUnpause = function()
-{
- this.audionode.onaudioprocess = this._callback;
-}
-
-LGAudioScript.prototype.onExecute = function()
-{
- //nothing! because we need an onExecute to receive onStart... fix that
-}
-
-LGAudioScript.prototype.onRemoved = function()
-{
- this.audionode.onaudioprocess = LGAudioScript._bypass_function;
-}
-
-LGAudioScript.prototype.processCode = function()
-{
- try
- {
- var func = new Function( "properties", this.properties.code );
- this._script = new func( this.properties );
- this._old_code = this.properties.code;
- this._callback = this._script.onaudioprocess;
- }
- catch (err)
- {
- console.error("Error in onaudioprocess code",err);
- this._callback = LGAudioScript._bypass_function;
- this.audionode.onaudioprocess = this._callback;
- }
-}
-
-LGAudioScript.prototype.onPropertyChanged = function( name, value )
-{
- if(name == "code")
- {
- this.properties.code = value;
- this.processCode();
- if(this.graph && this.graph.status == LGraph.STATUS_RUNNING)
- this.audionode.onaudioprocess = this._callback;
- }
-}
-
-LGAudioScript.default_function = function()
-{
-
-this.onaudioprocess = function(audioProcessingEvent) {
- // The input buffer is the song we loaded earlier
- var inputBuffer = audioProcessingEvent.inputBuffer;
-
- // The output buffer contains the samples that will be modified and played
- var outputBuffer = audioProcessingEvent.outputBuffer;
-
- // Loop through the output channels (in this case there is only one)
- for (var channel = 0; channel < outputBuffer.numberOfChannels; channel++) {
- var inputData = inputBuffer.getChannelData(channel);
- var outputData = outputBuffer.getChannelData(channel);
-
- // Loop through the 4096 samples
- for (var sample = 0; sample < inputBuffer.length; sample++) {
- // make output equal to the same as the input
- outputData[sample] = inputData[sample];
- }
- }
-}
-
-}
-
-LGAudio.createAudioNodeWrapper( LGAudioScript );
-
-LGAudioScript.title = "Script";
-LGAudioScript.desc = "apply script to signal";
-LiteGraph.registerNodeType("audio/script", LGAudioScript);
-
-
-function LGAudioDestination()
-{
- this.audionode = LGAudio.getAudioContext().destination;
- this.addInput("in","audio");
-}
-
-
-LGAudioDestination.title = "Destination";
-LGAudioDestination.desc = "Audio output";
-LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
-
-
-
-
+(function( global )
+{
+var LiteGraph = global.LiteGraph;
+
+var LGAudio = {};
+global.LGAudio = LGAudio;
+
+LGAudio.getAudioContext = function()
+{
+ if(!this._audio_context)
+ {
+ window.AudioContext = window.AudioContext || window.webkitAudioContext;
+ if(!window.AudioContext)
+ {
+ console.error("AudioContext not supported by browser");
+ return null;
+ }
+ this._audio_context = new AudioContext();
+ this._audio_context.onmessage = function(msg) { console.log("msg",msg);};
+ this._audio_context.onended = function(msg) { console.log("ended",msg);};
+ this._audio_context.oncomplete = function(msg) { console.log("complete",msg);};
+ }
+
+ //in case it crashes
+ //if(this._audio_context.state == "suspended")
+ // this._audio_context.resume();
+ return this._audio_context;
+}
+
+LGAudio.connect = function( audionodeA, audionodeB )
+{
+ try
+ {
+ audionodeA.connect( audionodeB );
+ }
+ catch (err)
+ {
+ console.warn("LGraphAudio:",err);
+ }
+}
+
+LGAudio.disconnect = function( audionodeA, audionodeB )
+{
+ try
+ {
+ audionodeA.disconnect( audionodeB );
+ }
+ catch (err)
+ {
+ console.warn("LGraphAudio:",err);
+ }
+}
+
+LGAudio.changeAllAudiosConnections = function( node, connect )
+{
+ if(node.inputs)
+ {
+ for(var i = 0; i < node.inputs.length; ++i)
+ {
+ var input = node.inputs[i];
+ var link_info = node.graph.links[ input.link ];
+ if(!link_info)
+ continue;
+
+ var origin_node = node.graph.getNodeById( link_info.origin_id );
+ var origin_audionode = null;
+ if( origin_node.getAudioNodeInOutputSlot )
+ origin_audionode = origin_node.getAudioNodeInOutputSlot( link_info.origin_slot );
+ else
+ origin_audionode = origin_node.audionode;
+
+ var target_audionode = null;
+ if( node.getAudioNodeInInputSlot )
+ target_audionode = node.getAudioNodeInInputSlot( i );
+ else
+ target_audionode = node.audionode;
+
+ if(connect)
+ LGAudio.connect( origin_audionode, target_audionode );
+ else
+ LGAudio.disconnect( origin_audionode, target_audionode );
+ }
+ }
+
+ if(node.outputs)
+ {
+ for(var i = 0; i < node.outputs.length; ++i)
+ {
+ var output = node.outputs[i];
+ for(var j = 0; j < output.links.length; ++j)
+ {
+ var link_info = node.graph.links[ output.links[j] ];
+ if(!link_info)
+ continue;
+
+ var origin_audionode = null;
+ if( node.getAudioNodeInOutputSlot )
+ origin_audionode = node.getAudioNodeInOutputSlot( i );
+ else
+ origin_audionode = node.audionode;
+
+ var target_node = node.graph.getNodeById( link_info.target_id );
+ var target_audionode = null;
+ if( target_node.getAudioNodeInInputSlot )
+ target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
+ else
+ target_audionode = target_node.audionode;
+
+ if(connect)
+ LGAudio.connect( origin_audionode, target_audionode );
+ else
+ LGAudio.disconnect( origin_audionode, target_audionode );
+ }
+ }
+ }
+}
+
+//used by many nodes
+LGAudio.onConnectionsChange = function( connection, slot, connected, link_info )
+{
+ //only process the outputs events
+ if(connection != LiteGraph.OUTPUT)
+ return;
+
+ var target_node = null;
+ if( link_info )
+ target_node = this.graph.getNodeById( link_info.target_id );
+
+ if( !target_node )
+ return;
+
+ //get origin audionode
+ var local_audionode = null;
+ if(this.getAudioNodeInOutputSlot)
+ local_audionode = this.getAudioNodeInOutputSlot( slot );
+ else
+ local_audionode = this.audionode;
+
+ //get target audionode
+ var target_audionode = null;
+ if(target_node.getAudioNodeInInputSlot)
+ target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
+ else
+ target_audionode = target_node.audionode;
+
+ //do the connection/disconnection
+ if( connected )
+ LGAudio.connect( local_audionode, target_audionode );
+ else
+ LGAudio.disconnect( local_audionode, target_audionode );
+}
+
+//this function helps creating wrappers to existing classes
+LGAudio.createAudioNodeWrapper = function( class_object )
+{
+ var old_func = class_object.prototype.onPropertyChanged;
+
+ class_object.prototype.onPropertyChanged = function(name, value)
+ {
+ if(old_func)
+ old_func.call(this,name,value);
+
+ if(!this.audionode)
+ return;
+
+ if( this.audionode[ name ] === undefined )
+ return;
+
+ if( this.audionode[ name ].value !== undefined )
+ this.audionode[ name ].value = value;
+ else
+ this.audionode[ name ] = value;
+ }
+
+ class_object.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
+}
+
+//contains the samples decoded of the loaded audios in AudioBuffer format
+LGAudio.cached_audios = {};
+
+LGAudio.loadSound = function( url, on_complete, on_error )
+{
+ if( LGAudio.cached_audios[ url ] && url.indexOf("blob:") == -1 )
+ {
+ if(on_complete)
+ on_complete( LGAudio.cached_audios[ url ] );
+ return;
+ }
+
+ if( LGAudio.onProcessAudioURL )
+ url = LGAudio.onProcessAudioURL( url );
+
+ //load new sample
+ var request = new XMLHttpRequest();
+ request.open('GET', url, true);
+ request.responseType = 'arraybuffer';
+
+ var context = LGAudio.getAudioContext();
+
+ // Decode asynchronously
+ request.onload = function() {
+ console.log("AudioSource loaded");
+ context.decodeAudioData( request.response, function( buffer ) {
+ console.log("AudioSource decoded");
+ LGAudio.cached_audios[ url ] = buffer;
+ if(on_complete)
+ on_complete( buffer );
+ }, onError);
+ }
+ request.send();
+
+ function onError(err)
+ {
+ console.log("Audio loading sample error:",err);
+ if(on_error)
+ on_error(err);
+ }
+
+ return request;
+}
+
+
+//****************************************************
+
+function LGAudioSource()
+{
+ this.properties = {
+ src: "",
+ gain: 0.5,
+ loop: true,
+ autoplay: true,
+ playbackRate: 1
+ };
+
+ this._loading_audio = false;
+ this._audiobuffer = null; //points to AudioBuffer with the audio samples decoded
+ this._audionodes = [];
+ this._last_sourcenode = null; //the last AudioBufferSourceNode (there could be more if there are several sounds playing)
+
+ this.addOutput( "out", "audio" );
+ this.addInput( "gain", "number" );
+
+ //init context
+ var context = LGAudio.getAudioContext();
+
+ //create gain node to control volume
+ this.audionode = context.createGain();
+ this.audionode.graphnode = this;
+ this.audionode.gain.value = this.properties.gain;
+
+ //debug
+ if(this.properties.src)
+ this.loadSound( this.properties.src );
+}
+
+LGAudioSource["@src"] = { widget: "resource" };
+LGAudioSource.supported_extensions = ["wav","ogg","mp3"];
+
+
+LGAudioSource.prototype.onAdded = function(graph)
+{
+ if(graph.status === LGraph.STATUS_RUNNING)
+ this.onStart();
+}
+
+LGAudioSource.prototype.onStart = function()
+{
+ if(!this._audiobuffer)
+ return;
+
+ if(this.properties.autoplay)
+ this.playBuffer( this._audiobuffer );
+}
+
+LGAudioSource.prototype.onStop = function()
+{
+ this.stopAllSounds();
+}
+
+LGAudioSource.prototype.onPause = function()
+{
+ this.pauseAllSounds();
+}
+
+LGAudioSource.prototype.onUnpause = function()
+{
+ this.unpauseAllSounds();
+ //this.onStart();
+}
+
+
+LGAudioSource.prototype.onRemoved = function()
+{
+ this.stopAllSounds();
+ if(this._dropped_url)
+ URL.revokeObjectURL( this._url );
+}
+
+LGAudioSource.prototype.stopAllSounds = function()
+{
+ //iterate and stop
+ for(var i = 0; i < this._audionodes.length; ++i )
+ {
+ if(this._audionodes[i].started)
+ {
+ this._audionodes[i].started = false;
+ this._audionodes[i].stop();
+ }
+ //this._audionodes[i].disconnect( this.audionode );
+ }
+ this._audionodes.length = 0;
+}
+
+LGAudioSource.prototype.pauseAllSounds = function()
+{
+ LGAudio.getAudioContext().suspend();
+}
+
+LGAudioSource.prototype.unpauseAllSounds = function()
+{
+ LGAudio.getAudioContext().resume();
+}
+
+LGAudioSource.prototype.onExecute = function()
+{
+ if(this.inputs)
+ for(var i = 0; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ if(input.link == null)
+ continue;
+ var v = this.getInputData(i);
+ if( v === undefined )
+ continue;
+ if( input.name == "gain" )
+ this.audionode.gain.value = v;
+ else if( input.name == "playbackRate" )
+ {
+ this.properties.playbackRate = v;
+ for(var j = 0; j < this._audionodes.length; ++j)
+ this._audionodes[j].playbackRate.value = v;
+ }
+ }
+
+ if(this.outputs)
+ for(var i = 0; i < this.outputs.length; ++i)
+ {
+ var output = this.outputs[i];
+ if( output.name == "buffer" && this._audiobuffer )
+ this.setOutputData( i, this._audiobuffer );
+ }
+}
+
+LGAudioSource.prototype.onAction = function(event)
+{
+ if(this._audiobuffer)
+ {
+ if(event == "Play")
+ this.playBuffer(this._audiobuffer);
+ else if(event == "Stop")
+ this.stopAllSounds();
+ }
+}
+
+LGAudioSource.prototype.onPropertyChanged = function( name, value )
+{
+ if( name == "src" )
+ this.loadSound( value );
+ else if(name == "gain")
+ this.audionode.gain.value = value;
+ else if(name == "playbackRate")
+ {
+ for(var j = 0; j < this._audionodes.length; ++j)
+ this._audionodes[j].playbackRate.value = value;
+ }
+}
+
+LGAudioSource.prototype.playBuffer = function( buffer )
+{
+ var that = this;
+ var context = LGAudio.getAudioContext();
+
+ //create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
+ var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
+ this._last_sourcenode = audionode;
+ audionode.graphnode = this;
+ audionode.buffer = buffer;
+ audionode.loop = this.properties.loop;
+ audionode.playbackRate.value = this.properties.playbackRate;
+ this._audionodes.push( audionode );
+ audionode.connect( this.audionode ); //connect to gain
+ this._audionodes.push( audionode );
+
+ audionode.onended = function()
+ {
+ //console.log("ended!");
+ that.trigger("ended");
+ //remove
+ var index = that._audionodes.indexOf( audionode );
+ if(index != -1)
+ that._audionodes.splice(index,1);
+ }
+
+ if(!audionode.started)
+ {
+ audionode.started = true;
+ audionode.start();
+ }
+ return audionode;
+}
+
+LGAudioSource.prototype.loadSound = function( url )
+{
+ var that = this;
+
+ //kill previous load
+ if(this._request)
+ {
+ this._request.abort();
+ this._request = null;
+ }
+
+ this._audiobuffer = null; //points to the audiobuffer once the audio is loaded
+ this._loading_audio = false;
+
+ if(!url)
+ return;
+
+ this._request = LGAudio.loadSound( url, inner );
+
+ this._loading_audio = true;
+ this.boxcolor = "#AA4";
+
+ function inner( buffer )
+ {
+ this.boxcolor = LiteGraph.NODE_DEFAULT_BOXCOLOR;
+ that._audiobuffer = buffer;
+ that._loading_audio = false;
+ //if is playing, then play it
+ if(that.graph && that.graph.status === LGraph.STATUS_RUNNING)
+ that.onStart(); //this controls the autoplay already
+ }
+}
+
+//Helps connect/disconnect AudioNodes when new connections are made in the node
+LGAudioSource.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
+
+LGAudioSource.prototype.onGetInputs = function()
+{
+ return [["playbackRate","number"],["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
+}
+
+LGAudioSource.prototype.onGetOutputs = function()
+{
+ return [["buffer","audiobuffer"],["ended",LiteGraph.EVENT]];
+}
+
+LGAudioSource.prototype.onDropFile = function(file)
+{
+ if(this._dropped_url)
+ URL.revokeObjectURL( this._dropped_url );
+ var url = URL.createObjectURL( file );
+ this.properties.src = url;
+ this.loadSound( url );
+ this._dropped_url = url;
+}
+
+
+LGAudioSource.title = "Source";
+LGAudioSource.desc = "Plays audio";
+LiteGraph.registerNodeType("audio/source", LGAudioSource);
+
+
+//*****************************************************
+
+function LGAudioAnalyser()
+{
+ this.properties = {
+ fftSize: 2048,
+ minDecibels: -100,
+ maxDecibels: -10,
+ smoothingTimeConstant: 0.5
+ };
+
+ var context = LGAudio.getAudioContext();
+
+ this.audionode = context.createAnalyser();
+ this.audionode.graphnode = this;
+ this.audionode.fftSize = this.properties.fftSize;
+ this.audionode.minDecibels = this.properties.minDecibels;
+ this.audionode.maxDecibels = this.properties.maxDecibels;
+ this.audionode.smoothingTimeConstant = this.properties.smoothingTimeConstant;
+
+ this.addInput("in","audio");
+ this.addOutput("freqs","array");
+ this.addOutput("samples","array");
+
+ this._freq_bin = null;
+ this._time_bin = null;
+}
+
+LGAudioAnalyser.prototype.onPropertyChanged = function(name, value)
+{
+ this.audionode[ name ] = value;
+}
+
+LGAudioAnalyser.prototype.onExecute = function()
+{
+ if(this.isOutputConnected(0))
+ {
+ //send FFT
+ var bufferLength = this.audionode.frequencyBinCount;
+ if( !this._freq_bin || this._freq_bin.length != bufferLength )
+ this._freq_bin = new Uint8Array( bufferLength );
+ this.audionode.getByteFrequencyData( this._freq_bin );
+ this.setOutputData(0,this._freq_bin);
+ }
+
+ //send analyzer
+ if(this.isOutputConnected(1))
+ {
+ //send Samples
+ var bufferLength = this.audionode.frequencyBinCount;
+ if( !this._time_bin || this._time_bin.length != bufferLength )
+ this._time_bin = new Uint8Array( bufferLength );
+ this.audionode.getByteTimeDomainData( this._time_bin );
+ this.setOutputData(1,this._time_bin);
+ }
+
+
+ //properties
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ if(input.link == null)
+ continue;
+ var v = this.getInputData(i);
+ if (v !== undefined)
+ this.audionode[ input.name ].value = v;
+ }
+
+
+
+ //time domain
+ //this.audionode.getFloatTimeDomainData( dataArray );
+}
+
+LGAudioAnalyser.prototype.onGetInputs = function()
+{
+ return [["minDecibels","number"],["maxDecibels","number"],["smoothingTimeConstant","number"]];
+}
+
+LGAudioAnalyser.prototype.onGetOutputs = function()
+{
+ return [["freqs","array"],["samples","array"]];
+}
+
+
+LGAudioAnalyser.title = "Analyser";
+LGAudioAnalyser.desc = "Audio Analyser";
+LiteGraph.registerNodeType( "audio/analyser", LGAudioAnalyser );
+
+//*****************************************************
+
+function LGAudioGain()
+{
+ //default
+ this.properties = {
+ gain: 1
+ };
+
+ this.audionode = LGAudio.getAudioContext().createGain();
+ this.addInput("in","audio");
+ this.addInput("gain","number");
+ this.addOutput("out","audio");
+}
+
+LGAudioGain.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ var v = this.getInputData(i);
+ if(v !== undefined)
+ this.audionode[ input.name ].value = v;
+ }
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioGain );
+
+LGAudioGain.title = "Gain";
+LGAudioGain.desc = "Audio gain";
+LiteGraph.registerNodeType("audio/gain", LGAudioGain);
+
+
+function LGAudioConvolver()
+{
+ //default
+ this.properties = {
+ impulse_src:"",
+ normalize: true
+ };
+
+ this.audionode = LGAudio.getAudioContext().createConvolver();
+ this.addInput("in","audio");
+ this.addOutput("out","audio");
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioConvolver );
+
+LGAudioConvolver.prototype.onRemove = function()
+{
+ if(this._dropped_url)
+ URL.revokeObjectURL( this._dropped_url );
+}
+
+LGAudioConvolver.prototype.onPropertyChanged = function( name, value )
+{
+ if( name == "impulse_src" )
+ this.loadImpulse( value );
+ else if( name == "normalize" )
+ this.audionode.normalize = value;
+}
+
+LGAudioConvolver.prototype.onDropFile = function(file)
+{
+ if(this._dropped_url)
+ URL.revokeObjectURL( this._dropped_url );
+ this._dropped_url = URL.createObjectURL( file );
+ this.properties.impulse_src = this._dropped_url;
+ this.loadImpulse( this._dropped_url );
+}
+
+LGAudioConvolver.prototype.loadImpulse = function( url )
+{
+ var that = this;
+
+ //kill previous load
+ if(this._request)
+ {
+ this._request.abort();
+ this._request = null;
+ }
+
+ this._impulse_buffer = null;
+ this._loading_impulse = false;
+
+ if(!url)
+ return;
+
+ //load new sample
+ this._request = LGAudio.loadSound( url, inner );
+ this._loading_impulse = true;
+
+ // Decode asynchronously
+ function inner( buffer ) {
+ that._impulse_buffer = buffer;
+ that.audionode.buffer = buffer;
+ console.log("Impulse signal set");
+ that._loading_impulse = false;
+ }
+}
+
+LGAudioConvolver.title = "Convolver";
+LGAudioConvolver.desc = "Convolves the signal (used for reverb)";
+LiteGraph.registerNodeType("audio/convolver", LGAudioConvolver);
+
+
+function LGAudioDynamicsCompressor()
+{
+ //default
+ this.properties = {
+ threshold: -50,
+ knee: 40,
+ ratio: 12,
+ reduction: -20,
+ attack: 0,
+ release: 0.25
+ };
+
+ this.audionode = LGAudio.getAudioContext().createDynamicsCompressor();
+ this.addInput("in","audio");
+ this.addOutput("out","audio");
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioDynamicsCompressor );
+
+LGAudioDynamicsCompressor.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ if(input.link == null)
+ continue;
+ var v = this.getInputData(i);
+ if(v !== undefined)
+ this.audionode[ input.name ].value = v;
+ }
+}
+
+LGAudioDynamicsCompressor.prototype.onGetInputs = function()
+{
+ return [["threshold","number"],["knee","number"],["ratio","number"],["reduction","number"],["attack","number"],["release","number"]];
+}
+
+LGAudioDynamicsCompressor.title = "DynamicsCompressor";
+LGAudioDynamicsCompressor.desc = "Dynamics Compressor";
+LiteGraph.registerNodeType("audio/dynamicsCompressor", LGAudioDynamicsCompressor);
+
+
+function LGAudioWaveShaper()
+{
+ //default
+ this.properties = {
+ };
+
+ this.audionode = LGAudio.getAudioContext().createWaveShaper();
+ this.addInput("in","audio");
+ this.addInput("shape","waveshape");
+ this.addOutput("out","audio");
+}
+
+LGAudioWaveShaper.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+ var v = this.getInputData(1);
+ if(v === undefined)
+ return;
+ this.audionode.curve = v;
+}
+
+LGAudioWaveShaper.prototype.setWaveShape = function(shape)
+{
+ this.audionode.curve = shape;
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioWaveShaper );
+
+/* disabled till I dont find a way to do a wave shape
+LGAudioWaveShaper.title = "WaveShaper";
+LGAudioWaveShaper.desc = "Distortion using wave shape";
+LiteGraph.registerNodeType("audio/waveShaper", LGAudioWaveShaper);
+*/
+
+function LGAudioMixer()
+{
+ //default
+ this.properties = {
+ gain1: 0.5,
+ gain2: 0.5
+ };
+
+ this.audionode = LGAudio.getAudioContext().createGain();
+
+ this.audionode1 = LGAudio.getAudioContext().createGain();
+ this.audionode1.gain.value = this.properties.gain1;
+ this.audionode2 = LGAudio.getAudioContext().createGain();
+ this.audionode2.gain.value = this.properties.gain2;
+
+ this.audionode1.connect( this.audionode );
+ this.audionode2.connect( this.audionode );
+
+ this.addInput("in1","audio");
+ this.addInput("in1 gain","number");
+ this.addInput("in2","audio");
+ this.addInput("in2 gain","number");
+
+ this.addOutput("out","audio");
+}
+
+LGAudioMixer.prototype.getAudioNodeInInputSlot = function( slot )
+{
+ if(slot == 0)
+ return this.audionode1;
+ else if(slot == 2)
+ return this.audionode2;
+}
+
+LGAudioMixer.prototype.onPropertyChanged = function( name, value )
+{
+ if( name == "gain1" )
+ this.audionode1.gain.value = value;
+ else if( name == "gain2" )
+ this.audionode2.gain.value = value;
+}
+
+
+LGAudioMixer.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+
+ if(input.link == null || input.type == "audio")
+ continue;
+
+ var v = this.getInputData(i);
+ if(v === undefined)
+ continue;
+
+ if(i == 1)
+ this.audionode1.gain.value = v;
+ else if(i == 3)
+ this.audionode2.gain.value = v;
+ }
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioMixer );
+
+LGAudioMixer.title = "Mixer";
+LGAudioMixer.desc = "Audio mixer";
+LiteGraph.registerNodeType("audio/mixer", LGAudioMixer);
+
+
+function LGAudioDelay()
+{
+ //default
+ this.properties = {
+ delayTime: 0.5
+ };
+
+ this.audionode = LGAudio.getAudioContext().createDelay( 10 );
+ this.audionode.delayTime.value = this.properties.delayTime;
+ this.addInput("in","audio");
+ this.addInput("time","number");
+ this.addOutput("out","audio");
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioDelay );
+
+LGAudioDelay.prototype.onExecute = function()
+{
+ var v = this.getInputData(1);
+ if(v !== undefined )
+ this.audionode.delayTime.value = v;
+}
+
+LGAudioDelay.title = "Delay";
+LGAudioDelay.desc = "Audio delay";
+LiteGraph.registerNodeType("audio/delay", LGAudioDelay);
+
+
+function LGAudioBiquadFilter()
+{
+ //default
+ this.properties = {
+ frequency: 350,
+ detune: 0,
+ Q: 1
+ };
+ this.addProperty("type","lowpass","enum",{values:["lowpass","highpass","bandpass","lowshelf","highshelf","peaking","notch","allpass"]});
+
+ //create node
+ this.audionode = LGAudio.getAudioContext().createBiquadFilter();
+
+ //slots
+ this.addInput("in","audio");
+ this.addOutput("out","audio");
+}
+
+LGAudioBiquadFilter.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ if(input.link == null)
+ continue;
+ var v = this.getInputData(i);
+ if(v !== undefined)
+ this.audionode[ input.name ].value = v;
+ }
+}
+
+LGAudioBiquadFilter.prototype.onGetInputs = function()
+{
+ return [["frequency","number"],["detune","number"],["Q","number"]];
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioBiquadFilter );
+
+LGAudioBiquadFilter.title = "BiquadFilter";
+LGAudioBiquadFilter.desc = "Audio filter";
+LiteGraph.registerNodeType("audio/biquadfilter", LGAudioBiquadFilter);
+
+
+
+
+function LGAudioOscillatorNode()
+{
+ //default
+ this.properties = {
+ frequency: 440,
+ detune: 0,
+ type: "sine"
+ };
+ this.addProperty("type","sine","enum",{values:["sine","square","sawtooth","triangle","custom"]});
+
+ //create node
+ this.audionode = LGAudio.getAudioContext().createOscillator();
+
+ //slots
+ this.addOutput("out","audio");
+}
+
+LGAudioOscillatorNode.prototype.onStart = function()
+{
+ if(!this.audionode.started)
+ {
+ this.audionode.started = true;
+ this.audionode.start();
+ }
+}
+
+LGAudioOscillatorNode.prototype.onStop = function()
+{
+ if(this.audionode.started)
+ {
+ this.audionode.started = false;
+ this.audionode.stop();
+ }
+}
+
+LGAudioOscillatorNode.prototype.onPause = function()
+{
+ this.onStop();
+}
+
+LGAudioOscillatorNode.prototype.onUnpause = function()
+{
+ this.onStart();
+}
+
+LGAudioOscillatorNode.prototype.onExecute = function()
+{
+ if(!this.inputs || !this.inputs.length)
+ return;
+
+ for(var i = 0; i < this.inputs.length; ++i)
+ {
+ var input = this.inputs[i];
+ if(input.link == null)
+ continue;
+ var v = this.getInputData(i);
+ if(v !== undefined)
+ this.audionode[ input.name ].value = v;
+ }
+}
+
+LGAudioOscillatorNode.prototype.onGetInputs = function()
+{
+ return [["frequency","number"],["detune","number"],["type","string"]];
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioOscillatorNode );
+
+LGAudioOscillatorNode.title = "Oscillator";
+LGAudioOscillatorNode.desc = "Oscillator";
+LiteGraph.registerNodeType("audio/oscillator", LGAudioOscillatorNode);
+
+
+//*****************************************************
+
+//EXTRA
+
+
+function LGAudioVisualization()
+{
+ this.properties = {
+ continuous: true,
+ mark: -1
+ };
+
+ this.addInput("data","array");
+ this.addInput("mark","number");
+ this.size = [300,200];
+ this._last_buffer = null;
+}
+
+LGAudioVisualization.prototype.onExecute = function()
+{
+ this._last_buffer = this.getInputData(0);
+ var v = this.getInputData(1);
+ if(v !== undefined)
+ this.properties.mark = v;
+ this.setDirtyCanvas(true,false);
+}
+
+LGAudioVisualization.prototype.onDrawForeground = function(ctx)
+{
+ if(!this._last_buffer)
+ return;
+
+ var buffer = this._last_buffer;
+
+ //delta represents how many samples we advance per pixel
+ var delta = buffer.length / this.size[0];
+ var h = this.size[1];
+
+ ctx.fillStyle = "black";
+ ctx.fillRect(0,0,this.size[0],this.size[1]);
+ ctx.strokeStyle = "white";
+ ctx.beginPath();
+ var x = 0;
+
+ if(this.properties.continuous)
+ {
+ ctx.moveTo(x,h);
+ for(var i = 0; i < buffer.length; i+= delta)
+ {
+ ctx.lineTo(x,h - (buffer[i|0]/255) * h);
+ x++;
+ }
+ }
+ else
+ {
+ for(var i = 0; i < buffer.length; i+= delta)
+ {
+ ctx.moveTo(x+0.5,h);
+ ctx.lineTo(x+0.5,h - (buffer[i|0]/255) * h);
+ x++;
+ }
+ }
+ ctx.stroke();
+
+ if(this.properties.mark >= 0)
+ {
+ var samplerate = LGAudio.getAudioContext().sampleRate;
+ var binfreq = samplerate / buffer.length;
+ var x = 2 * (this.properties.mark / binfreq) / delta;
+ if(x >= this.size[0])
+ x = this.size[0]-1;
+ ctx.strokeStyle = "red";
+ ctx.beginPath();
+ ctx.moveTo(x,h);
+ ctx.lineTo(x,0);
+ ctx.stroke();
+ }
+}
+
+LGAudioVisualization.title = "Visualization";
+LGAudioVisualization.desc = "Audio Visualization";
+LiteGraph.registerNodeType("audio/visualization", LGAudioVisualization);
+
+
+function LGAudioBandSignal()
+{
+ //default
+ this.properties = {
+ band: 440,
+ amplitude: 1
+ };
+
+ this.addInput("freqs","array");
+ this.addOutput("signal","number");
+}
+
+LGAudioBandSignal.prototype.onExecute = function()
+{
+ this._freqs = this.getInputData(0);
+ if( !this._freqs )
+ return;
+
+ var band = this.properties.band;
+ var v = this.getInputData(1);
+ if(v !== undefined)
+ band = v;
+
+ var samplerate = LGAudio.getAudioContext().sampleRate;
+ var binfreq = samplerate / this._freqs.length;
+ var index = 2 * (band / binfreq);
+ var v = 0;
+ if( index < 0 )
+ v = this._freqs[ 0 ];
+ if( index >= this._freqs.length )
+ v = this._freqs[ this._freqs.length - 1];
+ else
+ {
+ var pos = index|0;
+ var v0 = this._freqs[ pos ];
+ var v1 = this._freqs[ pos+1 ];
+ var f = index - pos;
+ v = v0 * (1-f) + v1 * f;
+ }
+
+ this.setOutputData( 0, (v/255) * this.properties.amplitude );
+}
+
+LGAudioBandSignal.prototype.onGetInputs = function()
+{
+ return [["band","number"]];
+}
+
+LGAudioBandSignal.title = "Signal";
+LGAudioBandSignal.desc = "extract the signal of some frequency";
+LiteGraph.registerNodeType("audio/signal", LGAudioBandSignal);
+
+
+function LGAudioScript()
+{
+ if(!LGAudioScript.default_code)
+ {
+ var code = LGAudioScript.default_function.toString();
+ var index = code.indexOf("{")+1;
+ var index2 = code.lastIndexOf("}");
+ LGAudioScript.default_code = code.substr(index, index2 - index);
+ }
+
+ //default
+ this.properties = {
+ code: LGAudioScript.default_code
+ };
+
+ //create node
+ var ctx = LGAudio.getAudioContext();
+ if(ctx.createScriptProcessor)
+ this.audionode = ctx.createScriptProcessor(4096,1,1); //buffer size, input channels, output channels
+ else
+ {
+ console.warn("ScriptProcessorNode deprecated");
+ this.audionode = ctx.createGain(); //bypass audio
+ }
+
+ this.processCode();
+ if(!LGAudioScript._bypass_function)
+ LGAudioScript._bypass_function = this.audionode.onaudioprocess;
+
+ //slots
+ this.addInput("in","audio");
+ this.addOutput("out","audio");
+}
+
+LGAudioScript.prototype.onAdded = function( graph )
+{
+ if(graph.status == LGraph.STATUS_RUNNING)
+ this.audionode.onaudioprocess = this._callback;
+}
+
+LGAudioScript["@code"] = { widget: "code" };
+
+LGAudioScript.prototype.onStart = function()
+{
+ this.audionode.onaudioprocess = this._callback;
+}
+
+LGAudioScript.prototype.onStop = function()
+{
+ this.audionode.onaudioprocess = LGAudioScript._bypass_function;
+}
+
+LGAudioScript.prototype.onPause = function()
+{
+ this.audionode.onaudioprocess = LGAudioScript._bypass_function;
+}
+
+LGAudioScript.prototype.onUnpause = function()
+{
+ this.audionode.onaudioprocess = this._callback;
+}
+
+LGAudioScript.prototype.onExecute = function()
+{
+ //nothing! because we need an onExecute to receive onStart... fix that
+}
+
+LGAudioScript.prototype.onRemoved = function()
+{
+ this.audionode.onaudioprocess = LGAudioScript._bypass_function;
+}
+
+LGAudioScript.prototype.processCode = function()
+{
+ try
+ {
+ var func = new Function( "properties", this.properties.code );
+ this._script = new func( this.properties );
+ this._old_code = this.properties.code;
+ this._callback = this._script.onaudioprocess;
+ }
+ catch (err)
+ {
+ console.error("Error in onaudioprocess code",err);
+ this._callback = LGAudioScript._bypass_function;
+ this.audionode.onaudioprocess = this._callback;
+ }
+}
+
+LGAudioScript.prototype.onPropertyChanged = function( name, value )
+{
+ if(name == "code")
+ {
+ this.properties.code = value;
+ this.processCode();
+ if(this.graph && this.graph.status == LGraph.STATUS_RUNNING)
+ this.audionode.onaudioprocess = this._callback;
+ }
+}
+
+LGAudioScript.default_function = function()
+{
+
+this.onaudioprocess = function(audioProcessingEvent) {
+ // The input buffer is the song we loaded earlier
+ var inputBuffer = audioProcessingEvent.inputBuffer;
+
+ // The output buffer contains the samples that will be modified and played
+ var outputBuffer = audioProcessingEvent.outputBuffer;
+
+ // Loop through the output channels (in this case there is only one)
+ for (var channel = 0; channel < outputBuffer.numberOfChannels; channel++) {
+ var inputData = inputBuffer.getChannelData(channel);
+ var outputData = outputBuffer.getChannelData(channel);
+
+ // Loop through the 4096 samples
+ for (var sample = 0; sample < inputBuffer.length; sample++) {
+ // make output equal to the same as the input
+ outputData[sample] = inputData[sample];
+ }
+ }
+}
+
+}
+
+LGAudio.createAudioNodeWrapper( LGAudioScript );
+
+LGAudioScript.title = "Script";
+LGAudioScript.desc = "apply script to signal";
+LiteGraph.registerNodeType("audio/script", LGAudioScript);
+
+
+function LGAudioDestination()
+{
+ this.audionode = LGAudio.getAudioContext().destination;
+ this.addInput("in","audio");
+}
+
+
+LGAudioDestination.title = "Destination";
+LGAudioDestination.desc = "Audio output";
+LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
+
+
+
+
})( this );
-//event related nodes
-(function(global){
-var LiteGraph = global.LiteGraph;
-
-function LGWebSocket()
-{
- this.size = [60,20];
- this.addInput("send", LiteGraph.ACTION);
- this.addOutput("received", LiteGraph.EVENT);
- this.addInput("in", 0 );
- this.addOutput("out", 0 );
- this.properties = {
- url: "",
- room: "lgraph" //allows to filter messages
- };
- this._ws = null;
- this._last_data = [];
-}
-
-LGWebSocket.title = "WebSocket";
-LGWebSocket.desc = "Send data through a websocket";
-
-LGWebSocket.prototype.onPropertyChanged = function(name,value)
-{
- if(name == "url")
- this.createSocket();
-}
-
-LGWebSocket.prototype.onExecute = function()
-{
- if(!this._ws && this.properties.url)
- this.createSocket();
-
- if(!this._ws || this._ws.readyState != WebSocket.OPEN )
- return;
-
- var room = this.properties.room;
-
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var data = this.getInputData(i);
- if(data != null)
- {
- var json;
- try
- {
- json = JSON.stringify({ type: 0, room: room, channel: i, data: data });
- }
- catch (err)
- {
- continue;
- }
- this._ws.send( json );
- }
- }
-
- for(var i = 1; i < this.outputs.length; ++i)
- this.setOutputData( i, this._last_data[i] );
-}
-
-LGWebSocket.prototype.createSocket = function()
-{
- var that = this;
- var url = this.properties.url;
- if( url.substr(0,2) != "ws" )
- url = "ws://" + url;
- this._ws = new WebSocket( url );
- this._ws.onopen = function()
- {
- console.log("ready");
- that.boxcolor = "#8E8";
- }
- this._ws.onmessage = function(e)
- {
- var data = JSON.parse( e.data );
- if( data.room && data.room != this.properties.room )
- return;
- if( e.data.type == 1 )
- that.triggerSlot( 0, data );
- else
- that._last_data[ e.data.channel || 0 ] = data.data;
- }
- this._ws.onerror = function(e)
- {
- console.log("couldnt connect to websocket");
- that.boxcolor = "#E88";
- }
- this._ws.onclose = function(e)
- {
- console.log("connection closed");
- that.boxcolor = "#000";
- }
-}
-
-LGWebSocket.prototype.send = function(data)
-{
- if(!this._ws || this._ws.readyState != WebSocket.OPEN )
- return;
- this._ws.send( JSON.stringify({ type:1, msg: data }) );
-}
-
-LGWebSocket.prototype.onAction = function( action, param )
-{
- if(!this._ws || this._ws.readyState != WebSocket.OPEN )
- return;
- this._ws.send( { type: 1, room: this.properties.room, action: action, data: param } );
-}
-
-LGWebSocket.prototype.onGetInputs = function()
-{
- return [["in",0]];
-}
-
-LGWebSocket.prototype.onGetOutputs = function()
-{
- return [["out",0]];
-}
-
-LiteGraph.registerNodeType("network/websocket", LGWebSocket );
-
-
-//It is like a websocket but using the SillyServer.js server that bounces packets back to all clients connected:
-//For more information: https://github.com/jagenjo/SillyServer.js
-
-function LGSillyClient()
-{
- this.size = [60,20];
- this.addInput("send", LiteGraph.ACTION);
- this.addOutput("received", LiteGraph.EVENT);
- this.addInput("in", 0 );
- this.addOutput("out", 0 );
- this.properties = {
- url: "tamats.com:55000",
- room: "lgraph",
- save_bandwidth: true
- };
-
- this._server = null;
- this.createSocket();
- this._last_input_data = [];
- this._last_output_data = [];
-}
-
-LGSillyClient.title = "SillyClient";
-LGSillyClient.desc = "Connects to SillyServer to broadcast messages";
-
-LGSillyClient.prototype.onPropertyChanged = function(name,value)
-{
- var final_url = (this.properties.url + "/" + this.properties.room);
- if(this._server && this._final_url != final_url )
- {
- this._server.connect( this.properties.url, this.properties.room );
- this._final_url = final_url;
- }
-}
-
-LGSillyClient.prototype.onExecute = function()
-{
- if(!this._server || !this._server.is_connected)
- return;
-
- var save_bandwidth = this.properties.save_bandwidth;
-
- for(var i = 1; i < this.inputs.length; ++i)
- {
- var data = this.getInputData(i);
- if(data != null)
- {
- if( save_bandwidth && this._last_input_data[i] == data )
- continue;
- this._server.sendMessage( { type: 0, channel: i, data: data } );
- this._last_input_data[i] = data;
- }
- }
-
- for(var i = 1; i < this.outputs.length; ++i)
- this.setOutputData( i, this._last_output_data[i] );
-}
-
-LGSillyClient.prototype.createSocket = function()
-{
- var that = this;
- if(typeof(SillyClient) == "undefined")
- {
- if(!this._error)
- console.error("SillyClient node cannot be used, you must include SillyServer.js");
- this._error = true;
- return;
- }
-
- this._server = new SillyClient();
- this._server.on_ready = function()
- {
- console.log("ready");
- that.boxcolor = "#8E8";
- }
- this._server.on_message = function(id,msg)
- {
- var data = null;
- try
- {
- data = JSON.parse( msg );
- }
- catch (err)
- {
- return;
- }
-
- if(data.type == 1)
- that.triggerSlot( 0, data );
- else
- that._last_output_data[ data.channel || 0 ] = data.data;
- }
- this._server.on_error = function(e)
- {
- console.log("couldnt connect to websocket");
- that.boxcolor = "#E88";
- }
- this._server.on_close = function(e)
- {
- console.log("connection closed");
- that.boxcolor = "#000";
- }
-
- if(this.properties.url && this.properties.room)
- {
- this._server.connect( this.properties.url, this.properties.room );
- this._final_url = (this.properties.url + "/" + this.properties.room);
- }
-}
-
-LGSillyClient.prototype.send = function(data)
-{
- if(!this._server || !this._server.is_connected)
- return;
- this._server.sendMessage( { type:1, data: data } );
-}
-
-LGSillyClient.prototype.onAction = function( action, param )
-{
- if(!this._server || !this._server.is_connected)
- return;
- this._server.sendMessage( { type: 1, action: action, data: param } );
-}
-
-LGSillyClient.prototype.onGetInputs = function()
-{
- return [["in",0]];
-}
-
-LGSillyClient.prototype.onGetOutputs = function()
-{
- return [["out",0]];
-}
-
-LiteGraph.registerNodeType("network/sillyclient", LGSillyClient );
-
-
-})(this);
+//event related nodes
+(function(global){
+var LiteGraph = global.LiteGraph;
+
+function LGWebSocket()
+{
+ this.size = [60,20];
+ this.addInput("send", LiteGraph.ACTION);
+ this.addOutput("received", LiteGraph.EVENT);
+ this.addInput("in", 0 );
+ this.addOutput("out", 0 );
+ this.properties = {
+ url: "",
+ room: "lgraph" //allows to filter messages
+ };
+ this._ws = null;
+ this._last_data = [];
+}
+
+LGWebSocket.title = "WebSocket";
+LGWebSocket.desc = "Send data through a websocket";
+
+LGWebSocket.prototype.onPropertyChanged = function(name,value)
+{
+ if(name == "url")
+ this.createSocket();
+}
+
+LGWebSocket.prototype.onExecute = function()
+{
+ if(!this._ws && this.properties.url)
+ this.createSocket();
+
+ if(!this._ws || this._ws.readyState != WebSocket.OPEN )
+ return;
+
+ var room = this.properties.room;
+
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var data = this.getInputData(i);
+ if(data != null)
+ {
+ var json;
+ try
+ {
+ json = JSON.stringify({ type: 0, room: room, channel: i, data: data });
+ }
+ catch (err)
+ {
+ continue;
+ }
+ this._ws.send( json );
+ }
+ }
+
+ for(var i = 1; i < this.outputs.length; ++i)
+ this.setOutputData( i, this._last_data[i] );
+}
+
+LGWebSocket.prototype.createSocket = function()
+{
+ var that = this;
+ var url = this.properties.url;
+ if( url.substr(0,2) != "ws" )
+ url = "ws://" + url;
+ this._ws = new WebSocket( url );
+ this._ws.onopen = function()
+ {
+ console.log("ready");
+ that.boxcolor = "#8E8";
+ }
+ this._ws.onmessage = function(e)
+ {
+ var data = JSON.parse( e.data );
+ if( data.room && data.room != this.properties.room )
+ return;
+ if( e.data.type == 1 )
+ that.triggerSlot( 0, data );
+ else
+ that._last_data[ e.data.channel || 0 ] = data.data;
+ }
+ this._ws.onerror = function(e)
+ {
+ console.log("couldnt connect to websocket");
+ that.boxcolor = "#E88";
+ }
+ this._ws.onclose = function(e)
+ {
+ console.log("connection closed");
+ that.boxcolor = "#000";
+ }
+}
+
+LGWebSocket.prototype.send = function(data)
+{
+ if(!this._ws || this._ws.readyState != WebSocket.OPEN )
+ return;
+ this._ws.send( JSON.stringify({ type:1, msg: data }) );
+}
+
+LGWebSocket.prototype.onAction = function( action, param )
+{
+ if(!this._ws || this._ws.readyState != WebSocket.OPEN )
+ return;
+ this._ws.send( { type: 1, room: this.properties.room, action: action, data: param } );
+}
+
+LGWebSocket.prototype.onGetInputs = function()
+{
+ return [["in",0]];
+}
+
+LGWebSocket.prototype.onGetOutputs = function()
+{
+ return [["out",0]];
+}
+
+LiteGraph.registerNodeType("network/websocket", LGWebSocket );
+
+
+//It is like a websocket but using the SillyServer.js server that bounces packets back to all clients connected:
+//For more information: https://github.com/jagenjo/SillyServer.js
+
+function LGSillyClient()
+{
+ this.size = [60,20];
+ this.addInput("send", LiteGraph.ACTION);
+ this.addOutput("received", LiteGraph.EVENT);
+ this.addInput("in", 0 );
+ this.addOutput("out", 0 );
+ this.properties = {
+ url: "tamats.com:55000",
+ room: "lgraph",
+ save_bandwidth: true
+ };
+
+ this._server = null;
+ this.createSocket();
+ this._last_input_data = [];
+ this._last_output_data = [];
+}
+
+LGSillyClient.title = "SillyClient";
+LGSillyClient.desc = "Connects to SillyServer to broadcast messages";
+
+LGSillyClient.prototype.onPropertyChanged = function(name,value)
+{
+ var final_url = (this.properties.url + "/" + this.properties.room);
+ if(this._server && this._final_url != final_url )
+ {
+ this._server.connect( this.properties.url, this.properties.room );
+ this._final_url = final_url;
+ }
+}
+
+LGSillyClient.prototype.onExecute = function()
+{
+ if(!this._server || !this._server.is_connected)
+ return;
+
+ var save_bandwidth = this.properties.save_bandwidth;
+
+ for(var i = 1; i < this.inputs.length; ++i)
+ {
+ var data = this.getInputData(i);
+ if(data != null)
+ {
+ if( save_bandwidth && this._last_input_data[i] == data )
+ continue;
+ this._server.sendMessage( { type: 0, channel: i, data: data } );
+ this._last_input_data[i] = data;
+ }
+ }
+
+ for(var i = 1; i < this.outputs.length; ++i)
+ this.setOutputData( i, this._last_output_data[i] );
+}
+
+LGSillyClient.prototype.createSocket = function()
+{
+ var that = this;
+ if(typeof(SillyClient) == "undefined")
+ {
+ if(!this._error)
+ console.error("SillyClient node cannot be used, you must include SillyServer.js");
+ this._error = true;
+ return;
+ }
+
+ this._server = new SillyClient();
+ this._server.on_ready = function()
+ {
+ console.log("ready");
+ that.boxcolor = "#8E8";
+ }
+ this._server.on_message = function(id,msg)
+ {
+ var data = null;
+ try
+ {
+ data = JSON.parse( msg );
+ }
+ catch (err)
+ {
+ return;
+ }
+
+ if(data.type == 1)
+ that.triggerSlot( 0, data );
+ else
+ that._last_output_data[ data.channel || 0 ] = data.data;
+ }
+ this._server.on_error = function(e)
+ {
+ console.log("couldnt connect to websocket");
+ that.boxcolor = "#E88";
+ }
+ this._server.on_close = function(e)
+ {
+ console.log("connection closed");
+ that.boxcolor = "#000";
+ }
+
+ if(this.properties.url && this.properties.room)
+ {
+ this._server.connect( this.properties.url, this.properties.room );
+ this._final_url = (this.properties.url + "/" + this.properties.room);
+ }
+}
+
+LGSillyClient.prototype.send = function(data)
+{
+ if(!this._server || !this._server.is_connected)
+ return;
+ this._server.sendMessage( { type:1, data: data } );
+}
+
+LGSillyClient.prototype.onAction = function( action, param )
+{
+ if(!this._server || !this._server.is_connected)
+ return;
+ this._server.sendMessage( { type: 1, action: action, data: param } );
+}
+
+LGSillyClient.prototype.onGetInputs = function()
+{
+ return [["in",0]];
+}
+
+LGSillyClient.prototype.onGetOutputs = function()
+{
+ return [["out",0]];
+}
+
+LiteGraph.registerNodeType("network/sillyclient", LGSillyClient );
+
+
+})(this);
\ No newline at end of file
diff --git a/css/litegraph.css b/css/litegraph.css
index 32111b724..3c5217086 100755
--- a/css/litegraph.css
+++ b/css/litegraph.css
@@ -131,7 +131,7 @@
.litegraph .litemenu-entry:hover:not(.disabled):not(.separator) {
background-color: #444 !important;
color: #EEE;
- transition: * 0.4s;
+ transition: all 0.4s;
}
.litegraph .litemenu-entry .property_name {
@@ -151,6 +151,49 @@
padding-right: 10px;
}
+.litegraph.litesearchbox {
+ font-family:Tahoma, sans-serif;
+ position: absolute;
+ background-color: rgba(0,0,0,0.5);
+ padding-top: 4px;
+}
+
+.litegraph.litesearchbox input, .litegraph.litesearchbox select {
+ margin-top: 3px;
+ min-width: 60px;
+ min-height: 1.5em;
+ background-color: black;
+ border: 0;
+ color: white;
+ padding-left: 10px;
+ margin-right: 5px;
+}
+
+.litegraph.litesearchbox .name {
+ display: inline-block;
+ min-width: 60px;
+ min-height: 1.5em;
+ padding-left: 10px;
+}
+
+litegraph.litesearchbox .helper {
+ overflow: auto;
+ max-height: 200px;
+ margin-top: 2px;
+}
+
+.litegraph.lite-search-item {
+ font-family:Tahoma, sans-serif;
+ background-color: rgba(0,0,0,0.5);
+ color: white;
+ padding-top: 2px;
+}
+
+.litegraph.lite-search-item:hover, .litegraph.lite-search-item.selected {
+ cursor: pointer;
+ background-color: white;
+ color: black;
+}
/* OLD */
@@ -175,7 +218,7 @@
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
- transition: * linear 0.5s;
+ transition: all linear 0.5s;
}
.graphmenu-entry.event, .litemenu-entry.event {
diff --git a/src/litegraph.js b/src/litegraph.js
index b6c7a2bc3..6c0b2b44c 100755
--- a/src/litegraph.js
+++ b/src/litegraph.js
@@ -6455,7 +6455,7 @@ LGraphCanvas.onShowTitleEditor = function( value, options, e, menu, node )
var dialog = document.createElement("div");
dialog.className = "graphdialog";
- dialog.innerHTML = "Title";
+ dialog.innerHTML = "Title";
var input = dialog.querySelector("input");
if(input)
{
@@ -6515,8 +6515,8 @@ LGraphCanvas.prototype.showSearchBox = function(event)
var input_html = "";
var dialog = document.createElement("div");
- dialog.className = "graphdialog";
- dialog.innerHTML = "Search ";
+ dialog.className = "litegraph litesearchbox";
+ dialog.innerHTML = "Search ";
dialog.close = function()
{
that.search_box = null;
@@ -6652,7 +6652,7 @@ LGraphCanvas.prototype.showSearchBox = function(event)
var help = document.createElement("div");
if(!first) first = i;
help.innerText = i;
- help.className = "help-item";
+ help.className = "litegraph lite-search-item";
help.addEventListener("click", function(e){
select( this.innerText );
});
@@ -6704,10 +6704,10 @@ LGraphCanvas.prototype.showEditPropertyValue = function( node, property, options
var input_html = "";
if(type == "string" || type == "number" || type == "array")
- input_html = "";
+ input_html = "";
else if(type == "enum" && info.values)
{
- input_html = "