0001-cells-more-items-accessibility-40883-40884.patch
combo/apps/wcs/templates/combo/wcs/forms_of_category.html | ||
---|---|---|
22 | 22 |
{% if form.description %}<div class="description">{{ form.description|safe }}</div>{% endif %} |
23 | 23 |
</li> |
24 | 24 |
{% endfor %} |
25 |
{% if more_forms %} |
|
26 |
<li class="add-more-items"> |
|
27 |
<a role="button" tabindex="0" aria-expanded="false" aria-controls="more-items-{{ cell.get_reference }}" aria-label="{% trans 'More items' %}" id="btn-more-items-{{ cell.get_reference }}" class="add-more-items--button">{% block cell-more-items-btn-label %}+{% endblock %}</a> |
|
28 |
</li> |
|
29 |
{% endif %} |
|
30 |
</ul> |
|
25 | 31 | |
26 | 32 |
{% if more_forms %} |
27 |
<li class="more-items"><a>+</a></li>
|
|
33 |
<ul style="display: none" class="more-items" id="more-items-{{ cell.get_reference }}" aria-labelledby="btn-wcs-more-items-{{ cell.get_reference }}">
|
|
28 | 34 |
{% for form in more_forms %} |
29 |
<li style="display: none" class="additional-form {{ form.css_classes|join:" " }}"
|
|
30 |
><a href="{{ form.url }}tryauth">{{ form.title }}</a>
|
|
35 |
<li class="more-items--item {{ form.css_classes|join:" " }}">
|
|
36 |
<a href="{{ form.url }}tryauth">{{ form.title }}</a> |
|
31 | 37 |
{% if form.description %}<div class="description">{{ form.description|safe }}</div>{% endif %} |
32 |
</li>
|
|
38 |
</li> |
|
33 | 39 |
{% endfor %} |
34 | 40 |
{% endif %} |
35 | ||
36 | 41 |
</ul> |
37 | 42 |
</div> |
38 | 43 |
{% endif %} |
combo/public/static/js/combo.public.js | ||
---|---|---|
96 | 96 |
}); |
97 | 97 |
} |
98 | 98 | |
99 |
$(document).on('click', '.more-items a', function() { |
|
100 |
$(this).parent().hide(); |
|
101 |
$(this).parent().nextAll().show(); |
|
99 |
$(document).on('click keypress', '.add-more-items--button', function(e) { |
|
100 |
if (e.type === 'keypress' && !(e.key === ' ' || e.key === 'Enter')) |
|
101 |
return; |
|
102 | ||
103 |
e.preventDefault(); |
|
104 |
$(this).attr('aria-expanded', 'true'); |
|
105 |
$(this).parent('.add-more-items').hide(); |
|
106 |
$('#' + $(this).attr('aria-controls')).show().focus(); |
|
102 | 107 |
}); |
103 | 108 | |
109 | ||
104 | 110 |
var menu_page_ids = $.makeArray($('[data-menu-page-id]').map(function() { return $(this).data('menu-page-id'); })); |
105 | 111 |
if (menu_page_ids.length && $('body').data('check-badges') === true) { |
106 | 112 |
$.ajax({url: $('body').data('api-root') + 'menu-badges/', |
combo/public/templates/combo/link-list-cell.html | ||
---|---|---|
1 |
{% load i18n %} |
|
1 | 2 |
{% block cell-content %} |
2 | 3 |
{% spaceless %} |
3 | 4 |
{% if title %}<h2>{{ title }}</h2>{% endif %} |
... | ... | |
7 | 8 |
{% for link in links %} |
8 | 9 |
<li class="{{ link.css_classes|default:""|join:" " }}"><a href="{{ link.url }}">{{ link.title }}</a></li> |
9 | 10 |
{% endfor %} |
11 |
{% if more_links %} |
|
12 |
<li class="add-more-items"> |
|
13 |
<a role="button" tabindex="0" aria-expanded="false" aria-controls="more-items-{{ cell.get_reference }}" aria-label="{% trans 'More items' %}" id="btn-more-items-{{ cell.get_reference }}" class="add-more-items--button">{% block cell-more-items-btn-label %}+{% endblock %}</a> |
|
14 |
</li> |
|
15 |
{% endif %} |
|
16 |
</ul> |
|
10 | 17 | |
11 | 18 |
{% if more_links %} |
12 |
<li class="more-items"><a>+</a></li>
|
|
19 |
<ul style="display: none" class="more-items" id="more-items-{{ cell.get_reference }}" aria-labelledby="btn-more-items-{{ cell.get_reference }}">
|
|
13 | 20 |
{% for link in more_links %} |
14 |
<li style="display: none" class="additional-links {{ link.css_classes|default:""|join:" " }}"><a href="{{ link.url }}">{{ link.title }}</a></li>
|
|
21 |
<li class="more-items--item {{ link.css_classes|default:""|join:" " }}"><a href="{{ link.url }}">{{ link.title }}</a></li>
|
|
15 | 22 |
{% endfor %} |
16 | 23 |
{% endif %} |
17 | 24 |
</ul> |
tests/test_cells.py | ||
---|---|---|
273 | 273 |
order=1, |
274 | 274 |
) |
275 | 275 |
ctx = {'page_cells': [item, item2]} |
276 |
assert '<li class="more-items"><a>+</a></li>' not in cell.render(ctx)
|
|
276 |
assert 'class="add-more-items--button">+</a>' not in cell.render(ctx)
|
|
277 | 277 |
cell.limit = 1 |
278 |
assert '<li class="more-items"><a>+</a></li>' in cell.render(ctx)
|
|
278 |
assert 'class="add-more-items--button">+</a>' in cell.render(ctx)
|
|
279 | 279 | |
280 | 280 | |
281 | 281 |
def test_link_list_cell_validity(): |
282 |
- |