How to place proyected shadows on this script?

Questions
1

I tries this:

But it shows me this error:

three.module.js:22850 WebGL: INVALID_OPERATION: useProgram: program not valid
useProgram @ three.module.js:22850
2v180/:367 Collision.
three.module.js:1166 Uncaught TypeError: Cannot read properties of undefined (reading ‘elements’)
at Matrix3.copy (three.module.js:1166:16)
at refreshTransformUniform (three.module.js:27164:17)
at refreshUniformsCommon (three.module.js:27285:4)
at Object.refreshMaterialUniforms (three.module.js:27223:4)
at setProgram (three.module.js:29983:15)
at WebGLRenderer.renderBufferDirect (three.module.js:28843:20)
at renderObject (three.module.js:22278:16)
at renderObject (three.module.js:22290:4)
at WebGLShadowMap.render (three.module.js:22089:5)
at WebGLRenderer.render (three.module.js:29160:14)

Why its happens and how to solve it?

This is the file:

index.html (19.1 KB)

2

I taked advantage, so… there is my main file:

index.html (18.7 KB)

And its the incomplete of shadowmap result:

image
image1306×597 77.9 KB

So… i can make it better?