Update idaho theme to add custom search page

ckanext/opendata_theme/extended_themes/idaho/plugin.py

@@ -1,12 +1,32 @@
+from six import text_type
+
 import ckan.plugins as plugins
 import ckan.plugins.toolkit as toolkit
+from ckanext.opendata_theme.extended_themes.idaho.blueprint import search_blueprint
 
 
 class OpenDataThemePlugin(plugins.SingletonPlugin):
     plugins.implements(plugins.IConfigurer)
+    plugins.implements(plugins.IBlueprint)
 
     # IConfigurer
-
     def update_config(self, config):
         toolkit.add_template_directory(config, 'templates')
         toolkit.add_public_directory(config, 'public')
+
+    def update_config_schema(self, schema):
+        ignore_missing = toolkit.get_validator('ignore_missing')
+        ignore_not_sysadmin = toolkit.get_validator('ignore_not_sysadmin')
+
+        schema.update({
+            # Configuration option for filter fields
+            'ckanext.custom_search.filter_fields': [ignore_missing, ignore_not_sysadmin, text_type],
+            # Configuration option for iframe URL (resource_id is extracted from this)
+            'ckanext.custom_search.iframe_url': [ignore_missing, ignore_not_sysadmin, text_type]
+        })
+
+        return schema
+
+    # IBlueprint
+    def get_blueprint(self):
+        return search_blueprint

ckanext/opendata_theme/extended_themes/idaho/public/css/custom.css

@@ -1,78 +1,118 @@
+/* Roboto Slab Bold for headings */
 @font-face {
-  font-family: 'Bryant';
-  src: url('fonts/BryantWebRegular.eot');
-  src: url('fonts/BryantWebRegular.woff') format('woff'),
-       url('fonts/BryantWebRegular.woff2') format('woff2');
+  font-family: "Roboto Slab", serif;
+  src: url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');
+  font-optical-sizing: auto;
+  font-weight: 700;
+  font-style: normal;
 }
-
+/* Merriweather Sans Regular for body */
 @font-face {
-  font-family: 'Bryant';
-  src: url('fonts/BryantWebBold.eot');
-  src: url('fonts/BryantWebBold.woff') format('woff'),
-       url('fonts/BryantWebBold.woff2') format('woff2');
-  font-weight: bold;
+  font-family: "Merriweather Sans", sans-serif;
+  src: url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300..800;1,300..800&display=swap');
+  font-optical-sizing: auto;
+  font-weight: 400;
+  font-style: normal;
+}
+h1, h2, h3, h4, h5, h6 {
+  font-family: "Roboto Slab", serif;
 }
 body {
-  font-family: 'Bryant', sans-serif !important;
+  font-family: "Merriweather Sans", sans-serif;
   font-size: 16px;
 }
-.header-info {
-  float: left;
-  text-align: center;
-}
-.header-info ul li {
-  display: inline-block;
-}
-.header-info span.text {
-  margin: 0 2px 0 4px;
+
+.container {
+  width: 100% !important;
 }
-.header-info a {
-  color: #ffffff;
-  line-height: 31px;
+
+/* Filter dropdown styles */
+.filters {
+  background: #f8f9fa;
+  padding: 10px;
+  border-radius: 8px;
 }
-.header-info a:hover, .header-info a:focus {
-  color: #ffffff;
-  text-decoration: underline;
+
+.filters h3 {
+  margin-top: 0;
+  margin-bottom: 15px;
+  color: #2c3e50;
 }
-.header-info .fa {
-  color: #ffffff;
+
+.filter-dropdown {
+  width: 100%;
+  padding: 8px 12px;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  background-color: white;
+  font-size: 14px;
+  margin-bottom: 15px;
 }
-.header-info li.phone-info {
-  margin-right: 30px;
+
+.filter-dropdown:focus {
+  outline: none;
+  border-color: #007bff;
+  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
 }
-.account.authed i.fa-home {
-  font-size: 16px;
+
+.btn-primary {
+  border: 1px solid #4B3FFF !important;
+  background-color: #4B3FFF !important;
+  color: #FFFFFF !important;
 }
-.account.not-authed i.fa-home,
-.account.not-authed i.fa-twitter-square,
-.account.not-authed i.fa-facebook-square {
-  font-size: 20px;
-  margin-top: 5px;
+
+.btn-primary:hover,
+.btn-primary:focus {
+  border: 1px solid #4B3FFF !important;
+  background-color: #19009B !important;
+  color: #FFFFFF !important;
 }
-.navbar button.dropdown-toggle {
-  background-color: #445562;
-  margin-top: 15px;
+
+.btn-secondary {
+  border: 1px solid #4B3FFF !important;
+  color: #4B3FFF !important;
 }
-.navbar .dropdown-menu>li>a:hover,
-.navbar .dropdown-menu>li>a:focus {
-  background: #4298B5;
+
+.btn-secondary:hover,
+.btn-secondary:focus {
+  border: 1px solid #4B3FFF !important;
+  background-color: rgb(238, 241, 252);
+  color: #4B3FFF !important;
 }
-.intro-block .box {
-  background: #445562;
-  color: #FFFFFF;
-  text-align: center;
+
+.panel-default {
+  min-height: 110px;
 }
-.hero-text-heading {
-  margin-top: 0;
-  border-bottom: #4298B5 solid thick;
+@media (min-width: 768px) and (max-width: 1366px) {
+  .panel-default {
+    min-height: 150px;
+  }
 }
-.sub-footer {
-  background: #4298B5;
-  height: 22px;
+.panel-default .panel-body {
+  padding: 15px 15px 10px;
 }
-.sub-footer .idaho-logo {
-  height: 22px;
-  float: right;
-  padding: 1px;
-  margin-right: 10px;
+
+/* Date range container */
+.date-range-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+.date-range-input-wrapper {
+  flex: 1 1 auto;
+  min-width: 140px;
+  max-width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+}
+.date-range-label {
+  font-weight: 500;
+  margin: 0;
+}
+.date-range-label:after {
+  content: "";
+}
+.date-range-input {
+  width: 100%;
 }

ckanext/opendata_theme/extended_themes/idaho/templates/admin/config.html

@@ -0,0 +1,16 @@
+{% ckan_extends %}
+
+{% import 'macros/form.html' as form %}
+
+{% block admin_form %}
+    {{ super() }}
+    {{ form.input('ckanext.custom_search.iframe_url', id='field-custom-search-iframe-url', label=_('Custom Search Resource View URL'), value=data['ckanext.custom_search.iframe_url'], error=errors.get('ckanext.custom_search.iframe_url'), classes=['control-full'], placeholder='Link to a Data Table resource view') }}
+    {{ form.input('ckanext.custom_search.filter_fields', id='field-custom-search-filter-fields', label=_('Custom Search Filter Fields'), value=data['ckanext.custom_search.filter_fields'], error=errors.get('ckanext.custom_search.filter_fields'), classes=['control-full'], placeholder='e.g. Agency;Type;Status') }}
+{% endblock %}
+
+{% block admin_form_help %}
+    {{ super() }}
+    <p><strong>Custom Search Resource View URL:</strong> The URL for the Data Table resource view that displays the search results.</p>
+    <p><strong>Custom Search Filter Fields:</strong> Semicolon-separated list of field names to display as filters in the search interface.</p>
+{% endblock %}
+

ckanext/opendata_theme/extended_themes/idaho/templates/custom_search/base.html

@@ -0,0 +1,29 @@
+{% extends "page.html" %}
+
+{% block subtitle %}Custom Search{% endblock %}
+
+{% block skip %}
+{% endblock %}
+
+{%- block header %}
+{% endblock -%}
+
+{% block flash %}
+{% endblock %}
+
+{% block toolbar %}
+{% endblock %}
+
+{% block pre_primary %}
+<article class="module">
+  <header class="module-content page-header">
+    <ul class="nav nav-tabs">
+      {{ h.build_nav_icon('custom-search.custom_search', 'Search Statewide Agreements and Contracts') }}
+      {{ h.build_nav_icon('custom-search.custom_browse', 'Browse by Agency') }}
+    </ul>
+  </header>
+</article>
+{% endblock %}
+
+{%- block footer %}
+{% endblock -%}

ckanext/opendata_theme/extended_themes/idaho/templates/custom_search/browse.html

@@ -0,0 +1,120 @@
+{% extends "custom_search/base.html" %}
+
+{% block secondary %}
+{% endblock %}
+
+{% block primary %}
+<div class="primary">
+  <section class="module">
+    <div class="module-content">
+      {% if config_missing %}
+        <div class="alert alert-warning" style="margin: 20px 0; padding: 20px;">
+          <h3>Configuration Required</h3>
+          <p>The custom search feature is not configured. Please configure the <strong>Custom Search Resource View URL</strong> in the admin settings.</p>
+          <p><a href="{{ h.url_for('admin.config') }}" class="btn btn-primary">Go to Admin Settings</a></p>
+        </div>
+      {% else %}
+        <h2>Browse by {{ browse_field }}</h2>
+        {% if not browse_field %}
+          <p>No result for {{ browse_field }} was found in the datastore schema.</p>
+        {% else %}
+          {% if browse_items and browse_items|length > 0 %}
+            <div class="search-filter-container" style="margin-bottom: 20px;">
+              <input type="text" 
+                    id="agency-search" 
+                    class="form-control" 
+                    placeholder="Search agencies..." 
+                    style="padding: 10px 15px; font-size: 16px; border: 1px solid #ddd; border-radius: 4px;">
+            </div>
+            <div class="row" id="agencies-container">
+              {% for item in browse_items %}
+                {% set agency_number = '' %}
+                {% if ' -' in item %}
+                  {% set item_parts = item.split(' -') %}
+                {% elif '-' in item %}
+                  {% set item_parts = item.split('-') %}
+                {% endif %}
+                {% set agency_number = item_parts[0] if item_parts|length > 0 else '' %}
+                {% set agency_image_path = '/img/agency_logo/StateAgencylogo' + agency_number + '.png' if agency_number else '' %}
+                <div class="col-md-4 col-sm-6 agency-panel" style="margin-bottom: 15px;" data-agency-name="{{ item|lower }}">
+                  <a class="panel panel-default" href="/custom-search?{{ browse_field|urlencode }}={{ item|urlencode }}" style="display:block;">
+                    <div class="panel-body">
+                      <div class="media">
+                        <div class="media-left">
+                          <div class="agency-icon-container" style="width: 64px; height: 64px; display: flex; align-items: center; justify-content: center;">
+                            {% if agency_image_path %}
+                              <img src="{{ agency_image_path }}"
+                                  alt="{{ item }}"
+                                  class="agency-logo"
+                                  style="max-width: 64px; max-height: 64px; object-fit: contain; display: none;"
+                                  onerror="this.style.display='none'; this.nextElementSibling.style.display='inline-block';"
+                                  onload="this.style.display='block'; this.nextElementSibling.style.display='none';">
+                              <img src="/img/agency_logo/StateAgencylogo100.png"
+                                  alt="{{ item }}"
+                                  class="agency-logo"
+                                  style="max-width: 64px; max-height: 64px; object-fit: contain; display: none;">
+                            {% else %}
+                              <img src="/img/agency_logo/StateAgencylogo100.png"
+                              alt="{{ item }}"
+                              class="agency-logo"
+                              style="max-width: 64px; max-height: 64px; object-fit: contain; display: inline-block;">
+                            {% endif %}
+                          </div>
+                        </div>
+                        <div class="media-body">
+                          <h4 class="media-heading" style="margin-top:0;">{{ item }}</h4>
+                          <div>View agreements</div>
+                        </div>
+                      </div>
+                    </div>
+                  </a>
+                </div>
+              {% endfor %}
+            </div>
+            <div id="no-results-message" style="display: none; text-align: center; padding: 40px; color: #666;">
+              <p>No agencies found matching your search.</p>
+            </div>
+          {% else %}
+            <p>No result for {{ browse_field }} found.</p>
+          {% endif %}
+        {% endif %}
+      {% endif %}
+    </div>
+  </section>
+</div>
+
+<script>
+  (function() {
+    var searchInput = document.getElementById('agency-search');
+    var agenciesContainer = document.getElementById('agencies-container');
+    var noResultsMessage = document.getElementById('no-results-message');
+
+    if (searchInput && agenciesContainer) {
+      searchInput.addEventListener('input', function() {
+        var searchTerm = this.value.toLowerCase().trim();
+        var panels = agenciesContainer.querySelectorAll('.agency-panel');
+        var visibleCount = 0;
+
+        panels.forEach(function(panel) {
+          var agencyName = panel.getAttribute('data-agency-name');
+          if (agencyName.includes(searchTerm)) {
+            panel.style.display = '';
+            visibleCount++;
+          } else {
+            panel.style.display = 'none';
+          }
+        });
+
+        // Show/hide no results message
+        if (visibleCount === 0 && searchTerm !== '') {
+          noResultsMessage.style.display = 'block';
+          agenciesContainer.style.display = 'none';
+        } else {
+          noResultsMessage.style.display = 'none';
+          agenciesContainer.style.display = '';
+        }
+      });
+    }
+  })();
+</script>
+{% endblock %}