From 3e3b68c72dd21bdfe0c0b17df624d66aead0aae6 Mon Sep 17 00:00:00 2001
From: Kyle Huynh <kyle.huynh205@gmail.com>
Date: Thu, 27 Jan 2022 04:39:35 +0000
Subject: [PATCH] Added handle for .is-active for pager linke in Pager block
 with ajax

---
 css/advanced_search.pager.css                |  8 ++++--
 js/facets/facets-views-ajax.js               | 28 +++++++++++++++++++-
 src/Plugin/Block/SearchResultsPagerBlock.php |  2 +-
 3 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/css/advanced_search.pager.css b/css/advanced_search.pager.css
index 5a5afcb..78a42d1 100644
--- a/css/advanced_search.pager.css
+++ b/css/advanced_search.pager.css
@@ -107,9 +107,13 @@
 }
 
 .pager__link--is-active {
-  text-decoration: underline;
+  text-decoration: underline !important;
+  border: solid 2px #0d77b5;
 }
 
+.view-grid .view-content .views-row {
+  padding: 0px 20px 20px 0px !important;
+}
 
 /* generalizing */
 .advanced_search_result_pager .pager__group .pager  {
@@ -142,5 +146,5 @@
 .view-grid .view-content{
   display: grid;
   grid-template-columns: repeat(3, 1fr);
-  margin: 0.47214rem 0 0.47214rem 2.61803rem;
+  /*margin: 0.47214rem 0 0.47214rem 2.61803rem;*/
 }
diff --git a/js/facets/facets-views-ajax.js b/js/facets/facets-views-ajax.js
index e8c9eb7..cba4386 100644
--- a/js/facets/facets-views-ajax.js
+++ b/js/facets/facets-views-ajax.js
@@ -77,7 +77,6 @@
   Drupal.behaviors.islandoraAdvancedSearchViewsAjax = {
     attach: function (context, settings) {
       window.historyInitiated = true;
-
       // Remove existing behavior from form.
       if (settings && settings.views && settings.views.ajaxViews) {
         $.each(settings.views.ajaxViews, function (index, settings) {
@@ -114,7 +113,34 @@
               });
             });
         });
+
+          if (window.location.search.includes("display=") === true) {
+
+              $("li.pager__item a.pager__display").each(function () {
+                  $(this).parent().removeClass("is-active");
+                  $(this).removeClass("pager__link--is-active");
+                  if ($(this).text().trim().toLowerCase() === getParam(window.location.search, "display").trim().toLowerCase()) {
+                      $(this).addClass("pager__link--is-active");
+                  }
+              });
+          }
+
+          if (window.location.search.includes("items_per_page=") === true) {
+              $("li.pager__item a.pager__itemsperpage").each(function() {
+                  $(this).parent().removeClass("is-active");
+                  $(this).removeClass("pager__link--is-active");
+                  if ($(this).text().trim().toLowerCase() === getParam(window.location.search, "items_per_page").trim().toLowerCase()) {
+                      $(this).addClass("pager__link--is-active");
+                  }
+              });
+          }
+
+
       }
+        function getParam(urlstring, param) {
+            var searchparam = new URLSearchParams(urlstring);
+            return searchparam.get(param);
+        }
 
       // Attach behavior to pager, summary, facet links.
       $("[data-drupal-pager-id], [data-drupal-facets-summary-id], [data-drupal-facet-id]")
diff --git a/src/Plugin/Block/SearchResultsPagerBlock.php b/src/Plugin/Block/SearchResultsPagerBlock.php
index a196f49..498cc64 100644
--- a/src/Plugin/Block/SearchResultsPagerBlock.php
+++ b/src/Plugin/Block/SearchResultsPagerBlock.php
@@ -212,7 +212,7 @@ class SearchResultsPagerBlock extends BlockBase implements ContainerFactoryPlugi
    *   A renderable array representing the display links portion of pager.
    */
   protected function buildDisplayLinks(array $query_parameters) {
-    $active_display = $query_parameters['display'] ?? 'list';
+    $active_display = $query_parameters['display'] ?? 'grid';
     $display_options = [
       'list' => [
         'icon' => 'fa-list',