on master help sign in
[fix] add aria labels to result links - #350
b51d4ecAdam Tauber
searx/templates/oscar/macros.html+13−13
@@ -8,34 +8,34 @@
8 <img width="32" height="32" class="favicon" src="{{ url_for('static', filename='themes/oscar/img/icons/' + favicon + '.png') }}" alt="{{ favicon }}" />
8 <img width="32" height="32" class="favicon" src="{{ url_for('static', filename='themes/oscar/img/icons/' + favicon + '.png') }}" alt="{{ favicon }}" />
9{%- endmacro %}
9{%- endmacro %}
10
10
11−{%- macro result_link(url, title, classes='') -%}
11+{%- macro result_link(url, title, classes='', id='') -%}
12−<a href="{{ url }}" {% if classes %}class="{{ classes }}" {% endif %}{% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}>{{ title }}</a>
12+<a href="{{ url }}" {% if classes %}class="{{ classes }}" {% endif %}{% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}{% if id %} aria-labelledby="result-{{id}}"{%endif%}>{{ title }}</a>
13{%- endmacro -%}
13{%- endmacro -%}
14
14
15<!-- Draw result header -->
15<!-- Draw result header -->
16−{% macro result_header(result, favicons) -%}
16+{% macro result_header(result, favicons, id) -%}
17−<h4 class="result_header">{% if result.engine~".png" in favicons %}{{ draw_favicon(result.engine) }} {% endif %}{% if result.url %}{{ result_link(result.url, result.title|safe) }}{% else %}{{ result.title|safe}}{% endif %}</h4>
17+<h4 class="result_header" id="result-{{id}}">{% if result.engine~".png" in favicons %}{{ draw_favicon(result.engine) }} {% endif %}{% if result.url %}{{ result_link(result.url, result.title|safe, id=id) }}{% else %}{{ result.title|safe}}{% endif %}</h4>
18{%- endmacro %}
18{%- endmacro %}
19
19
20<!-- Draw result sub header -->
20<!-- Draw result sub header -->
21−{% macro result_sub_header(result) -%}
21+{% macro result_sub_header(result, id) -%}
22 {% if result.publishedDate %}<time class="text-muted" datetime="{{ result.pubdate }}" >{{ result.publishedDate }}</time>{% endif %}
22 {% if result.publishedDate %}<time class="text-muted" datetime="{{ result.pubdate }}" >{{ result.publishedDate }}</time>{% endif %}
23− {% if result.magnetlink %}<small> &bull; {{ result_link(result.magnetlink, icon('magnet') + _('magnet link'), "magnetlink") }}</small>{% endif %}
23+ {% if result.magnetlink %}<small> &bull; {{ result_link(result.magnetlink, icon('magnet') + _('magnet link'), "magnetlink", id) }}</small>{% endif %}
24− {% if result.torrentfile %}<small> &bull; {{ result_link(result.torrentfile, icon('download-alt') + _('torrent file'), "torrentfile") }}</small>{% endif %}
24+ {% if result.torrentfile %}<small> &bull; {{ result_link(result.torrentfile, icon('download-alt') + _('torrent file'), "torrentfile", id) }}</small>{% endif %}
25{%- endmacro %}
25{%- endmacro %}
26
26
27<!-- Draw result footer -->
27<!-- Draw result footer -->
28−{% macro result_footer(result) -%}
28+{% macro result_footer(result, id) -%}
29 <div class="clearfix"></div>{{- "" -}}
29 <div class="clearfix"></div>{{- "" -}}
30 <div class="pull-right">
30 <div class="pull-right">
31 {%- for engine in result.engines -%}
31 {%- for engine in result.engines -%}
32 <span class="label label-default">{{ engine }}</span>
32 <span class="label label-default">{{ engine }}</span>
33 {%- endfor -%}
33 {%- endfor -%}
34 {%- if result.url -%}
34 {%- if result.url -%}
35− <small>{{ result_link("https://web.archive.org/web/" + result.url, icon('link') + _('cached'), "text-info") }}</small>
35+ <small>{{ result_link("https://web.archive.org/web/" + result.url, icon('link') + _('cached'), "text-info", id) }}</small>
36 {%- endif -%}
36 {%- endif -%}
37 {%- if proxify -%}
37 {%- if proxify -%}
38− <small>{{ result_link(proxify(result.url), icon('sort') + _('proxied'), "text-info") }}</small>
38+ <small>{{ result_link(proxify(result.url), icon('sort') + _('proxied'), "text-info", id) }}</small>
39 {%- endif -%}
39 {%- endif -%}
40 </div>
40 </div>
41 {%- if result.pretty_url -%}
41 {%- if result.pretty_url -%}
@@ -44,16 +44,16 @@
44{%- endmacro %}
44{%- endmacro %}
45
45
46<!-- Draw result footer -->
46<!-- Draw result footer -->
47−{% macro result_footer_rtl(result) -%}
47+{% macro result_footer_rtl(result, id) -%}
48 <div class="clearfix"></div>{{- "" -}}
48 <div class="clearfix"></div>{{- "" -}}
49 {% for engine in result.engines -%}
49 {% for engine in result.engines -%}
50 <span class="label label-default">{{ engine }}</span>
50 <span class="label label-default">{{ engine }}</span>
51 {%- endfor %}
51 {%- endfor %}
52 {%- if result.url -%}
52 {%- if result.url -%}
53− <small>{{ result_link("https://web.archive.org/web/" + result.url, icon('link') + _('cached'), "text-info") }}</small>
53+ <small>{{ result_link("https://web.archive.org/web/" + result.url, icon('link') + _('cached'), "text-info", id) }}</small>
54 {%- endif -%}
54 {%- endif -%}
55 {% if proxify -%}
55 {% if proxify -%}
56− <small>{{ result_link(proxify(result.url), icon('sort') + _('proxied'), "text-info") }}</small>
56+ <small>{{ result_link(proxify(result.url), icon('sort') + _('proxied'), "text-info", id) }}</small>
57 {%- endif %}
57 {%- endif %}
58 {%- if result.pretty_url -%}
58 {%- if result.pretty_url -%}
59 <div class="external-link">{{ result.pretty_url }}</div>
59 <div class="external-link">{{ result.pretty_url }}</div>
searx/templates/oscar/result_templates/code.html+2−2
@@ -1,11 +1,11 @@
1−{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
1+{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon with context%}
2
2
3{{ result_header(result, favicons) }}
3{{ result_header(result, favicons) }}
4{{ result_sub_header(result) }}
4{{ result_sub_header(result) }}
5
5
6{% if result.content %}<p class="result-content">{{ result.content|safe }}</p>{% endif %}
6{% if result.content %}<p class="result-content">{{ result.content|safe }}</p>{% endif %}
7
7
8−{% if result.repository %}<p class="result-content">{{ icon('file') }} <a href="{{ result.repository }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}>{{ result.repository }}</a></p>{% endif %}
8+{% if result.repository %}<p class="result-content">{{ icon('file') }} <a href="{{ result.repository }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} aria-labelledby="result-{{loop.index}}">{{ result.repository }}</a></p>{% endif %}
9
9
10<div dir="ltr">
10<div dir="ltr">
11{{ result.codelines|code_highlighter(result.code_language)|safe }}
11{{ result.codelines|code_highlighter(result.code_language)|safe }}
searx/templates/oscar/result_templates/default.html+5−5
@@ -1,10 +1,10 @@
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon with context %}
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon with context %}
2
2
3−{{- result_header(result, favicons) -}}
3+{{- result_header(result, favicons, loop.index) -}}
4−{{- result_sub_header(result) -}}
4+{{- result_sub_header(result, loop.index) -}}
5
5
6{%- if result.embedded -%}
6{%- if result.embedded -%}
7− <small> &bull; <a class="text-info btn-collapse collapsed cursor-pointer media-loader disabled_if_nojs" data-toggle="collapse" data-target="#result-media-{{ index }}" data-btn-text-collapsed="{{ _('show media') }}" data-btn-text-not-collapsed="{{ _('hide media') }}">{{ icon('music') }} {{ _('show media') }}</a></small>
7+ <small> &bull; <a class="text-info btn-collapse collapsed cursor-pointer media-loader disabled_if_nojs" data-toggle="collapse" data-target="#result-media-{{ index }}" data-btn-text-collapsed="{{ _('show media') }}" data-btn-text-not-collapsed="{{ _('hide media') }}" aria-labelledby="result-{{loop.index}}">{{ icon('music') }} {{ _('show media') }}</a></small>
8{%- endif -%}
8{%- endif -%}
9
9
10{%- if result.embedded -%}
10{%- if result.embedded -%}
@@ -25,7 +25,7 @@
25{%- endif -%}
25{%- endif -%}
26
26
27{%- if rtl -%}
27{%- if rtl -%}
28−{{ result_footer_rtl(result) }}
28+{{ result_footer_rtl(result, loop.index) }}
29{%- else -%}
29{%- else -%}
30−{{ result_footer(result) }}
30+{{ result_footer(result, loop.index) }}
31{%- endif -%}
31{%- endif -%}
searx/templates/oscar/result_templates/images.html+2−2
@@ -1,6 +1,6 @@
1−{%- from 'oscar/macros.html' import draw_favicon -%}
1+{%- from 'oscar/macros.html' import draw_favicon with context -%}
2
2
3−<a href="{{ result.img_src }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} data-toggle="modal" data-target="#modal-{{ index }}-{{pageno}}">{{- "" -}}
3+<a href="{{ result.img_src }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} data-toggle="modal" data-target="#modal-{{ index }}-{{pageno}}" id="result-{{loop.index}}">{{- "" -}}
4 <img src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="img-thumbnail">{{- "" -}}
4 <img src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="img-thumbnail">{{- "" -}}
5</a>
5</a>
6<div class="modal fade" id="modal-{{ index }}-{{ pageno }}" tabindex="-1" role="dialog" aria-hidden="true">{{- "" -}}
6<div class="modal fade" id="modal-{{ index }}-{{ pageno }}" tabindex="-1" role="dialog" aria-hidden="true">{{- "" -}}
searx/templates/oscar/result_templates/map.html+4−4
@@ -1,7 +1,7 @@
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
2
2
3−{{ result_header(result, favicons) }}
3+{{ result_header(result, favicons, loop.index) }}
4−{{ result_sub_header(result) }}
4+{{ result_sub_header(result, loop.index) }}
5
5
6{% if (result.latitude and result.longitude) or result.boundingbox %}
6{% if (result.latitude and result.longitude) or result.boundingbox %}
7 <small> &bull; <a class="text-info btn-collapse collapsed searx_init_map cursor-pointer disabled_if_nojs" data-toggle="collapse" data-target="#result-map-{{ index }}" data-leaflet-target="osm-map-{{ index }}" data-map-lon="{{ result.longitude }}" data-map-lat="{{ result.latitude }}" {% if result.boundingbox %}data-map-boundingbox='{{ result.boundingbox|tojson|safe }}'{% endif %} {% if result.geojson %}data-map-geojson='{{ result.geojson|tojson|safe }}'{% endif %} data-btn-text-collapsed="{{ _('show map') }}" data-btn-text-not-collapsed="{{ _('hide map') }}">{{ icon('globe') }} {{ _('show map') }}</a></small>
7 <small> &bull; <a class="text-info btn-collapse collapsed searx_init_map cursor-pointer disabled_if_nojs" data-toggle="collapse" data-target="#result-map-{{ index }}" data-leaflet-target="osm-map-{{ index }}" data-map-lon="{{ result.longitude }}" data-map-lat="{{ result.latitude }}" {% if result.boundingbox %}data-map-boundingbox='{{ result.boundingbox|tojson|safe }}'{% endif %} {% if result.geojson %}data-map-geojson='{{ result.geojson|tojson|safe }}'{% endif %} data-btn-text-collapsed="{{ _('show map') }}" data-btn-text-not-collapsed="{{ _('hide map') }}">{{ icon('globe') }} {{ _('show map') }}</a></small>
@@ -66,7 +66,7 @@
66{% endif %}
66{% endif %}
67
67
68{% if rtl %}
68{% if rtl %}
69−{{ result_footer_rtl(result) }}
69+{{ result_footer_rtl(result, loop.index) }}
70{% else %}
70{% else %}
71−{{ result_footer(result) }}
71+{{ result_footer(result, loop.index) }}
72{% endif %}
72{% endif %}
searx/templates/oscar/result_templates/torrent.html+4−4
@@ -1,7 +1,7 @@
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
2
2
3−{{ result_header(result, favicons) }}
3+{{ result_header(result, favicons, loop.index) }}
4−{{ result_sub_header(result) }}
4+{{ result_sub_header(result, loop.index) }}
5
5
6{% if result.seed is defined %}<p class="result-content">{{ icon('transfer') }} {{ _('Seeder') }} <span class="badge">{{ result.seed }}</span> &bull; {{ _('Leecher') }} <span class="badge">{{ result.leech }}</span>{% endif %}
6{% if result.seed is defined %}<p class="result-content">{{ icon('transfer') }} {{ _('Seeder') }} <span class="badge">{{ result.seed }}</span> &bull; {{ _('Leecher') }} <span class="badge">{{ result.leech }}</span>{% endif %}
7{% if result.filesize %}<br />{{ icon('floppy-disk') }} {{ _('Filesize') }}
7{% if result.filesize %}<br />{{ icon('floppy-disk') }} {{ _('Filesize') }}
@@ -19,7 +19,7 @@
19</p>
19</p>
20
20
21{% if rtl %}
21{% if rtl %}
22−{{ result_footer_rtl(result) }}
22+{{ result_footer_rtl(result, loop.index) }}
23{% else %}
23{% else %}
24−{{ result_footer(result) }}
24+{{ result_footer(result, loop.index) }}
25{% endif %}
25{% endif %}
searx/templates/oscar/result_templates/videos.html+6−6
@@ -1,10 +1,10 @@
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
1{% from 'oscar/macros.html' import result_header, result_sub_header, result_footer, result_footer_rtl, icon %}
2
2
3−{{ result_header(result, favicons) }}
3+{{ result_header(result, favicons, loop.index) }}
4−{{ result_sub_header(result) }}
4+{{ result_sub_header(result, loop.index) }}
5
5
6{% if result.embedded %}
6{% if result.embedded %}
7− <small> &bull; <a class="text-info btn-collapse collapsed cursor-pointer media-loader disabled_if_nojs" data-toggle="collapse" data-target="#result-video-{{ index }}" data-btn-text-collapsed="{{ _('show video') }}" data-btn-text-not-collapsed="{{ _('hide video') }}">{{ icon('film') }} {{ _('show video') }}</a></small>
7+ <small> &bull; <a class="text-info btn-collapse collapsed cursor-pointer media-loader disabled_if_nojs" data-toggle="collapse" data-target="#result-video-{{ index }}" data-btn-text-collapsed="{{ _('show video') }}" data-btn-text-not-collapsed="{{ _('hide video') }}" aria-labelledby="result-{{loop.index}}">{{ icon('film') }} {{ _('show video') }}</a></small>
8{% endif %}
8{% endif %}
9
9
10{% if result.embedded %}
10{% if result.embedded %}
@@ -15,7 +15,7 @@
15
15
16<div class="container-fluid">
16<div class="container-fluid">
17 <div class="row">
17 <div class="row">
18− <a href="{{ result.url }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}><img class="thumbnail col-xs-6 col-sm-4 col-md-4 result-content" src="{{ image_proxify(result.thumbnail) }}" /></a>
18+ <a href="{{ result.url }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}><img class="thumbnail col-xs-6 col-sm-4 col-md-4 result-content" src="{{ image_proxify(result.thumbnail) }}" aria-labelledby="result-{{loop.index}}" /></a>
19 {% if result.author %}<p class="col-xs-12 col-sm-8 col-md-8 result-content"><b>{{ _('Author') }}</b>: {{ result.author }}</p>{% endif %}
19 {% if result.author %}<p class="col-xs-12 col-sm-8 col-md-8 result-content"><b>{{ _('Author') }}</b>: {{ result.author }}</p>{% endif %}
20 {% if result.length %}<p class="col-xs-12 col-sm-8 col-md-8 result-content"><b>{{ _('Length') }}</b>: {{ result.length }}</p>{% endif %}
20 {% if result.length %}<p class="col-xs-12 col-sm-8 col-md-8 result-content"><b>{{ _('Length') }}</b>: {{ result.length }}</p>{% endif %}
21 {% if result.content %}<p class="col-xs-12 col-sm-8 col-md-8 result-content">{{ result.content|safe }}</p>{% endif %}
21 {% if result.content %}<p class="col-xs-12 col-sm-8 col-md-8 result-content">{{ result.content|safe }}</p>{% endif %}
@@ -23,7 +23,7 @@
23</div>
23</div>
24
24
25{% if rtl %}
25{% if rtl %}
26−{{ result_footer_rtl(result) }}
26+{{ result_footer_rtl(result, loop.index) }}
27{% else %}
27{% else %}
28−{{ result_footer(result) }}
28+{{ result_footer(result, loop.index) }}
29{% endif %}
29{% endif %}