Merge pull request #455 from flipcomputing/claude/fix-glow-rendering-order-GUYnZ

Refactor glow layer management to use exclusion instead of inclusion

Author: tracygardner

api/material.js

@@ -142,11 +142,12 @@ export const flockMaterial = {
   },
   glow(meshName, { color } = {}) {
     if (flock.materialsDebug) console.log(`Making ${meshName} glow`);
-    // Ensure the glow layer is initialised and only affects explicitly
-    // included meshes.
     if (!flock.glowLayer) {
       flock.glowLayer = new flock.BABYLON.GlowLayer("glowLayer", flock.scene);
       flock.glowLayer.intensity = 0.5;
+      if (flock.sky) {
+        flock.glowLayer.addExcludedMesh(flock.sky);
+      }
     }
 
     return new Promise((resolve) => {
@@ -166,10 +167,6 @@ export const flockMaterial = {
       m.metadata = m.metadata || {};
       m.metadata.glow = true;
 
-      if (flock.glowLayer) {
-        flock.glowLayer.addIncludedOnlyMesh(m);
-      }
-
       if (m.material) {
         const currentMat = m.material;
         const color = glowColor
@@ -280,13 +277,10 @@ export const flockMaterial = {
           targetMesh.metadata.glow = false;
 
           if (flock.glowLayer) {
-            flock.glowLayer.removeIncludedOnlyMesh(targetMesh);
-
-            const hasIncludedMeshes =
-              flock.glowLayer.includedOnlyMeshes &&
-              flock.glowLayer.includedOnlyMeshes.length > 0;
-
-            if (!hasIncludedMeshes) {
+            const anyGlowing = flock.scene.meshes.some(
+              (m) => m !== targetMesh && m.metadata?.glow,
+            );
+            if (!anyGlowing) {
               flock.glowLayer.dispose();
               flock.glowLayer = null;
             }

api/scene.js

@@ -60,6 +60,7 @@ export const flockScene = {
     if (color && color instanceof flock.BABYLON.Material) {
       const skySphere = createSkySphere();
       flock.sky = skySphere;
+      if (flock.glowLayer) flock.glowLayer.addExcludedMesh(flock.sky);
 
       const isShader = typeof color.setFloat === "function";
       const tex =
@@ -90,6 +91,7 @@ export const flockScene = {
     if (Array.isArray(color) && color.length >= 2) {
       const skySphere = createSkySphere();
       flock.sky = skySphere;
+      if (flock.glowLayer) flock.glowLayer.addExcludedMesh(flock.sky);
 
       if (color.length === 2) {
         const mat = new flock.GradientMaterial("skyGradient", flock.scene);
@@ -128,6 +130,7 @@ export const flockScene = {
       );
       const skySphere = createSkySphere();
       flock.sky = skySphere;
+      if (flock.glowLayer) flock.glowLayer.addExcludedMesh(flock.sky);
 
       const skyMat = new flock.BABYLON.StandardMaterial(
         "skyMaterial",