The example is using new API that is coming out with the next release of the engine (v2.8). So you’d need to use older API, but possibly other changes would be needed, I’m not entirely sure, as this has changed in many ways since v2.7
see here, the same example using API from engine 2.7: PlayCanvas Examples
But as I said, there might be other issues with this with 2.7 engine, as example is written with 2.8 in mind. Might just work though.
1 Like
Thank you so much! Great to see this does work in 2.7
It looks like that example still uses the same function, transformCoreVS for the vertex shader
@eproasim this might be useful?
Yep! I’m working on it now and digging into see what I’m missing =]
1 Like
Hello! I managed to make the required adjustments to be made for Engine 2.7. If you like, when 2.8 is released, I can revisit and edit again. You can check out the changes in this fork:
https://playcanvas.com/editor/scene/2239562
Make sure you’re looking at windv2.js as well as copying the new shader file to your project.
I hope this is helpful.
1 Like
@eproasim Amazing! Thank you so much!!
I’m getting that same error opening your scene “Error while saving changes” but it usually works after a bit of time.
If possible can you share the new wind.js and wind.vert.glsl ?
Yep!
windv2.js:
var Windv2 = pc.createScript('windv2');
Windv2.attributes.add('vShader', {
type: 'asset',
title: 'Vertex Shader',
assetType: 'shader'
});
Windv2.attributes.add('amplitude', {
type: 'number',
title: 'Amplitude',
default: 1
});
Windv2.attributes.add('wavelength', {
type: 'number',
title: 'Frequency',
default: 1
});
// initialize code called once per entity
Windv2.prototype.initialize = function() {
this.timer = 0;
this.material = this.entity.render.meshInstances[0].material;
// this.material.chunks.startVS = this.vShader.resource;
this.material.chunks.transformCoreVS = this.vShader.resource;
// console.log(this.material);
// this.material.shaderChunks.glsl.set('transformCoreVS', this.vShader.resource);
// console.log(this.material.chunks);
};
// update code called every frame
Windv2.prototype.update = function(dt) {
this.timer += dt;
// this.material.setParameter('time', this.timer);
this.app.graphicsDevice.scope.resolve('time').setValue(this.timer);
// this.material.setParameter('amplitude', this.amplitude);
this.app.graphicsDevice.scope.resolve('amplitude').setValue(this.amplitude);
// this.material.setParameter('wavelength', this.wavelength);
this.app.graphicsDevice.scope.resolve('wavelength').setValue(this.wavelength);
// this.material.update();
};
// swap method called for script hot-reloading
// inherit your script state here
// Windv2.prototype.swap = function(old) { };
// to learn more about script anatomy, please read:
// http://developer.playcanvas.com/en/user-manual/scripting/
wind.glsl:
uniform float time;
uniform float amplitude;
uniform float wavelength;
attribute vec4 vertex_position;
uniform mat4 matrix_viewProjection;
uniform mat4 matrix_model;
uniform mat3 matrix_normal;
#if defined(INSTANCING)
#include "transformInstancingVS"
#endif
mat4 getModelMatrix() {
return matrix_model;
}
vec3 getLocalPosition(vec3 vertexPosition) {
vec3 pos = vertexPosition;
pos.y += cos(pos.z * wavelength + time) * amplitude * pow(sin(pos.x * wavelength + time), 3.0);
return pos;
}
1 Like
@eproasim I got it working! Thank you so much!!!
@mvaligursky Thank you so much for your help also!
Looking forward to sharing my project with you both, should be done end of day Thursday
2 Likes
@eproasim @mvaligursky Check it out!
Please drop a like and share it if you enjoy. Thanks again!
2 Likes
@eproasim @mvaligursky Hello, thank you both for your previous help with the vertex shader. It has recently stopped working (with no errors) and I wondered if there had been any updates to PlayCanvas / Vertex Shaders that might have broken it?
This is the vertex shader .glsl
uniform float time;
uniform float amplitude;
uniform float wavelength;
attribute vec4 vertex_position;
uniform mat4 matrix_viewProjection;
uniform mat4 matrix_model;
uniform mat3 matrix_normal;
#if defined(INSTANCING)
#include "transformInstancingVS"
#endif
mat4 getModelMatrix() {
return matrix_model;
}
vec3 getLocalPosition(vec3 vertexPosition) {
vec3 pos = vertexPosition;
pos.y += cos(pos.z * wavelength + time) * amplitude * pow(sin(pos.x * wavelength + time), 3.0);
return pos;
}
Hi @Dylan !
I took a look at my example project to see when the breaking change would have occurred. It appears to originate in the change made to the chunk system in 2.8.0:
I modified my project to follow the conventions listed in the pull request:
var Windv2 = pc.createScript('windv2');
Windv2.attributes.add('vShader', {
type: 'asset',
title: 'Vertex Shader',
assetType: 'shader'
});
Windv2.attributes.add('amplitude', {
type: 'number',
title: 'Amplitude',
default: 1
});
Windv2.attributes.add('wavelength', {
type: 'number',
title: 'Frequency',
default: 1
});
// initialize code called once per entity
Windv2.prototype.initialize = function() {
this.timer = 0;
this.material = this.entity.render.meshInstances[0].material;
// this.material.chunks.transformCoreVS = this.vShader.resource;
this.material.getShaderChunks(pc.SHADERLANGUAGE_GLSL).set('transformCoreVS', this.vShader.resource);
};
// update code called every frame
Windv2.prototype.update = function(dt) {
this.timer += dt;
// this.material.setParameter('time', this.timer);
this.app.graphicsDevice.scope.resolve('time').setValue(this.timer);
// this.material.setParameter('amplitude', this.amplitude);
this.app.graphicsDevice.scope.resolve('amplitude').setValue(this.amplitude);
// this.material.setParameter('wavelength', this.wavelength);
this.app.graphicsDevice.scope.resolve('wavelength').setValue(this.wavelength);
// this.material.update();
};
// swap method called for script hot-reloading
// inherit your script state here
// Windv2.prototype.swap = function(old) { };
// to learn more about script anatomy, please read:
// http://developer.playcanvas.com/en/user-manual/scripting/
but the shader now errors out:
Failed to compile vertex shader:
WARNING: 0:5: 'GL_ANGLE_multi_draw' : extension is not supported
ERROR: 0:136: 'matrix_normal' : redefinition
If I have time to keep poking at it tomorrow, I’ll try to give an update, otherwise @mvaligursky might be able to give a quicker response to the changes now required for the glsl resourse.
Sorry I couldn’t be more helpful, right at the moment =[
@eproasim Thank you so much for trying!
I will look at the github link too and see what I can figure out.
Yes hopefully @mvaligursky can point us in the right direction 
It seems you need to remove the definition of matrix_normal from your override. Look at the whole shader that errors, to see what is going on there.
Thank you @mvaligursky!
Yep, removing uniform mat3 matrix_normal from the shader resource fixed the shader. I took a look at the output form the error, and now see that after the chunk is inserted, matrix_normal is defined again:
...
72: uniform float time;
73: uniform float amplitude;
74: uniform float wavelength;
75:
76: attribute vec4 vertex_position;
77: uniform mat4 matrix_viewProjection;
78: uniform mat4 matrix_model;
79: uniform mat3 matrix_normal; //<------- First definition
80:
81:
82: mat4 getModelMatrix() {
83: return matrix_model;
84: }
85:
86: vec3 getLocalPosition(vec3 vertexPosition) {
87:
88: vec3 pos = vertexPosition;
89:
90: pos.y += cos(pos.z * wavelength + time) * amplitude * pow(sin(pos.x * wavelength + time), 3.0);
91:
92: return pos;
93: }
94:
95: attribute vec2 vertex_texCoord0;
96:
97: vec2 getUv0() {
98: return vertex_texCoord0;
99: }
100:
101:
102: vec4 evalWorldPosition(vec3 vertexPosition, mat4 modelMatrix) {
103:
104: vec3 localPos = getLocalPosition(vertexPosition);
105:
106:
107: vec4 posW = modelMatrix * vec4(localPos, 1.0);
108:
109:
110: return posW;
111: }
112:
113: vec4 getPosition() {
114:
115: dModelMatrix = getModelMatrix();
116:
117: vec4 posW = evalWorldPosition(vertex_position.xyz, dModelMatrix);
118: dPositionW = posW.xyz;
119:
120: vec4 screenPos;
121: screenPos = matrix_viewProjection * posW;
122:
123:
124: return screenPos;
125: }
126:
127: vec3 getWorldPosition() {
128: return dPositionW;
129: }
130:
131:
132:
133:
134: attribute vec3 vertex_normal;
135:
136: uniform mat3 matrix_normal; // <------ Second definition
137:
138:
139: vec3 getLocalNormal(vec3 vertexNormal) {
140:
141: vec3 localNormal = vertex_normal;
142:
143:
144: return localNormal;
145: }
146:
147: mat3 getNormalMatrix(mat4 modelMatrix) {
148: return matrix_normal;
149: }
...
I suppose I’m surprised that the shader works while having the uniform definition further down in the file, but I’m not particularly experienced with GLSL.
Out of curiosity, was there a reason that the uniform was moved to be added after the chunk override?
You can safely comment out or remove line 8 from the shader resource to get it working again:
uniform float time;
uniform float amplitude;
uniform float wavelength;
attribute vec4 vertex_position;
uniform mat4 matrix_viewProjection;
uniform mat4 matrix_model;
// uniform mat3 matrix_normal; // <------ Comment or remove
#if defined(INSTANCING)
#include "transformInstancingVS"
#endif
mat4 getModelMatrix() {
return matrix_model;
}
vec3 getLocalPosition(vec3 vertexPosition) {
vec3 pos = vertexPosition;
pos.y += cos(pos.z * wavelength + time) * amplitude * pow(sin(pos.x * wavelength + time), 3.0);
return pos;
}
I hope this is helpful =]
I’m sure there was, but without finding and looking at PR, I cannot comment on it as it escaped my memory, there were many shader refactorings to bring it to a more useful versions before exposing to public, related to making ShaderMaterial support skinning / instancing and all that.
Hi @eproasim thank you so much for your help. For some reason making the change you suggested does not work. My tree is still static.
I also do not get any errors in the console.
Could it be the engine version? Currently I’m using 2.12.4
I invited you to the test project if that is helpful.
https://playcanvas.com/editor/scene/2357753
Sorted out on example project.
The wind.js script had to be updated to the latest convention introduced in 2.8.0.