Adiciona pesquisa

2023-07-19 16:06:47 +01:00 · 2023-07-19 16:06:47 +01:00 · e7c20ee460
commit e7c20ee460
parent 89d95d0993
11 changed files with 243 additions and 2 deletions
--- a/.gitignore
+++ b/.gitignore
@ -3,3 +3,4 @@
 /content/archy
 /public
 *.lock
+/static/pesquisa.st
--- a/5
+++ b/5
@ -0,0 +1,5 @@
+all:
+	./mkarchive.sh
+	./mkstork.sh  > stork.toml
+	stork build -i stork.toml -o static/pesquisa.st
+	hugo
--- a/README.md
+++ b/README.md
@ -5,10 +5,11 @@ Plataforma dedicada à divulgação de informação sobre DRM em Portugal.

 ## Tarefas em falta

- [ ] Pesquisa
+- [x] Pesquisa
 - [ ] Garantir acessibilidade, foco no carrossel na página principal
 - [ ] Garantir que o link antigo de RSS funciona (`/feed/`)
 - [ ] Meter o carrossel a andar sozinho com um bocadinho de javascript
 - [ ] Remover google fonts (Oswald)
 - [ ] Fazer upload dos vídeos do youtube para o viste.pt e adicionar embeds
 - [ ] Substituir `/img/logo.png` por versão de melhor qualidade
+- [ ] Fazer self-host do stork.{js,wasm}
--- a/config.toml
+++ b/config.toml
@ -1,4 +1,4 @@
-baseURL = 'http://example.org/'
+baseURL = 'https://drmpt.pxto.pt/'
 languageCode = 'pt-pt'
 defaultContentLanguage = "pt"
 title = "DRM Portugal"
--- a/content/search/_index.md
+++ b/content/search/_index.md
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@ -43,6 +43,11 @@
    </main>

    <aside>
+      <form class='search' action="/search" method="GET">
+        <input type="search" name="s" placeholder="Termo de pesquisa..." />
+        <button class="padding: 0.5rem" type='submit'><img src="/img/search.svg" alt="Pesquisar" /></button>
+      </form>
+
      {{ $articles := (where .Site.RegularPages "Section" "artigos") }}
      <section aria-labelled-by="artigos-recentes">
        <h2 id="artigos-recentes"><span>Artigos recentes</span></h2>
@ -90,6 +95,7 @@

        <ul>
          <li><a href="">Feed de notícias</a></li>
+          <li><a href="https://git.ansol.org/ansol/drm-pt.info">Código fonte</a></li>
          <li><a href="https://gohugo.io">Hugo - Ferramenta de geração de websites</a></li>
        </ul>
      </section>
--- a/layouts/search/list.html
+++ b/layouts/search/list.html
@ -0,0 +1,118 @@
+{{ define "main" }}
+
+<h1>Resultados da pesquisa por <span class='query'></span></h1>
+
+<div id='search-results'>
+</div>
+
+<script src="https://files.stork-search.net/releases/v1.6.0/stork.js"></script>
+<script type='text/javascript'>
+  const articles = [
+    {{ range $index, $page := site.Pages }}
+      {{ $cover := (index (.Resources.ByType "image") 0) }}
+      {
+        "url": {{ $page.Permalink }},
+        "title": {{ $page.Title }},
+        "author": {{ $page.Params.author }},
+        "summary": {{ $page.Summary }},
+        "published_date": {{ time.Format "02 de January, 2006" .Date }},
+        "cover_url": {{ $cover.Permalink }},
+        "cover_description": {{ $page.Params.coverdescription }},
+        "categories": [
+          {{ range $index2, $category := $page.GetTerms "categories" }}
+          {
+            "url": {{ $category.Permalink }},
+            "title": {{ $category.Title }}
+          }{{ if ne (add $index2 1) (len $page.Params.categories) }}, {{ end }}
+          {{ end }}
+        ]
+      }{{ if not (eq (add $index 1) ($.Pages.Len)) }},{{ end }}
+    {{ end }}
+  ];
+
+  window.addEventListener('load', async () => {
+    const query = (new URLSearchParams(document.location.search)).get("s");
+    document.querySelector('.query').innerText = query;
+    document.querySelector('input[type=search]').value = query;
+
+    stork.initialize();
+    await stork.downloadIndex("artigos", "/pesquisa.st", {});
+    const search = stork.search("artigos", query);
+
+    if (search.results.length == 0) {
+      document.querySelector('#search-results').innerHTML = "<p>Não há resultados para essa pesquisa.</p>";
+    } else {
+      document.querySelector('#search-results').innerHTML = "<ul class='articles detailed'></ul>";
+
+      search.results.forEach((result) => {
+        const url = `${search.url_prefix}${result.entry.url}/`;
+        const article = articles.find((a) => a.url == url);
+
+        const match = document.createElement('li');
+
+        {
+          const img = document.createElement('img');
+          img.setAttribute('src', article.cover_url);
+          img.setAttribute('alt', article.cover_description);
+          img.setAttribute('title', article.cover_description);
+          match.appendChild(img);
+        }
+
+        {
+          const title = document.createElement('h2');
+          const link = title.appendChild(document.createElement('a'));
+          link.setAttribute('href', url);
+          link.innerText = result.entry.title;
+          match.appendChild(title);
+        }
+
+        {
+          const summary = document.createElement('div');
+          summary.classList.add('summary');
+          summary.innerText = article.summary;
+          match.appendChild(summary);
+        }
+
+        {
+          const readmore = document.createElement('p');
+          readmore.classList.add('readmore');
+          const link = readmore.appendChild(document.createElement('a'));
+          link.setAttribute('href', url);
+          link.innerText = "Ler artigo completo →";
+          match.appendChild(readmore);
+        }
+
+        {
+          const byline = document.createElement('p');
+          byline.classList.add('byline');
+
+          byline.appendChild(document.createTextNode(`Publicado por ${article.author} // `));
+
+          if (article.categories.length == 0) {
+            byline.appendChild(document.createTextNode(`Sem categoria`));
+          } else {
+            article.categories.forEach((category, index) => {
+              const link = byline.appendChild(document.createElement('a'));
+              link.setAttribute('href', category.url);
+              link.innerText = category.title;
+              if (index + 1 != article.categories.length) {
+                byline.appendChild(document.createTextNode(", "));
+              }
+            });
+          }
+
+          byline.appendChild(document.createTextNode(` // `));
+          const link = byline.appendChild(document.createElement('a'));
+          link.setAttribute('href', url);
+          link.innerText = article.published_date;
+
+          match.appendChild(byline);
+        }
+
+        document.querySelector('#search-results ul').appendChild(match);
+
+      });
+    }
+  });
+</script>
+{{ end }}
--- a/mkstork.sh
+++ b/mkstork.sh
@ -0,0 +1,18 @@
+#!/usr/bin/env bash
+
+cat <<EOF
+[input]
+base_directory = "content/artigos/"
+stemming = "Portuguese"
+url_prefix = "https://drmpt.pxto.pt/"
+frontmatter_handling = "Parse"
+files = [
+EOF
+
+find content/artigos -name "*.md" -printf "%P\n" | while read filename; do
+slug="$(echo "$filename" | sed -e 's|/index.md||')"
+date="$(cat "content/artigos/$filename" | yq --front-matter=extract .date | sed -e 's/ ..:..:..//' -e 's/-/\//g')"
+echo "  {url=\"$date/$slug\", title=\"\", path=\"$filename\"},"
+done
+
+echo "]"
--- a/static/img/search.svg
+++ b/static/img/search.svg
@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 78.704521 85.561996"
+   enable-background="new 0 0 100 100"
+   xml:space="preserve"
+   id="svg202"
+   sodipodi:docname="search.svg"
+   width="78.704521"
+   height="85.561996"
+   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs206" /><sodipodi:namedview
+     id="namedview204"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="5.9821234"
+     inkscape:cx="37.86281"
+     inkscape:cy="41.122522"
+     inkscape:window-width="1920"
+     inkscape:window-height="1055"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg202" /><path
+     id="path200"
+     d="M 28.304688 0 C 17.12471 0 6.9686316 6.5994736 2.4316406 16.814453 C -3.8963466 31.073425 2.5536691 47.823309 16.806641 54.154297 C 24.592625 57.609289 33.681344 57.310961 41.236328 53.417969 C 42.062326 54.460967 43.733692 56.565506 45.929688 59.3125 C 46.551686 60.084498 61.24118 78.271119 65.451172 82.662109 C 66.20617 83.450109 68.217662 85.301344 70.597656 85.527344 C 70.837656 85.552344 71.078453 85.5625 71.314453 85.5625 C 75.148445 85.5625 78.311736 82.682228 78.677734 78.865234 C 78.925734 76.32324 77.36 73.866873 76.875 73.171875 C 73.406006 68.223885 58.01842 50.200734 57.357422 49.427734 C 54.495428 46.137742 52.986764 44.403279 52.134766 43.488281 C 52.927764 42.250283 53.591438 41.03034 54.148438 39.777344 C 60.478424 25.521372 54.027456 8.7694405 39.771484 2.4394531 C 36.123492 0.81945638 32.26468 2.9605918e-16 28.304688 0 z M 28.634766 10.882812 C 30.088764 10.882813 31.544845 11.0675 32.964844 11.4375 C 37.405839 12.589499 41.131034 15.404379 43.457031 19.359375 C 45.783029 23.317371 46.428436 27.940817 45.273438 32.382812 C 43.308439 39.959805 36.476195 45.248047 28.658203 45.248047 C 27.206205 45.248047 25.75103 45.060359 24.332031 44.693359 C 15.16204 42.313362 9.6366277 32.919038 12.015625 23.748047 C 13.984623 16.173054 20.817773 10.882812 28.634766 10.882812 z "
+     style="fill:#ffffff" /></svg>
--- a/static/styles.css
+++ b/static/styles.css
@ -37,6 +37,33 @@ aside h2 {

 aside { border-left: 1px solid #ccc; padding-left: 1rem; }

+aside .search {
+  padding: 2rem 0;
+  display: flex;
+  justify-content: end;
+}
+
+aside .search input {
+  border: 1px solid #ccc;
+  padding: 0.5rem;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+
+aside .search button {
+  border: 1px solid #87211d;
+  padding: 0 0.75rem;
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  background-color: #C4302B;
+  cursor: pointer;
+}
+aside .search button img {
+  display: block;
+  height: 15px;
+}
+
+
 aside section { margin-bottom: 2rem; }

 aside ul { list-style-type: none; padding: 0; }
--- a/stork.toml
+++ b/stork.toml
@ -0,0 +1,26 @@
+[input]
+base_directory = "content/artigos/"
+stemming = "Portuguese"
+url_prefix = "https://drmpt.pxto.pt/"
+frontmatter_handling = "Parse"
+files = [
+  {url="2013/04/27/be-quer-resolver-problema-do-drm-com-projecto-de-lei", title="", path="be-quer-resolver-problema-do-drm-com-projecto-de-lei/index.md"},
+  {url="2008/12/25/dia-10-spore", title="", path="dia-10-spore/index.md"},
+  {url="2016/12/01/2016-um-ano-cheio-de-drm", title="", path="2016-um-ano-cheio-de-drm/index.md"},
+  {url="2007/07/03/emi", title="", path="emi/index.md"},
+  {url="2015/04/21/direitos-de-autor-e-drm", title="", path="direitos-de-autor-e-drm/index.md"},
+  {url="2017/01/08/pl-drm-aprovado-generalidade", title="", path="pl-drm-aprovado-generalidade/index.md"},
+  {url="2016/09/18/html-eme-e-normas-abertas", title="", path="html-eme-e-normas-abertas/index.md"},
+  {url="2007/05/25/accao-de-sensibilizacao-sobre-drm", title="", path="accao-de-sensibilizacao-sobre-drm/index.md"},
+  {url="2013/04/25/o-drm-impede-a-utilizacao-educativa", title="", path="o-drm-impede-a-utilizacao-educativa/index.md"},
+  {url="2017/07/09/dayagainstdrm-dia-internacional-contra-o-drm-2017", title="", path="dayagainstdrm-dia-internacional-contra-o-drm-2017/index.md"},
+  {url="2013/04/21/social-drm", title="", path="social-drm/index.md"},
+  {url="2023/04/30/alteracoes-ao-uso-de-drm-em-portugal", title="", path="alteracoes-ao-uso-de-drm-em-portugal/index.md"},
+  {url="2007/06/28/estudo-da-apdsi-sobre-drm", title="", path="estudo-da-apdsi-sobre-drm/index.md"},
+  {url="2016/09/08/contra-drm-na-w3c", title="", path="contra-drm-na-w3c/index.md"},
+  {url="2011/08/21/cd-como-saber-se-estao-corrompidos", title="", path="cd-como-saber-se-estao-corrompidos/index.md"},
+  {url="2017/04/08/parlamento-aprova-projeto-de-lei-que-resolve-drm-fixcopyright-publicdomain", title="", path="parlamento-aprova-projeto-de-lei-que-resolve-drm-fixcopyright-publicdomain/index.md"},
+  {url="2016/10/16/o-ceta-e-o-drm", title="", path="o-ceta-e-o-drm/index.md"},
+  {url="2013/04/20/o-drm-nao-impede-pirataria", title="", path="o-drm-nao-impede-pirataria/index.md"},
+  {url="2016/10/02/diga-a-hp-nao-ao-drm", title="", path="diga-a-hp-nao-ao-drm/index.md"},
+]