Ambiera Forum

Discussions, Help and Support.

Ambiera Forum > CopperCube > Announcements and Showcase
Introduction to HLSL Shaders.

just_in_case
Moderator
Quote
2021-03-22 14:45:42

just posted a video on HLSL Shaders to be used with coppercube. Video doesn't dive deep into the programming part of HLSL but will give you an understanding of what format coppercube uses to write HLSL Shader. where your code should reside and how coppercube handles techniques and passes. and what values or constants coppercube provides us and how ShaderCallback function is used, how textures are used, and all other stuff.

This will be going a video series on HLSL shaders and in each video, I will cover some components of shader programming and how we can implement them in coppercube. I will also tell about the mistakes and bugs one can encounter and how to avoid and fix them.

here is the link to the video
https://youtu.be/8EQn3EP155k


Hopefully, you guys will find this video useful.


Newbee
Guest
Quote
2021-03-22 19:39:03

Thanks to share.


smnmhmdy
Registered User
Quote
2021-03-23 08:42:57

Thanks man, I always wanted to learn shader programming so I'm looking forward to watching this series :)


nrasool
Registered User
Quote
2021-03-28 13:04:15

Hey nice video,

I'm looking into how to apply post-process on the camera rather than a object. Much like reshade you can use post processing to change the way the camera views the world :O


just_in_case
Moderator
Quote
2021-03-28 16:01:59

If you don't know shaders you can apply overlays to your scene and then can also use them as post processing effects for the camera.
Can also use animate texture behavior along to make it more beautifull.
For example CRT effects, vignette and all. Just attach a big 2D overlay and apply the texture to it, animate it if you want. It is highly recommended to use textures with transparency.

Anyways in one or 2 days i will upload second video to the series. In which i will try to make people learn to write a basic shader which does nothing but changes the color of an object.


nrasool
Registered User
Quote
2021-03-28 22:44:32

Hey just_in_case

Nice workaround, yes I can see that working and being better for me, appreciate that :)


just_in_case
Moderator
Quote
2021-03-31 15:00:27

2 Video has been added to the youtube series.

Creates a basic shader that changes the color of an object according to the provided RGB value.

watch the video on YOUTUBE here:-
https://www.youtube.com/watch?v=...


please let me know if you find any difficulty in understanding the videos.



marcw
Registered User
Quote
2021-04-01 21:24:31

Hello Vazahat,

Even though I prefer playing with GLSL shaders, I watch your video tutorials relative to the DirectX shaders (HLSL format). As usual you clearly share your knowledge.

A few weeks ago I discovered an amazing software "RenderMonkey" on this website https://gpuopen.com/archived/ren...

It works nicely on my computer, but you have to know that my graphic card is a AMD Radeon.

Of course, there are many similar applications (most of them are for online testing purposes), but RenderMonkey has the advantage to be a very old software working with DirectX9.0c (HLSL), OpenGL 2.0 (GLSL) and OpenGL ES 2.0.

The software shows the detailed settings of the shaders, a preview window, an "artist editor" and the source of the shaders are easily exportable.






marcw
Registered User
Quote
2021-04-01 21:33:48

By the way, today I spent a few hours (yes, I know, it took me too much time, because everything is difficult for a newbie) to write this "action script" dedicated to the shaders.

I wouldn't ever be able to imagine and to fully write that script by myself without having discovered this very nice "action_shader" created by the member 'pmax' in this forum.

Please see this thread : https://www.ambiera.com/forum.ph...

And here is the source code of the "action_ShaderPlus.js" :

// 'action_ShaderPlus' is inspired by the original 'action_Shader' created  by 'Pmax'.
// Please visit this thread in Ambiera/Coppercube/Forum : 'https://www.ambiera.com/forum.php?t=3634'
// It is assumed that both Vertex and Fragment Shaders are assigned to the material.
/*
<action jsname="action_ShaderPlus" description="Assign Vertex and Fragment Shaders">
<property name="sceneNode" type="scenenode" />
<property name="materialIndex" type="int" default="0" />
<property name="vertexFile" type="string" default="v_01.glsl" />
<property name="fragmentFile" type="string" default="f_01.glsl" />
<property name="materialType" type="int" default="0" />
<property name="shaderCallBackChoice" type="int" default="1" />
</action>
*/

action_ShaderPlus = function()
{
};

action_ShaderPlus.prototype.execute = function(currentNode)
{
var vertexShader = ccbReadFileContent(this.vertexFile); // Read the file containing the Vertex Shader
var fragmentShader = ccbReadFileContent(this.fragmentFile); // Read the file containing the Fragment Shader
var baseMaterialType = this.materialType; // 0 for solid, 2 for lightmap, 12 for additive transparency, ...

myShaderCallBack_1 = function()
{ // example provided in CopperCube's Documentation
var time = new Date().getTime();
var pulse = (time % 500) / 500.0;
ccbSetShaderConstant(2, 'callBackUniformVector', pulse, pulse, 0, pulse);
//don't forget to add this definition of the read-only variable in the fragment shader (see next line)
//uniform vec4 callBackUniformVector;
}

myShaderCallBack_2 = function()
{ // another example : no incidence on the fragment shader with those default values
var param_1 = 1.0; // the first parameter transmitted to the uniform vec4 callBackUniformVector
var param_2 = 1.0; // the second parameter
var param_3 = 1.0; // the third parameter
var param_4 = 1.0; // the fourth parameter (the default values of 1.0 are shown as example)

ccbSetShaderConstant(2, 'callBackUniformVector', param_1,param_2,param_3,param_4);
//don't forget to add this definition of the read-only variable in the fragment shader (see next line)
//uniform vec4 callBackUniformVector;
}

if (this.shaderCallBackChoice == 1){
var newMaterial = ccbCreateMaterial(vertexShader, fragmentShader, this.materialType, myShaderCallBack_1);
} else if (this.shaderCallBackChoice == 2) {
var newMaterial = ccbCreateMaterial(vertexShader, fragmentShader, this.materialType, myShaderCallBack_2);
} else { // other available options ...
var newMaterial = ccbCreateMaterial(vertexShader, fragmentShader, this.materialType, myShaderCallBack_1);
}

ccbSetSceneNodeMaterialProperty(this.sceneNode, this.materialIndex, 'Type', newMaterial);
}



marcw
Registered User
Quote
2021-04-01 22:08:09

For the purpose of testing, these two files were associated to that "action_ShaderPlus" :

1) Vertex Shader (GLSL format) file "v_01.glsl" :

uniform mat4 mWorldViewProj;						
uniform mat4 mInvWorld;
uniform mat4 mTransWorld;

void main(void)
{
gl_Position = mWorldViewProj * gl_Vertex;

// normal would be this:
vec4 normal = vec4(gl_Normal, 0.0);
normal = mInvWorld * normal;
normal = normalize(normal);

// world position would be this:
vec4 worldpos = gl_Vertex * mTransWorld;

gl_FrontColor = gl_BackColor = vec4(1.0, 0.0, 1.0, 0.0);

gl_TexCoord[0] = gl_MultiTexCoord0;
}


2) Fragment Shader (GLSL format) file "f_01.glsl" :


uniform sampler2D myTexture;
uniform vec4 callBackUniformVector;
void main (void)
{
vec4 col = texture2D(myTexture, vec2(gl_TexCoord[0]));
col *= gl_Color;
gl_FragColor = col * callBackUniformVector;
}


Of course, this action_ShaderPlus" can handle HLSL shaders.

The name of the files and their extension could be whatever you want.
(example : "myshaderfolder/myvertexshader.txt" with which you specify the folder and the file containing your shader).


just_in_case
Moderator
Quote
2021-04-02 09:17:32

Yeah , I do rember pmax sharing some cool shaders like x-ray and toon shading.

And it was already planned by me to include the vertex.text and fragment.txt method in my next video in which i will be showing how to convert shaders into actions.
So am already aware about that method.

@P-max also had created some cool javascript snippets command if i remember correctly. His programming skills are really good. He once mentioned his github repo if my memory is correct you might find some more usefull stuff there if you checkout.

He still sometime appears on the forums as well.

I will take a look into "render monkey" when I get time. Right now am working with lights in shaders. Am still learning and sharing videos on the basis of what i have acheived so far in shaders and am really fascinated by the subject. Shadera has become my favourite in game developing.
I do have more ideas for coppercube which were left written in my diaries for year and this year i will try to execute them, i was having health issues previously but am recovering much faster so hopefully this year will be a good year for me to execute my ideas with coppercube.😇 Will see what i can brought to the community 😇


marcw
Registered User
Quote
2021-04-02 10:36:29

Hello Vazahat,

Thank you for your comment.

I previously read about your health issues mentioned in one of your old comments.

I wish you good health at this difficult time.

No doubt that CopperCube's forum is a place where you can share your programming skills with many people from all around our planet which is now a gigantic village thanks to the internet.






pmax
Registered User
Quote
2021-04-02 18:19:38

Thanks guys, I am not a programmer, the plugins I have written are very rough but thanks to all of you they can be improved.
Thanks again to everyone.


marcw
Registered User
Quote
2021-04-02 19:30:53

Hello Pmax,

I am glad to "meet" you.
I especially want to thank you for having created your action_shader.
What you declare about yourself and your creation is modesty.

Indeed you found the inspiration to import the shaders in their original format.

Thanks to your discovery it is now possible to perform much easier tests with new shaders.

By the way, for the members who wish to experiment with your action_shader (or with my version, why not?),
it is important to know that it is required to save a first time the .CCB project before running it.

If it is not done, then the files containing the shaders are not found and therefore it results in an error.




just_in_case
Moderator
Quote
2021-07-15 16:35:23

3rd installment to the series has been added.

Will teach you how to use texture data coming from CopperCube in your HLSL Shaders. Basically, it will teach you how you can use textures in your shaders using incoming texture coordinates and then outputting them to Pixel Shader(fragment program), how to sample your textures and obtain the color data from textures using the texture coordinates and sampled texture.

link to the Video https://www.youtube.com/watch?v=...

P.S Ignore my bloating voice only I know how I managed to speak with boils in my mouth in this video

hope you guys find this video useful.


Create reply:


Posted by: (you are not logged in)


Enter the missing letter in: "Internati?nal" (you are not logged in)


Text:

 

  

Possible Codes


Feature Code
Link [url] www.example.com [/url]
Bold [b]bold text[/b]
Image [img]http://www.example.com/image.jpg[/img]
Quote [quote]quoted text[/quote]
Code [code]source code[/code]

Emoticons


   






Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact