aboutsummaryrefslogtreecommitdiff
path: root/_includes/search
diff options
context:
space:
mode:
authorAndrew Lee <alee14498@gmail.com>2019-10-27 09:57:37 -0400
committerAndrew Lee <alee14498@gmail.com>2019-10-27 09:57:37 -0400
commite62e7bb6b14555c9bbe5d40d217103984f4f80e6 (patch)
tree21887d847dccacb47644eb6f74ce31326172303c /_includes/search
parent716ea6ed2b64c921a799d872a07bfbd53b2a3e58 (diff)
downloadpokeworld-website-e62e7bb6b14555c9bbe5d40d217103984f4f80e6.tar.gz
pokeworld-website-e62e7bb6b14555c9bbe5d40d217103984f4f80e6.tar.bz2
pokeworld-website-e62e7bb6b14555c9bbe5d40d217103984f4f80e6.zip
Rewrite progress
Diffstat (limited to '_includes/search')
-rw-r--r--_includes/search/algolia-search-scripts.html54
-rw-r--r--_includes/search/google-search-scripts.html30
-rw-r--r--_includes/search/lunr-search-scripts.html10
-rw-r--r--_includes/search/search_form.html26
4 files changed, 120 insertions, 0 deletions
diff --git a/_includes/search/algolia-search-scripts.html b/_includes/search/algolia-search-scripts.html
new file mode 100644
index 0000000..a6bc9d2
--- /dev/null
+++ b/_includes/search/algolia-search-scripts.html
@@ -0,0 +1,54 @@
+<!-- Including InstantSearch.js library and styling -->
+<script src="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.js"></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch-theme-algolia.min.css">
+
+<script>
+// Instanciating InstantSearch.js with Algolia credentials
+const search = instantsearch({
+ appId: '{{ site.algolia.application_id }}',
+ apiKey: '{{ site.algolia.search_only_api_key }}',
+ indexName: '{{ site.algolia.index_name }}',
+ searchParameters: {
+ restrictSearchableAttributes: [
+ 'title',
+ 'content'
+ ]
+ }
+});
+
+const hitTemplate = function(hit) {
+ const url = hit.url;
+ const title = hit._highlightResult.title.value;
+ const content = hit._highlightResult.html.value;
+
+ return `
+ <div class="list__item">
+ <article class="archive__item" itemscope itemtype="https://schema.org/CreativeWork">
+ <h2 class="archive__item-title" itemprop="headline"><a href="{{ site.baseurl }}${url}">${title}</a></h2>
+ <div class="archive__item-excerpt" itemprop="description">${content}</div>
+ </article>
+ </div>
+ `;
+}
+
+// Adding searchbar and results widgets
+search.addWidget(
+ instantsearch.widgets.searchBox({
+ container: '.search-searchbar',
+ {% unless site.algolia.powered_by == false %}poweredBy: true,{% endunless %}
+ placeholder: '{{ site.data.ui-text[site.locale].search_placeholder_text | default: "Enter your search term..." }}'
+ })
+);
+search.addWidget(
+ instantsearch.widgets.hits({
+ container: '.search-hits',
+ templates: {
+ item: hitTemplate
+ }
+ })
+);
+
+// Starting the search
+search.start();
+</script>
diff --git a/_includes/search/google-search-scripts.html b/_includes/search/google-search-scripts.html
new file mode 100644
index 0000000..4af7423
--- /dev/null
+++ b/_includes/search/google-search-scripts.html
@@ -0,0 +1,30 @@
+<script>
+ (function () {
+ var cx = '{{ site.google.search_engine_id }}';
+ var gcse = document.createElement('script');
+ gcse.type = 'text/javascript';
+ gcse.async = true;
+ gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
+ var s = document.getElementsByTagName('script')[0];
+ s.parentNode.insertBefore(gcse, s);
+ })();
+
+ function googleCustomSearchExecute() {
+ var input = document.getElementById('cse-search-input-box-id');
+ var element = google.search.cse.element.getElement('searchresults-only0');
+ if (input.value == '') {
+ element.clearAllResults();
+ } else {
+ element.execute(input.value);
+ }
+ return false;
+ }
+
+ {% if site.google.instant_search %}
+ $(document).ready(function () {
+ $('input#cse-search-input-box-id').on('keyup', function () {
+ googleCustomSearchExecute();
+ });
+ });
+ {% endif %}
+</script> \ No newline at end of file
diff --git a/_includes/search/lunr-search-scripts.html b/_includes/search/lunr-search-scripts.html
new file mode 100644
index 0000000..574c390
--- /dev/null
+++ b/_includes/search/lunr-search-scripts.html
@@ -0,0 +1,10 @@
+{% assign lang = site.locale | slice: 0,2 | default: "en" %}
+{% case lang %}
+{% when "gr" %}
+ {% assign lang = "gr" %}
+{% else %}
+ {% assign lang = "en" %}
+{% endcase %}
+<script src="{{ '/assets/js/lunr/lunr.min.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/lunr/lunr-store.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/lunr/lunr-' | append: lang | append: '.js' | relative_url }}"></script> \ No newline at end of file
diff --git a/_includes/search/search_form.html b/_includes/search/search_form.html
new file mode 100644
index 0000000..c346379
--- /dev/null
+++ b/_includes/search/search_form.html
@@ -0,0 +1,26 @@
+<div class="search-content__inner-wrap">
+ {%- assign search_provider = site.search_provider | default: "lunr" -%}
+ {%- case search_provider -%}
+ {%- when "lunr" -%}
+ <form class="search-content__form" onkeydown="return event.key != 'Enter';">
+ <label class="sr-only" for="search">
+ {{ site.data.ui-text[site.locale].search_label_text | default: 'Enter your search term...' }}
+ </label>
+ <input type="search" id="search" class="search-input" tabindex="-1" placeholder="{{ site.data.ui-text[site.locale].search_placeholder_text | default: 'Enter your search term...' }}" />
+ </form>
+ <div id="results" class="results"></div>
+ {%- when "google" -%}
+ <form onsubmit="return googleCustomSearchExecute();" id="cse-search-box-form-id">
+ <label class="sr-only" for="cse-search-input-box-id">
+ {{ site.data.ui-text[site.locale].search_label_text | default: 'Enter your search term...' }}
+ </label>
+ <input type="search" id="cse-search-input-box-id" class="search-input" tabindex="-1" placeholder="{{ site.data.ui-text[site.locale].search_placeholder_text | default: 'Enter your search term...' }}" />
+ </form>
+ <div id="results" class="results">
+ <gcse:searchresults-only></gcse:searchresults-only>
+ </div>
+ {%- when "algolia" -%}
+ <div class="search-searchbar"></div>
+ <div class="search-hits"></div>
+ {%- endcase -%}
+</div>