Show listing status in results view

Add a banner to the listings in the results view that show the listing status. Additionally, have a CSS class with the listing status so that users can target this element with custom CSS for a given status. - [ ] Add listing status banner - [ ] Add CSS class for listing statuses
SimplyRETS · Feb 28, 2024 · 3f549e1 · 3f549e1
1 parent 706d81e
commit 3f549e1
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 3 deletions.
diff --git a/src/assets/css/simply-rets-client.css b/src/assets/css/simply-rets-client.css
@@ -75,7 +75,7 @@ of the image, use this class.
     height: 155px;
     width: 30%;
     overflow: hidden;
-    background-size: contain;
+    background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
 }
@@ -87,6 +87,28 @@ of the image, use this class.
     background-size: cover;
 }
 
+.sr-listing-status {
+    padding: 10px;
+    color: white;
+    font-weight: 700;
+    background-color: rgba(128, 128, 128, 0.75);
+}
+
+.sr-listing-status-active,
+.sr-listing-status-comingsoon {
+    background-color: rgba(0, 128, 0, 0.75);
+}
+
+.sr-listing-status-activeundercontract,
+.sr-listing-status-pending {
+    background-color: rgba(255, 165, 0, 0.75);
+}
+
+.sr-listing > a:first-child,
+.sr-listing-grid-item > a:first-child {
+    text-decoration: none !important;
+}
+
 /*
 Primary Data
 ---

diff --git a/src/simply-rets-api-helper.php b/src/simply-rets-api-helper.php
@@ -1462,6 +1462,7 @@ public static function srResidentialResultsGenerator($request_response, $setting
              */
             $mls_status = SrListing::listingStatus($listing);
             $full_address = SrUtils::buildFullAddressString($listing);
+            $status_class = SrListing::listingStatusClass($listing->mls->status);
 
             $listing_USD = $listing_price == "" ? "" : '$' . number_format( $listing_price );
 
@@ -1609,9 +1610,14 @@ public static function srResidentialResultsGenerator($request_response, $setting
             if ($grid_view == true) {
                 // append markup for this listing to the content
                 $resultsMarkup .= <<<HTML
-                    <div class="sr-listing-grid-item">
+                    <div class="sr-listing-grid-item" id="{$status_class}">
                       <a href="$link">
                         <div class="sr-photo" style="background-image:url('$main_photo');">
+                            <span class="sr-listing-status {$status_class}">
+                                <span class="sr-listing-status-text">
+                                    $mls_status
+                                </span>
+                            </span>
                         </div>
                       </a>
                       <div class="sr-listing-data-wrapper">
@@ -1649,9 +1655,14 @@ public static function srResidentialResultsGenerator($request_response, $setting
                 // append markup for this listing to the content
                 $resultsMarkup .= <<<HTML
                     <hr>
-                    <div class="sr-listing">
+                    <div class="sr-listing" id="{$status_class}">
                       <a href="$link">
                         <div class="sr-photo" style="background-image:url('$main_photo');">
+                            <span class="sr-listing-status {$status_class}">
+                                <span class="sr-listing-status-text">
+                                    $mls_status
+                                </span>
+                            </span>
                         </div>
                       </a>
                       <div class="sr-listing-data-wrapper">

diff --git a/src/simply-rets-utils.php b/src/simply-rets-utils.php
@@ -525,6 +525,15 @@ public static function listingStatus($listing) {
         return $useStatusText ? $listing->mls->statusText : $listing->mls->status;
     }
 
+    /**
+     * Create a CSS class name for a standard status
+     */
+    public static function listingStatusClass($status) {
+        $status = strtolower($status);
+
+        return "sr-listing-status-{$status}";
+    }
+
     /**
      * Return a 'display-ready' number of bathrooms for a
      * listing. Checks for `.property.bathrooms` first, and then