added texture points
diff --git a/player/js/elements/webglElements/effects/WebGLPuppetPin.js b/player/js/elements/webglElements/effects/WebGLPuppetPin.js
index e0c5a31..dd85416 100644
--- a/player/js/elements/webglElements/effects/WebGLPuppetPin.js
+++ b/player/js/elements/webglElements/effects/WebGLPuppetPin.js
@@ -26,14 +26,125 @@
this.filterManager = filterManager;
this.gl = gl;
this.elem = elem;
+
+ var positions = [];
+ var i, j, len = 10, jlen = 10;
+ for(j = 0; j < jlen; j += 1) {
+ for(i = 0; i < len; i += 1) {
+ /*positions.push(i/10);
+ positions.push(j/10);
+ positions.push((i+1)/10);
+ positions.push(j/10);
+ positions.push(i/10);
+ positions.push((j+1)/10);
+ positions.push((i+1)/10);
+ positions.push(j/10);
+ positions.push((i+1)/10);
+ positions.push((j+1)/10);
+ positions.push(i/10);
+ positions.push((j+1)/10);*/
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ }
+ }
+ this.positions = new Float32Array(positions);
+ this.positionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
+ gl.bufferData(gl.ARRAY_BUFFER, this.positions, gl.STATIC_DRAW);
+
+ var texture_positions = [];
+ var i, j, len = 10, jlen = 10;
+ for(j = 0; j < jlen; j += 1) {
+ for(i = 0; i < len; i += 1) {
+ /*texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());
+ texture_positions.push(Math.random());*/
+ texture_positions.push(i/10);
+ texture_positions.push(j/10);
+ texture_positions.push((i+1)/10);
+ texture_positions.push(j/10);
+ texture_positions.push(i/10);
+ texture_positions.push((j+1)/10);
+ texture_positions.push((i+1)/10);
+ texture_positions.push(j/10);
+ texture_positions.push((i+1)/10);
+ texture_positions.push((j+1)/10);
+ texture_positions.push(i/10);
+ texture_positions.push((j+1)/10);
+ }
+ }
+ this.texture_positions = new Float32Array(texture_positions);
+ this.textureBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.textureBuffer);
+ gl.bufferData(gl.ARRAY_BUFFER, this.texture_positions, gl.STATIC_DRAW);
}
WPuppetPinEffect.prototype.renderFrame = function(forceRender, buffer){
var effectElements = this.filterManager.effectElements;
var gl = this.gl;
- this.positionAttributeLocation = gl.getAttribLocation(this.program, "a_position");
- gl.vertexAttribPointer(this.texcoordLocation, 2, gl.FLOAT, false, 0, 4 * 12 * 1);
- gl.vertexAttribPointer(this.positionAttributeLocation, 2, gl.FLOAT, false, 0, 4 * 12 * 1);
this.gl.useProgram(this.program);
- this.gl.drawArrays(this.gl.TRIANGLES, 0, 6 * 75);
+
+ //POSITION
+ var positions = [];
+ var i, j, len = 10, jlen = 10;
+ for(j = 0; j < jlen; j += 1) {
+ for(i = 0; i < len; i += 1) {
+ /*positions.push(i/10);
+ positions.push(j/10);
+ positions.push((i+1)/10);
+ positions.push(j/10);
+ positions.push(i/10);
+ positions.push((j+1)/10);
+ positions.push((i+1)/10);
+ positions.push(j/10);
+ positions.push((i+1)/10);
+ positions.push((j+1)/10);
+ positions.push(i/10);
+ positions.push((j+1)/10);*/
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ positions.push(Math.random());
+ }
+ }
+ this.positions = new Float32Array(positions);
+ this.positionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
+ gl.bufferData(gl.ARRAY_BUFFER, this.positions, gl.STATIC_DRAW);
+ gl.enableVertexAttribArray(this.positionAttributeLocation);
+ gl.vertexAttribPointer(this.positionAttributeLocation, 2, gl.FLOAT, false, 0, 0);
+ //TEXTURE
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.textureBuffer);
+ gl.enableVertexAttribArray(this.texcoordLocation);
+ gl.vertexAttribPointer(this.texcoordLocation, 2, gl.FLOAT, false, 0, 0);
+ //DRAWING
+ this.gl.drawArrays(this.gl.TRIANGLES, 0, 6 * 100);
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.elem.globalData.positionBuffer);
};
\ No newline at end of file
diff --git a/player/js/renderers/WebGLRenderer.js b/player/js/renderers/WebGLRenderer.js
index 5e5ad07..0559431 100644
--- a/player/js/renderers/WebGLRenderer.js
+++ b/player/js/renderers/WebGLRenderer.js
@@ -77,27 +77,9 @@
1, 0,
1, 1,
];
- var i, j, len = 10, jlen = 10;
- for(j = 0; j < jlen; j += 1) {
- for(i = 0; i < len; i += 1) {
- positions.push(i/10);
- positions.push(j/10);
- positions.push((i+1)/10);
- positions.push(j/10);
- positions.push(i/10);
- positions.push((j+1)/10);
- positions.push((i+1)/10);
- positions.push(j/10);
- positions.push((i+1)/10);
- positions.push((j+1)/10);
- positions.push(i/10);
- positions.push((j+1)/10);
- }
- }
- console.log(positions)
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(positions), gl.STATIC_DRAW);
//
- this.globalData.positions = positions;
+ this.globalData.positionBuffer = this.positionBuffer;
this.globalData.renderer = this;
this.globalData.isDashed = false;
this.globalData.progressiveLoad = this.renderConfig.progressiveLoad;
diff --git a/player/js/utils/webgl/shader_provider.js b/player/js/utils/webgl/shader_provider.js
index a13980c..d0e120c 100644
--- a/player/js/utils/webgl/shader_provider.js
+++ b/player/js/utils/webgl/shader_provider.js
@@ -10,7 +10,7 @@
shaders["mask_shader_vert"] = "// mask_shader.vert\nattribute vec4 a_position;\nvarying vec2 v_texCoord;\nattribute vec2 a_texCoord;\nvoid main() {\n vec4 zeroToOne = a_position / 1.0;\n vec4 zeroToTwo = zeroToOne * 2.0;\n vec4 clipSpace = zeroToTwo - 1.0;\n gl_Position = vec4(clipSpace);\n v_texCoord = a_texCoord;\n}";
shaders["noop_effect_shader_frag"] = "// noop_effect_shader.frag\nprecision mediump float;\nvoid main() {\n gl_FragColor = vec4(1.0,1.0,0.0,1.0);\n}";
shaders["puppet_pin_shader_frag"] = "// puppet_pin_shader.frag\nprecision mediump float;\nuniform sampler2D u_image;\nvarying vec2 v_texCoord;\nvoid main() {\n gl_FragColor = texture2D(u_image, v_texCoord);\n}";
-shaders["puppet_pin_shader_vert"] = "// puppet_pin_shader.vert\nattribute vec4 a_position;\nvarying vec2 v_texCoord;\nattribute vec2 a_texCoord;\nvoid main() {\n vec4 zeroToOne = a_position / 1.0;\n vec4 zeroToTwo = zeroToOne * 2.0;\n vec4 clipSpace = zeroToTwo - 1.0;\n gl_Position = vec4(clipSpace);\n v_texCoord = a_texCoord;\n}";
+shaders["puppet_pin_shader_vert"] = "// puppet_pin_shader.vert\nattribute vec4 a_position;\nvarying vec2 v_texCoord;\nattribute vec2 a_texCoord;\nvoid main() {\n vec4 zeroToTwo = a_position * 2.0;\n vec4 clipSpace = zeroToTwo - 1.0;\n gl_Position = vec4(clipSpace);\n v_texCoord = a_texCoord;\n}";
shaders["ripple_shader_frag"] = "// ripple_shader.frag\nprecision mediump float;\nuniform sampler2D u_image;\nvarying vec2 vUv;\n\nvec2 fromPolar( vec2 uv ) {\n uv = vec2( uv.x * cos( uv.y ), uv.x * sin( uv.y ) );\n return uv + vec2( 0.5 );\n}\nvec2 toPolar( vec2 uv ) {\n uv -= vec2( 0.5 );\n return vec2( length( uv ), atan( uv.y, uv.x )); \n}\n\n\n//sqrt(pow(0.5,2) + pow(0.5,2)) * 2\nfloat diagonal = 1.4142;\nfloat PI = 3.141592;\nfloat wave_width = 9.0;\nfloat wave_height = 0.008;\n\nvoid main() {\n vec2 vUv_1 = vUv;\n vUv_1 = toPolar(vUv_1);\n float angle = (vUv_1.y + PI) * 180.0 / PI;\n float segment = mod(angle, wave_width);\n float segment_perc = segment / wave_width;\n vUv_1.x += wave_height * sin(PI * segment_perc);\n //vUv_1.x += vUv_1.x;\n vec2 cart_vUv_1 = fromPolar(vUv_1);\n if(cart_vUv_1.x < 0.0 || cart_vUv_1.x > 1.0 || cart_vUv_1.y < 0.0 || cart_vUv_1.y > 1.0) {\n discard;\n }\n if(segment_perc < 0.5) {\n }\n\n gl_FragColor = texture2D(u_image, cart_vUv_1);\n}";
shaders["ripple_shader_vert"] = "// ripple_shader.vert\nattribute vec4 a_position;\nattribute vec2 a_texCoord;\nvarying vec2 v_texCoord;\nvarying vec2 vUv;\nvoid main() {\n vec4 zeroToOne = a_position / 1.0;\n vec4 zeroToTwo = zeroToOne * 2.0;\n vec4 clipSpace = zeroToTwo - 1.0;\n gl_Position = vec4(clipSpace);\n vUv = a_texCoord;\n}";
shaders["solid_layer_shader_frag"] = "// solid_layer_shader.frag\nprecision mediump float;\nuniform vec4 colorUniform;\nvoid main() {\n gl_FragColor = colorUniform;\n}";
diff --git a/player/js/utils/webgl/shaders/puppet_pin_shader.vert b/player/js/utils/webgl/shaders/puppet_pin_shader.vert
index 811e6f3..0f3af54 100644
--- a/player/js/utils/webgl/shaders/puppet_pin_shader.vert
+++ b/player/js/utils/webgl/shaders/puppet_pin_shader.vert
@@ -2,8 +2,7 @@
varying vec2 v_texCoord;
attribute vec2 a_texCoord;
void main() {
- vec4 zeroToOne = a_position / 1.0;
- vec4 zeroToTwo = zeroToOne * 2.0;
+ vec4 zeroToTwo = a_position * 2.0;
vec4 clipSpace = zeroToTwo - 1.0;
gl_Position = vec4(clipSpace);
v_texCoord = a_texCoord;
