2D isometric lighting

Question

Recently I used Godot 3.0 to implement the old version demo here:
github

video demo:
Youtube

---

Description

I know how the shadow part works. But what I don't understand is when the light goes in the sprite, its shader material can somehow overwrite the shadow, and add a normal map at the same time, making it looks just correct.

without shader:

with shader:

shader code in the demo:

uniform texture normal;

vec2 ywnormal=tex( normal,UV).ga * vec2(2.0,2.0) - vec2(1.0,1.0);
NORMAL=vec3(ywnormal,sqrt(1 - (ywnormal.x * ywnormal.x) - (ywnormal.y * 
ywnormal.y) ));

---

What I've tried

I thought I can achieve that by adding a normal map on the sprite in first place, since in 3.0 you just need to attach a normal map, no need to code shader.

But I still end up with this:

It seems to me that I have to code shader on the sprite.

---

Problem

1. How the shader code above works?
   I don't understand the shader language in GODOT(I don't have any
   expereice in GLSL either.) I've checkout the documentation but still
   got no idea. The doc just mention tons of syntax, not teaching the
   basics.
2. What is the proper way to generate normal maps for my sprites?
   I generate normal maps by using an filter effect in Photoshop, but seems a lot of
   different comparing with those in the demo. Is there any standard procedure
   should I apply?

Answer 1

In that example they aren't the typical color channel normal map, but these ones mainly do their calculations based on the alpha/opacity of the pixel.

https://github.com/godotengine/godot-demo-projects/blob/2.1/2d/isometric_light/faceNormal.png

The tops of pillars are about 50% alpha, the left diagonal sides are indicated by some value approaching 100%, on most of them it is around 85%. Then the right diagonal sides use a value approaching 0%, many being at 15%.

Comments

so in my case, the formula above doesn't fit right?
I've check out another Q&A here, and entered exactly the same shader code, but still end up with that incorrect result (shadow project overhead the object).
How can I solve this?

---

Oh, I ignored the "light shader" part, that sould be the key. Now there is another problem, I don't understand any of them. I probably need to learn how the shader works.

Is there any beginner tutorial or introduction for light shader? I only saw vertex shader and fragment shader from searching, or is that part of fragment shader or something?