Skip to content

Commit db1b4e5

Browse files
gastaldigastaldi
authored
Fix Search feature (#155)
* Fix Search feature - Fixes #117 * Apply suggestions from code review
1 parent 53e2d0d commit db1b4e5

File tree

2 files changed

+245
-110
lines changed

2 files changed

+245
-110
lines changed

‎l10n/override/pt_BR/_includes/index-docs.html

Lines changed: 143 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -4,128 +4,161 @@
44
{% assign categories = index.quarkus.categories %}
55
{% assign by_type = index.quarkus | map: "types" | first %}
66

7-
8-
<section class="full-width-version-bg flexfilterbar">
9-
<div class="flexcontainer">
10-
<div class="flexlabel">
11-
<label>Versão</label>
12-
</div>
13-
<div class="pulldown version">
14-
<select id="guidesindex-version-dropdown">
15-
{% for version in site.data.versions.documentation %}
16-
<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>
17-
{% endfor %}
18-
</select>
19-
</div>
20-
<div class="flexlabel">
21-
<label>Categoria</label>
22-
</div>
23-
<div class="pulldown category">
24-
<select id="guidesindex-category-dropdown">
25-
<option value="">Todas as categorias</option>
26-
{% for item in categories %}
27-
<option value="{{ item.cat-id }}">{{ item.category }}</option>
28-
{% endfor %}
29-
</select>
30-
</div>
31-
<div class="search">
32-
<input type="text" id="search-text" placeholder="Filtrar por palavra-chave" />
7+
<div id="guides-app"
8+
data-search-api-server="{{ site.search.url }}"
9+
data-quarkus-version="{{ docversion }}"
10+
data-language="{{ site.language }}"
11+
data-initial-timeout="{{ site.search.initial-timeout }}"
12+
data-more-timeout="{{ site.search.more-timeout }}"
13+
data-min-chars="{{ site.search.min-chars }}">
14+
<section class="full-width-version-bg flexfilterbar">
15+
<div class="flexcontainer">
16+
<div class="flexlabel">
17+
<label>Por Versão</label>
18+
</div>
19+
<div class="pulldown version">
20+
<select id="guidesindex-version-dropdown">
21+
{% for version in site.data.versions.documentation %}
22+
<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>
23+
{% endfor %}
24+
</select>
25+
</div>
26+
<div class="flexlabel">
27+
<label>Por Categoria</label>
28+
</div>
29+
<div class="pulldown category">
30+
<select v-model="category">
31+
<option value="">Todas as categorias</option>
32+
{% for item in categories %}
33+
<option value="{{ item.cat-id }}">{{ item.category }}</option>
34+
{% endfor %}
35+
</select>
36+
</div>
37+
<div class="search">
38+
<input v-model="text" type="text" placeholder="Filtrar por palavra-chave" />
39+
</div>
3340
</div>
34-
</div>
35-
</section>
36-
41+
</section>
3742

38-
39-
<div>
40-
<h1 class="title">{{ page.title }}</h1>
41-
</div>
42-
<div class="grid-wrapper guides" id="docs">
43-
{% include index-docs-merge.html type="tutorial" %}
44-
{% if values %}
45-
<div class="grid__item width-12-12 docslist">
46-
<div class="doclist-header">
47-
<h3 id="tutorial">Tutoriais</h3>
48-
<p>Exercícios curtos e focados para você começar rapidamente.</p>
49-
</div>
50-
<div class="grid-wrapper">
51-
{% for guide in values %}
52-
{% include index-doc-item.html class="tutorialbkg" docversion=docversion
53-
title=guide.title url=guide.url summary=guide.summary
54-
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
55-
{% endfor %}
56-
</div>
43+
<div>
44+
<h1 class="title">{{ page.title }}</h1>
5745
</div>
58-
{% endif %}
59-
{% include index-docs-merge.html type="howto" %}
60-
{% if values %}
61-
<div class="grid__item width-12-12 docslist">
62-
<div class="doclist-header">
63-
<h3 id="guide">Guias práticos</h3>
64-
<p>Guias passo a passo para cobrir tarefas importantes, operações do mundo real e problemas comuns.</p>
65-
</div>
66-
<div class="grid-wrapper">
67-
{% for guide in values %}
68-
{% include index-doc-item.html class="guidebkg" docversion=docversion
69-
title=guide.title url=guide.url summary=guide.summary
70-
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
71-
{% endfor %}
46+
<div v-if="hasInput" class="grid-wrapper guides results vuejs"
47+
:class="{ empty: !loading && !hasHits, 'vuejs-enabled': true, loading: loading }">
48+
<div class="grid__item width-12-12 docslist">
49+
<Transition name="fade-in">
50+
<div v-if="!loading && !hasHits" class="empty-placeholder">
51+
Desculpe, nenhum guia foi encontrado com estes parâmetros. Por favor tente novamente.
52+
</div>
53+
</Transition>
54+
<div class="grid-wrapper">
55+
{% raw %}
56+
<div v-for="hit in searchHits" :class="`${hit.type}bkg grid__item docs-card`">
57+
<h4><a :href="hit.url" :target="hit.url.startsWith('http') ? '_blank' : ''" v-html="hit.title"></a></h4>
58+
<div class="description" v-html="hit.summary"></div>
59+
<div class="content-highlights">
60+
<p v-for="contentLine in hit.content" v-html="contentLine"></p>
61+
</div>
62+
</div>
63+
{% endraw %}
64+
<Transition name="fade-in">
65+
<div v-if="loading" class="loading-placeholder">
66+
Carregando...
67+
</div>
68+
</Transition>
69+
</div>
7270
</div>
7371
</div>
74-
{% endif %}
75-
{% include index-docs-merge.html type="concepts" %}
76-
{% if values %}
77-
<div class="grid__item width-12-12 docslist">
78-
<div class="doclist-header">
79-
<h3 id="concept">Conceitos</h3>
80-
<p>Explicações de alguns dos conceitos e tecnologias mais amplos envolvidos no Quarkus.</p>
81-
</div>
82-
<div class="grid-wrapper">
83-
{% for guide in values %}
84-
{% include index-doc-item.html class="conceptbkg" docversion=docversion
85-
title=guide.title url=guide.url summary=guide.summary
72+
<!-- Static content displayed when there is no input in the search form or Javascript is disabled,
73+
but also used as a source of data for cards displayed by the vue.js app. -->
74+
<div v-else class="grid-wrapper guides" id="all-docs">
75+
{% include index-docs-merge.html type="tutorial" %}
76+
{% if values %}
77+
<div class="grid__item width-12-12 docslist">
78+
<div class="doclist-header">
79+
<h3 id="tutorial">Tutoriais</h3>
80+
<p>Exercícios curtos e focados para você começar rapidamente.</p>
81+
</div>
82+
<div class="grid-wrapper">
83+
{% for guide in values %}
84+
{% include index-doc-item.html class="tutorialbkg" docversion=docversion
85+
title=guide.title url=guide.url summary=guide.summary
8686
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
87-
{% endfor %}
87+
{% endfor %}
88+
</div>
8889
</div>
89-
</div>
90-
{% endif %}
91-
{% include index-docs-merge.html type="reference" %}
92-
{% if values %}
93-
<div class="grid__item width-12-12 docslist">
94-
<div class="doclist-header">
95-
<h3 id="reference">Referências</h3>
96-
<p>Ferramentas, componentes e comandos. A enciclopédia Quarkus.</p>
90+
{% endif %}
91+
{% include index-docs-merge.html type="howto" %}
92+
{% if values %}
93+
<div class="grid__item width-12-12 docslist">
94+
<div class="doclist-header">
95+
<h3 id="guide">Guias práticos</h3>
96+
<p>Guias passo a passo para cobrir tarefas importantes, operações do mundo real e problemas comuns.</p>
97+
</div>
98+
<div class="grid-wrapper">
99+
{% for guide in values %}
100+
{% include index-doc-item.html class="howtobkg" docversion=docversion
101+
title=guide.title url=guide.url summary=guide.summary
102+
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
103+
{% endfor %}
104+
</div>
97105
</div>
98-
<div class="grid-wrapper">
99-
<div class="grid__item docs-card pdfbkg">
100-
<h4><a href="https://lordofthejars.github.io/quarkus-cheat-sheet/" target="_blank">Quarkus Cheat Sheet</a></h4>
101-
<div class="description">Baixe o cheatsheet completo em PDF. <a href="https://developers.redhat.com/search?t=quarkus&f=type%7Echeatsheet" target="_blank">
102-
Obtenha mais cheatsheets no site Red Hat Developers. <i class="fas fa-external-link-alt"></i></a></div>
103-
<div class="keywords"></div>
104-
<div class="categories"></div>
105-
</div>
106-
{% for guide in values %}
107-
{% include index-doc-item.html class="referencebkg" docversion=docversion
108-
title=guide.title url=guide.url summary=guide.summary
106+
{% endif %}
107+
{% include index-docs-merge.html type="concepts" %}
108+
{% if values %}
109+
<div class="grid__item width-12-12 docslist">
110+
<div class="doclist-header">
111+
<h3 id="concept">Conceitos</h3>
112+
<p>Explicações de alguns dos conceitos e tecnologias mais amplos envolvidos no Quarkus.</p>
113+
</div>
114+
<div class="grid-wrapper">
115+
{% for guide in values %}
116+
{% include index-doc-item.html class="conceptsbkg" docversion=docversion
117+
title=guide.title url=guide.url summary=guide.summary
109118
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
110-
{% endfor %}
119+
{% endfor %}
120+
</div>
111121
</div>
112-
</div>
113-
{% endif %}
114-
{% include index-docs-merge.html type="guide" %}
115-
{% if values %}
116-
<div class="grid__item width-12-12 docslist">
117-
<div class="doclist-header">
118-
<h3 id="reference">Guias Gerais</h3>
119-
<p>Outros guias sobre Quarkus</p>
122+
{% endif %}
123+
{% include index-docs-merge.html type="reference" %}
124+
{% if values %}
125+
<div class="grid__item width-12-12 docslist">
126+
<div class="doclist-header">
127+
<h3 id="reference">Referências</h3>
128+
<p>Ferramentas, componentes e comandos. A enciclopédia Quarkus.</p>
129+
</div>
130+
<div class="grid-wrapper">
131+
<div class="grid__item docs-card pdfbkg">
132+
<h4><a href="https://lordofthejars.github.io/quarkus-cheat-sheet/" target="_blank">Quarkus Cheat Sheet</a></h4>
133+
<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">
134+
Obtenha mais cheatsheets no website Red Hat Developers. <i class="fas fa-external-link-alt"></i></a></div>
135+
<div class="keywords"></div>
136+
<div class="categories"></div>
137+
</div>
138+
{% for guide in values %}
139+
{% include index-doc-item.html class="referencebkg" docversion=docversion
140+
title=guide.title url=guide.url summary=guide.summary
141+
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
142+
{% endfor %}
143+
</div>
120144
</div>
121-
<div class="grid-wrapper">
122-
{% for guide in values %}
123-
{% include index-doc-item.html class="referencebkg" docversion=docversion
124-
title=guide.title url=guide.url summary=guide.summary
145+
{% endif %}
146+
{% include index-docs-merge.html type="guide" %}
147+
{% if values %}
148+
<div class="grid__item width-12-12 docslist">
149+
<div class="doclist-header">
150+
<h3>Guias Gerais</h3>
151+
<p>Outros guias sobre Quarkus</p>
152+
</div>
153+
<div class="grid-wrapper">
154+
{% for guide in values %}
155+
{% include index-doc-item.html class="guidebkg" docversion=docversion
156+
title=guide.title url=guide.url summary=guide.summary
125157
keywords=guide.keywords categories=guide.categories origin=guide.origin %}
126-
{% endfor %}
158+
{% endfor %}
159+
</div>
127160
</div>
161+
{% endif %}
128162
</div>
129-
{% endif %}
130-
<div class="grid__item width-12-12 empty-list">Desculpe, nenhum guia corresponde à sua pesquisa. Por favor, tente novamente.</div>
131163
</div>
164+
<script src="/assets/javascript/guides-app.js" type="module"></script>

‎l10n/override/pt_BR/_layouts/guides.html

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
---
2+
layout: base
3+
---
4+
{% assign versioned_page = page.url | startswith: '/version/' %}
5+
{% if versioned_page %}
6+
{% assign docversion = page.url | replace_regex: '^/version/([^/]+)/.*', '\1' %}
7+
{% else %}
8+
{% assign docversion = 'latest' %}
9+
{% endif %}
10+
{% assign docversion_index = docversion | replace: '.', '-' %}
11+
{% assign relations = site.data.versioned[docversion_index].index.relations %}
12+
{% assign guide_url = page.url | replace_regex: '^/version/[^/]+(/.*)', '\1' %}
13+
14+
<section class="full-width-version-bg flexfilterbar guides">
15+
<div class="guideflexcontainer">
16+
<div class="docslink">
17+
<a class="returnlink" href="{{site.baseurl}}/{% if versioned_page %}version/{{docversion}}/guides/{% else %}guides/{% endif %}"> Voltar aos Guias</a>
18+
</div>
19+
<div class="flexlabel">
20+
<label>Por Versão</label>
21+
</div>
22+
<div class="guidepulldown version">
23+
<select id="guide-version-dropdown">
24+
{% for version in site.data.versions.documentation -%}
25+
{% assign legacy_data_source = "guides-" | append: version | replace: '.', '-' %}
26+
{% assign guide_present_in_version = false %}
27+
{% for item in site.data[legacy_data_source].categories -%}
28+
{% for guide in item.guides -%}
29+
{% if guide.url == guide_url -%}
30+
{% assign guide_present_in_version = true %}
31+
{% endif -%}
32+
{% endfor -%}
33+
{% endfor -%}
34+
{% assign data_source = version | replace: '.', '-' %}
35+
{% for type in site.data.versioned[data_source].index.quarkus.types -%}
36+
{% for guide in type[1] -%}
37+
{% if guide.url == guide_url -%}
38+
{% assign guide_present_in_version = true %}
39+
{% endif -%}
40+
{% endfor -%}
41+
{% endfor -%}
42+
{% if guide_present_in_version or docversion == version -%}
43+
<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>
44+
{% endif -%}
45+
{% endfor -%}
46+
</select>
47+
</div>
48+
</div>
49+
</section>
50+
51+
<div class="guide">
52+
<div class="grid-wrapper">
53+
<div class="grid__item width-8-12 width-12-12-m">
54+
<h1 class="text-caps">{{page.title}} {{page.docversion}}</h1>
55+
{{ content }}
56+
</div>
57+
<div class="grid__item width-4-12 width-12-12-m tocwrapper">
58+
<div class="hide-mobile toc">{{ page.document | tocify_asciidoc: 2 }}</div>
59+
</div>
60+
</div>
61+
{% if relations and relations[guide_url] -%}
62+
<h2>Conteúdo Relacionado</h2>
63+
<div class="grid-wrapper relations">
64+
{% if relations[guide_url].sameExtensions -%}
65+
<div class="grid__item width-6-12 width-12-12-m">
66+
<h3>Nas mesmas extensões</h3>
67+
<ul class="related-content">
68+
{% for guide in relations[guide_url].sameExtensions -%}
69+
{% assign is_external_guide = guide.url | startswith: 'http' %}
70+
{% if is_external_guide %}
71+
{% assign related_guide_url = include.url %}
72+
{% elsif docversion == 'latest' %}
73+
{% assign related_guide_url = site.baseurl | append: guide.url %}
74+
{% else %}
75+
{% assign related_guide_url = site.baseurl | append: '/version/' | append: docversion | append: guide.url %}
76+
{% endif %}
77+
<li class="{{ guide.type }}"><a href="{{ related_guide_url }}">{{ guide.title }}</a></li>
78+
{% endfor -%}
79+
</ul>
80+
</div>
81+
{% endif -%}
82+
{% if relations[guide_url].sameTopics -%}
83+
<div class="grid__item width-6-12 width-12-12-m">
84+
<h3>Nos mesmos tópicos</h3>
85+
<ul class="related-content">
86+
{% for guide in relations[guide_url].sameTopics limit:20 -%}
87+
{% assign is_external_guide = guide.url | startswith: 'http' %}
88+
{% if is_external_guide %}
89+
{% assign related_guide_url = include.url %}
90+
{% elsif docversion == 'latest' %}
91+
{% assign related_guide_url = site.baseurl | append: guide.url %}
92+
{% else %}
93+
{% assign related_guide_url = site.baseurl | append: '/version/' | append: docversion | append: guide.url %}
94+
{% endif %}
95+
<li class="{{ guide.type }}"><a href="{{ related_guide_url }}">{{ guide.title }}</a></li>
96+
{% endfor -%}
97+
</ul>
98+
</div>
99+
{% endif -%}
100+
</div>
101+
{% endif -%}
102+
</div>

0 commit comments

Comments
 (0)