Merge pull request #1153 from AleziaKurdis/placesAppPromoteBetter

Place App: Weekly promoted place
overte-org · Oct 5, 2024 · 529a7ae · 529a7ae
2 parents af1306b + 8526f09
commit 529a7ae
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 6 deletions.
diff --git a/scripts/system/places/places.css b/scripts/system/places/places.css
@@ -487,6 +487,10 @@ div.placeEntry {
     text-align: center;
 }
 
+div.placeEntryLargeSize {
+    height: 220px;
+}
+
 div.addMsEntry {
     width: 85%;
     height: 38px;
@@ -625,6 +629,10 @@ div.placeDetail-event {
     border: 0px;
 }
 
+.promotedblur {
+    backdrop-filter: blur(0px);
+}
+
 .placeTitle {
   color: #ffffff;
   font-size: 21px;
@@ -633,6 +641,10 @@ div.placeDetail-event {
   text-shadow: 1px 1px 3px #000000;
 }
 
+.placeTitlePromoted {
+    font-size: 28px;
+    text-shadow: 1px 1px 4px #000000;
+}
 .placeTable {
     width: 100%;
 }

diff --git a/scripts/system/places/places.html b/scripts/system/places/places.html
@@ -415,8 +415,12 @@
                                         } else if (placeRecords[i].category === "Z") {
                                             moreStyle = " style='background-color: #364a6e;'";
                                         }
-
-                                        var shortenedDescription = placeRecords[i].description.substr(0, 55);
+
+                                        var maxCharNumber = 55;
+                                        if (currentListFormat === "PLACES" && i === 0) {
+                                            maxCharNumber = 180;
+                                        }
+                                        var shortenedDescription = placeRecords[i].description.substr(0, maxCharNumber);
                                         if (shortenedDescription.slice(-1) !== ".") {
                                             shortenedDescription = shortenedDescription + "...";
                                         }
@@ -429,21 +433,31 @@
                                             placeUrl = "file:///~/serverless/tutorial.json";
                                         }
 
+                                        var promotedblur = "";
+                                        var promoted = "";
+                                        var placeTitlePromoted = "";
+                                        var prompotionDescHeight = "";
+                                        if (currentListFormat === "PLACES" && i === 0) {
+                                            promotedblur = " promotedblur";
+                                            promoted = " placeEntryLargeSize";
+                                            placeTitlePromoted = " placeTitlePromoted";
+                                            prompotionDescHeight = " style='height: 175px; '";
+                                        }
                                         //Add the place to the list
 
-                                        formatedList = formatedList + "<div class = 'placeEntry' id='place-" + placeRecords[i].id + "'" + moreStyle + "><div class = 'blur'>";
+                                        formatedList = formatedList + "<div class = 'placeEntry" + promoted + "' id='place-" + placeRecords[i].id + "'" + moreStyle + "><div class = 'blur" + promotedblur + "'>";
                                         formatedList = formatedList + "<table class='placeTable'>";
                                         formatedList = formatedList + "    <tr valign = 'top'>";
                                         formatedList = formatedList + "        <td width='2%'></td>";                                
-                                        formatedList = formatedList + "        <td align='left' width='75%' onclick='teleport(" + '"' + placeRecords[i].id + '"' + ", " + '"' + placeUrl + '"' + "); return false;'><a class= 'placeTitle' href='javascript:void(0)' onclick='teleport(" + '"' + placeRecords[i].id + '"' + ", " + '"' + placeUrl + '"' + "); return false;'>" + placeRecords[i].name + "</a></td>";
+                                        formatedList = formatedList + "        <td align='left' width='75%' onclick='teleport(" + '"' + placeRecords[i].id + '"' + ", " + '"' + placeUrl + '"' + "); return false;'><a class= 'placeTitle" + placeTitlePromoted + "' href='javascript:void(0)' onclick='teleport(" + '"' + placeRecords[i].id + '"' + ", " + '"' + placeUrl + '"' + "); return false;'>" + placeRecords[i].name + "</a></td>";
                                         if (placeRecords[i].category !== "Z") {
                                             formatedList = formatedList + "        <td align='right' ><span style='padding: 0%; cursor: pointer;' onclick='openDetail(" + '"' + placeRecords[i].id + '"' + ")'><img src='icons/info.png' width='26' height='26' draggable='false'></span></td>";
                                         }
                                         formatedList = formatedList + "    </tr>";
                                         formatedList = formatedList + "</table>";
                                         if (placeRecords[i].category !== "Z") {
-                                            formatedList = formatedList + "<table class='placeTable'>";
-                                            formatedList = formatedList + "    <tr>";
+                                            formatedList = formatedList + "<table class='placeTable'" + prompotionDescHeight + ">";
+                                            formatedList = formatedList + "    <tr valign = 'bottom'>";
                                             formatedList = formatedList + "        <td width='2%'></td>";
                                             formatedList = formatedList + "        <td align='left' width='88%' class='place-entry-description' onclick='teleport(" + '"' + placeRecords[i].id + '"' + ", " + '"' + placeUrl + '"' + "); return false;'>" + shortenedDescription + "</td>";
                                             formatedList = formatedList + "        <td align='right' class='presenceOfLife-" + placeRecords[i].accessStatus + "'>&#9603;</td>";