UNPKG

videocontext

Version:

A WebGL & HTML5 graph based video composition library

118 lines (88 loc) 4.18 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JSDoc: Source: DestinationNode/destinationnode.js</title> <script src="scripts/prettify/prettify.js"> </script> <script src="scripts/prettify/lang-css.js"> </script> <!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css"> <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css"> </head> <body> <div id="main"> <h1 class="page-title">Source: DestinationNode/destinationnode.js</h1> <section> <article> <pre class="prettyprint source linenums"><code>//Matthew Shotton, R&amp;D User Experience,© BBC 2015 import ProcessingNode from "../ProcessingNodes/processingnode"; class DestinationNode extends ProcessingNode { /** * Initialise an instance of a DestinationNode. * * There should only be a single instance of a DestinationNode per VideoContext instance. An VideoContext's destination can be accessed like so: videoContext.desitnation. * * You should not instantiate this directly. */ constructor(gl, renderGraph){ let vertexShader = "\ attribute vec2 a_position;\ attribute vec2 a_texCoord;\ varying vec2 v_texCoord;\ void main() {\ gl_Position = vec4(vec2(2.0,2.0)*a_position-vec2(1.0, 1.0), 0.0, 1.0);\ v_texCoord = a_texCoord;\ }"; let fragmentShader = "\ precision mediump float;\ uniform sampler2D u_image;\ varying vec2 v_texCoord;\ varying float v_progress;\ void main(){\ gl_FragColor = texture2D(u_image, v_texCoord);\ }"; let deffinition = {fragmentShader:fragmentShader, vertexShader:vertexShader, properties:{}, inputs:["u_image"]}; super(gl, renderGraph, deffinition, deffinition.inputs, false); this._displayName = "DestinationNode"; } _render(){ let gl = this._gl; gl.bindFramebuffer(gl.FRAMEBUFFER, null); gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); gl.enable(gl.BLEND); gl.clearColor(0, 0, 0, 0.0); // green; gl.clear(gl.COLOR_BUFFER_BIT); this.inputs.forEach((node)=>{ super._render(); //map the input textures input the node var texture = node._texture; let textureOffset = 0; for(let mapping of this._inputTextureUnitMapping ){ gl.activeTexture(mapping.textureUnit); let textureLocation = gl.getUniformLocation(this._program, mapping.name); gl.uniform1i(textureLocation, this._parameterTextureCount + textureOffset); textureOffset += 1; gl.bindTexture(gl.TEXTURE_2D, texture); } gl.drawArrays(gl.TRIANGLES, 0, 6); }); } } export default DestinationNode; </code></pre> </article> </section> </div> <nav> <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-VideoContext.html">VideoContext</a></li></ul><h3>Classes</h3><ul><li><a href="CanvasNode.html">CanvasNode</a></li><li><a href="CompositingNode.html">CompositingNode</a></li><li><a href="DestinationNode.html">DestinationNode</a></li><li><a href="EffectNode.html">EffectNode</a></li><li><a href="GraphNode.html">GraphNode</a></li><li><a href="ImageNode.html">ImageNode</a></li><li><a href="module-VideoContext.html">VideoContext</a></li><li><a href="ProcessingNode.html">ProcessingNode</a></li><li><a href="RenderGraph.html">RenderGraph</a></li><li><a href="SourceNode.html">SourceNode</a></li><li><a href="TransitionNode.html">TransitionNode</a></li><li><a href="VideoNode.html">VideoNode</a></li></ul> </nav> <br class="clear"> <footer> Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.3</a> </footer> <script> prettyPrint(); </script> <script src="scripts/linenumber.js"> </script> </body> </html>