From 51ebea1f687d517f1aa555ac269ffc6d1e3763ec Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Thu, 29 Oct 2015 16:20:45 -0400 Subject: [PATCH 01/18] Fix: Channels effect crashes when setting alphaSource when source is undefined (#109) --- effects/seriously.channels.js | 5 +++ test/media/tiny.png | Bin 0 -> 169 bytes test/seriously.unit.js | 64 ++++++++++++++++++++++++++++++++++ 3 files changed, 69 insertions(+) create mode 100644 test/media/tiny.png diff --git a/effects/seriously.channels.js b/effects/seriously.channels.js index ca9d52f..6dd1e24 100644 --- a/effects/seriously.channels.js +++ b/effects/seriously.channels.js @@ -95,6 +95,11 @@ s = inputs[name]; if (!s) { s = me.sources[name] = inputs[name] = inputs.source; + + if (!s) { + //no main source to fall back to + return; + } } j = sources.indexOf(s); diff --git a/test/media/tiny.png b/test/media/tiny.png new file mode 100644 index 0000000000000000000000000000000000000000..b5daf2370284e065b88aa796bcbfd4a35cb86bc5 GIT binary patch literal 169 zcmeAS@N?(olHy`uVBq!ia0vp^4j|0I1SD0tpLGH$&H|6fVj#^3#{Q~Dt^pa*o-U3d z6?5L6-^j_JAi%OA+LiktCu?a%`i38R6IdtB4qcTxy{iE$I8go|Wy-6WOIfgkeYUS> WzUX-U+cyhn4TGnvpUXO@geCxTG% Date: Mon, 23 Nov 2015 00:56:56 -0800 Subject: [PATCH 02/18] colorcube takes 'size' param to accept varying size LUT maps --- effects/seriously.colorcube.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/effects/seriously.colorcube.js b/effects/seriously.colorcube.js index 1fe8a0b..24d7864 100644 --- a/effects/seriously.colorcube.js +++ b/effects/seriously.colorcube.js @@ -29,6 +29,7 @@ 'uniform sampler2D source;', 'uniform sampler2D colorCube;', + 'uniform float size;', 'varying vec2 vTexCoord;', 'vec3 sampleAs3DTexture(sampler2D tex, vec3 coord, float size) {', @@ -48,7 +49,7 @@ 'void main(void) {', ' vec4 originalColor = texture2D(source, vTexCoord);', - ' vec3 color = sampleAs3DTexture(colorCube, originalColor.rgb, 8.0);', + ' vec3 color = sampleAs3DTexture(colorCube, originalColor.rgb, size);', ' gl_FragColor = vec4(color, originalColor.a);', '}' ].join('\n'); @@ -63,6 +64,13 @@ cube: { type: 'image', uniform: 'colorCube' + }, + size: { + type: 'number', + uniform: 'size', + defaultValue: 8, + min: 1, + max: 256 } }, title: 'Color Cube', From d2aa68c58e753b701c2ba52feda619a52bacb8cf Mon Sep 17 00:00:00 2001 From: Drew Perttula Date: Mon, 23 Nov 2015 01:03:20 -0800 Subject: [PATCH 03/18] Straighten green/blue in linear-transfer.html demo sliders --- examples/color/linear-transfer.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/examples/color/linear-transfer.html b/examples/color/linear-transfer.html index f9f43de..aa76bbe 100644 --- a/examples/color/linear-transfer.html +++ b/examples/color/linear-transfer.html @@ -28,16 +28,16 @@
Slope - - + +
Intercept - - + +
From 66e68c2fe7653d6bbfea71387c4e5598b7ac4eb2 Mon Sep 17 00:00:00 2001 From: Michael Traeger Date: Mon, 27 Jun 2016 23:56:10 +0200 Subject: [PATCH 04/18] using more generic window.URL fixes firefox - also Edge possible now --- index.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index e6762ab..912e4b1 100644 --- a/index.html +++ b/index.html @@ -144,7 +144,7 @@ } } - gUM = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; + gUM = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; if (!gUM) { document.body.removeChild(document.getElementById('camera')); @@ -296,8 +296,8 @@ target.width = video.videoWidth; } - if (window.webkitURL) { - video.src = window.webkitURL.createObjectURL(stream); + if (window.URL) { + video.src = window.URL.createObjectURL(stream); } else { video.src = stream; } From 54f6971a3a76ceaadb412dbfb8a562bdf3737547 Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Tue, 16 Aug 2016 15:01:59 -0400 Subject: [PATCH 05/18] Directional Blur: set `baseShader` in `initialize` so it works with multiple nodes --- effects/seriously.directionblur.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/effects/seriously.directionblur.js b/effects/seriously.directionblur.js index e734705..7363936 100644 --- a/effects/seriously.directionblur.js +++ b/effects/seriously.directionblur.js @@ -64,6 +64,8 @@ http://v002.info/plugins/v002-blurs/ return; } + baseShader = this.baseShader; + fbs = [ new Seriously.util.FrameBuffer(gl, this.width, this.height), new Seriously.util.FrameBuffer(gl, this.width, this.height) @@ -73,8 +75,6 @@ http://v002.info/plugins/v002-blurs/ shader: function (inputs, shaderSource) { var gl = this.gl; - baseShader = this.baseShader; - shaderSource.vertex = [ 'precision mediump float;', From 03feff5a7cad1a8a4062e41dd5df7f07cdfb686e Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Tue, 16 Aug 2016 15:06:56 -0400 Subject: [PATCH 06/18] Resize canvas source node on update if canvas changes size --- seriously.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/seriously.js b/seriously.js index 8fa213b..49f514c 100755 --- a/seriously.js +++ b/seriously.js @@ -3133,6 +3133,7 @@ }; this.update = function () { + me.update(); me.setDirty(); }; @@ -3246,6 +3247,11 @@ matchedType = true; this.hook = 'canvas'; this.compare = compareSource; + this.update = function () { + this.width = source.width; + this.height = source.height; + this.resize(); + }; } else if (source.tagName === 'IMG') { this.width = source.naturalWidth || 1; this.height = source.naturalHeight || 1; @@ -3406,6 +3412,8 @@ } }; + SourceNode.prototype.update = nop; + SourceNode.prototype.resize = function () { var i, target; From 17bd28aaa4f6cc829ebb12de463ccebd2623467d Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Thu, 18 Aug 2016 16:29:01 -0400 Subject: [PATCH 07/18] Fix expression effect if using require --- effects/seriously.expression.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/effects/seriously.expression.js b/effects/seriously.expression.js index 0fd24bf..96542f7 100644 --- a/effects/seriously.expression.js +++ b/effects/seriously.expression.js @@ -537,5 +537,11 @@ /* jsep v0.2.9 (http://jsep.from.so/) */ !function(a){"use strict";var b="Compound",c="Identifier",d="MemberExpression",e="Literal",f="ThisExpression",g="CallExpression",h="UnaryExpression",i="BinaryExpression",j="LogicalExpression",k=!0,l={"-":k,"!":k,"~":k,"+":k},m={"||":1,"&&":2,"|":3,"^":4,"&":5,"==":6,"!=":6,"===":6,"!==":6,"<":7,">":7,"<=":7,">=":7,"<<":8,">>":8,">>>":8,"+":9,"-":9,"*":10,"/":10,"%":10},n=function(a){var b,c=0;for(var d in a)(b=d.length)>c&&a.hasOwnProperty(d)&&(c=b);return c},o=n(l),p=n(m),q={"true":!0,"false":!1,"null":null},r="this",s=function(a){return m[a]||0},t=function(a,b,c){var d="||"===a||"&&"===a?j:i;return{type:d,operator:a,left:b,right:c}},u=function(a){return a>=48&&57>=a},v=function(a){return 36===a||95===a||a>=65&&90>=a||a>=97&&122>=a},w=function(a){return 36===a||95===a||a>=65&&90>=a||a>=97&&122>=a||a>=48&&57>=a},x=function(a){for(var i,j,k=0,n=a.charAt,x=a.charCodeAt,y=function(b){return n.call(a,b)},z=function(b){return x.call(a,b)},A=a.length,B=function(){for(var a=z(k);32===a||9===a;)a=z(++k)},C=function(){B();for(var b=a.substr(k,p),c=b.length;c>0;){if(m.hasOwnProperty(b))return k+=c,b;b=b.substr(0,--c)}return!1},D=function(){var a,b,c,d,e,f,g,h;if(f=E(),b=C(),!b)return f;if(e={value:b,prec:s(b)},g=E(),!g)throw new Error("Expected expression after "+b+" at character "+k);for(d=[f,e,g];(b=C())&&(c=s(b),0!==c);){for(e={value:b,prec:c};d.length>2&&c<=d[d.length-2].prec;)g=d.pop(),b=d.pop().value,f=d.pop(),a=t(b,f,g),d.push(a);if(a=E(),!a)throw new Error("Expected expression after "+b+" at character "+k);d.push(e),d.push(a)}for(h=d.length-1,a=d[h];h>1;)a=t(d[h-1].value,d[h-2],a),h-=2;return a},E=function(){var b,c,d;if(B(),b=z(k),u(b)||46===b)return F();if(39===b||34===b)return G();if(v(b))return J();if(40===b)return K();for(c=a.substr(k,o),d=c.length;d>0;){if(l.hasOwnProperty(c))return k+=d,{type:h,operator:c,argument:E(),prefix:!0};c=c.substr(0,--d)}return!1},F=function(){for(var a="";u(z(k));)a+=y(k++);if("."===y(k))for(a+=y(k++);u(z(k));)a+=y(k++);if("e"===y(k)||"E"===y(k)){for(a+=y(k++),("+"===y(k)||"-"===y(k))&&(a+=y(k++));u(z(k));)a+=y(k++);if(!u(z(k-1)))throw new Error("Expected exponent ("+a+y(k)+") at character "+k)}if(v(z(k)))throw new Error("Variable names cannot start with a number ("+a+y(k)+") at character "+k);return{type:e,value:parseFloat(a),raw:a}},G=function(){for(var a,b="",c=y(k++),d=!1;A>k;){if(a=y(k++),a===c){d=!0;break}if("\\"===a)switch(a=y(k++)){case"n":b+="\n";break;case"r":b+="\r";break;case"t":b+=" ";break;case"b":b+="\b";break;case"f":b+="\f";break;case"v":b+=" "}else b+=a}if(!d)throw new Error('Unclosed quote after "'+b+'"');return{type:e,value:b,raw:c+b+c}},H=function(){var b,d=z(k),g=k;if(!v(d))throw new Error("Unexpected "+y(k)+"at character "+k);for(k++;A>k&&(d=z(k),w(d));)k++;return b=a.slice(g,k),q.hasOwnProperty(b)?{type:e,value:q[b],raw:b}:b===r?{type:f}:{type:c,name:b}},I=function(){for(var a,c,d=[];A>k;){if(B(),a=y(k),")"===a){k++;break}if(","===a)k++;else{if(c=D(),!c||c.type===b)throw new Error("Expected comma at character "+k);d.push(c)}}return d},J=function(){var a,b,c;for(b=H(),B(),a=y(k);"."===a||"["===a||"("===a;){if("."===a)k++,B(),b={type:d,computed:!1,object:b,property:H()};else if("["===a){if(c=k,k++,b={type:d,computed:!0,object:b,property:D()},B(),a=y(k),"]"!==a)throw new Error("Unclosed [ at character "+k);k++,B()}else"("===a&&(k++,b={type:g,arguments:I(),callee:b});B(),a=y(k)}return b},K=function(){k++;var a=D();if(B(),")"===y(k))return k++,a;throw new Error("Unclosed ( at character "+k)},L=[];A>k;)if(i=y(k),";"===i||","===i)k++;else if(j=D())L.push(j);else if(A>k)throw new Error("Unexpected '"+y(k)+"' at character "+k);return 1===L.length?L[0]:{type:b,body:L}};if(x.version="0.2.9",x.toString=function(){return"JavaScript Expression Parser (JSEP) v"+x.version},x.addUnaryOp=function(a){return l[a]=k,this},x.addBinaryOp=function(a,b){return p=Math.max(a.length,p),m[a]=b,this},x.removeUnaryOp=function(a){return delete l[a],a.length===o&&(o=n(l)),this},x.removeBinaryOp=function(a){return delete m[a],a.length===p&&(p=n(m)),this},"undefined"==typeof exports){var y=a.jsep;a.jsep=x,x.noConflict=function(){return a.jsep===x&&(a.jsep=y),x}}else"undefined"!=typeof module&&module.exports?exports=module.exports=x:exports.parse=x}(window); - jsep = window.jsep.noConflict(); + jsep = window.jsep || + typeof module !== undefined && module.exports || + typeof exports !== undefined && exports.parse; + + if (jsep.noConflict) { + jsep = jsep.noConflict(); + } })); From 4dec4e439c850151d9ce3b1f1eaf536d202d5ce2 Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Fri, 19 Aug 2016 12:23:21 -0400 Subject: [PATCH 08/18] Optimizied blur shaders for texture pre-fetching --- effects/seriously.blur.js | 17 ++++++++--------- effects/seriously.directionblur.js | 26 +++++++++++--------------- 2 files changed, 19 insertions(+), 24 deletions(-) diff --git a/effects/seriously.blur.js b/effects/seriously.blur.js index efe9993..4825192 100644 --- a/effects/seriously.blur.js +++ b/effects/seriously.blur.js @@ -87,7 +87,7 @@ http://v002.info/plugins/v002-blurs/ 'const vec2 zero = vec2(0.0);', 'varying vec2 vTexCoord;', - 'varying vec4 vTexCoords[4];', + 'varying vec2 vTexCoords[8];', 'void main(void) {', // first convert to screen space @@ -100,18 +100,18 @@ http://v002.info/plugins/v002-blurs/ ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', ' vTexCoord = texCoord;', - ' vec2 one = vec2(1.0) * inputScale;', + ' vec2 one = vec2(inputScale);', ' if (inputScale < 1.0) {', ' one -= 1.0 / resolution;', ' }', - ' vTexCoord = max(zero, min(one, texCoord.st * inputScale));', + ' vTexCoord = max(zero, min(one, texCoord * inputScale));', ' vec2 amount = direction * (inputScale * amount * 5.0 / resolution);', ' for (int i = 0; i < 4; i++) {', ' float s = pow(3.0, float(i));', - ' vTexCoords[i].xy = max(zero, min(one, vTexCoord + amount * s));', - ' vTexCoords[i].zw = max(zero, min(one, vTexCoord - amount * s));', + ' vTexCoords[i * 2] = max(zero, min(one, vTexCoord + amount * s));', + ' vTexCoords[i * 2 + 1] = max(zero, min(one, vTexCoord - amount * s));', ' }', '}' ].join('\n'); @@ -122,7 +122,7 @@ http://v002.info/plugins/v002-blurs/ 'uniform float blendGamma;', 'varying vec2 vTexCoord;', - 'varying vec4 vTexCoords[4];', + 'varying vec2 vTexCoords[8];', 'vec3 exp;', @@ -138,9 +138,8 @@ http://v002.info/plugins/v002-blurs/ ' gl_FragColor = sample(source, vTexCoord) / 9.0;', - ' for (int i = 0; i < 4; i++) {', - ' gl_FragColor += sample(source, vTexCoords[i].xy) / 9.0;', - ' gl_FragColor += sample(source, vTexCoords[i].zw) / 9.0;', + ' for (int i = 0; i < 8; i++) {', + ' gl_FragColor += sample(source, vTexCoords[i]) / 9.0;', ' }', ' gl_FragColor.rgb = pow(gl_FragColor.rgb, 1.0 / exp);', diff --git a/effects/seriously.directionblur.js b/effects/seriously.directionblur.js index 7363936..8050d92 100644 --- a/effects/seriously.directionblur.js +++ b/effects/seriously.directionblur.js @@ -92,7 +92,7 @@ http://v002.info/plugins/v002-blurs/ 'const vec2 zero = vec2(0.0);', 'varying vec2 vTexCoord;', - 'varying vec4 vTexCoords[4];', + 'varying vec2 vTexCoords[8];', 'void main(void) {', // first convert to screen space @@ -105,35 +105,32 @@ http://v002.info/plugins/v002-blurs/ ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', ' vTexCoord = texCoord;', - ' vec2 one = vec2(1.0) * inputScale;', + ' vec2 one = vec2(inputScale);', ' if (inputScale < 1.0) {', ' one -= 1.0 / resolution;', ' }', - ' vTexCoord = max(zero, min(one, texCoord.st * inputScale));', + ' vTexCoord = max(zero, min(one, texCoord * inputScale));', ' vec2 amount = vec2(cos(angle), sin(angle)) * amount * 5.0 / resolution;', ' for (int i = 0; i < 4; i++) {', ' float s = pow(3.0, float(i));', - ' vTexCoords[i].xy = max(zero, min(one, vTexCoord + amount * s));', - ' vTexCoords[i].zw = max(zero, min(one, vTexCoord - amount * s));', + ' vTexCoords[i * 2] = max(zero, min(one, vTexCoord + amount * s));', + ' vTexCoords[i * 2 + 1] = max(zero, min(one, vTexCoord - amount * s));', ' }', '}' ].join('\n'); shaderSource.fragment = [ 'precision mediump float;\n', - 'uniform sampler2D source;', - 'uniform float angle;', - 'uniform float amount;', + 'uniform lowp sampler2D source;', 'uniform float blendGamma;', 'varying vec2 vTexCoord;', - 'varying vec4 vTexCoords[4];', + 'varying vec2 vTexCoords[8];', 'vec3 exp;', - 'vec4 sample(sampler2D sampler, vec2 coord) {', - ' vec4 pixel = texture2D(sampler, coord);', + 'vec4 sample(lowp vec4 pixel) {', ' pixel.rgb = pow(pixel.rgb, exp);', ' return pixel;', '}', @@ -142,11 +139,10 @@ http://v002.info/plugins/v002-blurs/ ' exp = vec3(blendGamma);', - ' gl_FragColor = sample(source, vTexCoord) / 9.0;', + ' gl_FragColor = sample(texture2D(source, vTexCoord)) / 9.0;', - ' for (int i = 0; i < 4; i++) {', - ' gl_FragColor += sample(source, vTexCoords[i].xy) / 9.0;', - ' gl_FragColor += sample(source, vTexCoords[i].zw) / 9.0;', + ' for (int i = 0; i < 8; i++) {', + ' gl_FragColor += sample(texture2D(source, vTexCoords[i])) / 9.0;', ' }', ' gl_FragColor.rgb = pow(gl_FragColor.rgb, 1.0 / exp);', From a36d5e9a043579d2e34a594060eb2e9a6334fdd7 Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Mon, 22 Aug 2016 12:57:59 -0400 Subject: [PATCH 09/18] Fix alpha blending in layers effect --- effects/seriously.layers.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/effects/seriously.layers.js b/effects/seriously.layers.js index 50c7381..115ab5e 100644 --- a/effects/seriously.layers.js +++ b/effects/seriously.layers.js @@ -155,8 +155,8 @@ topOpts.blendEquation = gl.FUNC_ADD; topOpts.srcRGB = gl.SRC_ALPHA; topOpts.dstRGB = gl.ONE_MINUS_SRC_ALPHA; - topOpts.srcAlpha = gl.SRC_ALPHA; - topOpts.dstAlpha = gl.DST_ALPHA; + topOpts.srcAlpha = gl.ONE; + topOpts.dstAlpha = gl.ONE_MINUS_SRC_ALPHA; }, commonShader: true, shader: function (inputs, shaderSource) { From 6ae8b18dc08074d09941d0b1973363668028147a Mon Sep 17 00:00:00 2001 From: Brian Chirls Date: Fri, 26 Aug 2016 11:14:36 -0400 Subject: [PATCH 10/18] Bug fix: blend effect shows repeating pixels with translated images of different sizes #131 --- effects/seriously.blend.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/effects/seriously.blend.js b/effects/seriously.blend.js index 24fc9ac..08f8ff4 100644 --- a/effects/seriously.blend.js +++ b/effects/seriously.blend.js @@ -264,6 +264,9 @@ 'uniform sampler2D source;', 'uniform float opacity;', 'void main(void) {', + ' if (vTexCoord.x < 0.0 || vTexCoord.x > 1.0 || vTexCoord.y < 0.0 || vTexCoord.y > 1.0) {', + ' discard;', + ' }', ' gl_FragColor = texture2D(source, vTexCoord);', ' gl_FragColor.a *= opacity;', '}' @@ -275,7 +278,6 @@ topUniforms = null; bottomUniforms = null; - //todo: need separate texture coords for different size top/bottom images shaderSource.vertex = [ '#define SHADER_NAME seriously.blend.' + mode, 'precision mediump float;', @@ -475,10 +477,14 @@ ' return vec4(pow(color.rgb, gamma), color.a);', '}', + 'bool inBounds(vec2 uv) {', + ' return uv.x >= 0.0 && uv.x <= 1.0 && uv.y >= 0.0 && uv.y <= 1.0;', + '}', + 'void main(void) {', ' vec3 exp = vec3(blendGamma);', - ' vec4 topPixel = linear(texture2D(top, texCoordTop), exp);', - ' vec4 bottomPixel = texture2D(bottom, texCoordBottom);', + ' vec4 topPixel = inBounds(texCoordTop) ? linear(texture2D(top, texCoordTop), exp) : vec4(0.0);', + ' vec4 bottomPixel = inBounds(texCoordBottom) ? texture2D(bottom, texCoordBottom) : vec4(0.0);', ' if (topPixel.a == 0.0) {', ' gl_FragColor = bottomPixel;', From 67a50d921d3251ed94371b3fe05d21f8f5103772 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mario=20Ju=C3=A1rez?= Date: Fri, 2 Dec 2016 11:32:49 +0100 Subject: [PATCH 11/18] Fix divide-by-zero bug in chroma effect at some Android devices --- effects/seriously.chroma.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/effects/seriously.chroma.js b/effects/seriously.chroma.js index d944624..b137cf5 100644 --- a/effects/seriously.chroma.js +++ b/effects/seriously.chroma.js @@ -101,7 +101,7 @@ */ ' float alpha = max(0.0, 1.0 - pixelSat / screenSat);', ' alpha = smoothstep(clipBlack, clipWhite, alpha);', - ' vec4 semiTransparentPixel = vec4((sourcePixel.rgb - (1.0 - alpha) * screen.rgb * screenWeight) / max(0.00001, alpha), alpha);', + ' vec4 semiTransparentPixel = vec4((sourcePixel.rgb - (1.0 - alpha) * screen.rgb * screenWeight) / max(0.0001, alpha), alpha);', ' vec4 pixel = mix(semiTransparentPixel, sourcePixel, solid);', From f9d7a2fc1311fafeb584552f504f476ba9d10605 Mon Sep 17 00:00:00 2001 From: Yehonatan Daniv Date: Thu, 7 Sep 2017 17:28:42 +0300 Subject: [PATCH 12/18] WIP modularizing --- .editorconfig | 10 + .gitignore | 1 + effects/seriously.ascii.js | 186 - effects/seriously.blend.js | 633 - effects/seriously.blur.js | 259 - effects/seriously.channels.js | 380 - effects/seriously.crop.js | 158 - effects/seriously.directionblur.js | 256 - effects/seriously.displacement.js | 195 - effects/seriously.expression.js | 547 - effects/seriously.gradientwipe.js | 190 - effects/seriously.layers.js | 255 - effects/seriously.opticalflow.js | 145 - effects/seriously.repeat.js | 204 - effects/seriously.select.js | 178 - effects/seriously.split.js | 281 - effects/seriously.tvglitch.js | 310 - effects/seriously.whitebalance.js | 249 - examples/accumulator/index.html | 4 +- examples/amd/index.html | 6 +- examples/animate/index.html | 2 +- examples/blend/index.html | 4 +- examples/blur/blur.html | 2 +- examples/blur/directionblur.html | 2 +- examples/blur/whip.html | 4 +- examples/camera/camera-source.html | 4 +- examples/camera/index.html | 2 +- examples/channels/index.html | 4 +- examples/color/color.html | 2 +- examples/color/linear-transfer.html | 2 +- examples/color/lut.html | 2 +- examples/crop.html | 2 +- examples/demo/drunk.html | 6 +- examples/demo/fog.html | 12 +- examples/demo/panorama.html | 6 +- examples/demo/select.html | 4 +- examples/demo/threejs-source.html | 28 +- examples/demo/threejs-target.html | 8 +- examples/displace/index.html | 4 +- examples/gradientwipe.html | 6 +- examples/mirror/camera.html | 4 +- examples/mirror/index.html | 2 +- examples/opticalflow.html | 4 +- examples/target/multi-target.html | 8 +- examples/transform/camerashake.html | 2 +- examples/tutorial/tutorial01-datauri.html | 6 +- examples/tutorial/tutorial01.html | 6 +- index.html | 88 +- package-lock.json | 477 + package.json | 40 + rollup.config.js | 22 + seriously.js | 10336 +++++++--------- src/constants.js | 175 + src/effect-node.js | 1188 ++ .../effects}/seriously.accumulator.js | 108 +- src/effects/seriously.ascii.js | 190 + .../effects}/seriously.bleach-bypass.js | 6 +- src/effects/seriously.blend.js | 637 + src/effects/seriously.blur.js | 263 + .../effects}/seriously.brightness-contrast.js | 6 +- src/effects/seriously.channels.js | 385 + .../effects}/seriously.checkerboard.js | 8 +- {effects => src/effects}/seriously.chroma.js | 6 +- .../effects}/seriously.color-select.js | 38 +- {effects => src/effects}/seriously.color.js | 10 +- .../effects}/seriously.colorcomplements.js | 6 +- .../effects}/seriously.colorcube.js | 6 +- src/effects/seriously.crop.js | 162 + .../effects}/seriously.daltonize.js | 70 +- src/effects/seriously.directionblur.js | 260 + src/effects/seriously.displacement.js | 199 + {effects => src/effects}/seriously.dither.js | 14 +- {effects => src/effects}/seriously.edge.js | 14 +- {effects => src/effects}/seriously.emboss.js | 6 +- .../effects}/seriously.exposure.js | 6 +- src/effects/seriously.expression.js | 736 ++ {effects => src/effects}/seriously.fader.js | 6 +- .../effects}/seriously.falsecolor.js | 6 +- .../effects}/seriously.filmgrain.js | 8 +- {effects => src/effects}/seriously.freeze.js | 6 +- {effects => src/effects}/seriously.fxaa.js | 12 +- src/effects/seriously.gradientwipe.js | 194 + {effects => src/effects}/seriously.hex.js | 6 +- .../effects}/seriously.highlights-shadows.js | 6 +- .../effects}/seriously.hue-saturation.js | 12 +- {effects => src/effects}/seriously.invert.js | 6 +- .../effects}/seriously.kaleidoscope.js | 6 +- src/effects/seriously.layers.js | 259 + .../effects}/seriously.linear-transfer.js | 6 +- {effects => src/effects}/seriously.lumakey.js | 6 +- {effects => src/effects}/seriously.lut.js | 6 +- {effects => src/effects}/seriously.mirror.js | 6 +- .../effects}/seriously.nightvision.js | 44 +- {effects => src/effects}/seriously.noise.js | 6 +- src/effects/seriously.opticalflow.js | 149 + .../effects}/seriously.panorama.js | 6 +- .../effects}/seriously.pixelate.js | 6 +- {effects => src/effects}/seriously.polar.js | 6 +- src/effects/seriously.repeat.js | 208 + {effects => src/effects}/seriously.ripple.js | 6 +- .../effects}/seriously.scanlines.js | 36 +- src/effects/seriously.select.js | 182 + {effects => src/effects}/seriously.sepia.js | 14 +- {effects => src/effects}/seriously.simplex.js | 6 +- {effects => src/effects}/seriously.sketch.js | 10 +- src/effects/seriously.split.js | 285 + .../effects}/seriously.temperature.js | 6 +- .../effects}/seriously.throttle.js | 6 +- {effects => src/effects}/seriously.tone.js | 6 +- src/effects/seriously.tvglitch.js | 314 + .../effects}/seriously.vibrance.js | 6 +- .../effects}/seriously.vignette.js | 6 +- src/effects/seriously.whitebalance.js | 253 + src/helpers/framebuffer.js | 134 + src/helpers/shaderprogram.js | 214 + src/logger.js | 37 + src/node.js | 231 + src/seriously.js | 1642 +++ src/source-node.js | 449 + .../sources/array.js | 0 .../sources/camera.js | 4 +- .../sources/depth.js | 4 +- .../sources/imagedata.js | 2 +- .../sources/three.js | 0 src/sources/video.js | 131 + src/target-node.js | 544 + src/transform-node.js | 672 + src/transforms/camerashake.js | 447 + src/transforms/flip.js | 56 + src/transforms/reformat.js | 177 + src/transforms/transform2d.js | 404 + src/transforms/transform3d.js | 566 + src/utilities/dom.js | 196 + src/utilities/logic.js | 147 + src/utilities/math.js | 201 + src/utilities/shaders/simplex-noise.js | 240 + src/utilities/webgl.js | 130 + test/index.html | 16 +- test/seriously.unit.js | 6 +- transforms/seriously.camerashake.js | 471 - transforms/seriously.transform3d.js | 587 - 141 files changed, 18406 insertions(+), 11461 deletions(-) create mode 100644 .editorconfig create mode 100644 .gitignore delete mode 100644 effects/seriously.ascii.js delete mode 100644 effects/seriously.blend.js delete mode 100644 effects/seriously.blur.js delete mode 100644 effects/seriously.channels.js delete mode 100755 effects/seriously.crop.js delete mode 100644 effects/seriously.directionblur.js delete mode 100644 effects/seriously.displacement.js delete mode 100644 effects/seriously.expression.js delete mode 100644 effects/seriously.gradientwipe.js delete mode 100644 effects/seriously.layers.js delete mode 100644 effects/seriously.opticalflow.js delete mode 100644 effects/seriously.repeat.js delete mode 100644 effects/seriously.select.js delete mode 100644 effects/seriously.split.js delete mode 100644 effects/seriously.tvglitch.js delete mode 100644 effects/seriously.whitebalance.js create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 rollup.config.js create mode 100644 src/constants.js create mode 100644 src/effect-node.js rename {effects => src/effects}/seriously.accumulator.js (83%) create mode 100644 src/effects/seriously.ascii.js rename {effects => src/effects}/seriously.bleach-bypass.js (95%) create mode 100644 src/effects/seriously.blend.js create mode 100644 src/effects/seriously.blur.js rename {effects => src/effects}/seriously.brightness-contrast.js (94%) create mode 100644 src/effects/seriously.channels.js rename {effects => src/effects}/seriously.checkerboard.js (96%) rename {effects => src/effects}/seriously.chroma.js (98%) rename {effects => src/effects}/seriously.color-select.js (91%) rename {effects => src/effects}/seriously.color.js (95%) rename {effects => src/effects}/seriously.colorcomplements.js (97%) rename {effects => src/effects}/seriously.colorcube.js (96%) create mode 100755 src/effects/seriously.crop.js rename {effects => src/effects}/seriously.daltonize.js (65%) create mode 100644 src/effects/seriously.directionblur.js create mode 100644 src/effects/seriously.displacement.js rename {effects => src/effects}/seriously.dither.js (90%) rename {effects => src/effects}/seriously.edge.js (93%) rename {effects => src/effects}/seriously.emboss.js (95%) rename {effects => src/effects}/seriously.exposure.js (92%) create mode 100644 src/effects/seriously.expression.js rename {effects => src/effects}/seriously.fader.js (93%) rename {effects => src/effects}/seriously.falsecolor.js (93%) rename {effects => src/effects}/seriously.filmgrain.js (96%) rename {effects => src/effects}/seriously.freeze.js (90%) rename {effects => src/effects}/seriously.fxaa.js (95%) create mode 100644 src/effects/seriously.gradientwipe.js rename {effects => src/effects}/seriously.hex.js (96%) rename {effects => src/effects}/seriously.highlights-shadows.js (95%) rename {effects => src/effects}/seriously.hue-saturation.js (93%) rename {effects => src/effects}/seriously.invert.js (91%) rename {effects => src/effects}/seriously.kaleidoscope.js (94%) create mode 100644 src/effects/seriously.layers.js rename {effects => src/effects}/seriously.linear-transfer.js (93%) rename {effects => src/effects}/seriously.lumakey.js (94%) rename {effects => src/effects}/seriously.lut.js (95%) rename {effects => src/effects}/seriously.mirror.js (91%) rename {effects => src/effects}/seriously.nightvision.js (59%) rename {effects => src/effects}/seriously.noise.js (95%) create mode 100644 src/effects/seriously.opticalflow.js rename {effects => src/effects}/seriously.panorama.js (97%) rename {effects => src/effects}/seriously.pixelate.js (92%) rename {effects => src/effects}/seriously.polar.js (93%) create mode 100644 src/effects/seriously.repeat.js rename {effects => src/effects}/seriously.ripple.js (94%) rename {effects => src/effects}/seriously.scanlines.js (60%) create mode 100644 src/effects/seriously.select.js rename {effects => src/effects}/seriously.sepia.js (84%) rename {effects => src/effects}/seriously.simplex.js (96%) rename {effects => src/effects}/seriously.sketch.js (94%) create mode 100644 src/effects/seriously.split.js rename {effects => src/effects}/seriously.temperature.js (96%) rename {effects => src/effects}/seriously.throttle.js (92%) rename {effects => src/effects}/seriously.tone.js (95%) create mode 100644 src/effects/seriously.tvglitch.js rename {effects => src/effects}/seriously.vibrance.js (95%) rename {effects => src/effects}/seriously.vignette.js (92%) create mode 100644 src/effects/seriously.whitebalance.js create mode 100644 src/helpers/framebuffer.js create mode 100644 src/helpers/shaderprogram.js create mode 100644 src/logger.js create mode 100644 src/node.js create mode 100644 src/seriously.js create mode 100644 src/source-node.js rename sources/seriously.array.js => src/sources/array.js (100%) rename sources/seriously.camera.js => src/sources/camera.js (96%) rename sources/seriously.depth.js => src/sources/depth.js (98%) rename sources/seriously.imagedata.js => src/sources/imagedata.js (99%) rename sources/seriously.three.js => src/sources/three.js (100%) create mode 100644 src/sources/video.js create mode 100644 src/target-node.js create mode 100644 src/transform-node.js create mode 100644 src/transforms/camerashake.js create mode 100644 src/transforms/flip.js create mode 100644 src/transforms/reformat.js create mode 100644 src/transforms/transform2d.js create mode 100644 src/transforms/transform3d.js create mode 100644 src/utilities/dom.js create mode 100644 src/utilities/logic.js create mode 100644 src/utilities/math.js create mode 100644 src/utilities/shaders/simplex-noise.js create mode 100644 src/utilities/webgl.js delete mode 100644 transforms/seriously.camerashake.js delete mode 100644 transforms/seriously.transform3d.js diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..b16c170 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,10 @@ +root = true + +[*.{js,json}] +indent_style = tab +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..9f11b75 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.idea/ diff --git a/effects/seriously.ascii.js b/effects/seriously.ascii.js deleted file mode 100644 index 7fee535..0000000 --- a/effects/seriously.ascii.js +++ /dev/null @@ -1,186 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - /* - todo: consider an alternative algorithm: - http://tllabs.io/asciistreetview/ - http://sol.gfxile.net/textfx/index.html - */ - - var identity, letters; - - letters = document.createElement('img'); - letters.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAvAAAAAICAYAAACf+MsnAAAFY0lEQVR4Xu2Z644bOwyDN+//0NsOigEMQdRHyU6CFDnA+bHVWNaFojiTx8/Pz+/f/4/89/v7z9Xj8Tjib3XyTN9usFcMz8gt3h9zXf/O6nD/W1V7Vb9uXad+nHucZ9xenX7OqTHdSfmRXfmPsSn8xPMrllcfCkdVfHSe7Ned0/yp7jv2GPfqK+MCByc0zzvxKi5RPq8cuvE4+JrwpFM7N78K2yu+qb9kd3qV+ZjUx5n/+xnXP81ctW/UHQ5P3Gd360vxKf+n8dGpxXTeKu6h2ansFT6pvo5G2/FP99NsUf9d/xleInfetcj629m9cf9WOV5K+78R8ERGRLYO8VQiecd/1vwKEJV46JBJRzhRfXftVL/MTgM48UmL0l2OSmzs9kctAJfE4/1KkNFzbj8cjFHsJ/u460vhnPDfqddujJ27poLCWWBuHt0YKr/ki+yOKJnk5Z7pPLfLf4TZif+qvi7XuDWg+HbtNEe79ds9H7m1m2/3+YzLK5Hc9e/gYxdfNP+ZfdV9lT3usWn+9310/qiAdxa1O5gTEqVhoLudxVwVNPrvCqDp/ZX4d0Uk1Y7sbgyU4zooCk8nB3i9Y61V5wWpIjDlP+ZJsxPvmLxEOD2sntk5Pz1LBOb0L+sPfQGs6ksYpt7QAiHuUwtkgl+F3Qyf2YxTX53+Vdjfjc8VYIq7KT+abzof7ervZ8fX8d/Jyc3PmTcnRrrPEbyVTnD8T+Y38pH624mfNIr6muzO95S/sh1Gvog/XmW/a6N+scww43zgqLjcOX9cwFeESQK3Gpx32QggTlwk8Ei8OXfE4VMLeCLQiLBjfJM7VA069XefnZBGJz7Vr24dK3GwEoqLD7p/1+4IMWdRdxaMK9CmP4E62F7nm8S7s4B3BMCkBzQPVQ0IM06+2WLvzlDlI+NfF4d0ljiHuF/Zb/4m/4ojTgnA6f0qfiWA135P5l/NoFv/7txm+5ZyyOw0e1R/skd8ZKKwwnjXf9xLrkBV+2x3Pib9Vz3JOMaNL/KZ+oCkXhDUTLxEwLsC41OfI5DEYe9+mXfr0l2mJH5ISHTOUw2U8IjD5LyVUtxEmrvi4V5ejvijWNWicBbOyfsrYejkMMXmdIFEAZH19ASWnNyrPlBdKH+yU3y0gGjGKf4Mv51ft9zzKk83vul5qr9r7+CT9gHx2zvs0/yofpGX1AuC4svqhYJeJJydNZk/urcSxet91dfiUy94HX6oBHCHi5+F38svCeg1h+zZ6nyF5VUzVC8Q0X9LwE/IkMjmpJ3i27XvxuqQ0c4dp/JTfnb9T847AoNIW/nokIYrYKvnJvln/siPwtD0XAeTU+x0luEugWdLNeY4ecl260vxK8Efl3OnZi4uaZZIMBFeJ/hw6xrFvppvV1Q559d8MwwR50cskIBQ2KhE3y7/ZeddAUjxOr3diZ/8U3+I953z7uzR7Lj4rvjl9HxXvaHaOflSfSkf93y24xx94PpX89I5H2t9+fwK+KVzNOwdIeM+e905+ZqqRIj7pYHiU3FNFnBnkO+41EKige3cpX7GunwoARfjIwKrxNhEJFLfMrsbI+G/smfkojAa60vxPcNeCZCqhjSra6ydBaAWSFzaqnb01c4VEdVCWWPM7svstKDWuKrZpwUb7dVsOzPcxUeGdYdfdgV8Vr+Mv1R8Tn/iHcSNWR8jjjv9URzama9qbp0XlBP4y2Jw6u/E577AZTVz/BM/OfySzSjl79o73FRxaFdfuPG5/XE58PbXEvAT8UBn1HKuSIB8ThYwiZfJnd8z768Aib/3R/iN4J0VeMXcVwvynbl/735OBV6BKTfyT+e/T4/f7dP3uW8F3Aqs/PIHbWXeeeKjnSsAAAAASUVORK5CYII='; - identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - - Seriously.plugin('ascii', function () { - var baseShader, - scaledBuffer, - lettersTexture, - gl, - width, - height, - scaledWidth, - scaledHeight, - unif = {}, - me = this; - - function resize() { - //set up scaledBuffer if (width or height have changed) - height = me.height; - width = me.width; - scaledWidth = Math.ceil(width / 8); - scaledHeight = Math.ceil(height / 8); - - unif.resolution = me.uniforms.resolution; - unif.transform = identity; - - if (scaledBuffer) { - scaledBuffer.resize(scaledWidth, scaledHeight); - } - } - - return { - initialize: function (parent) { - function setLetters() { - gl.bindTexture(gl.TEXTURE_2D, lettersTexture); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); - 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.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true); - gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, letters); - gl.bindTexture(gl.TEXTURE_2D, null); - } - - var me = this; - - parent(); - this.texture = this.frameBuffer.texture; - - gl = this.gl; - - lettersTexture = gl.createTexture(); - if (letters.naturalWidth) { - setLetters(); - } else { - letters.addEventListener('load', function () { - setLetters(); - me.setDirty(); - }); - } - - unif.letters = lettersTexture; - - //when the output scales up, don't smooth it out - gl.bindTexture(gl.TEXTURE_2D, this.texture || this.frameBuffer && this.frameBuffer.texture); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); - gl.bindTexture(gl.TEXTURE_2D, null); - - resize(); - - scaledBuffer = new Seriously.util.FrameBuffer(gl, scaledWidth, scaledHeight); - - //so it stays blocky - gl.bindTexture(gl.TEXTURE_2D, scaledBuffer.texture); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); - - this.uniforms.transform = identity; - - baseShader = this.baseShader; - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.fragment = [ - 'precision mediump float;', - - 'varying vec2 vTexCoord;', - - 'uniform sampler2D source;', - 'uniform sampler2D letters;', - 'uniform vec4 background;', - 'uniform vec2 resolution;', - - 'const vec3 lumcoeff = vec3(0.2125, 0.7154, 0.0721);', - 'const vec2 fontSize = vec2(8.0, 8.0);', - - 'vec4 lookup(float ascii) {', - ' vec2 pos = mod(vTexCoord * resolution, fontSize) / vec2(752.0, fontSize.x) + vec2(ascii, 0.0);', - ' return texture2D(letters, pos);', - '}', - - 'void main(void) {', - ' vec4 sample = texture2D(source, vTexCoord);', - ' vec4 clamped = vec4(floor(sample.rgb * 8.0) / 8.0, sample.a);', - - ' float luma = dot(sample.rgb,lumcoeff);', - ' float char = floor(luma * 94.0) / 94.0;', - - ' gl_FragColor = mix(background, clamped, lookup(char).r);', - '}' - ].join('\n'); - - return shaderSource; - }, - resize: resize, - draw: function (shader, model, uniforms, frameBuffer, draw) { - draw(baseShader, model, uniforms, scaledBuffer.frameBuffer, false, { - width: scaledWidth, - height: scaledHeight, - blend: false - }); - - unif.source = scaledBuffer.texture; - unif.background = uniforms.background; - - draw(shader, model, unif, frameBuffer); - }, - destroy: function () { - if (scaledBuffer) { - scaledBuffer.destroy(); - } - if (gl && lettersTexture) { - gl.deleteTexture(lettersTexture); - } - } - }; - }, - { - inPlace: false, - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: false - }, - background: { - type: 'color', - uniform: 'background', - defaultValue: [0, 0, 0, 1] - } - }, - description: 'Display image as ascii text in 8-bit color.', - title: 'Ascii Text' - }); -})); diff --git a/effects/seriously.blend.js b/effects/seriously.blend.js deleted file mode 100644 index 08f8ff4..0000000 --- a/effects/seriously.blend.js +++ /dev/null @@ -1,633 +0,0 @@ -/* global define, require, exports, Float32Array */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - /* - todo: if transforms are used, do multiple passes and enable depth testing? - todo: for now, only supporting float blend modes. Add complex ones - todo: apply proper credit and license - - Adapted from blend mode shader by Romain Dura - http://mouaif.wordpress.com/2009/01/05/photoshop-math-with-glsl-shaders/ - */ - - function vectorBlendFormula(formula, base, blend) { - function replace(channel) { - var r = { - base: (base || 'base') + '.' + channel, - blend: (blend || 'blend') + '.' + channel - }; - return function (match) { - return r[match] || match; - }; - } - - return 'vec3(' + - formula.replace(/blend|base/g, replace('r')) + ', ' + - formula.replace(/blend|base/g, replace('g')) + ', ' + - formula.replace(/blend|base/g, replace('b')) + - ')'; - } - - var blendModes = { - normal: 'blend', - lighten: 'max(blend, base)', - darken: 'min(blend, base)', - multiply: '(base * blend)', - average: '(base + blend / TWO)', - add: 'min(base + blend, ONE)', - subtract: 'max(base - blend, ZERO)', - divide: 'base / blend', - difference: 'abs(base - blend)', - negation: '(ONE - abs(ONE - base - blend))', - exclusion: '(base + blend - TWO * base * blend)', - screen: '(ONE - ((ONE - base) * (ONE - blend)))', - lineardodge: 'min(base + blend, ONE)', - phoenix: '(min(base, blend) - max(base, blend) + ONE)', - linearburn: 'max(base + blend - ONE, ZERO)', - - hue: 'BlendHue(base, blend)', - saturation: 'BlendSaturation(base, blend)', - color: 'BlendColor(base, blend)', - luminosity: 'BlendLuminosity(base, blend)', - darkercolor: 'BlendDarkerColor(base, blend)', - lightercolor: 'BlendLighterColor(base, blend)', - - overlay: vectorBlendFormula('base < 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend))'), - softlight: vectorBlendFormula('blend < 0.5 ? (2.0 * base * blend + base * base * (1.0 - 2.0 * blend)) : (sqrt(base) * (2.0 * blend - 1.0) + 2.0 * base * (1.0 - blend))'), - hardlight: vectorBlendFormula('base < 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend))', 'blend', 'base'), - colordodge: vectorBlendFormula('blend == 1.0 ? blend : min(base / (1.0 - blend), 1.0)'), - colorburn: vectorBlendFormula('blend == 0.0 ? blend : max((1.0 - ((1.0 - base) / blend)), 0.0)'), - linearlight: vectorBlendFormula('BlendLinearLightf(base, blend)'), - vividlight: vectorBlendFormula('BlendVividLightf(base, blend)'), - pinlight: vectorBlendFormula('BlendPinLightf(base, blend)'), - hardmix: vectorBlendFormula('BlendHardMixf(base, blend)'), - reflect: vectorBlendFormula('BlendReflectf(base, blend)'), - glow: vectorBlendFormula('BlendReflectf(blend, base)') - }, - nativeBlendModes = { - //native blend modes removed for now, because they don't work with linear blending - // normal: ['FUNC_ADD', 'SRC_ALPHA', 'ONE_MINUS_SRC_ALPHA', 'SRC_ALPHA', 'DST_ALPHA'] - //todo: add, multiply, screen - }, - identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - - Seriously.plugin('blend', function () { - var topUniforms, - bottomUniforms, - topOpts = { - clear: false - }, - inputs, - gl; - - function updateDrawFunction() { - var nativeMode = inputs && nativeBlendModes[inputs.mode]; - if (nativeMode && gl) { - topOpts.blendEquation = gl[nativeMode[0]]; - topOpts.srcRGB = gl[nativeMode[1]]; - topOpts.dstRGB = gl[nativeMode[2]]; - topOpts.srcAlpha = gl[nativeMode[3]]; - topOpts.dstAlpha = gl[nativeMode[4]]; - } - } - - // custom resize method - this.resize = function () { - var width, - height, - mode = this.inputs.sizeMode, - node, - fn, - i, - bottom = this.inputs.bottom, - top = this.inputs.top; - - if (mode === 'bottom' || mode === 'top') { - node = this.inputs[mode]; - if (node) { - width = node.width; - height = node.height; - } else { - width = 1; - height = 1; - } - } else { - if (bottom) { - if (top) { - fn = (mode === 'union' ? Math.max : Math.min); - width = fn(bottom.width, top.width); - height = fn(bottom.height, top.height); - } else { - width = bottom.width; - height = bottom.height; - } - } else if (top) { - width = top.width; - height = top.height; - } else { - width = 1; - height = 1; - } - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.uniforms.resolution[0] = width; - this.uniforms.resolution[1] = height; - - if (this.frameBuffer) { - this.frameBuffer.resize(width, height); - } - - this.emit('resize'); - this.setDirty(); - } - - this.uniforms.resBottom[0] = bottom && bottom.width || 1; - this.uniforms.resBottom[1] = bottom && bottom.height || 1; - this.uniforms.resTop[0] = top && top.width || 1; - this.uniforms.resTop[1] = top && top.height || 1; - - if (topUniforms) { - if (bottom) { - bottomUniforms.resolution[0] = bottom.width; - bottomUniforms.resolution[1] = bottom.height; - } - if (top) { - topUniforms.resolution[0] = top.width; - topUniforms.resolution[1] = top.height; - } - } - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - }; - - this.uniforms.resTop = [1, 1]; - this.uniforms.resBottom = [1, 1]; - - return { - initialize: function (initialize) { - inputs = this.inputs; - initialize(); - gl = this.gl; - updateDrawFunction(); - }, - shader: function (inputs, shaderSource) { - var mode = inputs.mode || 'normal', - node; - mode = mode.toLowerCase(); - - if (nativeBlendModes[mode]) { - //todo: move this to an 'update' event for 'mode' input - if (!topUniforms) { - node = this.inputs.top; - topUniforms = { - resolution: [ - node && node.width || 1, - node && node.height || 1 - ], - targetRes: this.uniforms.resolution, - source: node, - transform: node && node.cumulativeMatrix || identity, - opacity: this.inputs.opacity - }; - - node = this.inputs.bottom; - bottomUniforms = { - resolution: [ - node && node.width || 1, - node && node.height || 1 - ], - targetRes: this.uniforms.resolution, - source: node, - transform: node && node.cumulativeMatrix || identity, - opacity: 1 - }; - } - - shaderSource.vertex = [ - '#define SHADER_NAME seriously.blend.' + mode, - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 targetRes;', - 'uniform mat4 transform;', - - 'varying vec2 vTexCoord;', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' gl_Position.xy *= resolution / targetRes;', - ' gl_Position.w = screenPosition.w;', - ' vTexCoord = texCoord;', - '}\n' - ].join('\n'); - - shaderSource.fragment = [ - '#define SHADER_NAME seriously.blend.' + mode, - 'precision mediump float;', - 'varying vec2 vTexCoord;', - 'uniform sampler2D source;', - 'uniform float opacity;', - 'void main(void) {', - ' if (vTexCoord.x < 0.0 || vTexCoord.x > 1.0 || vTexCoord.y < 0.0 || vTexCoord.y > 1.0) {', - ' discard;', - ' }', - ' gl_FragColor = texture2D(source, vTexCoord);', - ' gl_FragColor.a *= opacity;', - '}' - ].join('\n'); - - return shaderSource; - } - - topUniforms = null; - bottomUniforms = null; - - shaderSource.vertex = [ - '#define SHADER_NAME seriously.blend.' + mode, - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 resBottom;', - 'uniform vec2 resTop;', - - 'varying vec2 texCoordBottom;', - 'varying vec2 texCoordTop;', - - 'const vec2 HALF = vec2(0.5);', - - 'void main(void) {', - //we don't need to do a transform in this shader, since this effect is not "inPlace" - ' gl_Position = position;', - - ' vec2 adjusted = (texCoord - HALF) * resolution;', - - ' texCoordBottom = adjusted / resBottom + HALF;', - ' texCoordTop = adjusted / resTop + HALF;', - '}' - ].join('\n'); - - shaderSource.fragment = [ - '#define SHADER_NAME seriously.blend.' + mode, - 'precision mediump float;', - - 'const vec3 ZERO = vec3(0.0);', - 'const vec3 ONE = vec3(1.0);', - 'const vec3 HALF = vec3(0.5);', - 'const vec3 TWO = vec3(2.0);', - - /* - Linear Light is another contrast-increasing mode - If the blend color is darker than midgray, Linear Light darkens the image - by decreasing the brightness. If the blend color is lighter than midgray, - the result is a brighter image due to increased brightness. - */ - - '#define BlendAddf(base, blend) min(base + blend, 1.0)', - '#define BlendLinearDodgef(base, blend) BlendAddf(base, blend)', - '#define BlendLinearBurnf(base, blend) max(base + blend - 1.0, 0.0)', - '#define BlendLightenf(base, blend) max(blend, base)', - '#define BlendDarkenf(base, blend) min(blend, base)', - '#define BlendLinearLightf(base, blend) (blend < 0.5 ? BlendLinearBurnf(base, (2.0 * blend)) : BlendLinearDodgef(base, (2.0 * (blend - 0.5))))', - '#define BlendScreenf(base, blend) (1.0 - ((1.0 - base) * (1.0 - blend)))', - '#define BlendOverlayf(base, blend) (base < 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend)))', - '#define BlendSoftLightf(base, blend) ((blend < 0.5) ? (2.0 * base * blend + base * base * (1.0 - 2.0 * blend)) : (sqrt(base) * (2.0 * blend - 1.0) + 2.0 * base * (1.0 - blend)))', - '#define BlendColorDodgef(base, blend) ((blend == 1.0) ? blend : min(base / (1.0 - blend), 1.0))', - '#define BlendColorBurnf(base, blend) ((blend == 0.0) ? blend : max((1.0 - ((1.0 - base) / blend)), 0.0))', - '#define BlendVividLightf(base, blend) ((blend < 0.5) ? BlendColorBurnf(base, (2.0 * blend)) : BlendColorDodgef(base, (2.0 * (blend - 0.5))))', - '#define BlendPinLightf(base, blend) ((blend < 0.5) ? BlendDarkenf(base, (2.0 * blend)) : BlendLightenf(base, (2.0 *(blend - 0.5))))', - '#define BlendHardMixf(base, blend) ((BlendVividLightf(base, blend) < 0.5) ? 0.0 : 1.0)', - '#define BlendReflectf(base, blend) ((blend == 1.0) ? blend : min(base * base / (1.0 - blend), 1.0))', - - /* - RGB/HSL conversion functions needed for Color, Saturation, Hue, Luminosity, etc. - */ - - 'vec3 RGBToHSL(vec3 color) {', - ' vec3 hsl;', // init to 0 to avoid warnings ? (and reverse if + remove first part) - - ' float fmin = min(min(color.r, color.g), color.b);', //Min. value of RGB - ' float fmax = max(max(color.r, color.g), color.b);', //Max. value of RGB - ' float delta = fmax - fmin;', //Delta RGB value - - ' hsl.z = (fmax + fmin) / 2.0;', // Luminance - - ' if (delta == 0.0) {', //This is a gray, no chroma... - ' hsl.x = 0.0;', // Hue - ' hsl.y = 0.0;', // Saturation - ' } else {', //Chromatic data... - ' if (hsl.z < 0.5)', - ' hsl.y = delta / (fmax + fmin);', // Saturation - ' else', - ' hsl.y = delta / (2.0 - fmax - fmin);', // Saturation - - ' float deltaR = (((fmax - color.r) / 6.0) + (delta / 2.0)) / delta;', - ' float deltaG = (((fmax - color.g) / 6.0) + (delta / 2.0)) / delta;', - ' float deltaB = (((fmax - color.b) / 6.0) + (delta / 2.0)) / delta;', - - ' if (color.r == fmax )', - ' hsl.x = deltaB - deltaG;', // Hue - ' else if (color.g == fmax)', - ' hsl.x = (1.0 / 3.0) + deltaR - deltaB;', // Hue - ' else if (color.b == fmax)', - ' hsl.x = (2.0 / 3.0) + deltaG - deltaR;', // Hue - - ' if (hsl.x < 0.0)', - ' hsl.x += 1.0;', // Hue - ' else if (hsl.x > 1.0)', - ' hsl.x -= 1.0;', // Hue - ' }', - - ' return hsl;', - '}', - - 'float HueToRGB(float f1, float f2, float hue) {', - ' if (hue < 0.0)', - ' hue += 1.0;', - ' else if (hue > 1.0)', - ' hue -= 1.0;', - ' float res;', - ' if ((6.0 * hue) < 1.0)', - ' res = f1 + (f2 - f1) * 6.0 * hue;', - ' else if ((2.0 * hue) < 1.0)', - ' res = f2;', - ' else if ((3.0 * hue) < 2.0)', - ' res = f1 + (f2 - f1) * ((2.0 / 3.0) - hue) * 6.0;', - ' else', - ' res = f1;', - ' return res;', - '}', - - 'vec3 HSLToRGB(vec3 hsl) {', - ' vec3 rgb;', - - ' if (hsl.y == 0.0)', - ' rgb = vec3(hsl.z);', // Luminance - ' else {', - ' float f2;', - - ' if (hsl.z < 0.5)', - ' f2 = hsl.z * (1.0 + hsl.y);', - ' else', - ' f2 = (hsl.z + hsl.y) - (hsl.y * hsl.z);', - - ' float f1 = 2.0 * hsl.z - f2;', - - ' rgb.r = HueToRGB(f1, f2, hsl.x + (1.0/3.0));', - ' rgb.g = HueToRGB(f1, f2, hsl.x);', - ' rgb.b= HueToRGB(f1, f2, hsl.x - (1.0/3.0));', - ' }', - - ' return rgb;', - '}', - - // Hue Blend mode creates the result color by combining the luminance and saturation of the base color with the hue of the blend color. - 'vec3 BlendHue(vec3 base, vec3 blend) {', - ' vec3 baseHSL = RGBToHSL(base);', - ' return HSLToRGB(vec3(RGBToHSL(blend).r, baseHSL.g, baseHSL.b));', - '}', - - // Saturation Blend mode creates the result color by combining the luminance and hue of the base color with the saturation of the blend color. - 'vec3 BlendSaturation(vec3 base, vec3 blend) {', - ' vec3 baseHSL = RGBToHSL(base);', - ' return HSLToRGB(vec3(baseHSL.r, RGBToHSL(blend).g, baseHSL.b));', - '}', - - // Color Mode keeps the brightness of the base color and applies both the hue and saturation of the blend color. - 'vec3 BlendColor(vec3 base, vec3 blend) {', - ' vec3 blendHSL = RGBToHSL(blend);', - ' return HSLToRGB(vec3(blendHSL.r, blendHSL.g, RGBToHSL(base).b));', - '}', - - // Luminosity Blend mode creates the result color by combining the hue and saturation of the base color with the luminance of the blend color. - 'vec3 BlendLuminosity(vec3 base, vec3 blend) {', - ' vec3 baseHSL = RGBToHSL(base);', - ' return HSLToRGB(vec3(baseHSL.r, baseHSL.g, RGBToHSL(blend).b));', - '}', - - // Compares the total of all channel values for the blend and base color and displays the higher value color. - 'vec3 BlendLighterColor(vec3 base, vec3 blend) {', - ' float baseTotal = base.r + base.g + base.b;', - ' float blendTotal = blend.r + blend.g + blend.b;', - ' return blendTotal > baseTotal ? blend : base;', - '}', - - // Compares the total of all channel values for the blend and base color and displays the lower value color. - 'vec3 BlendDarkerColor(vec3 base, vec3 blend) {', - ' float baseTotal = base.r + base.g + base.b;', - ' float blendTotal = blend.r + blend.g + blend.b;', - ' return blendTotal < baseTotal ? blend : base;', - '}', - - '#define BlendFunction(base, blend) ' + blendModes[mode], - - 'varying vec2 texCoordBottom;', - 'varying vec2 texCoordTop;', - - 'uniform sampler2D top;', - 'uniform sampler2D bottom;', - 'uniform float opacity;', - 'uniform float blendGamma;', - - 'vec3 BlendOpacity(vec4 base, vec4 blend, float opacity) {', - //apply blend, then mix by (opacity * blend.a) - ' vec3 blendedColor = BlendFunction(base.rgb, blend.rgb);', - ' return mix(base.rgb, blendedColor, opacity * blend.a);', - '}', - - 'vec4 linear(vec4 color, vec3 gamma) {', - ' return vec4(pow(color.rgb, gamma), color.a);', - '}', - - 'bool inBounds(vec2 uv) {', - ' return uv.x >= 0.0 && uv.x <= 1.0 && uv.y >= 0.0 && uv.y <= 1.0;', - '}', - - 'void main(void) {', - ' vec3 exp = vec3(blendGamma);', - ' vec4 topPixel = inBounds(texCoordTop) ? linear(texture2D(top, texCoordTop), exp) : vec4(0.0);', - ' vec4 bottomPixel = inBounds(texCoordBottom) ? texture2D(bottom, texCoordBottom) : vec4(0.0);', - - ' if (topPixel.a == 0.0) {', - ' gl_FragColor = bottomPixel;', - ' } else {', - ' bottomPixel = linear(bottomPixel, exp);', - ' gl_FragColor = vec4(pow(BlendOpacity(bottomPixel, topPixel, opacity), 1.0 / exp), bottomPixel.a);', - ' }', - '}' - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, draw) { - if (nativeBlendModes[this.inputs.mode]) { - if (this.inputs.bottom) { - draw(shader, model, bottomUniforms, frameBuffer); - } else { - //just clear - gl.viewport(0, 0, this.width, this.height); - gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer); - gl.clearColor(0.0, 0.0, 0.0, 0.0); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - } - - if (this.inputs.top && this.inputs.opacity) { - draw(shader, model, topUniforms, frameBuffer, null, topOpts); - } - } else { - draw(shader, model, uniforms, frameBuffer); - } - }, - requires: function (sourceName) { - if (!this.inputs.opacity && sourceName === 'top') { - return false; - } - return true; - }, - inputs: { - top: { - type: 'image', - uniform: 'top', - update: function () { - if (topUniforms) { - topUniforms.source = this.inputs.top; - topUniforms.transform = this.inputs.top.cumulativeMatrix || identity; - } - this.resize(); - } - }, - bottom: { - type: 'image', - uniform: 'bottom', - update: function () { - if (bottomUniforms) { - bottomUniforms.source = this.inputs.bottom; - bottomUniforms.transform = this.inputs.bottom.cumulativeMatrix || identity; - } - this.resize(); - } - }, - opacity: { - type: 'number', - uniform: 'opacity', - defaultValue: 1, - min: 0, - max: 1, - updateSources: true, - update: function (opacity) { - if (topUniforms) { - topUniforms.opacity = opacity; - } - } - }, - blendGamma: { - type: 'number', - uniform: 'blendGamma', - defaultValue: 2.2, - min: 0, - max: 4 - }, - sizeMode: { - type: 'enum', - defaultValue: 'bottom', - options: [ - 'bottom', - 'top', - 'union', - 'intersection' - ], - update: function () { - this.resize(); - } - }, - mode: { - type: 'enum', - shaderDirty: true, - defaultValue: 'normal', - options: [ - ['normal', 'Normal'], - ['lighten', 'Lighten'], - ['darken', 'Darken'], - ['multiply', 'Multiply'], - ['average', 'Average'], - ['add', 'Add'], - ['subtract', 'Subtract'], - ['divide', 'Divide'], - ['difference', 'Difference'], - ['negation', 'Negation'], - ['exclusion', 'Exclusion'], - ['screen', 'Screen'], - ['overlay', 'Overlay'], - ['softlight', 'Soft Light'], - ['hardlight', 'Hard Light'], - ['colordodge', 'Color Dodge'], - ['colorburn', 'Color Burn'], - ['lineardodge', 'Linear Dodge'], - ['linearburn', 'Linear Burn'], - ['linearlight', 'Linear Light'], - ['vividlight', 'Vivid Light'], - ['pinlight', 'Pin Light'], - ['hardmix', 'Hard Mix'], - ['reflect', 'Reflect'], - ['glow', 'Glow'], - ['phoenix', 'Phoenix'], - ['hue', 'Hue'], - ['saturation', 'Saturation'], - ['color', 'color'], - ['luminosity', 'Luminosity'], - ['darkercolor', 'Darker Color'], - ['lightercolor', 'Lighter Color'] - ], - update: function () { - updateDrawFunction(); - } - } - } - }; - }, - { - inPlace: function () { - return !!nativeBlendModes[this.inputs.mode]; - }, - description: 'Blend two layers', - title: 'Blend' - }); -})); diff --git a/effects/seriously.blur.js b/effects/seriously.blur.js deleted file mode 100644 index 4825192..0000000 --- a/effects/seriously.blur.js +++ /dev/null @@ -1,259 +0,0 @@ -/* global define, require */ -/* -Blur - -Adapted from v002 by Anton Marini and Tom Butterworth -* Copyright vade - Anton Marini -* Creative Commons, Attribution - Non Commercial - Share Alike 3.0 - -http://v002.info/plugins/v002-blurs/ -*/ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var passes = [0.2, 0.3, 0.5, 0.8, 1], - finalPass = passes.length - 1, - horizontal = [1, 0], - vertical = [0, 1], - identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - - Seriously.plugin('blur', function (options) { - var fbHorizontal, - fbVertical, - baseShader, - loopUniforms = { - amount: 0, - blendGamma: 2, - inputScale: 1, - resolution: [this.width, this.height], - transform: identity, - direction: null - }; - - return { - initialize: function (parent) { - var gl; - - parent(); - - gl = this.gl; - - if (!gl) { - return; - } - - baseShader = this.baseShader; - - fbHorizontal = new Seriously.util.FrameBuffer(gl, this.width, this.height); - fbVertical = new Seriously.util.FrameBuffer(gl, this.width, this.height); - }, - commonShader: true, - shader: function (inputs, shaderSource) { - var gl = this.gl; - - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform mat4 transform;', - - 'uniform vec2 direction;', - 'uniform float amount;', - 'uniform float inputScale;', - - 'const vec2 zero = vec2(0.0);', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoords[8];', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position = screenPosition;', - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' vTexCoord = texCoord;', - - ' vec2 one = vec2(inputScale);', - ' if (inputScale < 1.0) {', - ' one -= 1.0 / resolution;', - ' }', - - ' vTexCoord = max(zero, min(one, texCoord * inputScale));', - ' vec2 amount = direction * (inputScale * amount * 5.0 / resolution);', - - ' for (int i = 0; i < 4; i++) {', - ' float s = pow(3.0, float(i));', - ' vTexCoords[i * 2] = max(zero, min(one, vTexCoord + amount * s));', - ' vTexCoords[i * 2 + 1] = max(zero, min(one, vTexCoord - amount * s));', - ' }', - '}' - ].join('\n'); - shaderSource.fragment = [ - 'precision mediump float;\n', - - 'uniform sampler2D source;', - 'uniform float blendGamma;', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoords[8];', - - 'vec3 exp;', - - 'vec4 sample(sampler2D sampler, vec2 coord) {', - ' vec4 pixel = texture2D(sampler, coord);', - ' pixel.rgb = pow(pixel.rgb, exp);', - ' return pixel;', - '}', - - 'void main(void) {', - - ' exp = vec3(blendGamma);', - - ' gl_FragColor = sample(source, vTexCoord) / 9.0;', - - ' for (int i = 0; i < 8; i++) {', - ' gl_FragColor += sample(source, vTexCoords[i]) / 9.0;', - ' }', - - ' gl_FragColor.rgb = pow(gl_FragColor.rgb, 1.0 / exp);', - - '}', - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - var i, - pass, - amount, - width, - height, - opts = { - width: 0, - height: 0, - blend: false - }, - previousPass = 1; - - amount = this.inputs.amount; - if (!amount) { - uniforms.source = this.inputs.source.texture; - parent(baseShader, model, uniforms, frameBuffer); - return; - } - - if (amount <= 0.01) { - //horizontal pass - uniforms.inputScale = 1; - uniforms.direction = horizontal; - uniforms.source = this.inputs.source.texture; - parent(shader, model, uniforms, fbHorizontal.frameBuffer); - - //vertical pass - uniforms.direction = vertical; - uniforms.source = fbHorizontal.texture; - parent(shader, model, uniforms, frameBuffer); - return; - } - - loopUniforms.amount = amount; - loopUniforms.blendGamma = uniforms.blendGamma; - loopUniforms.source = this.inputs.source.texture; - - for (i = 0; i < passes.length; i++) { - pass = Math.min(1, passes[i] / amount); - width = Math.floor(pass * this.width); - height = Math.floor(pass * this.height); - - loopUniforms.resolution[0] = width; - loopUniforms.resolution[1] = height; - loopUniforms.inputScale = previousPass; - previousPass = pass; - - opts.width = width; - opts.height = height; - - //horizontal pass - loopUniforms.direction = horizontal; - parent(shader, model, loopUniforms, fbHorizontal.frameBuffer, null, opts); - - //vertical pass - loopUniforms.inputScale = pass; - loopUniforms.source = fbHorizontal.texture; - loopUniforms.direction = vertical; - parent(shader, model, loopUniforms, i === finalPass ? frameBuffer : fbVertical.frameBuffer, null, opts); - - loopUniforms.source = fbVertical.texture; - } - }, - resize: function () { - loopUniforms.resolution[0] = this.width; - loopUniforms.resolution[1] = this.height; - if (fbHorizontal) { - fbHorizontal.resize(this.width, this.height); - fbVertical.resize(this.width, this.height); - } - }, - destroy: function () { - if (fbHorizontal) { - fbHorizontal.destroy(); - fbVertical.destroy(); - fbHorizontal = null; - fbVertical = null; - } - - loopUniforms = null; - } - }; - }, - { - inputs: { - source: { - type: 'image', - shaderDirty: false - }, - amount: { - type: 'number', - uniform: 'amount', - defaultValue: 0.2, - min: 0, - max: 1 - }, - blendGamma: { - type: 'number', - uniform: 'blendGamma', - defaultValue: 2.2, - min: 0, - max: 4 - } - }, - title: 'Gaussian Blur' - }); -})); diff --git a/effects/seriously.channels.js b/effects/seriously.channels.js deleted file mode 100644 index 6dd1e24..0000000 --- a/effects/seriously.channels.js +++ /dev/null @@ -1,380 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var channelOptions = [ - 'Red', - 'Green', - 'Blue', - 'Alpha' - ], - channelLookup = { - r: 0, - g: 1, - b: 2, - a: 3, - x: 0, - y: 1, - z: 2, - w: 3 - }; - - Seriously.plugin('channels', function () { - var sources = [], - shaders = [], - matrices = [], - me = this; - - function validateChannel(value, input, name) { - var val; - if (typeof value === 'string') { - val = value.charAt(0).toLowerCase(); - val = channelLookup[val]; - if (val === undefined) { - val = -1; - } - if (val < 0) { - val = parseFloat(value); - } - } else { - val = value; - } - - if (val === 0 || val === 1 || val === 2 || val === 3) { - return val; - } - - return me.inputs[name]; - } - - function updateChannels() { - var inputs = me.inputs, - i, j, - source, - matrix; - - for (i = 0; i < sources.length; i++) { - source = sources[i]; - matrix = matrices[i]; - if (!matrix) { - matrix = matrices[i] = []; - me.uniforms['channels' + i] = matrix; - } - - for (j = 0; j < 16; j++) { - matrix[j] = 0; - } - - matrix[inputs.red] = (inputs.redSource === source) ? 1 : 0; - matrix[4 + inputs.green] = (inputs.greenSource === source) ? 1 : 0; - matrix[8 + inputs.blue] = (inputs.blueSource === source) ? 1 : 0; - matrix[12 + inputs.alpha] = (inputs.alphaSource === source) ? 1 : 0; - } - } - - function updateSources() { - var inputs = me.inputs; - - function validateSource(name) { - var s, j; - s = inputs[name]; - if (!s) { - s = me.sources[name] = inputs[name] = inputs.source; - - if (!s) { - //no main source to fall back to - return; - } - } - - j = sources.indexOf(s); - if (j < 0) { - j = sources.length; - sources.push(s); - me.uniforms['source' + j] = s; - } - } - sources.length = 0; - - validateSource('redSource'); - validateSource('greenSource'); - validateSource('blueSource'); - validateSource('alphaSource'); - - me.resize(); - - updateChannels(); - } - - // custom resize method - this.resize = function () { - var width, - height, - mode = this.inputs.sizeMode, - i, - resolution, - source; - - if (!sources.length) { - width = 1; - height = 1; - } else if (sources.length === 1) { - source = sources[0]; - width = source.width; - height = source.height; - } else if (mode === 'union') { - width = 0; - height = 0; - for (i = 0; i < sources.length; i++) { - source = sources[0]; - width = Math.max(width, source.width); - height = Math.max(height, source.height); - } - } else if (mode === 'intersection') { - width = Infinity; - height = Infinity; - for (i = 0; i < sources.length; i++) { - source = sources[0]; - width = Math.min(width, source.width); - height = Math.min(height, source.height); - } - } else { - source = me.inputs[mode + 'Source']; - if (source) { - width = source.width; - height = source.height; - } else { - width = 1; - height = 1; - } - } - - for (i = 0; i < sources.length; i++) { - source = sources[i]; - resolution = me.uniforms['resolution' + i]; - if (resolution) { - resolution[0] = source.width; - resolution[1] = source.height; - } else { - me.uniforms['resolution' + i] = [source.width, source.height]; - } - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.uniforms.resolution[0] = width; - this.uniforms.resolution[1] = height; - - if (this.frameBuffer) { - this.frameBuffer.resize(width, height); - } - - this.emit('resize'); - this.setDirty(); - } - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - }; - - return { - shader: function () { - var i, - frag, - vert, - shader, - uniforms = '', - samples = '', - varyings = '', - position = ''; - - /* - We'll restore this and the draw function below if we ever figure out a way to - add/& multiple renders without screwing up the brightness - shaderSource.fragment = [ - 'precision mediump float;', - - 'varying vec2 vTexCoord;', - 'uniform mat4 channels;', - 'uniform sampler2D source;', - //'uniform sampler2D previous;', - 'void main(void) {', - ' vec4 pixel;', - ' if (any(lessThan(vTexCoord, vec2(0.0))) || any(greaterThanEqual(vTexCoord, vec2(1.0)))) {', - ' pixel = vec4(0.0);', - ' } else {', - ' pixel = texture2D(source, vTexCoord) * channels;', - //' if (gl_FragColor.a == 0.0) gl_FragColor.a = 1.0;', - ' }', - ' gl_FragColor = pixel;', - '}' - ].join('\n'); - - return shaderSource; - */ - if (shaders[sources.length]) { - return shaders[sources.length]; - } - - for (i = 0; i < sources.length; i++) { - varyings += 'varying vec2 vTexCoord' + i + ';\n'; - - uniforms += 'uniform sampler2D source' + i + ';\n' + - 'uniform mat4 channels' + i + ';\n' + - 'uniform vec2 resolution' + i + ';\n\n'; - - position += ' vTexCoord' + i + ' = (position.xy * resolution / resolution' + i + ') * 0.5 + 0.5;\n'; - - samples += ' if (all(greaterThanEqual(vTexCoord' + i + ', vec2(0.0))) && all(lessThan(vTexCoord' + i + ', vec2(1.0)))) {\n' + - ' gl_FragColor += texture2D(source' + i + ', vTexCoord' + i + ') * channels' + i + ';\n }\n'; - } - - vert = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - uniforms, - - varyings, - - 'void main(void) {', - position, - ' gl_Position = position;', - '}\n' - ].join('\n'); - - frag = [ - 'precision mediump float;', - - varyings, - uniforms, - - 'void main(void) {', - ' gl_FragColor = vec4(0.0);', - samples, - '}' - ].join('\n'); - - shader = new Seriously.util.ShaderProgram(this.gl, - vert, - frag); - - shaders[sources.length] = shader; - return shader; - }, - /* - draw: function (shader, model, uniforms, frameBuffer, draw) { - var i, - source; - - options.clear = true; - for (i = 0; i < sources.length; i++) { - //for (i = sources.length - 1; i >= 0; i--) { - uniforms.channels = matrices[i]; - source = sources[i]; - uniforms.source = sources[i]; - //uniforms.resolution[] - - draw(shader, model, uniforms, frameBuffer, null, options); - options.clear = false; - } - }, - */ - inputs: { - sizeMode: { - type: 'enum', - defaultValue: 'red', - options: [ - 'red', - 'green', - 'blue', - 'alpha', - 'union', - 'intersection' - ], - update: function () { - this.resize(); - } - }, - source: { - type: 'image', - update: updateSources, - shaderDirty: true - }, - redSource: { - type: 'image', - update: updateSources, - shaderDirty: true - }, - greenSource: { - type: 'image', - update: updateSources, - shaderDirty: true - }, - blueSource: { - type: 'image', - update: updateSources, - shaderDirty: true - }, - alphaSource: { - type: 'image', - update: updateSources, - shaderDirty: true - }, - red: { - type: 'enum', - options: channelOptions, - validate: validateChannel, - update: updateChannels, - defaultValue: 0 - }, - green: { - type: 'enum', - options: channelOptions, - validate: validateChannel, - update: updateChannels, - defaultValue: 1 - }, - blue: { - type: 'enum', - options: channelOptions, - validate: validateChannel, - update: updateChannels, - defaultValue: 2 - }, - alpha: { - type: 'enum', - options: channelOptions, - validate: validateChannel, - update: updateChannels, - defaultValue: 3 - } - } - }; - }, - { - inPlace: false, - title: 'Channel Mapping' - }); -})); diff --git a/effects/seriously.crop.js b/effects/seriously.crop.js deleted file mode 100755 index d8cdb68..0000000 --- a/effects/seriously.crop.js +++ /dev/null @@ -1,158 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - Seriously.plugin('crop', function () { - var me = this; - - // custom resize method - function resize() { - var width = 1, - height = 1, - source = me.inputs.source, - target, - i; - - if (me.source) { - width = me.source.width; - height = me.source.height; - } else if (me.sources && me.sources.source) { - width = me.sources.source.width; - height = me.sources.source.height; - } - - width = width - me.inputs.left - me.inputs.right; - height = height - me.inputs.top - me.inputs.bottom; - - width = Math.max(1, Math.floor(width)); - height = Math.max(1, Math.floor(height)); - - - if (me.width !== width || me.height !== height) { - me.width = width; - me.height = height; - - me.uniforms.resolution[0] = width; - me.uniforms.resolution[1] = height; - - if (me.frameBuffer) { - me.frameBuffer.resize(me.width, me.height); - } - - me.emit('resize'); - me.setDirty(); - } - - for (i = 0; i < me.targets.length; i++) { - target = me.targets[i]; - target.resize(); - if (target.setTransformDirty) { - target.setTransformDirty(); - } - } - } - - me.resize = resize; - - return { - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform mat4 transform;', - - 'uniform float top;', - 'uniform float left;', - 'uniform float bottom;', - 'uniform float right;', - - 'varying vec2 vTexCoord;', - - 'const vec2 ZERO = vec2(0.0);', - 'const vec2 ONE = vec2(1.0);', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' gl_Position.w = screenPosition.w;', - - ' vec2 dim = resolution + vec2(right + left, bottom + top);', - ' vec2 scale = dim / resolution;', - ' vec2 offset = vec2(left, bottom) / resolution;', - - ' vTexCoord = max(ZERO, (texCoord + offset) / scale);', - '}\n' - ].join('\n'); - return shaderSource; - }, - inputs: { - source: { - type: 'image', - uniform: 'source', - update: resize - }, - top: { - type: 'number', - uniform: 'top', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - }, - left: { - type: 'number', - uniform: 'left', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - }, - bottom: { - type: 'number', - uniform: 'bottom', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - }, - right: { - type: 'number', - uniform: 'right', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - } - } - }; - }, - { - inPlace: true, - title: 'Crop' - }); -})); diff --git a/effects/seriously.directionblur.js b/effects/seriously.directionblur.js deleted file mode 100644 index 8050d92..0000000 --- a/effects/seriously.directionblur.js +++ /dev/null @@ -1,256 +0,0 @@ -/* global define, require */ -/* -Directional Motion Blur - -Adapted from v002 by Anton Marini and Tom Butterworth -* Copyright vade - Anton Marini -* Creative Commons, Attribution - Non Commercial - Share Alike 3.0 - -http://v002.info/plugins/v002-blurs/ -*/ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var passes = [0.2, 0.3, 0.5, 0.8], - identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - - Seriously.plugin('directionblur', function (options) { - var fbs, - baseShader, - loopUniforms = { - amount: 0, - blendGamma: 2, - angle: 0, - inputScale: 1, - resolution: [this.width, this.height], - transform: identity, - projection: new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]) - }; - - return { - initialize: function (parent) { - var gl; - - parent(); - - gl = this.gl; - - if (!gl) { - return; - } - - baseShader = this.baseShader; - - fbs = [ - new Seriously.util.FrameBuffer(gl, this.width, this.height), - new Seriously.util.FrameBuffer(gl, this.width, this.height) - ]; - }, - commonShader: true, - shader: function (inputs, shaderSource) { - var gl = this.gl; - - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform mat4 projection;', - 'uniform mat4 transform;', - - 'uniform float angle;', - 'uniform float amount;', - 'uniform float inputScale;', - - 'const vec2 zero = vec2(0.0);', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoords[8];', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position = screenPosition;', - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' vTexCoord = texCoord;', - - ' vec2 one = vec2(inputScale);', - ' if (inputScale < 1.0) {', - ' one -= 1.0 / resolution;', - ' }', - ' vTexCoord = max(zero, min(one, texCoord * inputScale));', - ' vec2 amount = vec2(cos(angle), sin(angle)) * amount * 5.0 / resolution;', - - ' for (int i = 0; i < 4; i++) {', - ' float s = pow(3.0, float(i));', - ' vTexCoords[i * 2] = max(zero, min(one, vTexCoord + amount * s));', - ' vTexCoords[i * 2 + 1] = max(zero, min(one, vTexCoord - amount * s));', - ' }', - '}' - ].join('\n'); - shaderSource.fragment = [ - 'precision mediump float;\n', - - 'uniform lowp sampler2D source;', - 'uniform float blendGamma;', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoords[8];', - - 'vec3 exp;', - - 'vec4 sample(lowp vec4 pixel) {', - ' pixel.rgb = pow(pixel.rgb, exp);', - ' return pixel;', - '}', - - 'void main(void) {', - - ' exp = vec3(blendGamma);', - - ' gl_FragColor = sample(texture2D(source, vTexCoord)) / 9.0;', - - ' for (int i = 0; i < 8; i++) {', - ' gl_FragColor += sample(texture2D(source, vTexCoords[i])) / 9.0;', - ' }', - - ' gl_FragColor.rgb = pow(gl_FragColor.rgb, 1.0 / exp);', - - '}' - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - var i, - fb, - pass, - amount, - width, - height, - opts = { - width: 0, - height: 0, - blend: false - }, - previousPass = 1; - - amount = this.inputs.amount; - if (!amount) { - parent(baseShader, model, uniforms, frameBuffer); - return; - } - - if (amount <= 0.01) { - parent(shader, model, uniforms, frameBuffer); - return; - } - - loopUniforms.amount = amount; - loopUniforms.angle = this.inputs.angle; - loopUniforms.projection[0] = this.height / this.width; - - for (i = 0; i < passes.length; i++) { - pass = Math.min(1, passes[i] / amount); - width = Math.floor(pass * this.width); - height = Math.floor(pass * this.height); - - loopUniforms.source = fb ? fb.texture : this.inputs.source.texture; - - fb = fbs[i % 2]; - loopUniforms.inputScale = previousPass;//pass; - previousPass = pass; - opts.width = width; - opts.height = height; - - parent(shader, model, loopUniforms, fb.frameBuffer, null, opts); - } - - loopUniforms.source = fb.texture; - loopUniforms.inputScale = previousPass; - parent(shader, model, loopUniforms, frameBuffer); - }, - resize: function () { - loopUniforms.resolution[0] = this.width; - loopUniforms.resolution[1] = this.height; - if (fbs) { - fbs[0].resize(this.width, this.height); - fbs[1].resize(this.width, this.height); - } - }, - destroy: function () { - if (fbs) { - fbs[0].destroy(); - fbs[1].destroy(); - fbs = null; - } - - if (baseShader) { - baseShader.destroy(); - } - - loopUniforms = null; - } - }; - }, - { - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: false - }, - amount: { - type: 'number', - uniform: 'amount', - defaultValue: 0.4, - min: 0, - max: 1 - }, - angle: { - type: 'number', - uniform: 'angle', - defaultValue: 0 - }, - blendGamma: { - type: 'number', - uniform: 'blendGamma', - defaultValue: 2.2, - min: 0, - max: 4 - } - }, - title: 'Directional Motion Blur' - }); -})); diff --git a/effects/seriously.displacement.js b/effects/seriously.displacement.js deleted file mode 100644 index ff87f0c..0000000 --- a/effects/seriously.displacement.js +++ /dev/null @@ -1,195 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var fillModes = { - wrap: 'pos = mod(pos, 1.0);', - clamp: 'pos = min(max(pos, 0.0), 1.0);', - ignore: 'pos = texCoordSource;', - color: 'gl_FragColor = color;\n\treturn;' - }, - channelVectors = { - none: [0, 0, 0, 0], - red: [1, 0, 0, 0], - green: [0, 1, 0, 0], - blue: [0, 0, 1, 0], - alpha: [0, 0, 0, 1], - luma: [0.2125, 0.7154, 0.0721, 0], - lightness: [1 / 3, 1 / 3, 1 / 3, 0] - }; - - Seriously.plugin('displacement', function () { - this.uniforms.resMap = [1, 1]; - this.uniforms.resSource = [1, 1]; - this.uniforms.xVector = channelVectors.red; - this.uniforms.yVector = channelVectors.green; - - return { - shader: function (inputs, shaderSource) { - var fillMode = fillModes[inputs.fillMode]; - - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 resSource;', - 'uniform vec2 resMap;', - - 'varying vec2 texCoordSource;', - 'varying vec2 texCoordMap;', - - 'const vec2 HALF = vec2(0.5);', - - 'void main(void) {', - //we don't need to do a transform in this shader, since this effect is not "inPlace" - ' gl_Position = position;', - - ' vec2 adjusted = (texCoord - HALF) * resolution;', - - ' texCoordSource = adjusted / resSource + HALF;', - ' texCoordMap = adjusted / resMap + HALF;', - '}' - ].join('\n'); - - shaderSource.fragment = [ - 'precision mediump float;\n', - - 'varying vec2 texCoordSource;', - 'varying vec2 texCoordMap;', - - 'uniform sampler2D source;', - 'uniform sampler2D map;', - - 'uniform float amount;', - 'uniform float offset;', - 'uniform vec2 mapScale;', - 'uniform vec4 color;', - 'uniform vec4 xVector;', - 'uniform vec4 yVector;', - - 'void main(void) {', - ' vec4 mapPixel = texture2D(map, texCoordMap);', - ' vec2 mapVector = vec2(dot(mapPixel, xVector), dot(mapPixel, yVector));', - ' vec2 pos = texCoordSource + (mapVector.xy - offset) * mapScale * amount;', - - ' if (pos.x < 0.0 || pos.x > 1.0 || pos.y < 0.0 || pos.y > 1.0) {', - ' ' + fillMode, - ' }', - - ' gl_FragColor = texture2D(source, pos);', - '}' - ].join('\n'); - - return shaderSource; - }, - requires: function (sourceName) { - if (!this.inputs.mapScale && sourceName === 'map') { - return false; - } - return true; - }, - resize: function () { - var source = this.inputs.source, - map = this.inputs.map; - - if (source) { - this.uniforms.resSource[0] = source.width; - this.uniforms.resSource[1] = source.height; - } else { - this.uniforms.resSource[0] = 1; - this.uniforms.resSource[1] = 1; - } - - if (map) { - this.uniforms.resMap[0] = map.width; - this.uniforms.resMap[1] = map.height; - } else { - this.uniforms.resMap[0] = 1; - this.uniforms.resMap[1] = 1; - } - } - }; - }, - { - inputs: { - source: { - type: 'image', - uniform: 'source' - }, - map: { - type: 'image', - uniform: 'map' - }, - xChannel: { - type: 'enum', - defaultValue: 'red', - options: [ - 'red', 'green', 'blue', 'alpha', 'luma', 'lightness', 'none' - ], - update: function (val) { - this.uniforms.xVector = channelVectors[val]; - } - }, - yChannel: { - type: 'enum', - defaultValue: 'green', - options: [ - 'red', 'green', 'blue', 'alpha', 'luma', 'lightness', 'none' - ], - update: function (val) { - this.uniforms.yVector = channelVectors[val]; - } - }, - fillMode: { - type: 'enum', - shaderDirty: true, - defaultValue: 'color', - options: [ - 'color', 'wrap', 'clamp', 'ignore' - ] - }, - color: { - type: 'color', - uniform: 'color', - defaultValue: [0, 0, 0, 0] - }, - offset: { - type: 'number', - uniform: 'offset', - defaultValue: 0.5 - }, - mapScale: { - type: 'vector', - dimensions: 2, - uniform: 'mapScale', - defaultValue: [1, 1], - updateSources: true - }, - amount: { - type: 'number', - uniform: 'amount', - defaultValue: 1 - } - }, - title: 'Displacement Map', - description: '' - }); -})); diff --git a/effects/seriously.expression.js b/effects/seriously.expression.js deleted file mode 100644 index 96542f7..0000000 --- a/effects/seriously.expression.js +++ /dev/null @@ -1,547 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - function formatFloat(n) { - if (n - Math.floor(n) === 0) { - return n + '.0'; - } - return n; - } - - var symbols = { - red: 'rgba.r', - blue: 'rgba.b', - green: 'rgba.g', - alpha: 'rgba.a', - x: 'dim.x', - y: 'dim.y', - width: 'resolution.x', - height: 'resolution.y', - a: 'a', - b: 'b', - c: 'c', - d: 'd', - luma: ['luma', 'rgba'] - - /* - todo: - - time of day in seconds - - video time - - year, month, day - - datetime in milliseconds - - transform? - - transformed position? - */ - }, - definitions = { - dim: 'vec2 dim = vTexCoord * resolution;', - rgba: 'vec4 rgba = texture2D(source, vTexCoord);', - luma: 'float luma = dot(rgba.rgb, vec3(0.2125,0.7154,0.0721));', - atan2: { - source: '#define atan2(x, y) atan(x / y)', - global: true - }, - and: { - source: [ - 'float and(float a, float b) {', - ' if (a == 0.0) {', - ' return 0.0;', - ' }', - ' return b;', - '}' - ].join('\n'), - global: true - }, - or: { - source: [ - 'float or(float a, float b) {', - ' if (a != 0.0) {', - ' return a;', - ' }', - ' return b;', - '}' - ].join('\n'), - global: true - }, - luminance: { - source: [ - 'const vec3 lumaCoeffs = vec3(0.2125,0.7154,0.0721);', - 'float luminance(float r, float g, float b) {', - ' return dot(vec3(r, g, b), lumaCoeffs);', - '}' - ].join('\n'), - global: true - }, - saturation: { - source: [ - 'float saturation(float r, float g, float b) {', - ' float lo = min(r, min(g, b));', - ' float hi = max(r, max(g, b));', - ' float l = (lo + hi) / 2.0;', - ' float d = hi - lo;', - ' return l > 0.5 ? d / (2.0 - hi - lo) : d / (hi + lo);', - '}' - ].join('\n'), - global: true - }, - lightness: { - source: [ - 'float lightness(float r, float g, float b) {', - ' float lo = min(r, min(g, b));', - ' float hi = max(r, max(g, b));', - ' return (lo + hi) / 2.0;', - '}' - ].join('\n'), - global: true - }, - hue: { - source: [ - 'float hue(float r, float g, float b) {', - ' float h;', - ' if (r > g && r > b) {', //red is max - ' h = (g - b) / d + (g < b ? 6.0 : 0.0);', - ' } else if (g > r && g > b) {', //green is max - ' h = (b - r) / d + 2.0;', - ' } else {', //blue is max - ' h = (r - g) / d + 4.0;', - ' }', - ' return h / 6.0;', - '}' - ].join('\n'), - global: true - } - }, - functions = { - //built-in shader functions - radians: 1, - degrees: 1, - sin: 1, - cos: 1, - tan: 1, - asin: 1, - acos: 1, - atan: 1, - pow: 2, - exp: 1, - log: 1, - exp2: 1, - log2: 1, - sqrt: 1, - inversesqrt: 1, - abs: 1, - sign: 1, - floor: 1, - ceil: 1, - fract: 1, - mod: 2, - min: 2, - max: 2, - clamp: 3, - mix: 3, - step: 2, - smoothstep: 3, - - //custom logic functions - and: 2, - or: 2, - - //custom functions - atan2: 2, - hue: 3, - saturation: 3, - lightness: 3, - luminance: 3 - - /* - todo: - noise, random, hslRed, hslGreen, hslBlue, - int, sinh, cosh, tanh, mantissa, hypot, lerp, step - noise with multiple octaves (See fBm) - */ - }, - unaryOps = { - '-': true, - '!': true, - //'~': false, //todo: implement this or just get rid of it? - '+': true - }, - binaryOps = { - //true means it's a comparison and needs to be converted to float - '+': false, - '-': false, - '*': false, - '/': false, - '%': 'mod', - '&&': 'and', - '||': 'or', - //'^^': false, //todo: implement xor? - //'&', - //'|', - //'<<', - //'>>', - '===': '==', - '==': true, - '!==': '!=', - '!=': true, - '>=': true, - '<=': true, - '<': true, - '>': true - }, - pair, - key, - def, - - jsep; - - ['E', 'LN2', 'LN10', 'LOG2E', 'LOG10E', 'PI', 'SQRT1_2', 'SQRT2'].forEach(function (key) { - symbols[key] = key; - definitions[key] = { - source: 'const float ' + key + ' = ' + Math[key] + ';', - global: true - }; - }); - - //clean up lookup tables - for (key in symbols) { - if (symbols.hasOwnProperty(key)) { - def = symbols[key]; - if (typeof def === 'string') { - def = [def]; - } - - pair = def[0].split('.'); - if (pair.length > 1) { - def.push(pair[0]); - } - symbols[key] = def; - } - } - - for (key in definitions) { - if (definitions.hasOwnProperty(key)) { - def = definitions[key]; - if (typeof def === 'string') { - definitions[key] = { - source: def, - global: false - }; - } - } - } - - Seriously.plugin('expression', function () { - var me = this; - - function updateSingle() { - var inputs = me.inputs; - - if (inputs.blue === inputs.red && - inputs.green === inputs.blue) { - inputs.rgb = inputs.red; - } else { - inputs.rgb = ''; - } - } - - return { - shader: function (inputs, shaderSource) { - var expressions = {}, - channels = { - red: '', - green: '', - blue: '', - alpha: '' - }, - dependencies = {}, - deps, - expr, - key, - statements, - globalDefinitions = [], - nonGlobalDefinitions = [], - cs = [], - tree; - - function makeExpression(tree) { - var verb, x, i, - args; - /* - COMPOUND = 'Compound' - */ - - //We do not have any objects to offer - if (tree.type === 'MemberExpression') { - throw new Error('Expression Error: Unknown object "' + (tree.object.name || 'this') + '"'); - } - - if (tree.type === 'BinaryExpression' || tree.type === 'LogicalExpression') { - if (!tree.right) { - throw new Error('Expression Error: Bad binary expression'); - } - - //jsep seems to parse some unary expressions as binary with missing left side - //todo: consider removing this if/when jsep fixes it. file a github issue - if (!tree.left) { - tree.type = 'UnaryExpression'; - tree.argument = tree.right; - return makeExpression(tree); - } - - verb = tree.operator; - x = binaryOps[verb]; - if (x === undefined) { - throw new Error('Expression Error: Unknown operator "' + verb + '"'); - } - - if (typeof x === 'string') { - if (x in binaryOps) { - verb = binaryOps[x]; - x = binaryOps[verb]; - } else if (functions[x] === 2) { - deps[x] = true; - return x + '(' + makeExpression(tree.left) + ', ' + makeExpression(tree.right) + ')'; - } - } - - return (x ? 'float' : '') + '(' + makeExpression(tree.left) + ' ' + verb + ' ' + makeExpression(tree.right) + ')'; - } - - if (tree.type === 'CallExpression') { - if (tree.callee.type !== 'Identifier') { - throw new Error('Expression Error: Unknown function'); - } - - verb = tree.callee.name; - x = functions[verb]; - if (x === undefined) { - throw new Error('Expression Error: Unknown function "' + verb + '"'); - } - - if (x > tree.arguments.length) { - throw new Error('Expression Error: Function "' + verb + '" requires at least ' + x + ' arguments'); - } - - args = []; - for (i = 0; i < x; i++) { - args.push(makeExpression(tree.arguments[i])); - } - deps[verb] = true; - return verb + '(' + args.join(', ') + ')'; - } - - if (tree.type === 'Identifier') { - args = symbols[tree.name]; - if (!args) { - throw new Error('Expression Error: Unknown identifier "' + tree.name + '"'); - } - - for (i = args.length - 1; i >= 0; i--) { - x = args[i]; - if (definitions[x]) { - deps[x] = true; - } - } - return args[0]; - } - - if (tree.type === 'Literal') { - if (tree.raw === 'true') { - return 1.0; - } - - if (tree.raw === 'true') { - return 0.0; - } - - if (typeof tree.value !== 'number' || isNaN(tree.value)) { - throw new Error('Expression Error: Invalid literal ' + tree.raw); - } - - return formatFloat(tree.value); - } - - if (tree.type === 'UnaryExpression') { - verb = tree.operator; - x = unaryOps[verb]; - if (!x) { - throw new Error('Expression Error: Unknown operator "' + verb + '"'); - } - - //todo: are there any unary operators that could become functions? - return verb + '(' + makeExpression(tree.argument) + ')'; - } - } - - for (key in channels) { - if (channels.hasOwnProperty(key)) { - expr = inputs[key] || key; - channels[key] = expr; - expressions[expr] = ''; - } - } - - for (expr in expressions) { - if (expressions.hasOwnProperty(expr)) { - try { - deps = {}; - tree = jsep(expr); - //todo: convert this to a function? - expressions[expr] = makeExpression(tree); - - //flag any required declarations/precalculations - for (key in deps) { - if (deps.hasOwnProperty(key)) { - dependencies[key] = deps[key]; - } - } - - //special case for luma. todo: generalize if we need to - if (deps.luma) { - dependencies.rgba = true; - } - } catch (parseError) { - console.log(parseError.message); - expressions[expr] = '0.0'; - } - } - } - - for (key in dependencies) { - if (dependencies.hasOwnProperty(key)) { - deps = definitions[key]; - if (deps) { - if (deps.global) { - globalDefinitions.push(deps.source); - } else { - nonGlobalDefinitions.push('\t' + deps.source); - } - } - } - } - - /* - todo: assign duplicate expressions to temp variables - for (expr in expressions) { - if (expressions.hasOwnProperty(expr)) { - statements.push('float val' + index = ) - } - } - */ - - for (key in channels) { - if (channels.hasOwnProperty(key)) { - expr = channels[key]; - cs.push(expressions[expr]); - } - } - - statements = [ - 'precision mediump float;', - 'varying vec2 vTexCoord;', - 'varying vec4 vPosition;', - - 'uniform sampler2D source;', - 'uniform float a, b, c, d;', - 'uniform vec2 resolution;', - globalDefinitions.join('\n'), - 'void main(void) {', - nonGlobalDefinitions.join('\n'), - '\tgl_FragColor = vec4(', - '\t\t' + cs.join(',\n\t\t'), - '\t);', - '}' - ]; - - shaderSource.fragment = statements.join('\n'); - - return shaderSource; - }, - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: true - }, - a: { - type: 'number', - uniform: 'a', - defaultValue: 0 - }, - b: { - type: 'number', - uniform: 'b', - defaultValue: 0 - }, - c: { - type: 'number', - uniform: 'c', - defaultValue: 0 - }, - d: { - type: 'number', - uniform: 'd', - defaultValue: 0 - }, - rgb: { - type: 'string', - update: function (val) { - var inputs = me.inputs; - inputs.red = inputs.green = inputs.blue = val; - }, - shaderDirty: true - }, - red: { - type: 'string', - update: updateSingle, - shaderDirty: true - }, - green: { - type: 'string', - update: updateSingle, - shaderDirty: true - }, - blue: { - type: 'string', - update: updateSingle, - shaderDirty: true - }, - alpha: { - type: 'string', - shaderDirty: true - } - } - }; - }, - { - inPlace: false, - title: 'Expression' - }); - - /* jsep v0.2.9 (http://jsep.from.so/) */ - !function(a){"use strict";var b="Compound",c="Identifier",d="MemberExpression",e="Literal",f="ThisExpression",g="CallExpression",h="UnaryExpression",i="BinaryExpression",j="LogicalExpression",k=!0,l={"-":k,"!":k,"~":k,"+":k},m={"||":1,"&&":2,"|":3,"^":4,"&":5,"==":6,"!=":6,"===":6,"!==":6,"<":7,">":7,"<=":7,">=":7,"<<":8,">>":8,">>>":8,"+":9,"-":9,"*":10,"/":10,"%":10},n=function(a){var b,c=0;for(var d in a)(b=d.length)>c&&a.hasOwnProperty(d)&&(c=b);return c},o=n(l),p=n(m),q={"true":!0,"false":!1,"null":null},r="this",s=function(a){return m[a]||0},t=function(a,b,c){var d="||"===a||"&&"===a?j:i;return{type:d,operator:a,left:b,right:c}},u=function(a){return a>=48&&57>=a},v=function(a){return 36===a||95===a||a>=65&&90>=a||a>=97&&122>=a},w=function(a){return 36===a||95===a||a>=65&&90>=a||a>=97&&122>=a||a>=48&&57>=a},x=function(a){for(var i,j,k=0,n=a.charAt,x=a.charCodeAt,y=function(b){return n.call(a,b)},z=function(b){return x.call(a,b)},A=a.length,B=function(){for(var a=z(k);32===a||9===a;)a=z(++k)},C=function(){B();for(var b=a.substr(k,p),c=b.length;c>0;){if(m.hasOwnProperty(b))return k+=c,b;b=b.substr(0,--c)}return!1},D=function(){var a,b,c,d,e,f,g,h;if(f=E(),b=C(),!b)return f;if(e={value:b,prec:s(b)},g=E(),!g)throw new Error("Expected expression after "+b+" at character "+k);for(d=[f,e,g];(b=C())&&(c=s(b),0!==c);){for(e={value:b,prec:c};d.length>2&&c<=d[d.length-2].prec;)g=d.pop(),b=d.pop().value,f=d.pop(),a=t(b,f,g),d.push(a);if(a=E(),!a)throw new Error("Expected expression after "+b+" at character "+k);d.push(e),d.push(a)}for(h=d.length-1,a=d[h];h>1;)a=t(d[h-1].value,d[h-2],a),h-=2;return a},E=function(){var b,c,d;if(B(),b=z(k),u(b)||46===b)return F();if(39===b||34===b)return G();if(v(b))return J();if(40===b)return K();for(c=a.substr(k,o),d=c.length;d>0;){if(l.hasOwnProperty(c))return k+=d,{type:h,operator:c,argument:E(),prefix:!0};c=c.substr(0,--d)}return!1},F=function(){for(var a="";u(z(k));)a+=y(k++);if("."===y(k))for(a+=y(k++);u(z(k));)a+=y(k++);if("e"===y(k)||"E"===y(k)){for(a+=y(k++),("+"===y(k)||"-"===y(k))&&(a+=y(k++));u(z(k));)a+=y(k++);if(!u(z(k-1)))throw new Error("Expected exponent ("+a+y(k)+") at character "+k)}if(v(z(k)))throw new Error("Variable names cannot start with a number ("+a+y(k)+") at character "+k);return{type:e,value:parseFloat(a),raw:a}},G=function(){for(var a,b="",c=y(k++),d=!1;A>k;){if(a=y(k++),a===c){d=!0;break}if("\\"===a)switch(a=y(k++)){case"n":b+="\n";break;case"r":b+="\r";break;case"t":b+=" ";break;case"b":b+="\b";break;case"f":b+="\f";break;case"v":b+=" "}else b+=a}if(!d)throw new Error('Unclosed quote after "'+b+'"');return{type:e,value:b,raw:c+b+c}},H=function(){var b,d=z(k),g=k;if(!v(d))throw new Error("Unexpected "+y(k)+"at character "+k);for(k++;A>k&&(d=z(k),w(d));)k++;return b=a.slice(g,k),q.hasOwnProperty(b)?{type:e,value:q[b],raw:b}:b===r?{type:f}:{type:c,name:b}},I=function(){for(var a,c,d=[];A>k;){if(B(),a=y(k),")"===a){k++;break}if(","===a)k++;else{if(c=D(),!c||c.type===b)throw new Error("Expected comma at character "+k);d.push(c)}}return d},J=function(){var a,b,c;for(b=H(),B(),a=y(k);"."===a||"["===a||"("===a;){if("."===a)k++,B(),b={type:d,computed:!1,object:b,property:H()};else if("["===a){if(c=k,k++,b={type:d,computed:!0,object:b,property:D()},B(),a=y(k),"]"!==a)throw new Error("Unclosed [ at character "+k);k++,B()}else"("===a&&(k++,b={type:g,arguments:I(),callee:b});B(),a=y(k)}return b},K=function(){k++;var a=D();if(B(),")"===y(k))return k++,a;throw new Error("Unclosed ( at character "+k)},L=[];A>k;)if(i=y(k),";"===i||","===i)k++;else if(j=D())L.push(j);else if(A>k)throw new Error("Unexpected '"+y(k)+"' at character "+k);return 1===L.length?L[0]:{type:b,body:L}};if(x.version="0.2.9",x.toString=function(){return"JavaScript Expression Parser (JSEP) v"+x.version},x.addUnaryOp=function(a){return l[a]=k,this},x.addBinaryOp=function(a,b){return p=Math.max(a.length,p),m[a]=b,this},x.removeUnaryOp=function(a){return delete l[a],a.length===o&&(o=n(l)),this},x.removeBinaryOp=function(a){return delete m[a],a.length===p&&(p=n(m)),this},"undefined"==typeof exports){var y=a.jsep;a.jsep=x,x.noConflict=function(){return a.jsep===x&&(a.jsep=y),x}}else"undefined"!=typeof module&&module.exports?exports=module.exports=x:exports.parse=x}(window); - - jsep = window.jsep || - typeof module !== undefined && module.exports || - typeof exports !== undefined && exports.parse; - - if (jsep.noConflict) { - jsep = jsep.noConflict(); - } -})); diff --git a/effects/seriously.gradientwipe.js b/effects/seriously.gradientwipe.js deleted file mode 100644 index 9cbf7bf..0000000 --- a/effects/seriously.gradientwipe.js +++ /dev/null @@ -1,190 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - Seriously.plugin('gradientwipe', function () { - this.uniforms.resGradient = [1, 1]; - this.uniforms.resSource = [1, 1]; - - return { - shader: function (inputs, shaderSource) { - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 resSource;', - 'uniform vec2 resGradient;', - - 'varying vec2 texCoordSource;', - 'varying vec2 texCoordGradient;', - - 'const vec2 HALF = vec2(0.5);', - - 'void main(void) {', - //we don't need to do a transform in this shader, since this effect is not "inPlace" - ' gl_Position = position;', - - ' vec2 adjusted = (texCoord - HALF) * resolution;', - - ' texCoordSource = adjusted / resSource + HALF;', - ' texCoordGradient = adjusted / resGradient + HALF;', - '}' - ].join('\n'); - - shaderSource.fragment = [ - 'precision mediump float;\n', - - 'varying vec2 texCoordSource;', - 'varying vec2 texCoordGradient;', - - 'uniform sampler2D source;', - 'uniform sampler2D gradient;', - - 'uniform float transition;', - 'uniform float smoothness;', - 'uniform bool invert;', - - 'const vec3 lumcoeff = vec3(0.2125,0.7154,0.0721);', - - 'void main(void) {', - ' float gradientVal = 1.0 - dot(texture2D(gradient, texCoordGradient).rgb, lumcoeff);', - - ' if (invert) {', - ' gradientVal = 1.0 - gradientVal;', - ' }', - - ' float amount = 1.0 - transition;', - - ' float mn = (amount - smoothness * (1.0 - amount));', - ' float mx = (amount + smoothness * amount);', - - ' if (gradientVal <= mn) {', - ' gl_FragColor = texture2D(source, texCoordSource);', - ' return;', - ' }', - - ' if (gradientVal >= mx) {', - ' gl_FragColor = vec4(0.0);', - ' return;', - ' }', - - ' float alpha = mix(1.0, 0.0, smoothstep(mn, mx, gradientVal));', - ' vec4 pixel = texture2D(source, texCoordSource);', - - ' gl_FragColor = vec4(pixel.rgb, pixel.a * alpha);', - '}' - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - var gl; - - //* - if (uniforms.transition <= 0) { - //uniforms.source = uniforms.sourceB; - parent(this.baseShader, model, uniforms, frameBuffer); - return; - } - //*/ - - //* - if (uniforms.transition >= 1) { - gl = this.gl; - - gl.viewport(0, 0, this.width, this.height); - gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer); - gl.clearColor(0.0, 0.0, 0.0, 0.0); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - - return; - } - //*/ - - parent(shader, model, uniforms, frameBuffer); - }, - inPlace: false, - requires: function (sourceName, inputs) { - - if (sourceName === 'source' && inputs.transition >= 1) { - return false; - } - - if (sourceName === 'gradient' && - (inputs.transition <= 0 || inputs.transition >= 1)) { - return false; - } - - return true; - }, - resize: function () { - var source = this.inputs.source, - gradient = this.inputs.gradient; - - if (source) { - this.uniforms.resSource[0] = source.width; - this.uniforms.resSource[1] = source.height; - } else { - this.uniforms.resSource[0] = 1; - this.uniforms.resSource[1] = 1; - } - - if (gradient) { - this.uniforms.resGradient[0] = gradient.width; - this.uniforms.resGradient[1] = gradient.height; - } else { - this.uniforms.resGradient[0] = 1; - this.uniforms.resGradient[1] = 1; - } - } - }; - }, - { - inputs: { - source: { - type: 'image', - uniform: 'source' - }, - gradient: { - type: 'image', - uniform: 'gradient' - }, - transition: { - type: 'number', - uniform: 'transition', - defaultValue: 0 - }, - invert: { - type: 'boolean', - uniform: 'invert', - defaultValue: false - }, - smoothness: { - type: 'number', - uniform: 'smoothness', - defaultValue: 0, - min: 0, - max: 1 - } - }, - title: 'Gradient Wipe' - }); -})); diff --git a/effects/seriously.layers.js b/effects/seriously.layers.js deleted file mode 100644 index 115ab5e..0000000 --- a/effects/seriously.layers.js +++ /dev/null @@ -1,255 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]), - intRegex = /\d+/; - - Seriously.plugin('layers', function (options) { - var count, - me = this, - topOpts = { - clear: false - }, - i, - inputs; - - function update() { - me.resize(); - } - - if (typeof options === 'number' && options >= 2) { - count = options; - } else { - count = options && options.count || 4; - count = Math.max(2, count); - } - - inputs = { - sizeMode: { - type: 'enum', - defaultValue: '0', - options: [ - 'union', - 'intersection' - ], - update: function () { - this.resize(); - } - } - }; - - for (i = 0; i < count; i++) { - inputs.sizeMode.options.push(i.toString()); - inputs.sizeMode.options.push('source' + i); - - //source - inputs['source' + i] = { - type: 'image', - update: update - }; - - //opacity - inputs['opacity' + i] = { - type: 'number', - defaultValue: 1, - min: 0, - max: 1, - updateSources: true - }; - } - - this.uniforms.layerResolution = [1, 1]; - - // custom resize method - this.resize = function () { - var width, - height, - mode = this.inputs.sizeMode, - i, - n, - source, - a; - - if (mode === 'union') { - width = 0; - height = 0; - for (i = 0; i < count; i++) { - source = this.inputs['source' + i]; - if (source) { - width = Math.max(width, source.width); - height = Math.max(height, source.height); - } - } - } else if (mode === 'intersection') { - width = Infinity; - height = Infinity; - for (i = 0; i < count; i++) { - source = this.inputs['source' + i]; - if (source) { - width = Math.min(width, source.width); - height = Math.min(height, source.height); - } - } - } else { - width = 1; - height = 1; - n = count - 1; - a = intRegex.exec(this.inputs.sizeMode); - if (a) { - n = Math.min(parseInt(a[0], 10), n); - } - - source = this.inputs['source' + n]; - if (source) { - width = source.width; - height = source.height; - } - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.uniforms.resolution[0] = width; - this.uniforms.resolution[1] = height; - - if (this.frameBuffer) { - this.frameBuffer.resize(width, height); - } - - this.emit('resize'); - this.setDirty(); - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - } - }; - - return { - initialize: function (initialize) { - var gl = this.gl; - initialize(); - - topOpts.blendEquation = gl.FUNC_ADD; - topOpts.srcRGB = gl.SRC_ALPHA; - topOpts.dstRGB = gl.ONE_MINUS_SRC_ALPHA; - topOpts.srcAlpha = gl.ONE; - topOpts.dstAlpha = gl.ONE_MINUS_SRC_ALPHA; - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 layerResolution;', - 'uniform mat4 transform;', - - 'varying vec2 vTexCoord;', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * layerResolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position.xy = screenPosition.xy * 2.0 / layerResolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (layerResolution.x / layerResolution.y);', - ' gl_Position.xy *= layerResolution / resolution;', - ' gl_Position.w = screenPosition.w;', - ' vTexCoord = texCoord;', - '}\n' - ].join('\n'); - - shaderSource.fragment = [ - 'precision mediump float;', - 'varying vec2 vTexCoord;', - 'uniform sampler2D source;', - 'uniform float opacity;', - 'void main(void) {', - ' if (any(lessThan(vTexCoord, vec2(0.0))) || any(greaterThanEqual(vTexCoord, vec2(1.0)))) {', - ' gl_FragColor = vec4(0.0);', - ' } else {', - ' gl_FragColor = texture2D(source, vTexCoord);', - ' gl_FragColor *= opacity;', - ' }', - '}' - ].join('\n'); - - return shaderSource; - }, - requires: function (sourceName, inputs) { - var a, index = count; - - a = intRegex.exec(this.inputs.sizeMode); - if (a) { - index = parseInt(a[0], 10); - } - if (index >= count) { - return false; - } - - return !!(inputs[sourceName] && inputs['opacity' + index]); - }, - draw: function (shader, model, uniforms, frameBuffer, draw) { - var i, - opacity, - source, - gl = this.gl; - - //clear in case we have no layers to draw - gl.viewport(0, 0, this.width, this.height); - gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer); - gl.clearColor(0.0, 0.0, 0.0, 0.0); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - - for (i = 0; i < count; i++) { - source = this.inputs['source' + i]; - opacity = this.inputs['opacity' + i]; - - //don't draw if layer is disconnected or opacity is 0 - if (source && opacity) { - uniforms.opacity = opacity; - uniforms.layerResolution[0] = source.width; - uniforms.layerResolution[1] = source.height; - uniforms.source = source; - uniforms.transform = source.cumulativeMatrix || identity; - - draw(shader, model, uniforms, frameBuffer, null, topOpts); - } - } - }, - inputs: inputs - }; - }, - { - inPlace: true, - description: 'Multiple layers', - title: 'Layers' - }); -})); diff --git a/effects/seriously.opticalflow.js b/effects/seriously.opticalflow.js deleted file mode 100644 index b4ce2eb..0000000 --- a/effects/seriously.opticalflow.js +++ /dev/null @@ -1,145 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - /* - Horn-Schunke Optical Flow - Based on shader by Andrew Benson - https://github.com/v002/v002-Optical-Flow/blob/master/v002.GPUHSFlow.frag - - Creative Commons, Attribution – Non Commercial – Share Alike 3.0 - http://v002.info/licenses/ - */ - - Seriously.plugin('opticalflow', function () { - var previousFrameBuffer, - baseShader; - - return { - initialize: function (initialize) { - previousFrameBuffer = new Seriously.util.FrameBuffer(this.gl, this.width, this.height); - initialize(); - baseShader = this.baseShader; - }, - resize: function () { - previousFrameBuffer.resize(this.width, this.height); - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.fragment = [ - 'precision mediump float;', - - 'varying vec2 vTexCoord;', - - 'uniform sampler2D source;', - 'uniform sampler2D previous;', - 'uniform vec2 resolution;', - - 'uniform vec2 scale;', - 'uniform float offsetX;', - 'uniform float lambda;', - // 'const vec4 lumcoeff = vec4(0.299, 0.587, 0.114, 0.0);', - - 'void main() {', - ' vec4 a = texture2D(previous, vTexCoord);', - ' vec4 b = texture2D(source, vTexCoord);', - ' vec2 offset = offsetX / resolution;', - ' vec2 x1 = vec2(offset.x, 0.0);', - ' vec2 y1 = vec2(0.0, offset.y);', - - //get the difference - ' vec4 curdif = b - a;', - - //calculate the gradient - ' vec4 gradx = texture2D(source, vTexCoord + x1) - texture2D(source, vTexCoord - x1);', - ' gradx += texture2D(previous, vTexCoord + x1) - texture2D(previous, vTexCoord - x1);', - - ' vec4 grady = texture2D(source, vTexCoord + y1) - texture2D(source, vTexCoord - y1);', - ' grady += texture2D(previous, vTexCoord + y1) - texture2D(previous, vTexCoord - y1);', - - ' vec4 gradmag = sqrt((gradx * gradx) + (grady * grady) + vec4(lambda));', - - ' vec4 vx = curdif * (gradx / gradmag);', - ' float vxd = vx.r;', //assumes greyscale - - //format output for flowrepos, out(-x,+x,-y,+y) - ' vec2 xout = vec2(max(vxd, 0.0), abs(min(vxd, 0.0))) * scale.x;', - - ' vec4 vy = curdif * (grady / gradmag);', - ' float vyd = vy.r;', //assumes greyscale - - //format output for flowrepos, out(-x,+x,-y,+y) - ' vec2 yout = vec2(max(vyd, 0.0), abs(min(vyd, 0.0))) * scale.y;', - - ' gl_FragColor = clamp(vec4(xout.xy, yout.xy), 0.0, 1.0);', - ' gl_FragColor.a = 1.0;', - '}' - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - uniforms.previous = previousFrameBuffer.texture; - - parent(shader, model, uniforms, frameBuffer); - - //todo: just swap buffers rather than copy? - parent(baseShader, model, uniforms, previousFrameBuffer.frameBuffer); - }, - destroy: function () { - if (previousFrameBuffer) { - previousFrameBuffer.destroy(); - previousFrameBuffer = null; - } - } - }; - }, - { - inPlace: false, - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: false - }, - lambda: { - type: 'number', - uniform: 'lambda', - min: 0, - defaultValue: 0, - description: 'noise limiting' - }, - scaleResult: { - type: 'vector', - dimensions: 2, - uniform: 'scale', - defaultValue: [1, 1] - }, - offset: { - type: 'number', - uniform: 'offsetX', - defaultValue: 1, - min: 1, - max: 100, - description: 'distance between texel samples for gradient calculation' - } - }, - description: 'Horn-Schunke Optical Flow', - title: 'Optical Flow' - }); -})); diff --git a/effects/seriously.repeat.js b/effects/seriously.repeat.js deleted file mode 100644 index 701f7b7..0000000 --- a/effects/seriously.repeat.js +++ /dev/null @@ -1,204 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]), - mat4 = Seriously.util.mat4; - - Seriously.plugin('repeat', function () { - var drawOpts = { - clear: false - }, - transform = new Float32Array(16), - me = this; - - function resize() { - me.resize(); - } - - // custom resize method - this.resize = function () { - var width = this.width, - height = this.height, - source = me.inputs.source, - i; - - if (this.source) { - width = this.source.width; - height = this.source.height; - } else if (this.sources && this.sources.source) { - width = this.sources.source.width; - height = this.sources.source.height; - } else { - width = 1; - height = 1; - } - - if (me.inputs.width) { - width = me.inputs.width; - if (me.inputs.height) { - height = me.inputs.height; - } else if (source) { - //match source aspect ratio - height = width * source.height / source.width; - } - } else if (me.inputs.height) { - height = me.inputs.height; - if (source) { - //match source aspect ratio - width = height * source.width / source.height; - } - } - - width = Math.floor(width); - height = Math.floor(height); - - if (source) { - this.uniforms.resolution[0] = source.width; - this.uniforms.resolution[1] = source.height; - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.uniforms.targetRes[0] = this.width; - this.uniforms.targetRes[1] = this.height; - - if (this.frameBuffer) { - this.frameBuffer.resize(this.width, this.height); - } - - this.emit('resize'); - this.setDirty(); - } - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - }; - - this.uniforms.targetRes = [1, 1]; - - return { - initialize: function (initialize) { - initialize(); - this.uniforms.transform = transform; - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 targetRes;', - 'uniform mat4 transform;', - - 'varying vec2 vTexCoord;', - - 'void main(void) {', - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - ' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position = screenPosition;', - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' gl_Position.xy *= resolution / targetRes;', - ' vTexCoord = texCoord;', - '}\n' - ].join('\n'); - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, draw) { - var i, - source = this.inputs.source, - transform = this.inputs.transform, - transformMatrix = transform && transform.cumulativeMatrix, - repeat = this.inputs.repeat, - gl = this.gl; - - if (transformMatrix && transform.transformed) { - mat4.copy(uniforms.transform, source && source.cumulativeMatrix || identity); - } else { - repeat = Math.min(repeat, 1); - } - - // first, clear - gl.viewport(0, 0, this.width, this.height); - gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer); - gl.clearColor(0.0, 0.0, 0.0, 0.0); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - - for (i = repeat - 1; i >= 0; i--) { - draw(shader, model, uniforms, frameBuffer, null, drawOpts); - if (i) { - mat4.multiply(uniforms.transform, transformMatrix, uniforms.transform); - } - } - }, - inputs: { - source: { - type: 'image', - uniform: 'source', - update: function () { - resize(); - this.uniforms.transform = transform; - } - }, - transform: { - type: 'image' - }, - repeat: { - type: 'number', - step: 1, - min: 0, - defaultValue: 8 - }, - width: { - type: 'number', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - }, - height: { - type: 'number', - min: 0, - step: 1, - update: resize, - defaultValue: 0 - } - } - }; - }, - { - inPlace: true, - description: 'Draw image multiple times, transforming each time', - title: 'Repeat' - }); -})); diff --git a/effects/seriously.select.js b/effects/seriously.select.js deleted file mode 100644 index c44ec7e..0000000 --- a/effects/seriously.select.js +++ /dev/null @@ -1,178 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - var intRegex = /\d+/; - - Seriously.plugin('select', function (options) { - var count, - me = this, - i, - inputs; - - function resize() { - me.resize(); - } - - function update() { - var i = me.inputs.active, - source; - - source = me.inputs['source' + i]; - me.texture = source && source.texture; - - resize(); - } - - if (typeof options === 'number' && options >= 2) { - count = options; - } else { - count = options && options.count || 4; - count = Math.max(2, count); - } - - inputs = { - active: { - type: 'number', - step: 1, - min: 0, - max: count - 1, - defaultValue: 0, - update: update, - updateSources: true - }, - sizeMode: { - type: 'enum', - defaultValue: '0', - options: [ - 'union', - 'intersection', - 'active' - ], - update: resize - } - }; - - for (i = 0; i < count; i++) { - inputs.sizeMode.options.push(i.toString()); - inputs.sizeMode.options.push('source' + i); - - //source - inputs['source' + i] = { - type: 'image', - update: update - }; - } - - this.uniforms.layerResolution = [1, 1]; - - // custom resize method - this.resize = function () { - var width, - height, - mode = this.inputs.sizeMode, - i, - n, - source, - a; - - if (mode === 'union') { - width = 0; - height = 0; - for (i = 0; i < count; i++) { - source = this.inputs['source' + i]; - if (source) { - width = Math.max(width, source.width); - height = Math.max(height, source.height); - } - } - } else if (mode === 'intersection') { - width = Infinity; - height = Infinity; - for (i = 0; i < count; i++) { - source = this.inputs['source' + i]; - if (source) { - width = Math.min(width, source.width); - height = Math.min(height, source.height); - } - } - } else if (mode === 'active') { - i = this.inputs.active; - source = this.inputs['source' + i]; - width = Math.max(1, source && source.width || 1); - height = Math.max(1, source && source.height || 1); - } else { - width = 1; - height = 1; - n = count - 1; - a = intRegex.exec(this.inputs.sizeMode); - if (a) { - n = Math.min(parseInt(a[0], 10), n); - } - - for (i = 0; i <= n; i++) { - source = this.inputs['source' + i]; - if (source) { - width = source.width; - height = source.height; - break; - } - } - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.emit('resize'); - this.setDirty(); - } - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - }; - - return { - initialize: function () { - this.initialized = true; - this.shaderDirty = false; - }, - requires: function (sourceName) { - return !!(this.inputs[sourceName] && sourceName === 'source' + this.inputs.active); - }, - - //check the source texture on every draw just in case the source nodes pulls - //shenanigans with its texture. - draw: function () { - var i = me.inputs.active, - source; - - source = me.inputs['source' + i]; - me.texture = source && source.texture; - }, - inputs: inputs - }; - }, - { - title: 'Select', - description: 'Select a single source image from a list of source nodes.', - inPlace: false, - commonShader: true - }); -})); diff --git a/effects/seriously.split.js b/effects/seriously.split.js deleted file mode 100644 index 9c74197..0000000 --- a/effects/seriously.split.js +++ /dev/null @@ -1,281 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - Seriously.plugin('split', function () { - var baseShader, - resolutionA = [1, 1], - resolutionB = [1, 1]; - - // custom resize method - this.resize = function () { - var width, - height, - mode = this.inputs.sizeMode, - node, - fn, - i, - sourceA = this.inputs.sourceA, - sourceB = this.inputs.sourceB; - - if (mode === 'a' || mode === 'b') { - node = mode === 'a' ? sourceA : sourceB; - if (node) { - width = node.width; - height = node.height; - } else { - width = 1; - height = 1; - } - } else { - if (sourceA) { - if (sourceB) { - fn = (mode === 'union' ? Math.max : Math.min); - width = fn(sourceA.width, sourceB.width); - height = fn(sourceA.height, sourceB.height); - } else { - width = sourceA.width; - height = sourceA.height; - } - } else if (sourceB) { - width = sourceB.width; - height = sourceB.height; - } else { - width = 1; - height = 1; - } - } - - if (this.width !== width || this.height !== height) { - this.width = width; - this.height = height; - - this.uniforms.resolution[0] = width; - this.uniforms.resolution[1] = height; - - if (this.frameBuffer) { - this.frameBuffer.resize(width, height); - } - - this.emit('resize'); - this.setDirty(); - } - - if (sourceA) { - resolutionA[0] = sourceA.width; - resolutionA[1] = sourceA.height; - } - if (sourceB) { - resolutionB[0] = sourceB.width; - resolutionB[1] = sourceB.height; - } - - for (i = 0; i < this.targets.length; i++) { - this.targets[i].resize(); - } - }; - - return { - initialize: function (initialize) { - initialize(); - this.uniforms.resolutionA = resolutionA; - this.uniforms.resolutionB = resolutionB; - baseShader = this.baseShader; - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.vertex = [ - 'precision mediump float;', - - 'attribute vec4 position;', - 'attribute vec2 texCoord;', - - 'uniform vec2 resolution;', - 'uniform vec2 resolutionA;', - 'uniform vec2 resolutionB;', - 'uniform mat4 projection;', - //'uniform mat4 transform;', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoordA;', - 'varying vec2 vTexCoordB;', - - 'uniform float angle;', - 'varying float c;', - 'varying float s;', - 'varying float t;', - - 'void main(void) {', - ' c = cos(angle);', - ' s = sin(angle);', - ' t = abs(c + s);', - - // first convert to screen space - ' vec4 screenPosition = vec4(position.xy * resolution / 2.0, position.z, position.w);', - //' screenPosition = transform * screenPosition;', - - // convert back to OpenGL coords - ' gl_Position.xy = screenPosition.xy * 2.0 / resolution;', - ' gl_Position.z = screenPosition.z * 2.0 / (resolution.x / resolution.y);', - ' gl_Position.w = screenPosition.w;', - - ' vec2 adjustedTexCoord = (texCoord - 0.5) * resolution;', - ' vTexCoordA = adjustedTexCoord / resolutionA + 0.5;', - ' vTexCoordB = adjustedTexCoord / resolutionB + 0.5;', - ' vTexCoord = texCoord;', - '}' - ].join('\n'); - shaderSource.fragment = [ - 'precision mediump float;\n', - - 'varying vec2 vTexCoord;', - 'varying vec2 vTexCoordA;', - 'varying vec2 vTexCoordB;', - - 'varying float c;', - 'varying float s;', - 'varying float t;', - - 'uniform sampler2D sourceA;', - 'uniform sampler2D sourceB;', - 'uniform float split;', - 'uniform float angle;', - 'uniform float fuzzy;', - 'uniform float blendGamma;', - - 'vec4 textureLookup(sampler2D tex, vec2 texCoord, vec3 exp) {', - ' if (any(lessThan(texCoord, vec2(0.0))) || any(greaterThan(texCoord, vec2(1.0)))) {', - ' return vec4(0.0);', - ' } else {', - ' vec4 pixel = texture2D(tex, texCoord);', - ' pixel.rgb = pow(pixel.rgb, exp);', - ' return pixel;', - ' }', - '}', - - 'void main(void) {', - ' vec3 exp = vec3(blendGamma);', - ' vec4 pixel1 = textureLookup(sourceA, vTexCoordA, exp);', - ' vec4 pixel2 = textureLookup(sourceB, vTexCoordB, exp);', - ' float mn = (split - fuzzy * (1.0 - split));', - ' float mx = (split + fuzzy * split);;', - ' vec2 coords = vTexCoord - vec2(0.5);', - ' coords = vec2(coords.x * c - coords.y * s, coords.x * s + coords.y * c);', - ' float scale = max(abs(c - s), abs(s + c));', - ' coords /= scale;', - ' coords += vec2(0.5);', - ' float x = coords.x;', - ' gl_FragColor = mix(pixel2, pixel1, smoothstep(mn, mx, x));', - ' gl_FragColor.rgb = pow(gl_FragColor.rgb, 1.0 / exp);', - '}' - ].join('\n'); - - return shaderSource; - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - if (uniforms.split >= 1) { - uniforms.source = uniforms.sourceB; - parent(baseShader, model, uniforms, frameBuffer); - return; - } - - if (uniforms.split <= 0) { - uniforms.source = uniforms.sourceA; - parent(baseShader, model, uniforms, frameBuffer); - return; - } - - parent(shader, model, uniforms, frameBuffer); - }, - inPlace: false, - requires: function (sourceName, inputs) { - if (sourceName === 'sourceA' && inputs.split >= 1) { - return false; - } - - if (sourceName === 'sourceB' && inputs.split <= 0) { - return false; - } - - return true; - } - }; - }, - { - inputs: { - sourceA: { - type: 'image', - uniform: 'sourceA', - shaderDirty: false, - update: function () { - this.resize(); - } - }, - sourceB: { - type: 'image', - uniform: 'sourceB', - shaderDirty: false, - update: function () { - this.resize(); - } - }, - sizeMode: { - type: 'enum', - defaultValue: 'a', - options: [ - 'a', - 'b', - 'union', - 'intersection' - ], - update: function () { - this.resize(); - } - }, - split: { - type: 'number', - uniform: 'split', - defaultValue: 0.5, - min: 0, - max: 1, - updateSources: true - }, - angle: { - type: 'number', - uniform: 'angle', - defaultValue: 0 - }, - fuzzy: { - type: 'number', - uniform: 'fuzzy', - defaultValue: 0, - min: 0, - max: 1 - }, - blendGamma: { - type: 'number', - uniform: 'blendGamma', - defaultValue: 2.2, - min: 0, - max: 4 - } - }, - description: 'Split screen or wipe', - title: 'Split' - }); -})); diff --git a/effects/seriously.tvglitch.js b/effects/seriously.tvglitch.js deleted file mode 100644 index 4034abc..0000000 --- a/effects/seriously.tvglitch.js +++ /dev/null @@ -1,310 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - //particle parameters - var minVelocity = 0.2, - maxVelocity = 0.8, - minSize = 0.02, - maxSize = 0.3, - particleCount = 20; - - Seriously.plugin('tvglitch', function () { - var lastHeight, - lastTime, - particleBuffer, - particleShader, - particleFrameBuffer, - gl; - - return { - initialize: function (parent) { - var i, - sizeRange, - velocityRange, - particleVertex, - particleFragment, - particles; - - gl = this.gl; - - lastHeight = this.height; - - //initialize particles - particles = []; - sizeRange = maxSize - minSize; - velocityRange = maxVelocity - minVelocity; - for (i = 0; i < particleCount; i++) { - particles.push(Math.random() * 2 - 1); //position - particles.push(Math.random() * velocityRange + minVelocity); //velocity - particles.push(Math.random() * sizeRange + minSize); //size - particles.push(Math.random() * 0.2); //intensity - } - - particleBuffer = gl.createBuffer(); - gl.bindBuffer(gl.ARRAY_BUFFER, particleBuffer); - gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(particles), gl.STATIC_DRAW); - particleBuffer.itemSize = 4; - particleBuffer.numItems = particleCount; - - particleVertex = [ - '#define SHADER_NAME seriously.tvglitch.particle', - 'precision mediump float;', - - 'attribute vec4 particle;', - - 'uniform float time;', - 'uniform float height;', - - 'varying float intensity;', - - 'void main(void) {', - ' float y = particle.x + time * particle.y;', - ' y = fract((y + 1.0) / 2.0) * 4.0 - 2.0;', - ' intensity = particle.w;', - ' gl_Position = vec4(0.0, -y , 1.0, 2.0);', - //' gl_Position = vec4(0.0, 1.0 , 1.0, 1.0);', - ' gl_PointSize = height * particle.z;', - '}' - ].join('\n'); - - particleFragment = [ - '#define SHADER_NAME seriously.tvglitch.particle', - 'precision mediump float;', - - 'varying float intensity;', - - 'void main(void) {', - ' gl_FragColor = vec4(1.0);', - ' gl_FragColor.a = 2.0 * intensity * (1.0 - abs(gl_PointCoord.y - 0.5));', - '}' - ].join('\n'); - - particleShader = new Seriously.util.ShaderProgram(gl, particleVertex, particleFragment); - - particleFrameBuffer = new Seriously.util.FrameBuffer(gl, 1, Math.max(1, this.height / 2)); - parent(); - }, - commonShader: true, - shader: function (inputs, shaderSource) { - shaderSource.fragment = [ - 'precision mediump float;', - - '#define HardLight(top, bottom) (1.0 - 2.0 * (1.0 - top) * (1.0 - bottom))', - - 'varying vec2 vTexCoord;', - - 'uniform sampler2D source;', - 'uniform sampler2D particles;', - 'uniform float time;', - 'uniform float scanlines;', - 'uniform float lineSync;', - 'uniform float lineHeight;', //for scanlines and distortion - 'uniform float distortion;', - 'uniform float vsync;', - 'uniform float bars;', - 'uniform float frameSharpness;', - 'uniform float frameShape;', - 'uniform float frameLimit;', - 'uniform vec4 frameColor;', - - //todo: need much better pseudo-random number generator - Seriously.util.shader.noiseHelpers + - Seriously.util.shader.snoise2d + - - 'void main(void) {', - ' vec2 texCoord = vTexCoord;', - - //distortion - ' float drandom = snoise(vec2(time * 10.0, texCoord.y /lineHeight));', - ' float distortAmount = distortion * (drandom - 0.25) * 0.5;', - //line sync - ' vec4 particleOffset = texture2D(particles, vec2(0.0, texCoord.y));', - ' distortAmount -= lineSync * (2.0 * particleOffset.a - 0.5);', - - ' texCoord.x -= distortAmount;', - ' texCoord.x = mod(texCoord.x, 1.0);', - - //vertical sync - ' float roll;', - ' if (vsync != 0.0) {', - ' roll = fract(time / vsync);', - ' texCoord.y = mod(texCoord.y - roll, 1.0);', - ' }', - - ' vec4 pixel = texture2D(source, texCoord);', - - //horizontal bars - ' float barsAmount = particleOffset.r;', - ' if (barsAmount > 0.0) {', - ' pixel = vec4(pixel.r + bars * barsAmount,' + - 'pixel.g + bars * barsAmount,' + - 'pixel.b + bars * barsAmount,' + - 'pixel.a);', - ' }', - - ' if (mod(texCoord.y / lineHeight, 2.0) < 1.0 ) {', - ' pixel.rgb *= (1.0 - scanlines);', - ' }', - - ' float f = (1.0 - gl_FragCoord.x * gl_FragCoord.x) * (1.0 - gl_FragCoord.y * gl_FragCoord.y);', - ' float frame = clamp( frameSharpness * (pow(f, frameShape) - frameLimit), 0.0, 1.0);', - - ' gl_FragColor = mix(frameColor, pixel, frame);', - '}' - ].join('\n'); - - return shaderSource; - }, - resize: function () { - if (particleFrameBuffer) { - particleFrameBuffer.resize(1, Math.max(1, this.height / 2)); - } - }, - draw: function (shader, model, uniforms, frameBuffer, parent) { - var doParticles = (lastTime !== this.inputs.time), - vsyncPeriod; - - if (lastHeight !== this.height) { - lastHeight = this.height; - doParticles = true; - } - - //todo: make this configurable? - uniforms.lineHeight = 1 / this.height; - - if (this.inputs.verticalSync) { - vsyncPeriod = 0.2 / this.inputs.verticalSync; - uniforms.vsync = vsyncPeriod; - } else { - vsyncPeriod = 1; - uniforms.vsync = 0; - } - uniforms.time = (this.inputs.time % (1000 * vsyncPeriod)); - uniforms.distortion = Math.random() * this.inputs.distortion; - - //render particle canvas and attach uniform - //todo: this is a good spot for parallel processing. ParallelArray maybe? - if (doParticles && (this.inputs.lineSync || this.inputs.bars)) { - particleShader.use(); - gl.viewport(0, 0, 1, this.height / 2); - gl.bindFramebuffer(gl.FRAMEBUFFER, particleFrameBuffer.frameBuffer); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - gl.enableVertexAttribArray(particleShader.location.particle); - gl.bindBuffer(gl.ARRAY_BUFFER, particleBuffer); - gl.vertexAttribPointer(particleShader.location.particle, particleBuffer.itemSize, gl.FLOAT, false, 0, 0); - gl.enable(gl.BLEND); - gl.blendFunc(gl.SRC_ALPHA, gl.ONE); - particleShader.time.set(uniforms.time * this.inputs.barsRate); - particleShader.height.set(this.height); - gl.drawArrays(gl.POINTS, 0, particleCount); - - lastTime = this.inputs.time; - } - uniforms.particles = particleFrameBuffer.texture; - - parent(shader, model, uniforms, frameBuffer); - }, - destroy: function () { - particleBuffer = null; - if (particleFrameBuffer) { - particleFrameBuffer.destroy(); - particleFrameBuffer = null; - } - } - }; - }, - { - inPlace: false, - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: false - }, - time: { - type: 'number', - defaultValue: 0 - }, - distortion: { - type: 'number', - defaultValue: 0.1, - min: 0, - max: 1 - }, - verticalSync: { - type: 'number', - defaultValue: 0.1, - min: 0, - max: 1 - }, - lineSync: { - type: 'number', - uniform: 'lineSync', - defaultValue: 0.2, - min: 0, - max: 1 - }, - scanlines: { - type: 'number', - uniform: 'scanlines', - defaultValue: 0.3, - min: 0, - max: 1 - }, - bars: { - type: 'number', - uniform: 'bars', - defaultValue: 0, - min: 0, - max: 1 - }, - barsRate: { - type: 'number', - defaultValue: 1 - }, - frameShape: { - type: 'number', - uniform: 'frameShape', - min: 0, - max: 2, - defaultValue: 0.27 - }, - frameLimit: { - type: 'number', - uniform: 'frameLimit', - min: -1, - max: 1, - defaultValue: 0.34 - }, - frameSharpness: { - type: 'number', - uniform: 'frameSharpness', - min: 0, - max: 40, - defaultValue: 8.4 - }, - frameColor: { - type: 'color', - uniform: 'frameColor', - defaultValue: [0, 0, 0, 1] - } - }, - title: 'TV Glitch' - }); -})); diff --git a/effects/seriously.whitebalance.js b/effects/seriously.whitebalance.js deleted file mode 100644 index c549bb7..0000000 --- a/effects/seriously.whitebalance.js +++ /dev/null @@ -1,249 +0,0 @@ -/* global define, require */ -(function (root, factory) { - 'use strict'; - - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module. - define(['seriously'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - factory(require('seriously')); - } else { - if (!root.Seriously) { - root.Seriously = { plugin: function (name, opt) { this[name] = opt; } }; - } - factory(root.Seriously); - } -}(window, function (Seriously) { - 'use strict'; - - /* - - Math references: - en.wikipedia.org/wiki/Color_balance - http://scien.stanford.edu/pages/labsite/2010/psych221/projects/2010/JasonSu/adaptation.html - https://github.com/ikaros-project/ikaros/blob/master/Source/Modules/VisionModules/WhiteBalance/WhiteBalance.cc - - */ - - var identity = new Float32Array([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - - Seriously.plugin('whitebalance', function () { - var pyramidShader, - pyramidBuffers = [], - width, - height, - pyramidSize, - log2 = Math.log(2), - me = this, - //baseShader, //todo: share one with main object - gl, - - MAX_TEXTURE_SIZE; - - /* - todo: handle special case where node is square and power of two. save on one pyramid iteration - */ - - function updateSize(w, h) { - var size, numLevels, n, - i; - - if (width === w && height === h) { - return; - } - - width = w; - height = h; - - numLevels = Math.ceil(Math.log(Math.max(h, w)) / log2); - size = Math.pow(2, numLevels); - - if (size > MAX_TEXTURE_SIZE) { - numLevels = Math.ceil(Math.log(MAX_TEXTURE_SIZE) / log2); - size = MAX_TEXTURE_SIZE; - } - - numLevels++; - if (pyramidSize === size) { - return; - } - - pyramidSize = size; - - while (pyramidBuffers.length > numLevels) { - (pyramidBuffers.pop()).fb.destroy(); - } - - while (pyramidBuffers.length < numLevels) { - i = pyramidBuffers.length; - n = Math.pow(2, i); - pyramidBuffers.push({ - fb: new Seriously.util.FrameBuffer(me.gl, n, n),//, true), - opts: { - width: n, - height: n - }, - uniforms: { - level: pyramidBuffers.length, - offset: 0.25 / n, - transform: identity, - projection: identity, - resolution: [n, n] - } - }); - - if (i) { - pyramidBuffers[i - 1].uniforms.source = pyramidBuffers[i].fb.texture; - } - } - } - - - return { - initialize: function (initialize) { - gl = this.gl; - - MAX_TEXTURE_SIZE = gl.getParameter(gl.MAX_TEXTURE_SIZE); - - if (this.inputs.auto) { - updateSize(this.width, this.height); - } - - initialize(); - }, - shader: function (inputs, shaderSource) { - var auto = inputs.auto; - //todo: gl.getExtension('OES_texture_float_linear') - - if (auto && !pyramidShader) { - pyramidShader = new Seriously.util.ShaderProgram(this.gl, shaderSource.vertex, [ - 'precision mediump float;', - - 'varying vec2 vTexCoord;', - - 'uniform sampler2D source;', - 'uniform float offset;', - 'uniform int level;', - - 'void main(void) {', - //gl.getExtension("OES_texture_float"), gl.getExtension("OES_texture_float_linear") - //' vec4 pixel = texture2D(source, vTexCoord);', - - ' vec4 pixel = texture2D(source, vTexCoord - vec2(offset)) +', - ' texture2D(source, vTexCoord + vec2(offset, -offset)) +', - ' texture2D(source, vTexCoord + vec2(offset)) +', - ' texture2D(source, vTexCoord + vec2(-offset, offset));', - ' pixel /= 4.0;', - ' gl_FragColor = pixel;', - '}' - ].join('\n')); - } - - shaderSource.fragment = [ - auto ? '#define AUTO' : '', - 'precision mediump float;', - - 'varying vec2 vTexCoord;', - - 'uniform sampler2D source;', - '#ifdef AUTO', - 'uniform sampler2D whiteSource;', - '#else', - 'uniform vec4 white;', - '#endif', - - // matrices from: http://www.brucelindbloom.com/index.html?Eqn_RGB_XYZ_Matrix.html - /* - raw RGB just seems to work better so let's use that until we figure Bradford out - 'const mat3 rgbToBradford = mat3(', - ' 0.4360747, 0.2225045, 0.0139322,', - ' 0.3850649, 0.7168786, 0.0971045,', - ' 0.1430804, 0.0606169, 0.7141733', - ');', - - 'const mat3 bradfordToRgb = mat3(', - ' 3.1338561, -0.9787684, 0.0719453,', - ' -1.6168667, 1.9161415, -0.2289914,', - ' -0.4906146, 0.033454, 1.4052427', - ');', - */ - - 'const vec3 luma = vec3(0.2125, 0.7154, 0.0721);', - - 'void main(void) {', - ' vec4 pixel = texture2D(source, vTexCoord);', - '#ifdef AUTO', - ' vec4 white = texture2D(whiteSource, vTexCoord);', - '#endif', - /* - ' vec3 whiteBradford = rgbToBradford * white.rgb;', - ' vec3 targetBradford = rgbToBradford * vec3(dot(white.rgb, luma));', - ' vec3 colorBradford = rgbToBradford * pixel.rgb;', - ' pixel.rgb = clamp(bradfordToRgb * (colorBradford * targetBradford / whiteBradford), 0.0, 1.0);', - */ - ' vec3 target = vec3(dot(white.rgb, luma));', - ' pixel.rgb = pixel.rgb * target / white.rgb;', - ' gl_FragColor = pixel;', - '}' - ].join('\n'); - - return shaderSource; - }, - resize: function () { - if (this.gl && this.inputs.auto) { - updateSize(this.width, this.height); - } - }, - draw: function (shader, model, uniforms, frameBuffer, draw) { - var i, - buf; - - if (this.inputs.auto) { - i = pyramidBuffers.length - 1; - pyramidBuffers[i].uniforms.source = uniforms.source; - while (i >= 0) { - buf = pyramidBuffers[i]; - draw(pyramidShader, model, buf.uniforms, buf.fb.frameBuffer, null, buf.opts); - i--; - } - - uniforms.whiteSource = pyramidBuffers[0].fb.texture; - } - - draw(shader, model, uniforms, frameBuffer); - }, - destroy: function () { - while (pyramidBuffers.length) { - pyramidBuffers.pop().destroy(); - } - }, - inPlace: false, - inputs: { - source: { - type: 'image', - uniform: 'source', - shaderDirty: false - }, - white: { - type: 'color', - uniform: 'white', - defaultValue: [1, 1, 1] - }, - auto: { - type: 'boolean', - shaderDirty: true, - defaultValue: true - } - } - }; - }, - { - title: 'White Balance' - }); -})); diff --git a/examples/accumulator/index.html b/examples/accumulator/index.html index 060e441..2e9ecfb 100644 --- a/examples/accumulator/index.html +++ b/examples/accumulator/index.html @@ -70,7 +70,7 @@ -
+
@@ -69,7 +69,7 @@ require([ 'seriously', - 'effects/seriously.blend' + 'src/effects/seriously.blend' ], function (Seriously) { // declare our variables var seriously, // the main object that holds the entire composition diff --git a/examples/blur/blur.html b/examples/blur/blur.html index 8fdc752..ade8352 100644 --- a/examples/blur/blur.html +++ b/examples/blur/blur.html @@ -44,7 +44,7 @@ require([ 'seriously', - 'effects/seriously.blur' + 'src/effects/seriously.blur' ], function (Seriously) { // declare our variables var seriously, // the main object that holds the entire composition diff --git a/examples/blur/directionblur.html b/examples/blur/directionblur.html index 68e82ab..d9e2e34 100644 --- a/examples/blur/directionblur.html +++ b/examples/blur/directionblur.html @@ -32,7 +32,7 @@ require([ 'seriously', - 'effects/seriously.directionblur' + 'src/effects/seriously.directionblur' ], function (Seriously) { // declare our variables var seriously, // the main object that holds the entire composition diff --git a/examples/blur/whip.html b/examples/blur/whip.html index 5c61da1..97322ab 100644 --- a/examples/blur/whip.html +++ b/examples/blur/whip.html @@ -21,8 +21,8 @@ require([ 'seriously', - 'effects/seriously.blend', - 'effects/seriously.directionblur' + 'src/effects/seriously.blend', + 'src/effects/seriously.directionblur' ], function (Seriously) { var seriously = new Seriously(), blend = seriously.effect('blend'), diff --git a/examples/camera/camera-source.html b/examples/camera/camera-source.html index e01a023..770ee2d 100644 --- a/examples/camera/camera-source.html +++ b/examples/camera/camera-source.html @@ -7,8 +7,8 @@ - - + + - + - + - + - - - - - - + + + + + + - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - + + + + - - + + - - - + + + - - + + - - + + - - - - + + + + - + - - - + + + - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - + +
@@ -61,47 +61,38 @@
- + diff --git a/examples/blur/blur.html b/examples/blur/blur.html index ade8352..23f20e2 100644 --- a/examples/blur/blur.html +++ b/examples/blur/blur.html @@ -29,97 +29,88 @@ - +
- - + + diff --git a/examples/blur/directionblur.html b/examples/blur/directionblur.html index d9e2e34..79820c1 100644 --- a/examples/blur/directionblur.html +++ b/examples/blur/directionblur.html @@ -18,38 +18,29 @@ - +
- + diff --git a/examples/blur/whip.html b/examples/blur/whip.html index 97322ab..b4813df 100644 --- a/examples/blur/whip.html +++ b/examples/blur/whip.html @@ -13,95 +13,85 @@ - + diff --git a/examples/camera/camera-source.html b/examples/camera/camera-source.html index 770ee2d..9a349fc 100644 --- a/examples/camera/camera-source.html +++ b/examples/camera/camera-source.html @@ -6,9 +6,7 @@ - - - + - + + diff --git a/examples/color/color.html b/examples/color/color.html index 530eb78..fd95310 100644 --- a/examples/color/color.html +++ b/examples/color/color.html @@ -26,8 +26,7 @@
- - + + diff --git a/examples/color/lut.html b/examples/color/lut.html index cb8b91c..a06d128 100644 --- a/examples/color/lut.html +++ b/examples/color/lut.html @@ -22,10 +22,10 @@ - - - - + + + +
@@ -42,42 +42,33 @@
- + diff --git a/examples/crop.html b/examples/crop.html index 307dfa9..9ba5a74 100644 --- a/examples/crop.html +++ b/examples/crop.html @@ -38,7 +38,6 @@ - + diff --git a/examples/demo/fog.html b/examples/demo/fog.html index 3096c9f..a068bbe 100644 --- a/examples/demo/fog.html +++ b/examples/demo/fog.html @@ -46,20 +46,13 @@ - - - - - - - - + + + diff --git a/examples/demo/select.html b/examples/demo/select.html index fea0b98..7625548 100644 --- a/examples/demo/select.html +++ b/examples/demo/select.html @@ -27,13 +27,9 @@ - + diff --git a/examples/demo/threejs-source.html b/examples/demo/threejs-source.html index d2a3348..bd13d2d 100644 --- a/examples/demo/threejs-source.html +++ b/examples/demo/threejs-source.html @@ -58,25 +58,9 @@ - - - - - - - - - - - - - - - - - - - + + + - - - - - - + + - - - + + - - - + + + - - + + diff --git a/examples/opticalflow.html b/examples/opticalflow.html index bcd3160..738101c 100644 --- a/examples/opticalflow.html +++ b/examples/opticalflow.html @@ -11,8 +11,6 @@ - - - - - - + + - - - + - - - + - - - - - - + + + + + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + +