ignore loaded texture if we switched to an other image in the meantime

3DStreet · Sep 1, 2024 · 8081e50 · 8081e50
1 parent ec5d1ce
commit 8081e50
Showing 1 changed file with 18 additions and 26 deletions.
diff --git a/src/components/street-environment.js b/src/components/street-environment.js
@@ -46,56 +46,48 @@ AFRAME.registerComponent('street-environment', {
     switch (this.data.preset) {
       case 'night':
         this.setLights(0.5, 0.15);
-        this.setBackground(
-          `${assetsPathRoot}images/AdobeStock_286725174-min.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/AdobeStock_286725174-min.jpeg`;
+        this.setBackground(this.backgroundImage);
         break;
       case 'day':
         this.setLights(0.8, 2.2);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-polyhaven-wasteland_clouds_puresky.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-polyhaven-wasteland_clouds_puresky.jpeg`;
+        this.setBackground(this.backgroundImage);
         this.light2.setAttribute('position', '-40 56 -43');
         break;
       case 'sunny-morning':
         this.setLights(0.8, 2.2);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-polyhaven-qwantani_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-polyhaven-qwantani_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         this.light2.setAttribute('position', '-60 56 -16');
         break;
       case 'cloudy-afternoon':
         this.setLights(2, 0.6);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-mud_road_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-mud_road_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         break;
       case 'sunny-afternoon':
         this.setLights(2, 2.2);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-kloofendal_43d_clear_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-kloofendal_43d_clear_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         this.light2.setAttribute('position', '60 56 -16');
         break;
       case 'sunny-noon':
         this.setLights(2, 2.2);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-kloppenheim_05_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-kloppenheim_05_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         this.light2.setAttribute('position', '5 56 -16');
         break;
       case 'foggy':
         this.setLights(2, 0.6);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-kloofendal_misty_morning_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-kloofendal_misty_morning_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         this.light2.setAttribute('light', 'castShadow', false);
         break;
       case 'cloudy':
         this.setLights(2, 0.6);
-        this.setBackground(
-          `${assetsPathRoot}images/skies/2048-kloofendal_48d_partly_cloudy_puresky-sdr.jpeg`
-        );
+        this.backgroundImage = `${assetsPathRoot}images/skies/2048-kloofendal_48d_partly_cloudy_puresky-sdr.jpeg`;
+        this.setBackground(this.backgroundImage);
         break;
       default: // 'color'
         this.setLights(0.8, 2.2);
@@ -115,8 +107,8 @@ AFRAME.registerComponent('street-environment', {
   setBackground: function (imagePath) {
     const scene = this.el.sceneEl.object3D;
     this.textureLoader.load(imagePath, (texture) => {
-      // If we changed to color preset in the meantime, ignore this texture
-      if (this.data.preset === 'color') {
+      // If we changed to color preset in the meantime or we switched to an other image, ignore this texture
+      if (this.data.preset === 'color' || imagePath !== this.backgroundImage) {
         texture.dispose();
       } else {
         if (scene.background?.isTexture) {