Shader HLSL and DBPro/DarkShader

Author

Message

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 17th Dec 2010 17:12 Edited at: 17th Dec 2010 17:38

Link

Hello,

I have been trying to learn HLSL, and I am folowing some tutorials on a site called: http://rbwhitaker.wikidot.com/

Here is my code: (well their code actually, but anyway...)

//------------------------------ TEXTURE PROPERTIES ----------------------------
// This is the texture that SpriteBatch will try to set before drawing
texture ScreenTexture;
 
// Our sampler for the texture, which is just going to be pretty simple
sampler TextureSampler = sampler_state
{
    Texture = <ScreenTexture>;
};
 
//------------------------ PIXEL SHADER ----------------------------------------
// This pixel shader will simply look up the color of the texture at the
// requested point, and turns it into a shade of gray
float4 PixelShaderFunction(float2 TextureCoordinate : TEXCOORD0) : COLOR0
{
    float4 color = tex2D(TextureSampler, TextureCoordinate);
 
    float value = (color.r + color.g + color.b) / 3; 
    color.r = value;
    color.g = value;
    color.b = value;
 
    return color;
}
 
//-------------------------- TECHNIQUES ----------------------------------------
// This technique is pretty simple - only one pass, and only a pixel shader
technique BlackAndWhite
{
    pass Pass1
    {
        PixelShader = compile ps_1_1 PixelShaderFunction();
    }
}

+ Code Snippet

//------------------------------ TEXTURE PROPERTIES ----------------------------
// This is the texture that SpriteBatch will try to set before drawing
texture ScreenTexture;
 
// Our sampler for the texture, which is just going to be pretty simple
sampler TextureSampler = sampler_state
{
    Texture = <ScreenTexture>;
};
 
//------------------------ PIXEL SHADER ----------------------------------------
// This pixel shader will simply look up the color of the texture at the
// requested point, and turns it into a shade of gray
float4 PixelShaderFunction(float2 TextureCoordinate : TEXCOORD0) : COLOR0
{
    float4 color = tex2D(TextureSampler, TextureCoordinate);
 
    float value = (color.r + color.g + color.b) / 3; 
    color.r = value;
    color.g = value;
    color.b = value;
 
    return color;
}
 
//-------------------------- TECHNIQUES ----------------------------------------
// This technique is pretty simple - only one pass, and only a pixel shader
technique BlackAndWhite
{
    pass Pass1
    {
        PixelShader = compile ps_1_1 PixelShaderFunction();
    }
}

EDIT: I found out that using the greyscale darkshader example as base, works out pretty good.

DarkShader "Compiles" it. But I don't see an actual effect. Is their something I need to keep in mind?

Thanks,

RedEye

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 17th Dec 2010 19:40

Link

Your edit suggests you've solved the problem. Have you?

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 17th Dec 2010 19:41

Link

I did thank you. Working on a shader right now, I would love if you had some time left to see it, as you are pretty much the god in shaders.

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 17th Dec 2010 22:45

Link

Quote: "if you had some time left to see it"

Quite possibly.

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 17th Dec 2010 23:57 Edited at: 17th Dec 2010 23:59

Link

Screenshot:

Code:

float4 RGBandBCandSS( output IN, uniform sampler2D srcTex ) : COLOR
{ 
  	float4 color = tex2D(srcTex,IN.uv);
	color = tex2D( srcTex, IN.uv.xy);
	color -= tex2D( srcTex, IN.uv.xy+sharpness)*5.0;
	color += tex2D( srcTex, IN.uv.xy-sharpness)*5.0;
  	
	color.r = color.r/(red/brightness);
	color.g = color.g/(green/brightness);
	color.b = color.b/(blue/brightness);
	
	color.r = pow(color.r,contrast);
	color.g = pow(color.g,contrast);
	color.b = pow(color.b,contrast);

float4 outputcolor = color;
	
	if(spehiaonoff > 0)
	{
    	outputcolor.r = (color.r * 0.393) + (color.g * 0.769) + (color.b * 0.189);
    	outputcolor.g = (color.r * 0.349) + (color.g * 0.686) + (color.b * 0.168);    
    	outputcolor.b = (color.r * 0.272) + (color.g * 0.534) + (color.b * 0.131);
	}
	else
	{
		if(bwonoff > 0)
		{
			float value = (outputcolor.r + outputcolor.g + outputcolor.b) / 3; 
    		outputcolor.r = value;
    		outputcolor.g = value;
    		outputcolor.b = value;
		}
	}
	
    return float4(outputcolor.r,outputcolor.g,outputcolor.b,1.0);
}

+ Code Snippet

float4 RGBandBCandSS( output IN, uniform sampler2D srcTex ) : COLOR
{ 
  	float4 color = tex2D(srcTex,IN.uv);
	color = tex2D( srcTex, IN.uv.xy);
	color -= tex2D( srcTex, IN.uv.xy+sharpness)*5.0;
	color += tex2D( srcTex, IN.uv.xy-sharpness)*5.0;
  	
	color.r = color.r/(red/brightness);
	color.g = color.g/(green/brightness);
	color.b = color.b/(blue/brightness);
	
	color.r = pow(color.r,contrast);
	color.g = pow(color.g,contrast);
	color.b = pow(color.b,contrast);

	float4 outputcolor = color;
	
	if(spehiaonoff > 0)
	{
    	outputcolor.r = (color.r * 0.393) + (color.g * 0.769) + (color.b * 0.189);
    	outputcolor.g = (color.r * 0.349) + (color.g * 0.686) + (color.b * 0.168);    
    	outputcolor.b = (color.r * 0.272) + (color.g * 0.534) + (color.b * 0.131);
	}
	else
	{
		if(bwonoff > 0)
		{
			float value = (outputcolor.r + outputcolor.g + outputcolor.b) / 3; 
    		outputcolor.r = value;
    		outputcolor.g = value;
    		outputcolor.b = value;
		}
	}
	
    return float4(outputcolor.r,outputcolor.g,outputcolor.b,1.0);
}

I've probably made loads of mistakes, and used bad formules, but hey! it's my first shader!

Note: I've used some tut's around the net to accomplish this...

Full Fullscreenshader attached.

Back to top

Profile PM Email

Black Profductions

17

Years of Service

User Offline

Joined: 15th Sep 2008

Location: Argentina

Posted: 18th Dec 2010 00:06

Link

Great work redeye, your really doing a great work
Keep em up!

Back to top

Profile PM

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 18th Dec 2010 14:47

Link

Great start - getting a working shader is a very satisfying first step.

Your shader was clearly written too. Well done.

The next step is to optimise it.

Have a look at the attached revised version. It's a bit messy because I've added lots of comments to the code and commented out various bits.

Your original version used 3 texture instructions and 32 arithmetic instructions in the compiled pixel shader code. The attached version uses the same 3 texture instructions but only 17 arithmetic instructions. Further reductions are possible. The main thing to look for is vectorisation of calculations as I've indicated in the revised version.

I suggest you try one optimisation at a time and check that it works before moving on to the next (note that I haven't checked that my version does the right thing so you should check that it does).

There are still other things you can do. See if you can prune the pixel shader still further. I'll help if I can.

The reason for focussing on the pixel shader is that the instructions are repeated for each screen pixel each frame and savings can be really worthwhile.

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 18th Dec 2010 14:57

Link

Thank you very much! You are amazing. I read the comments in the shader, I have learnt alot from it! Thanks!

I will try and see if I can optimize it. I will post and edited one soon this week.

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 18th Dec 2010 15:11

Link

OK. I look forward to seeing it.

Back to top

Profile PM Email

C0wbox

20

Years of Service

User Offline

Joined: 6th Jun 2006

Location: 0,50,-150

Posted: 19th Dec 2010 11:17

Link

I know this isn't really related (well it sort of is) but, what is HLSL syntax/code actually based on? - I can't decide what languages it's most like. :S

(Figured here would be a good place to ask, amongst all the shadery people

- I envy you, the most I can do with HLSL is edit shaders other people have written.

)

Back to top

Profile PM Email Website

Serial Velocity

17

Years of Service

User Offline

Joined: 24th Aug 2008

Location:

Posted: 19th Dec 2010 12:24

Link

Quote: "I can't decide what languages it's most like"

It is based on C++.

Back to top

Profile PM Email

C0wbox

20

Years of Service

User Offline

Joined: 6th Jun 2006

Location: 0,50,-150

Posted: 19th Dec 2010 12:38

Link

! Good good, that's what I thought and hoped.

Back to top

Profile PM Email Website

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 19th Dec 2010 13:45

Link

Thanks COwBox.

Btw: I have found a nice article about bloom, i just read it, and now i understand the principles about bloom. Here is the link: (I thought it would be nice to share

)

http://kalogirou.net/2006/05/20/how-to-do-good-bloom-for-hdr-rendering/

Back to top

Profile PM Email

C0wbox

20

Years of Service

User Offline

Joined: 6th Jun 2006

Location: 0,50,-150

Posted: 19th Dec 2010 14:17

Link

Lol, thanks for what? xD

Back to top

Profile PM Email Website

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 19th Dec 2010 14:39

Link

Quote: "I envy you, the most I can do with HLSL is edit shaders other people have written. "

If you said that too green gandalf, thanks anyway.

(thought you said that too me)

Anyway, I have created my first object shader. It basicaly just returns the negative value of the texture holding. (Instead of fullscreennegative shader, I did it to an object.)

Screenshot:

Single Return Code Line:

+ Code Snippet

return 1-pow(tex2D( BaseSmp, IN.uv ),NegativeAmmount);

Altough I am wondering how would I got onto animating something, for example how would i change the Negative Ammount(BrightnesS) by a timer. I know there is a standard float wich is: float timer:TIME;

But how to use that?

Greets,

RedEye

Back to top

Profile PM Email

C0wbox

20

Years of Service

User Offline

Joined: 6th Jun 2006

Location: 0,50,-150

Posted: 19th Dec 2010 14:40

Link

Oh, I was saying it to all you shadery people in general because you can all do HLSL better than me. xD

Back to top

Profile PM Email Website

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 19th Dec 2010 16:10

Link

Quote: "Altough I am wondering how would I got onto animating something, for example how would i change the Negative Ammount(BrightnesS) by a timer. I know there is a standard float wich is: float timer:TIME;

But how to use that?"

A simple, but not necessarily the most efficient, way might be:

+ Code Snippet

return NegativeAmmount + tex2D( BaseSmp, IN.uv ) * (1.0 - 2.0 * NegativeAmmount);

In that expression NegativeAmmount is intended to be a number between 0 and 1. The value zero gives the original texture, whereas the value 1 gives the negative. Other values give something in between. The best way to use time in this case is to calculate it in DBPro and use that to calculate NegativeAmmount which is then passed to the shader. For example, you can use the sine trig function:

+ Code Snippet

startTime = timer()
do
  seconds# = (timer() - startTime) * 0.001
  set effect constant float FXNum, "NegativeAmmount", 0.5 + 0.5 * sin(seconds# * frequency#)
  sync
loop

You'd need to use a sensible value for frequency# (remember that DBPro uses degrees for the sine function whereas HLSL uses radians).

Alternatively you can do the calculations in the shader (would probably adversely affect FPS though). For example

+ Code Snippet

float NegativeAmmount = 0.5 + 0.5 * sin(timer * frequency);
return NegativeAmmount + tex2D( BaseSmp, IN.uv ) * (1.0 - 2.0 * NegativeAmmount);

Here frequency would be a float constant with a sensible value.

Back to top

Profile PM Email

Matty H

17

Years of Service

User Offline

Joined: 7th Oct 2008

Location: England

Posted: 19th Dec 2010 17:04

Link

Some great info here but I have just had some trouble with that link in the first post.
I got lots of messages saying I had malware etc and my computer got a mind of its own so I just switched off at the plug and now I'm doing a scan, so far so good.

Just thought I would mention.

fulcrum physics - free collision/physics plug-in for DarkGDK

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 19th Dec 2010 19:46

Link

@Green Gandalf: Wow you keep learning me new things, thanks mate! I understand it all so far.

I like the "variable-animation" in shader because it has todo with the actual shader

.

But I understand if it's better to use dbpro or darkgdk ( that's what i use ), and then pass a variable onto the shader.

I will try your code, and make some more progress in my hlsl coding.

@Matty: Well the link is perfect, I've learnt alot from it.

Thanks,

RedEye

Back to top

Profile PM Email

Matty H

17

Years of Service

User Offline

Joined: 7th Oct 2008

Location: England

Posted: 19th Dec 2010 21:19

Link

Quote: "@Matty: Well the link is perfect, I've learnt alot from it."

Scan showed no issues, I'm not really sure how these things happen, maybe the link is fine, I had to mention it though.

fulcrum physics - free collision/physics plug-in for DarkGDK

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 20th Dec 2010 01:31

Link

I've been working on my project, and also been doing some side hlsl coding. I came along the refract and reflact commands when searching for a water shader tutorial. Anyway I started looking at it, and so far i got this, yeah i know it is very bad, but at least i've learnt something ay?

Here is the code I think it's the most important part:

In the VS i do:

+ Code Snippet

    float3 ViewDir = normalize(IN.pos - eyepos);
	
	OUT.Reflect = reflect(ViewDir, OUT.normal);    
	OUT.Refract = refract(ViewDir, OUT.normal, 0.99);

Those two commands are what i just learnt.

And also i used the two lerps of the texcubes of the Cube map refraction and reflection, in the PS, added some ammounts and the tint, and outputted the color.

Greets,

RedEye

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 20th Dec 2010 11:10

Link

Looks like you're making good progress. Keep it up.

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 20th Dec 2010 18:11

Link

Hello, i thought well this is shader related thread why not post another problem i am having:

http://forum.thegamecreators.com/?m=forum_view&t=179108&b=22

Thanks,

RedEye

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 20th Dec 2010 20:15

Link

Quote: "why not post another problem i am having"

That isn't a problem - it's a thread.

Nowhere on that thread do you tell us what the problem is. You give various screenshots, but what's the problem you're talking about? I can see more than one.

And, yes, it (whatever "it" is) is probably a camera problem. It usually is when people have problems with refraction/reflection water shaders. You need to think clearly about which objects the two cameras should "see". You also need to think about camera positioning and clipping planes and I have a feeling there are some unreported bugs in those.

But before we speculate, possibly pointlessly, any further, please describe the problem.

[When I get problems in this situation I usually find it helps to save the two camera images and study them. Then you can see where the problem lies very clearly.]

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 21st Dec 2010 00:47 Edited at: 21st Dec 2010 00:51

Link

I took a screenshot. I looked at it, and should i hide the player before pasting the image as reflection map? But then i wouldnt get any reflections for the player...

Here is a shot:

+ Code Snippet

//Water - Test
	dbPositionCamera(1100,50,800);
	dbSetCameraRange(1,15000);
	dbAutoCamOff();
	dbColorBackdrop(dbRGB(155,155,155));
	dbSetCameraFOV(70);
	dbFogOn(); dbFogColor(dbRGB(128,128,128));dbFogDistance(8192);

	dbMakeCamera(1);
	dbSetCameraRange(1,2,15000);
	dbSetCameraFOV(1,70);
	dbSetCameraAspect(1,1.33);
	dbColorBackdrop(1,0);
	dbSetCameraToImage(1,5,512,512);

	dbLoadImage("Media/core/water/waves.jpg",6);
	dbMakeObjectPlain(2,2500,2500);
	dbXRotateObject(2,270);
	dbTextureObject(2,0,5);
	dbTextureObject(2,1,6);
	dbLoadEffect("Media/shaders/water/water.fx",1,0);
	dbSetObjectEffect(2,1);
	dbSetAlphaMappingOn(2,100);
	
	float OldYpos = dbCameraPositionY();

+ Code Snippet

//Water Test Update
			if(dbKeyState(18)) WaterHeight += 1;
			if(dbKeyState(19)) WaterHeight -= 1;

		float Ypos = dbCameraPositionY();

		dbPositionCamera(1,dbCameraPositionX(),-Ypos,dbCameraPositionZ());
		dbRotateCamera(1,-dbCameraAngleX(),dbCameraAngleY(),dbCameraAngleZ());

		float ro = dbWrapValue(ro+0.5f);
		dbPositionObject(2,500+dbSin(ro)*100.0,WaterHeight,500+dbCos(ro)*100.0);

		dbHideObject(2);

		if(Ypos > WaterHeight)
		{
			dbSyncMask(0x00000002);
		}

		Ypos = dbCameraPositionY();
		if( (Ypos>WaterHeight) && (OldYpos<WaterHeight) )
		{
			dbFogOn();dbFogColor(dbRGB(128,128,128)); dbFogDistance(8192);
		}
		else
		{
			if( (Ypos>WaterHeight) && (OldYpos>WaterHeight) )
			{
				dbFogOn();dbFogColor(dbRGB(24,32,48)); dbFogDistance(5,8192);
			}
		}
		OldYpos = Ypos;

		dbSync();

		dbShowObject(2);
		if(dbControlKey()==1) dbPasteImage(5,0,0);
		dbText(10,10,dbStr(dbScreenFPS()));
		dbSyncMask(0x00000001);

		timer.updateb();

		ode.Update();
		
		core.updateGame();

Back to top

Profile PM Email

Green Gandalf

VIP Member

21

Years of Service

User Offline

Joined: 3rd Jan 2005

Playing: Malevolence:Sword of Ahkranox, Skyrim, Civ6.

Posted: 21st Dec 2010 13:41

Link

That suggests that the shader is looking up the wrong part of the reflection image. You'd need to check the reflection maths used in the shader. I'd advise working it out carefully on pen and paper first.

Perhaps it assumes a value for something like water level which is not appropriate for your application?

Or perhaps the reflection camera is in the wrong position or facing the wrong way?

Again, check on pen and paper first using a suitable diagram.

Back to top

Profile PM Email

Red Eye

17

Years of Service

User Offline

Joined: 15th Oct 2008

Location:

Posted: 21st Dec 2010 13:56 Edited at: 21st Dec 2010 13:57

Link

Okay thanks for the tips mate!

I will do just that!

For now, i wanted to share my fullscreenshader system...

With my first fullscreenshader in action.

Normal and Adjusted with my Color Changing fullscreenshader:

I know it aint much, but I quote from the godlike GG:

Quote: "getting a working shader is a very satisfying first step."

EDIT: Sorry about image format.

Back to top

Profile PM Email

Sorry your browser is not supported!

DarkBASIC Professional Discussion / Shader HLSL and DBPro/DarkShader