diff --git a/_config.yml b/_config.yml index e8313a95..4acef028 100644 --- a/_config.yml +++ b/_config.yml @@ -195,6 +195,7 @@ searchgov: # This renders the results within the page instead of sending to user to search.gov. inline: true + #inline: false # This allows Search.gov to present relevant type-ahead search suggestions in your website's search box. # If you do not want to present search suggestions, set this value to false. diff --git a/_includes/meta.html b/_includes/meta.html index cc20a07a..c3d8402d 100644 --- a/_includes/meta.html +++ b/_includes/meta.html @@ -59,4 +59,4 @@ - + \ No newline at end of file diff --git a/_includes/scripts.html b/_includes/scripts.html index c33d4a24..961f340e 100644 --- a/_includes/scripts.html +++ b/_includes/scripts.html @@ -21,6 +21,7 @@ {% endif %} + diff --git a/assets/css/style.css b/assets/css/style.css index 34b10e75..f0d64e35 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -29,7 +29,35 @@ C:/Program Files/Adobe/Adobe Dreamweaver 2021/ruby/lib/ruby/gems/2.7.0/gems/sass C:/Program Files/Adobe/Adobe Dreamweaver 2021/ruby/bin/sass:23:in `load' C:/Program Files/Adobe/Adobe Dreamweaver 2021/ruby/bin/sass:23:in `
' */ + body:before { white-space: pre; font-family: monospace; content: "Error: Invalid CSS after \" }\": expected selector or at-rule, was \"}\"\A on line 4446 of M:\icsp\fcsm\assets\css\style.scss\A \A 4441: height: 100%;\A 4442: z-index: -1;\A 4443: \A 4444: };\A 4445: }\A 4446: }\A 4447: .page-title-content {\A 4448: text-align: center;\A 4449: \A 4450: h2 {\A 4451: color: $white-color;"; } + + .pager-button { + display: inline-block; + padding: 8px 12px; + margin: 6px; + border: 2px solid #0004ff; /* blue border color */ + border-radius: 4px; /* rounded rectangle */ + background-color: transparent; /* no background color */ + color: #0004ff; /* blue text color */ + text-decoration: none; + cursor: pointer; +} + +.pager-button-current { + display: inline-block; + padding: 8px 12px; + margin: 6px; + border: 2px solid #350111; /* blue border color */ + border-radius: 4px; /* rounded rectangle */ + background-color: transparent; /* no background color */ + color: #000000; /* blue text color */ + text-decoration: none; + cursor: initial; +} +.pager-button:hover { + background-color: #e2e6ea; /* light gray background color on hover */ +} diff --git a/assets/css/styles-2.css b/assets/css/styles-2.css new file mode 100644 index 00000000..a66a1a75 --- /dev/null +++ b/assets/css/styles-2.css @@ -0,0 +1,29 @@ + + .pager-button { + display: inline-block; + padding: 8px 12px; + margin: 6px; + border: 2px solid #0004ff; /* blue border color */ + border-radius: 4px; /* rounded rectangle */ + background-color: transparent; /* no background color */ + color: #0004ff; /* blue text color */ + text-decoration: none; + cursor: pointer; + } + + .pager-button-current { + display: inline-block; + padding: 8px 12px; + margin: 6px; + border: 2px solid #350111; /* blue border color */ + border-radius: 4px; /* rounded rectangle */ + background-color: transparent; /* no background color */ + color: #000000; /* blue text color */ + text-decoration: none; + cursor: initial; + } + .pager-button:hover { + background-color: #e2e6ea; /* light gray background color on hover */ + } + + \ No newline at end of file diff --git a/assets/js/search.js b/assets/js/search.js new file mode 100644 index 00000000..ca1c998e --- /dev/null +++ b/assets/js/search.js @@ -0,0 +1,152 @@ +var urlParams = new URLSearchParams(window.location.search); +var page = urlParams.get("page") ?? 1; +var resultsPerPage = 20; +var offset = (page - 1) * resultsPerPage; +var totalResults = 0; + +// var searchEndpoint = new URL("{{site.searchgov.endpoint}}/api/v2/search/i14y"); +// params = { affiliate: "{{site.searchgov.affiliate}}", +// access_key: "{{site.searchgov.access_key}}", +// query: urlParams.get('query') , +// offset: offset +// } + +var searchgovParams = document.getElementById("searchgov-params"); +console.log("searchgovParams is : " + searchgovParams); +var currentURL = new URL(window.location.href); +var searchEndpoint = new URL( + searchgovParams.dataset.endpoint + "/api/v2/search/i14y" +); + +params = { + affiliate: searchgovParams.dataset.affiliate, + access_key: searchgovParams.dataset.accessKey, + query: urlParams.get("query"), + offset: offset +}; +searchResults.setAttribute("start", offset + 1); + +var inputElement = document.getElementById("extended-search-field-small"); + inputElement.value = urlParams.get("query"); + inputElement.focus(); + + + +Object.keys(params).forEach(key => searchEndpoint.searchParams.append(key, params[key])); + + +fetch(searchEndpoint).then(function(res) { + return res.json() + }).then(function(posts) { + totalResults = posts.web.total; + //console.log("Total results are : " + totalResults); + + document.getElementById('search-params').innerHTML = encodeHTML(urlParams.get('query')); + document.getElementById("search-keyword").innerHTML = urlParams.get("query"); + document.getElementById("results-count").innerHTML = totalResults; + + if (posts.web.results.length > 0) { + var searchResults = document.getElementById("search-results"); + if (searchResults != null){ + //console.log("searchResults are not null and offset is : " + offset); + + searchResults.setAttribute("start", offset + 1); + }else{ + console.log("searchResults are null."); + } + document.getElementById('search-results').classList.remove('display-none'); + document.getElementById('no-results').classList.add('display-none'); + for (item in posts.web.results){ + render_result(` +
  • + + + ${posts.web.results[item]['title'] + .replace(/\uE000/g, '') + .replace(/\uE001/g, '')} + +
    ${posts.web.results[item]['snippet'].replace(/\uE000/g, '').replace(/\uE001/g, '')}
    +
    • + `, true) + + } + } + }).catch(function(ex) { + console.log('parsing failed', ex); + }).finally(function(e){ + + if(document.getElementById('search-results').childNodes.length == 0){ + document.getElementById('search-results').classList.add('display-none'); + document.getElementById('no-results').classList.remove('display-none'); + document.getElementById("results-header").classList.add("display-none"); + document.getElementById("pager").classList.add("display-none"); + } + document.getElementById("results-header").classList.remove("display-none"); + update_pager(); + + }) + + + function render_result(content, append = true){ + const previous = document.getElementById('search-results').innerHTML; + document.getElementById('search-results').innerHTML = (append == true) ? previous + content : content; + } + + function update_pager() { + var page = urlParams.get("page") ?? 1; + var pager = document.getElementById("pager"); + var pagerLinks = ""; + var totalPages = Math.ceil(totalResults / resultsPerPage); + + pager.innerHTML = ""; + + if (page > 1){ + pagerLinks += 'First'; + } + + if (totalPages > 5 && page > 5) { + pagerLinks += '...'; + } + + var start = Math.max(2, page - 3); + for (var i = start; i < page; i++) { + pagerLinks += '' + i + ''; + } + + pagerLinks += 'Page ' + page + " of " + totalPages + ""; + + var end = Math.min((totalPages - 1), ((1*page) + 3)); + for (var j = (1*page) + 1; j <= end; j++) { + pagerLinks += '' + j + ''; + } + + if (totalPages > 5 && page < totalPages - 4) { + pagerLinks += '...'; + } + + if( totalPages > 1 && page < totalPages){ + pagerLinks += 'Last'; + } + + pagerLinks += '

    Powered by Search.gov

    '; + + pager.innerHTML = pagerLinks; + } + + function getLinkToPage(pageNumber) { + var searchParams = currentURL.searchParams; + if (searchParams.has("page")) { + searchParams.set("page", pageNumber); + } else { + searchParams.append("page", pageNumber); + } + return currentURL.toString(); + } + + function encodeHTML(str) { + return str.replace(/&/g, '&') + .replace(//g, '>') + .replace(/"/g, '"') + .replace(/'/g, '''); + } diff --git a/search/index.html b/search/index.html index 296e5794..3f12c4ae 100644 --- a/search/index.html +++ b/search/index.html @@ -4,28 +4,70 @@ title: Search Results --- + + - +
    {% if site.searchgov %} + + + +
      - +
      {% if site.searchgov.affiliate == "federalist-uswds-example" %}
      @@ -85,3 +194,4 @@ window.location = "/"; {% endif %} +
      \ No newline at end of file