Merge pull request #1304 from AleziaKurdis/placesAppDeadImagesManagement

Places App: Addressing ugly image "broken link" in Place Details
overte-org · Feb 10, 2025 · 33b288a · 33b288a
2 parents 9e9f308 + 1a1779a
commit 33b288a
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/scripts/system/places/places.html b/scripts/system/places/places.html
@@ -107,7 +107,7 @@
         <div id="placeDetail" class="overlay">
           <a href="javascript:void(0)" class="closebtn" onclick="closeDetail();">&times;</a>
           <div class="overlay-content">
-                <img id="placeDetail-image" onclick="closeDetail();" draggable="false">
+                <div id="placeDetail-image" onclick="closeDetail();" draggable="false"></div>
                 <div id="placeDetail-placeName"></div>
                 <table width='100%'>
                     <tr valign='top'>
@@ -775,12 +775,17 @@
                     }
                 }
 
-                document.getElementById("placeDetail-image").src = "";
+                var pictureUrl = "";
                 if (placeDetail.thumbnail === "") {
-                    document.getElementById("placeDetail-image").src = "icons/placeholder_" + placeDetail.metaverseRegion + ".jpg";
+                    pictureUrl = "icons/placeholder_" + placeDetail.metaverseRegion + ".jpg";
                 } else {
-                    document.getElementById("placeDetail-image").src = placeDetail.thumbnail;
+                    pictureUrl = placeDetail.thumbnail;
                 }
+                document.getElementById("placeDetail-image").style.backgroundImage = "url(" + pictureUrl + ")";
+                document.getElementById("placeDetail-image").style.backgroundRepeat = "no-repeat"; 
+                document.getElementById("placeDetail-image").style.backgroundPosition = "center center"; 
+                document.getElementById("placeDetail-image").style.backgroundSize = "cover";
+
                 document.getElementById("placeDetail-placeName").innerHTML = placeDetail.name;
                 document.getElementById("placeDetail-managers").innerHTML = "By <br>&nbsp;&nbsp;&nbsp;&nbsp;" + placeDetail.managers;
                 document.getElementById("placeDetail-description").innerHTML = placeDetail.description;