I’ll be happy to post this in a Github Issue but first I want to ensure that it’s actually a bug and not me doing something wrong (which has happened on the last 4 issues I’ve had :-p).
A StandardTexture that works on Chrome and Firefox is breaking on Safari. Here’s how I’m building the material:
const material = new StandardMaterial('AM', this._scene);
material.emissiveColor = Color3.White();
material.roughness = 1;
// Apply different effects based on substrate
switch (type) {
case Substrate.Canvas:
await this.loadImage(url);
txtr = new Texture(
`${this.assetBase}/textures/substrate_canvas.png`, this._scene
);
txtr.uScale = 3;
txtr.vScale = 3;
material.diffuseTexture = new Texture(url, this._scene);
material.detailMap.isEnabled = true;
material.detailMap.texture = txtr;
material.detailMap.diffuseBlendLevel = 0.5;
material.detailMap.bumpLevel = 0.5;
this.disableLighting();
break;
case Substrate.Paper:
await this.loadImage(url);
txtr = new Texture(**
`${this.assetBase}/textures/substrate_paper.png`, this._scene
);
txtr.uScale = 2;
txtr.vScale = 2;
material.diffuseTexture = new Texture(url, this._scene);
material.detailMap.isEnabled = true;
material.detailMap.texture = txtr;
material.detailMap.diffuseBlendLevel = 0.25;
material.detailMap.bumpLevel = 0.2;
this.disableLighting();
break;
case Substrate.Mirror:
material.diffuseTexture = new Texture(
`${this.assetBase}/textures/substrate_mirror.jpg`, this._scene
);
material.ambientColor = Color3.White();
material.detailMap.isEnabled = true;
material.detailMap.texture = txtr;
material.detailMap.diffuseBlendLevel = 0.5;
material.detailMap.bumpLevel = 0.5;
this.enableLighting();
break;
}
The third case works properly. Could it be the first two assets are PNG?
It seems that the texture I’m using in each of the cases is triggering the following errors in Safari:
Working on it, we’re slammed with preparing a production version of our app. I just disabled the material for now but will have a moment to circle back to it.
If you attempted reproducing, do you want to post your version and I can easily just adapt what we may be doing differently (in an attempt to recreate it?).
Note that I’m applying the texture to basic geometry:
let faceUV = new Array(6);
for (let i = 0; i < 6; i++) {
faceUV[i] = new Vector4(0, 0, 0, 0);
}
faceUV[1] = new Vector4(0, 0, 1, 1);
let faceColors = new Array(6);
for (let i = 0; i < 6; i++) {
faceColors[i] = new Color4(0.75, 0.75, 0.75, 1);
}
faceColors[0] = new Color4(1, 1, 1, 1);
return MeshBuilder.CreateBox(
'Artwork',
{ height, width, depth, faceUV, faceColors },
this._scene
);
Oh awesome. Sorry I wasn’t able to be more helpful. I’m literally down to the 1% of my project so everything takes 10x as long.
Glad you caught this so quickly. I have no experience with shaders and was completely lost.
How could I apply this to my codebase in a safe way before it’s merged into a release? I don’t want to push the change into node_modules as others wont be able to compile with the change.
Shoot yeah I figured that was the case. I thought perhaps there was a way. I’d love to get this in with our production release. Obviously there’s a schedule for having PRs handled, how long does it usually take for these to get included/released? :-p
:-p