Commit efa21b22 authored by Emma's avatar Emma 🦉

fix vote loading spinner

parent a58677f0
Pipeline #55321273 passed with stage
in 1 minute
......@@ -3,8 +3,6 @@
import $ from 'jquery';
import translator from 'bazinga-translator';
const LOADING_HTML = '<span class="icon icon--spin"><svg><use xlink:href="#spinner"/></svg></span>';
/**
* Get the current vote selection (-1: downvoted, 0: not voted on, 1: upvoted).
*
......@@ -80,7 +78,7 @@ function vote($form, isUp) {
};
$form.removeClass('vote--failed');
$form.find('.vote__net-score').html(LOADING_HTML);
$form.find('.vote__net-score').html($form.data('load-prototype'));
$.post(url, data).done(() => {
const newScore = getNewScore($form, isUp, $form.data('score'));
......
{% macro icon(name, alt_text = '') %}
{% macro icon(name, alt_text = '', extra_classes='') %}
{#- prevent preloading sprite sheet more than once -#}
{%- set icon_asset = asset('build/images/icons.svg') -%}
{%- if not app.request.attributes.get('icons_are_linked') -%}
......@@ -7,7 +7,7 @@
{%- do app.request.attributes.set('icons_are_linked', true) -%}
{%- filter spaceless -%}
<span class="icon {{ alt_text ? 'icon--with-alt-text' }}">
<span class="icon {{ alt_text ? 'icon--with-alt-text' }} {{ extra_classes }}">
{%- if alt_text is not empty -%}
{#- Attempt to display an empty SVG. If this fails, the alt text will
display. We assume that no support for SVG via <img> = no inline SVG
......
......@@ -20,7 +20,8 @@
{{- user_choice == upvoted ? ' vote--user-upvoted' }}
{{- user_choice == downvoted ? ' vote--user-downvoted' }}"
data-ajax-action="{{ path(route, {id: entity.id, _format: 'json'}) }}"
data-score="{{ entity.netScore }}">
data-score="{{ entity.netScore }}"
data-load-prototype="{{ icon('spinner', 'loading', 'icon--spin')|e }}">
{# csrf_token starts a session #}
{% if is_granted('ROLE_USER') %}
......@@ -30,7 +31,7 @@
<button type="submit" name="choice" value="{{ user_choice == upvoted ? retract : upvote }}"
class="vote__button vote__up"
title="{{ (user_choice == upvoted ? 'action.retract_upvote' : 'action.upvote')|trans }}">
<span class="inner" aria-hidden="true">{{ icon('up', 'up') }}</span>
<span aria-hidden="true">{{ icon('up', 'up') }}</span>
</button>
<span class="vote__net-score">{{ entity.netScore }}</span>
......@@ -38,7 +39,7 @@
<button type="submit" name="choice" value="{{ user_choice == downvoted ? retract : downvote }}"
class="vote__button vote__down"
title="{{ (user_choice == downvoted ? 'action.retract_downvote' : 'action.downvote')|trans }}">
<span class="inner" aria-hidden="true">{{ icon('down', 'down') }}</span>
<span aria-hidden="true">{{ icon('down', 'down') }}</span>
</button>
</form>
{%- endfilter -%}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment