Merge branch 'add-search' into 'master'

Add search capabilities

See merge request commun/recettes!13
This commit is contained in:
Thomas Schwery 2020-02-08 20:50:14 +00:00
commit e4434c6300
12 changed files with 150 additions and 17 deletions

View file

@ -16,5 +16,8 @@ copyright = ""
category = "categories"
tag = "tags"
[outputs]
home = ["html", "rss", "json"]
[params]
logo = "/images/logo.png"

4
content/search.md Normal file
View file

@ -0,0 +1,4 @@
---
title: "Search Results"
layout: "search"
---

View file

@ -0,0 +1,71 @@
var searchFunction = function(event) {
var searchQuery = $('#search-query').val();
if (searchQuery.length <= 3) {
$('#search-results').html("<p>Aucun résultat trouvé</p>");
return;
}
var lunrResults = lunrIdx.search(searchQuery);
if (lunrResults.length > 0) {
populateLunrResults(searchQuery, lunrResults);
}else{
$('#search-results').html("<p>Aucun résultat trouvé</p>");
}
}
var templateDefinition = `
<div id="summary-{{ key }}">
<h4><a href="{{ link }}index.html">{{ title }}</a> <small>{{ categories }}</small></h4>
<p>{{ content }}</p>
</div>
`;
var template = Handlebars.compile(templateDefinition);
var populateLunrResults = function(searchQuery, results) {
var resultDiv = $('#search-results');
resultDiv.html('');
$.each(results,function(rIdx,result){
var resultPage = jsonData.filter(function(page) {
return page.permalink === result.ref;
})[0];
console.info(result);
console.info(resultPage);
var output = template({
key: rIdx,
title: resultPage.title,
content: resultPage.contents,
categories: resultPage.categories,
link: result.ref
});
resultDiv.append(output);
$("#summary-" + rIdx).mark(searchQuery.replace(/[+-]/g, ''));
});
}
var lunrIdx;
var jsonData;
$('#search-query').prop('disabled', true);
$.getJSON( "../index.json", function( pages ) {
jsonData = pages;
lunrIdx = lunr(function() {
this.field("title", { boost: 10 });
this.field("categories", { boost: 5 });
this.field("contents");
this.ref("permalink");
jsonData.forEach(function (page) {
this.add(page)
}, this)
});
$('#search-query').prop('disabled', false);
searchFunction();
});
var formField = $('#search-query');
formField.change(searchFunction);
formField.keyup(searchFunction);

View file

@ -0,0 +1,21 @@
{{- $allRecettes := newScratch -}}
{{- $allRecettes.Add "index" slice -}}
{{- range .Site.RegularPages -}}
{{ $recette := (dict "title" .Title "permalink" .Permalink "categories" .CurrentSection.Title) }}
{{- $ingredients := newScratch -}}
{{- $ingredients.Add "ingredients" slice -}}
{{- range .Params.steps -}}
{{- range .ingredients -}}
{{- $ingredients.Add "ingredients" .name -}}
{{- end -}}
{{- end -}}
{{- $ingredientsArray := $ingredients.Get "ingredients" -}}
{{- $ingredientsContent := delimit $ingredientsArray ", " -}}
{{- $recette := merge $recette (dict "ingredients" $ingredientsArray) -}}
{{- $recette := merge $recette (dict "contents" $ingredientsContent) -}}
{{- $allRecettes.Add "index" $recette -}}
{{- end -}}
{{- $allRecettes.Get "index" | jsonify -}}

View file

@ -5,7 +5,7 @@
{{ range .Data.Pages }}
<article itemscope itemtype="http://schema.org/Blog">
<h2 class="entry-title" itemprop="headline">
<a href="{{ .Permalink }}">{{ .Title }}</a>
<a href="{{ .Permalink }}index.html">{{ .Title }}</a>
</h2>
</article>
{{ end }}

View file

@ -0,0 +1,31 @@
{{ partial "header.html" . }}
{{ $searchJS := resources.Get "js/search.js" }}
{{ $searchJSMin := $searchJS | minify | resources.Fingerprint "sha512" }}
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.3/handlebars.min.js"
integrity="sha256-/PJBs6QWvXijOFIX04kZpLb6ZtSQckdOIavLWKKOgXU="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mark.js/8.11.1/jquery.mark.min.js"
integrity="sha256-4HLtjeVgH0eIB3aZ9mLYF6E8oU5chNdjU6p6rrXpl9U="
crossorigin="anonymous"></script>
<script src="https://unpkg.com/lunr/lunr.js"></script>
<section class="resume-section p-3 p-lg-5 d-flex flex-column">
<div class="my-auto" >
<div class="form-group">
<label for="search-query">Termes de recherche</label>
<input class="form-control form-control-lg" placeholder="Poulet, Viande, Fondue, Soupe, ..." id="search-query" name="s"/>
</div>
<div class="mt-5" id="search-results">
</div>
</div>
</section>
<script src="{{ $searchJSMin.Permalink }}"></script>
{{ partial "footer.html" . }}

View file

@ -9,7 +9,7 @@
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<link>{{ .Permalink }}index.html</link>
<description>Les dernières recettes</description>
<generator>Hugo - {{ .Hugo.Version }} - gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Copyright }}
@ -22,7 +22,7 @@
{{ range $pages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<link>{{ .Permalink }}index.html</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
<guid>{{ .Permalink }}</guid>
</item>

View file

@ -9,6 +9,9 @@
{{ $cssBundle := slice $bootstrapCSS $customCSS | resources.Concat "css/bundle.css" }}
{{ $cssBundleMin := $cssBundle | resources.Minify | resources.Fingerprint "sha512" }}
{{ $indexUrl := "index.html" | absURL }}
{{ $searchUrl := "search" | absURL }}
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet" type="text/css">
@ -23,16 +26,16 @@
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light mb-5">
<div class="container">
<div class="navbar-nav">
<a class="nav-link" href="/index.html">
<h3>
Recettes
</h3>
</a>
</div>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="/index.html"><h3>Recettes</h3></a>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mr-auto">
<li class="nav-item"><a class="nav-link" href="{{ $indexUrl }}">Accueil</a></li>
</ul>
<ul class="navbar-nav">
<li class="nav-item "><a class="nav-link" href="{{ $searchUrl }}">Rechercher</a></li>
</ul>
</div>
</nav>
<div class="container">
<div class="container pt-5">
<article class="content">

View file

@ -1,6 +1,6 @@
<article itemscope itemtype="http://schema.org/Blog">
<h4 class="list-content-title pb-3">
<a href="{{ .RelPermalink }}index.html">{{ .Title }}</a>
<a href="{{ .Permalink }}index.html">{{ .Title }}</a>
<small class="text-muted font-weight-light">
{{ with .Date }}
<time itemprop="datePublished" datetime="{{ .Format "2006-01-02" }}">

View file

@ -6,7 +6,7 @@
{{ if eq $parentPage.File.UniqueID .File.UniqueID }}
{{ $active := "active" }}
{{ end }}
<a class="list-group-item d-flex justify-content-between list-group-item-action align-items-center $active" href="{{ .Permalink }}">
<a class="list-group-item d-flex justify-content-between list-group-item-action align-items-center $active" href="{{ .Permalink }}index.html">
{{ .Title }}
<span class="badge badge-secondary badge-pill">{{ len .Pages }}</span>
</a>

View file

@ -8,7 +8,7 @@
</h2>
<div class="header-container row">
<div class="header-category col-sm-4">
<a href="{{ .CurrentSection.Permalink }}">
<a href="{{ .CurrentSection.Permalink }}index.html">
{{ .CurrentSection.Title }}
</a>
</div>

View file

@ -7,7 +7,7 @@
<h2 class="list-title">Catégories</h2>
{{ range sort .Sections ".Title" "asc"}}
<h4 class="entry-title" itemprop="headline">
<a href="{{ .Permalink }}">{{ .Title }}</a>
<a href="{{ .Permalink }}index.html">{{ .Title }}</a>
<small class="text-muted">{{ len .Pages }} recettes</small>
</h4>
{{ end }}