Hey All
Something I am facing in my current project using ThreeJS v155, is that video textures appear washed looking in Safari as opposed to Chrome/Firefox. Using the one of the video examples on the threejs website (three.js examples), you can see the difference:
Safari:
Chrome:
Both of them are using the SRGBColorSpace. Maybe this is just the reality of using different browsers, but does anyone have a work around or idea?
Something that I noticed while testing:
So on my personal project I was able to get two videos to look the same with the following way:
For non IOS browsers, I remove the inline video texture decoding (below)
#ifdef DECODE_VIDEO_TEXTURE
// use inline sRGB decode until browsers properly support SRGB8_APLHA8 with video textures
sampledDiffuseColor = vec4( mix( pow( sampledDiffuseColor.rgb * 0.9478672986 + vec3( 0.0521327014 ), vec3( 2.4 ) ), sampledDiffuseColor.rgb * 0.0773993808, vec3( lessThanEqual( sampledDiffuseColor.rgb, vec3( 0.04045 ) ) ) ), sampledDiffuseColor.w );
#endif
For IOS browsers I add it.
1 Like
This will be fixed with r156
. There is a Webkit bug when using SRGB8_APLHA8
with video textures. Until this bug is resolved, the engine uses a GLSL inline sRGB decode like in your code snippet.
1 Like
Awesome thanks for the update