Skip to content

Commit

Permalink
Fix Search feature (#155)
Browse files Browse the repository at this point in the history
* Fix Search feature

- Fixes #117

* Apply suggestions from code review
  • Loading branch information
gastaldi authored Feb 7, 2024
1 parent 53e2d0d commit db1b4e5
Show file tree
Hide file tree
Showing 2 changed files with 245 additions and 110 deletions.
253 changes: 143 additions & 110 deletions l10n/override/pt_BR/_includes/index-docs.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,128 +4,161 @@
{% assign categories = index.quarkus.categories %}
{% assign by_type = index.quarkus | map: "types" | first %}


<section class="full-width-version-bg flexfilterbar">
<div class="flexcontainer">
<div class="flexlabel">
<label>Versão</label>
</div>
<div class="pulldown version">
<select id="guidesindex-version-dropdown">
{% for version in site.data.versions.documentation %}
<option value="{{ version }}" {% if docversion == version %}selected{% endif %}>{% if version == 'latest' %}{{ site.data.versions.quarkus.version | replace_regex: "\.[0-9+]\.Final", "" }} - {% endif %}{{ version | capitalize }}{% if version == 'main' %} - SNAPSHOT{% endif %}</option>
{% endfor %}
</select>
</div>
<div class="flexlabel">
<label>Categoria</label>
</div>
<div class="pulldown category">
<select id="guidesindex-category-dropdown">
<option value="">Todas as categorias</option>
{% for item in categories %}
<option value="{{ item.cat-id }}">{{ item.category }}</option>
{% endfor %}
</select>
</div>
<div class="search">
<input type="text" id="search-text" placeholder="Filtrar por palavra-chave" />
<div id="guides-app"
data-search-api-server="{{ site.search.url }}"
data-quarkus-version="{{ docversion }}"
data-language="{{ site.language }}"
data-initial-timeout="{{ site.search.initial-timeout }}"
data-more-timeout="{{ site.search.more-timeout }}"
data-min-chars="{{ site.search.min-chars }}">
<section class="full-width-version-bg flexfilterbar">
<div class="flexcontainer">
<div class="flexlabel">
<label>Por Versão</label>
</div>
<div class="pulldown version">
<select id="guidesindex-version-dropdown">
{% for version in site.data.versions.documentation %}
<option value="{{ version }}" {% if docversion == version %}selected{% endif %}>{% if version == 'latest' %}{{ site.data.versions.quarkus.version | replace_regex: "\.[0-9+]\.Final", "" }} - {% endif %}{{ version | capitalize }}{% if version == 'main' %} - SNAPSHOT{% endif %}</option>
{% endfor %}
</select>
</div>
<div class="flexlabel">
<label>Por Categoria</label>
</div>
<div class="pulldown category">
<select v-model="category">
<option value="">Todas as categorias</option>
{% for item in categories %}
<option value="{{ item.cat-id }}">{{ item.category }}</option>
{% endfor %}
</select>
</div>
<div class="search">
<input v-model="text" type="text" placeholder="Filtrar por palavra-chave" />
</div>
</div>
</div>
</section>

</section>


<div>
<h1 class="title">{{ page.title }}</h1>
</div>
<div class="grid-wrapper guides" id="docs">
{% include index-docs-merge.html type="tutorial" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="tutorial">Tutoriais</h3>
<p>Exercícios curtos e focados para você começar rapidamente.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="tutorialbkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
</div>
<div>
<h1 class="title">{{ page.title }}</h1>
</div>
{% endif %}
{% include index-docs-merge.html type="howto" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="guide">Guias práticos</h3>
<p>Guias passo a passo para cobrir tarefas importantes, operações do mundo real e problemas comuns.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="guidebkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
<div v-if="hasInput" class="grid-wrapper guides results vuejs"
:class="{ empty: !loading && !hasHits, 'vuejs-enabled': true, loading: loading }">
<div class="grid__item width-12-12 docslist">
<Transition name="fade-in">
<div v-if="!loading && !hasHits" class="empty-placeholder">
Desculpe, nenhum guia foi encontrado com estes parâmetros. Por favor tente novamente.
</div>
</Transition>
<div class="grid-wrapper">
{% raw %}
<div v-for="hit in searchHits" :class="`${hit.type}bkg grid__item docs-card`">
<h4><a :href="hit.url" :target="hit.url.startsWith('http') ? '_blank' : ''" v-html="hit.title"></a></h4>
<div class="description" v-html="hit.summary"></div>
<div class="content-highlights">
<p v-for="contentLine in hit.content" v-html="contentLine"></p>
</div>
</div>
{% endraw %}
<Transition name="fade-in">
<div v-if="loading" class="loading-placeholder">
Carregando...
</div>
</Transition>
</div>
</div>
</div>
{% endif %}
{% include index-docs-merge.html type="concepts" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="concept">Conceitos</h3>
<p>Explicações de alguns dos conceitos e tecnologias mais amplos envolvidos no Quarkus.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="conceptbkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
<!-- Static content displayed when there is no input in the search form or Javascript is disabled,
but also used as a source of data for cards displayed by the vue.js app. -->
<div v-else class="grid-wrapper guides" id="all-docs">
{% include index-docs-merge.html type="tutorial" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="tutorial">Tutoriais</h3>
<p>Exercícios curtos e focados para você começar rapidamente.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="tutorialbkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% include index-docs-merge.html type="reference" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="reference">Referências</h3>
<p>Ferramentas, componentes e comandos. A enciclopédia Quarkus.</p>
{% endif %}
{% include index-docs-merge.html type="howto" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="guide">Guias práticos</h3>
<p>Guias passo a passo para cobrir tarefas importantes, operações do mundo real e problemas comuns.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="howtobkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
</div>
</div>
<div class="grid-wrapper">
<div class="grid__item docs-card pdfbkg">
<h4><a href="https://lordofthejars.github.io/quarkus-cheat-sheet/" target="_blank">Quarkus Cheat Sheet</a></h4>
<div class="description">Baixe o cheatsheet completo em PDF. <a href="https://developers.redhat.com/search?t=quarkus&f=type%7Echeatsheet" target="_blank">
Obtenha mais cheatsheets no site Red Hat Developers. <i class="fas fa-external-link-alt"></i></a></div>
<div class="keywords"></div>
<div class="categories"></div>
</div>
{% for guide in values %}
{% include index-doc-item.html class="referencebkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
{% endif %}
{% include index-docs-merge.html type="concepts" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="concept">Conceitos</h3>
<p>Explicações de alguns dos conceitos e tecnologias mais amplos envolvidos no Quarkus.</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="conceptsbkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% include index-docs-merge.html type="guide" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="reference">Guias Gerais</h3>
<p>Outros guias sobre Quarkus</p>
{% endif %}
{% include index-docs-merge.html type="reference" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3 id="reference">Referências</h3>
<p>Ferramentas, componentes e comandos. A enciclopédia Quarkus.</p>
</div>
<div class="grid-wrapper">
<div class="grid__item docs-card pdfbkg">
<h4><a href="https://lordofthejars.github.io/quarkus-cheat-sheet/" target="_blank">Quarkus Cheat Sheet</a></h4>
<div class="description">Baixe o Cheat Sheet completo em PDF. <a href="https://developers.redhat.com/search?t=quarkus&f=type%7Echeat_sheet" target="_blank">
Obtenha mais cheatsheets no website Red Hat Developers. <i class="fas fa-external-link-alt"></i></a></div>
<div class="keywords"></div>
<div class="categories"></div>
</div>
{% for guide in values %}
{% include index-doc-item.html class="referencebkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
</div>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="referencebkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
{% endif %}
{% include index-docs-merge.html type="guide" %}
{% if values %}
<div class="grid__item width-12-12 docslist">
<div class="doclist-header">
<h3>Guias Gerais</h3>
<p>Outros guias sobre Quarkus</p>
</div>
<div class="grid-wrapper">
{% for guide in values %}
{% include index-doc-item.html class="guidebkg" docversion=docversion
title=guide.title url=guide.url summary=guide.summary
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
{% endfor %}
{% endfor %}
</div>
</div>
{% endif %}
</div>
{% endif %}
<div class="grid__item width-12-12 empty-list">Desculpe, nenhum guia corresponde à sua pesquisa. Por favor, tente novamente.</div>
</div>
<script src="/assets/javascript/guides-app.js" type="module"></script>
102 changes: 102 additions & 0 deletions l10n/override/pt_BR/_layouts/guides.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
---
layout: base
---
{% assign versioned_page = page.url | startswith: '/version/' %}
{% if versioned_page %}
{% assign docversion = page.url | replace_regex: '^/version/([^/]+)/.*', '\1' %}
{% else %}
{% assign docversion = 'latest' %}
{% endif %}
{% assign docversion_index = docversion | replace: '.', '-' %}
{% assign relations = site.data.versioned[docversion_index].index.relations %}
{% assign guide_url = page.url | replace_regex: '^/version/[^/]+(/.*)', '\1' %}

<section class="full-width-version-bg flexfilterbar guides">
<div class="guideflexcontainer">
<div class="docslink">
<a class="returnlink" href="{{site.baseurl}}/{% if versioned_page %}version/{{docversion}}/guides/{% else %}guides/{% endif %}"> Voltar aos Guias</a>
</div>
<div class="flexlabel">
<label>Por Versão</label>
</div>
<div class="guidepulldown version">
<select id="guide-version-dropdown">
{% for version in site.data.versions.documentation -%}
{% assign legacy_data_source = "guides-" | append: version | replace: '.', '-' %}
{% assign guide_present_in_version = false %}
{% for item in site.data[legacy_data_source].categories -%}
{% for guide in item.guides -%}
{% if guide.url == guide_url -%}
{% assign guide_present_in_version = true %}
{% endif -%}
{% endfor -%}
{% endfor -%}
{% assign data_source = version | replace: '.', '-' %}
{% for type in site.data.versioned[data_source].index.quarkus.types -%}
{% for guide in type[1] -%}
{% if guide.url == guide_url -%}
{% assign guide_present_in_version = true %}
{% endif -%}
{% endfor -%}
{% endfor -%}
{% if guide_present_in_version or docversion == version -%}
<option value="{{ version }}" {% if docversion == version %}selected{% endif %}>{% if version == 'latest' %}{{ site.data.versions.quarkus.version | replace_regex: "\.[0-9+]\.Final", "" }} - {% endif %}{{ version | capitalize }}{% if version == 'main' %} - SNAPSHOT{% endif %}</option>
{% endif -%}
{% endfor -%}
</select>
</div>
</div>
</section>

<div class="guide">
<div class="grid-wrapper">
<div class="grid__item width-8-12 width-12-12-m">
<h1 class="text-caps">{{page.title}} {{page.docversion}}</h1>
{{ content }}
</div>
<div class="grid__item width-4-12 width-12-12-m tocwrapper">
<div class="hide-mobile toc">{{ page.document | tocify_asciidoc: 2 }}</div>
</div>
</div>
{% if relations and relations[guide_url] -%}
<h2>Conteúdo Relacionado</h2>
<div class="grid-wrapper relations">
{% if relations[guide_url].sameExtensions -%}
<div class="grid__item width-6-12 width-12-12-m">
<h3>Nas mesmas extensões</h3>
<ul class="related-content">
{% for guide in relations[guide_url].sameExtensions -%}
{% assign is_external_guide = guide.url | startswith: 'http' %}
{% if is_external_guide %}
{% assign related_guide_url = include.url %}
{% elsif docversion == 'latest' %}
{% assign related_guide_url = site.baseurl | append: guide.url %}
{% else %}
{% assign related_guide_url = site.baseurl | append: '/version/' | append: docversion | append: guide.url %}
{% endif %}
<li class="{{ guide.type }}"><a href="{{ related_guide_url }}">{{ guide.title }}</a></li>
{% endfor -%}
</ul>
</div>
{% endif -%}
{% if relations[guide_url].sameTopics -%}
<div class="grid__item width-6-12 width-12-12-m">
<h3>Nos mesmos tópicos</h3>
<ul class="related-content">
{% for guide in relations[guide_url].sameTopics limit:20 -%}
{% assign is_external_guide = guide.url | startswith: 'http' %}
{% if is_external_guide %}
{% assign related_guide_url = include.url %}
{% elsif docversion == 'latest' %}
{% assign related_guide_url = site.baseurl | append: guide.url %}
{% else %}
{% assign related_guide_url = site.baseurl | append: '/version/' | append: docversion | append: guide.url %}
{% endif %}
<li class="{{ guide.type }}"><a href="{{ related_guide_url }}">{{ guide.title }}</a></li>
{% endfor -%}
</ul>
</div>
{% endif -%}
</div>
{% endif -%}
</div>

0 comments on commit db1b4e5

Please sign in to comment.