treat flag_question as a checkbox role and toggle aria-checked when clicked

fixes CNVS-6632

test plan
- use screenreader to check/uncheck the flag question icon on a quiz question

Change-Id: I5ce10b44d1381d8b7ab188e13a9248dd35b732e2
Reviewed-on: https://gerrit.instructure.com/24888
Tested-by: Jenkins <jenkins@instructure.com>
Reviewed-by: Josh Simpson <jsimpson@instructure.com>
QA-Review: Myller de Araujo <myller@instructure.com>
Product-Review: Derek DeVries <ddevries@instructure.com>
This commit is contained in:
Derek DeVries 2013-10-01 17:17:54 -06:00
parent 781b174ebd
commit a7f1c4736c
2 changed files with 6 additions and 2 deletions

View File

@ -27,10 +27,13 @@
<div class="question_holder <%= "group" if in_group %>" id="<%= "question_template" unless question %>" style="<%= hidden unless question %>">
<div style="display: block; height: 1px; overflow: hidden;">&nbsp;</div>
<a name="question_<%= hash_get(question, :id, "blank") %>"></a>
<div class="display_question question <%= question_type.question_type %> <%= "marked" if assessing && @stored_params && @stored_params["question_#{hash_get(question, :id)}_marked"].present? %> <%= "correct" if correct %> <%= "incorrect" if incorrect %> <%= "unanswered" if unanswered %> <%= "partial_credit" if partial_credit %>" id="question_<%= hash_get(question, :id, "new") %>">
<% marked = assessing && @stored_params && @stored_params["question_#{hash_get(question, :id)}_marked"].present? %>
<div class="display_question question <%= question_type.question_type %> <%= "marked" if marked %> <%= "correct" if correct %> <%= "incorrect" if incorrect %> <%= "unanswered" if unanswered %> <%= "partial_credit" if partial_credit %>" id="question_<%= hash_get(question, :id, "new") %>">
<div class="move"><%= image_tag "move.png", :class => "move_icon" %></div>
<% if assessing && @quiz_presenter.can_go_back? %>
<div class="flag_question"></div>
<div class="flag_question" role="checkbox" aria-checked="<%= marked ? "true" : "false" %>">
<span class="screenreader-only"><%= t(:flag_this_question, "Flag this Question") %></span>
</div>
<% end %>
<div class="header" <%= hidden(true) if (assessing || assessment_results) && question_type && question_type.entry_type == "none" %>>
<span class="name question_name" tabindex="0" role="heading"><%= hash_get(question, :question_name) %></span>

View File

@ -464,6 +464,7 @@ define([
.delegate(".flag_question", 'click', function() {
var $question = $(this).parents(".question");
$question.toggleClass('marked');
$(this).attr("aria-checked", $question.hasClass('marked'));
$("#list_" + $question.attr('id')).toggleClass('marked');
quizSubmission.updateSubmission();
})