Added 2 New SpotLight Examples

[MasterJames]

The first example focuses on the edge of one spotlights shadow. The properties are adjustable.
The second example has 3 animated spotlights. Their position, angle and penumbra are animated.

Where the lights converge as white light the shadows become R G B due to coloring from dual lights.

[mrdoob]

Could you use var instead of let? AFAIK Safari doesn't support it yet.

[mrdoob]

Really like the examples by the way!

[WestLangley]

Perhaps the single spotlight example could be embedded into the SpotLight and SpotLightHelper docs, instead?

[MasterJames]

Incorporated all recommendations.
I changed the SpotLight doc as recommended too.
I changed the description as well, "A point light that can cast a shadow in one direction with a falloff cone." I also put the examples at the top since they are most relevant.

Added Click to Randomize color and a CTRL-click will set to object materials to white.

I could change variable names to be more verbose.
You should also note that I used TweenMax.
When I first was trying to add animation to 'angle' with a setter/getter solution it didn't seem to work/animate. This one is simpler and better (no need to start or update).

I would consider opening that can of worms in another issue but for now in this example TweenMax is fine, right?

Oh I also moved the angle so when the penumbra is set to zero it overlaps the object, and so I also changed to a tighter penumbra too.

[MasterJames]

I'm noting again a need to start another issue about changing the docs to reflect the changes in camera properties. ? spotLight.shadowMapWidth = 1024;
It should just point to new (Spot)LightShadow with all that map width & height etc. there I guess?

[WestLangley]

This is what I was referring to when I suggested

the single spotlight example could be embedded into the SpotLight and SpotLightHelper docs

[MasterJames]

Thanks @WestLangley I needed a little more direction on that. I remembered later I forgot the Helper but I knew it was not embedded but just keeping what it was like, but to at least add them as simple links first.
I hope this is close to your expectations.
I also thought to slightly change the Header/Titles around a little Example, Other Examples, Code Example.
It links to the html file directly but has a View in Examples link to avoid the side panel wrapping etc.

[MasterJames]

My guess is the previous SpotLightHelper.html had newlines with carriage returns because it seems to have reformatted or replaced all lines. I'm not sure how that happened as they look like identical lines but they all get replaced. Maybe it had something to do with the html wrapper being inclusive, seems like a github bug to me? again not sure how that happened I hope it's okay because it's all corrected now?
@WestLangley can you spare a minute for more feedback on this PR, thanks.

[MasterJames]

Wait a minute now I've rebased and I've got no shadow or something?
Standby sorry I'm regrouping on this somehow?
#8500
Okay I found this missing I forgot this, all working and rebased sorry for any confusion.
this.shadow = new THREE.SpotLightShadow();
[I wanted to make sure it was not somehow broken, so I thought I better rebase.]

[mrdoob]

Thanks!

[WestLangley]

@MasterJames

spt.shadow.mapSize.width = 8192; is too big. Shadows do not render at all on my iPhone, and performance is degraded on desktop. Try 1024.

Unfortunately, shadow quality is degraded significantly as the angle is increased. This is a consequence of the recent changes automating the shadow frustum.

I could change variable names to be more verbose.

Please do. Follow the coding style of the other three.js examples.

[MasterJames]

@WestLangley thanks for pointing out the issues on mobile totally embarrassing, as is crashes on mobile.
I have addressed them with this new PR.
#8555

Basically it sets the shadow map size based on the angle, but in the animated example it will tune down the map sizes further if the desired FPS is not being obtained.

Also if it is-Mobile it will set the default map size lower and the desired FPS too.

It as well changes the names to be more verbose.