Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Text component broken at master (src/shaders/sdf.js msdf.js) #5325

Closed
nightgryphon opened this issue Jul 5, 2023 · 15 comments
Closed

Text component broken at master (src/shaders/sdf.js msdf.js) #5325

nightgryphon opened this issue Jul 5, 2023 · 15 comments

Comments

@nightgryphon
Copy link
Contributor

nightgryphon commented Jul 5, 2023 •
edited
Loading

Description:

<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@d817caf34be5e493a04b98e9fcb09adc76a7a691/dist/aframe-master.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-text position="-0.2 1.6 -1" value="test" color="#33C3F0"></a-text>
    </a-scene>
  </body>
</html>

Console error

THREE.WebGLProgram: Shader Error 0 - VALIDATE_STATUS false

Program Info Log: Vertex shader is not compiled.
VERTEX

ERROR: 0:3: 'version' : #version directive must occur before anything else, except for comments and white space
ERROR: 0:4: 'in' : storage qualifier supported in GLSL ES 3.00 and above only
ERROR: 0:5: 'in' : storage qualifier supported in GLSL ES 3.00 and above only
ERROR: 0:8: 'out' : storage qualifier supported in GLSL ES 3.00 and above only

  1: #define SHADER_TYPE RawShaderMaterial
  2: #define SHADER_NAME 
> 3: #version 300 es
  4: in vec2 uv;
  5: in vec3 position;
  6: uniform mat4 projectionMatrix;

src/shaders/sdf.js and msdf.js define #version string within shader program BUT super-three src/renderers/webgl/WebGLProgram.js function WebGLProgram automatically adds prefix before defined shader program string. WebGLProgram can add version string if material.glslVersion set but it is not the case for text component material.

Material used in text component has to be fixed. Version string has to be removed from sdf/msdf shaders and glslVersion parameter has to be added to material.
@dmarcos
Copy link
Member

dmarcos commented Jul 5, 2023

1.4.2 seems to be working https://aframe.io/aframe/examples/test/text/

Maybe something related to THREE updates? PRs always welcome

@nightgryphon
Copy link
Contributor Author

Yeah, 1.4.2 is ok. Trying to fix master right now.
But that's a bit tricky as i new in nodejs, three, aframe, 3d modeling etc. while have some general programming skills...
Just trying to make a little retrocomputing history VR scene %)
Stuck at performance troubleshooting. Creating debug tools for VR as there is no console and such stuff in Oculus Quest2 browser...

@vincentfretin
Copy link
Contributor

Just to let you know, there is also this PR related to the text component that update the three-bmfont-text dependency #5312 maybe it would be fixed there? If the error is not related to this package, please ignore my comment.

@dmarcos
Copy link
Member

dmarcos commented Jul 5, 2023 •
edited
Loading

Yeah. to my knowledge that PR covers bounding box calculation. This issue looks like a shader compilation problem. Would be worth to bisect commits from 1.4.2 to current master to see when it broke. Can use the build links in the commits.

@nightgryphon
Copy link
Contributor Author

seems i've found how to fix sdf/msdf shaders but something other goes wrong. testing. will try to made pull request when done
nightgryphon@57cae27

@mrxz
Copy link
Contributor

mrxz commented Jul 5, 2023

Seems that this change in Three.js is the cause: mrdoob/three.js#26101
Others faced the same and it seems the correct fix is indeed to not use #version 300 es in the shader code, but specify glslVersion

@nightgryphon You're change looks good. I'd just completely remove the #version 300 es lines instead of commenting them out and using THREE.GLSL3 instead of 300 es string literal.
It might also be worth changing the default to 300 es as Three.js has deprecated WebGL 1 in r153 anyway, so it won't be around that much longer.

@nightgryphon
Copy link
Contributor Author

I've just tried to keep the original functionality...

Sorry for off topic but right now i have trouble building aframe from repo. The resulting file is a few kb smaller than github one and VR part is broken. I'm doing:

  • git clone
  • npm install
  • npm run dist
    Am i miss something?

@dmarcos
Copy link
Member

dmarcos commented Jul 5, 2023

To build npm run dist is correct. should generate both minimized and non-minimized builds. It's the same commands that the build bots uses.

FWIW, For local testing you don't need to generate builds. can do npm start and use the examples http://localhost:8080/

@nightgryphon
Copy link
Contributor Author

It did but generated files have broken VR while ok at regular "flat" display. The world is randomly rotates around. 🤔 Prebuilt files from repo are ok so it seems i have trouble with my local tools or something.

I have apache running so npm run dist is fine

@dmarcos
Copy link
Member

dmarcos commented Jul 5, 2023

do npm start and examples work?

@dmarcos
Copy link
Member

dmarcos commented Jul 5, 2023

Yeah. to my knowledge that PR covers bounding box calculation. This issue looks like a shader compilation problem. Would be worth to bisect commits from 1.4.2 to current master to see when it broke. Can use the build links in the commits.

Unrelated but just merged the text component fixes described above

@nightgryphon
Copy link
Contributor Author

Updated according to @mrxz recommendtions and added PR.

Though still unable to build by myself :( Has reinstalled and updated node/npm to latest but still getting broken builds which are about 2.5k smaller than official build. Seems to miss some piece or use wrong package while no errors during build. Some difference i've found is at @ungap/custom-elements code...

@nightgryphon
Copy link
Contributor Author

@dmarcos plaese can you share package-lock.json for official aframe build?

@nightgryphon
Copy link
Contributor Author

OHHH. it is not my build broken. All official builds starting from Jul3 also have this bug. Including example

@nightgryphon
Copy link
Contributor Author

PR #5328

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@dmarcos @vincentfretin @mrxz @nightgryphon