November challenge - celebrating materials

[KarelAnker]

I'm excited for the splat mapping material tho, seems promising when the documentation is up

[RaananW]

John, your fur shader is awesome. :-) My (very-old-soon-to-be-replaced) Intel-HD4000 doesn't like it at all, but I do. And who listens to Intel Graphic cards anyhow?

 

Keep on the good work!

[iiceman]

I didn't dare to give it a shot yet, but I might give it a try at the weekend!

 

Fur is pretty cool!

[JohnK]

Making progress but not there yet. I have made two changes

 

1. Completely changed the increasedFacets function to one you only call once and is a bit more efficient. It now takes two parameters the mesh and the points to be added to each side of a facet. When n is the number of points per side the facets increase by (n + 1)(n + 1) and the number of vertices by (n + 2)(n +3)/2
2. Added a convertToSmoothShadedMesh function. When a box is created each corner has three normals, one for each face. ( I think this happens only  for the creation of boxes and polygons). Since this shader pushes the vertices in the direction of the normal this produces gaps at the edges http://www.babylonjs-playground.com/#1WIMO1#9 So the function averages out the normals at a vertex (this is the usual way that most meshes are created). The result of using the smoothing function removes the gaps http://www.babylonjs-playground.com/#1WIMO1#8 between the edges.

Currently I am working on using an image as a heightMap for the fur length and using an image for the texture. Still a long way from completing so doubt if I will be entering for the challenge but will keep working on it and submit it for the material library when I am happy with it

[JohnK]

Now have a shader that can use an image for texture http://www.babylonjs-playground.com/#1WIMO1#10 and one that uses an image for a heightmap http://www.babylonjs-playground.com/#1WIMO1#11

 

Now to get to grips with putting everything into one material for the material library. I may be gone for some time

[JohnK]

Thanks to Temechon's help I have managed to create and test my fur material in my Babylon fork. Tha'ts the good news. The bad news is that I cannot get it to work. The webserver is up and running and I get the option in the shaderlibray menu and I get the different meshes for my shader and even get the texture I applied but the change of height for the vertices is not working. Somewhere along the way trying to put my few lines of code that worked in the playground into all the vertex.fx and fragment.fx code I got well and truly lost. Perhaps I'll have time for another play tomorrow. If anybody feels brave enough and has enough time given how busy everybody is you can have a look at https://github.com/Cubees/Babylon.js/tree/babylonjk1

 

In the meantime I have been very pleasantly amazed by the current examples of BJS projects that are appearing.

[GameMonetize]

What error do you get?

[JohnK]

Not so much an error the vertices did not change height. Trouble is I know how to use the console to check values etc for JavaScript but cannot find a way to debug the shader bits to see which bits give the expected results.

[RaananW]

Maybe this can help? https://chrome.google.com/webstore/detail/webgl-inspector/ogkcjmbhnfmlnielkjhedpcjomeaghda

[jerome]

FF has also an embbeded shader/debugger editor. 

Open the console, open the tool options and check in the shader editor.

 

I didn't use it so far.

[JohnK]

@RaananW and @jermome thank you for the tip. One thing I have found using the shader editor is that my shaders never seem to change. I stripped the shaders back to the basic code I used for them in the PG examples but everytime I ran 'gulp webserver' I still found the original shaders I first wrote in the materials library.

I am using Visual Studio Code for editing and have commited the changes. I have completely closed the command line window opened it and re-installed npm and gulp and re-compiled and cleared the cache so I am guessing it is something to do with the recompling not overwriting the originally compiled program????

Will search for the compiled program and research compiling with gulp to see if there is a flag to set so it overwrites.

In the meantime any advice would be appreciated.

EDIT Seems it's not a compilation problem have found the compiled file and it matches the new edits. The link in the page source is to the old file. More tracking to do. May not have time until Thursday.

[Temechon]

You have to run "gulp" first to compile. It will override everything you have in the dist folder.

"gulp webserver" only run the webserver.

One more thing : be sure to check if "gulp" returns no error. If you have any error, the typescript won't compile and your javascript file won't change.

[RaananW]

So, who is still afraid of the big bad glsl wolf? One day remaining, waiting for your PMs!

Send me anything you have. If you failed, if you only partly succeeded, we want to see and learn. And maybe improve it together!

[JohnK]

It does seem to be a comiplation error after all. The compiled files are not being changed. This is the message after using gulp

[09:29:36] Using gulpfile ~\Documents\Babylon.js\materialsLibrary\gulpfile.js[09:29:36] Starting 'copyReference'...[09:29:36] Finished 'copyReference' after 72 ms[09:29:36] Starting 'default'...[09:29:36] Finished 'default' after 113 ms

Does the 'default' on the last two lines mean that an error has occured and it has defaulted to the original file?

 

 

[RaananW]

Nope, that means all is quiet on the western front.

Did you add your files to be compiled in the gulp file?

[JohnK]

@RaananW I had added the files to be comiled into the gulp file but I had not done it correctly. Would never have thought to check there without your suggestion. It was a copy and paste error and forgetting to edit some of the paste error. Still a bit to go before it works correctly but am definitely closer.   Still have limited time to do this before Thursday but will make the best use of the time I can have.

 

Good advice as usual.

 

Edit Have also just realised I need to commit after running gulp (I think)

[Temechon]

No you don't need to commit

[RaananW]

So... I haven't received too many PMs... Waiting till this evening!

[iiceman]

I didn't have or didn't spend enough time to accomplish anything. Started two times looking at it and then didn't have enough time to really get into it. So I'll have to skip this one. Sorry :-/

[JohnK]

Also sorry the best I can do at the moment are the PGs I posted already. Still learning to handle forks, branches, github desktop, Visual Studio Code and materialsLibrary. Seems very unlikely I'll have it sorted even by the weekend.

[iiceman]

Hooww... many entries do you have so far RaananW?

[JohnK]

Still struggling but have found another mistake I have made. in my babylon.furMaterial.ts file I had left the following code 

// Legacy browser patchvar shaderName = "simple";

as it was instead of changing it to

// Legacy browser patchvar shaderName = "fur";

Next time I will not take the How to instructions so literaly - as it said simple not simpleMaterial I didn't change it and everytime I saw it I thought it was something to do with that fur extended simple. Dhhhh how stupid was that.

 

However I now get the following error message in the console

 

Error: WebGL: shaderSource: String contains the illegal character '92', ie a backslash \

 

Now in babylon.furMaterial.js there are lots of these in the BABYLON.Effect.ShadersStore properties of furVertexShader and furPixelShader. But  there are also loads in, for example, Temechon's lavaMaterial. Of course these are for the escape codes for newline \n or tab \t

 

So now I presume I have at least one stray backslash somewhere.

 

Time to go throught the shader codes with a fine tooth comb. Anyone got any ideas where it may be likely it will be much appreciated.

[RaananW]

Well, I have two submissions (JohnK and Temechon), and mine, which is very simple. I will post it pretty soon, and will discuss next month's challenging challenge.

If anyone still wants to jump in, you still have some time!

[JohnK]

Yay Thursday and I think I have correctly finished adding furMaterial to my fork. Made a lot of silly mistakes on the way but have learnt an awful lot on the way. I hit the pull request button on my branch (babylonjk1) of my fork but not entirely sure if this was the thing to do or not. Will wait and see what happens.

 

Thank you for the votes I though Temechon's and RannanW's are brilliant. Could imagine a game using RaananW's where an invisible being is moving stealthfully around marked only by the disturbance in the surroundings.