ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixes SR issues on Editing Quiz, quiz restrictions section 

Closes CNVS-19232

Test Plan:
  - Confirm that following three items have labels
    - Require Access Code text input box
    - Filter IP addresses text input box
    - Filter IP addresses filter button link (the magnifying glass)
  - Also confirm that VoiceOver can navigate to the
    input boxes after they appear for the access code and the
    ip address.
Change-Id: Ie0fa3104614b4088de48f562713a13120accb731
Reviewed-on: https://gerrit.instructure.com/50794
Tested-by: Jenkins
Reviewed-by: Ryan Taylor <rtaylor@instructure.com>
QA-Review: Nathan Rogowski <nathan@instructure.com>
Product-Review: Aaron Cannon <acannon@instructure.com>
This commit is contained in:
Clay Diffrient 2015-03-23 13:10:18 -06:00 committed by Ryan Taylor
parent 34032a2f9b
commit 0381100c13
2 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/views/quizzes/quizzes/new.html.erb
View File

@ -330,8 +330,8 @@
<%= t('labels.require_access_code', "Require an access code") %>
</label>
<div class="options control-group">
<input type="text" name="quiz[access_code]" id="quiz_access_code" value="<%= @quiz.access_code %>" placeholder="ex: Password85" />
<div class="options control-group screenreader-only">
<input type="text" tabindex="-1" aria-label="<%=t('quiz_access_code', "Required access code")%>" name="quiz[access_code]" id="quiz_access_code" value="<%= @quiz.access_code %>" placeholder="ex: Password85" />
</div>
</div>
<div class="option-group">
@ -339,9 +339,9 @@
<input type="checkbox" <%= 'checked' if !@quiz.ip_filter.blank? %> id="enable_quiz_ip_filter">
<%= t('labels.ip_filter', "Filter IP Addresses") %>
</label>
<div class="options control-group">
<input type="text" name="quiz[ip_filter]" id="quiz_ip_filter" value="<%= @quiz.ip_filter %>" maxlength="255" placeholder="ex: 192.168.217.1" />
<%= link_to(image_tag("find.png"), '#', :class => 'ip_filtering_link', :title => t('titles.find_ip_address_filter', 'Find IP Address Filter')) %>
<div class="options control-group screenreader-only" aria-hidden="<%= !@quiz.ip_filter.blank? %>">
<input type="text" tabindex="-1" aria-label="<%=t('labels.ip_addresses', "Filter by IP address")%>" name="quiz[ip_filter]" id="quiz_ip_filter" value="<%= @quiz.ip_filter %>" maxlength="255" placeholder="ex: 192.168.217.1" />
<%= link_to(image_tag("find.png"), '#', :class => 'ip_filtering_link', :title => t('titles.find_ip_address_filter', 'Find IP Address Filter'), 'aria-label' => t('titles.find_ip_address_filter', 'Find IP Address Filter'), :tabindex => -1) %>
</div>
</div>
<% if feature_enabled?(:lockdown_browser) && !@quiz.lockdown_browser_use_lti_tool? %>

21
public/javascripts/quizzes.js
View File

@ -1455,7 +1455,26 @@ define([
var $optionGroup = $checkbox.closest('.option-group');
var checked = $checkbox.prop('checked');
$optionGroup.find('> .options').toggle(checked);
// All of this magic here is so that VoiceOver will properly navigate to
// the inputs after they are shown.
var $foundOptions = $optionGroup.find('> .options');
if (checked) {
$foundOptions.removeClass('screenreader-only');
// We have to do this bit so keyboard only users aren't confused
// when their focus goes to something shown offscreen.
$foundOptions.find('[tabindex="-1"]').each(function (k,v) {
$(v).attr('tabindex', 0);
});
} else {
$foundOptions.addClass('screenreader-only');
// Same as above
$foundOptions.find('[tabindex="0"]').each(function (k,v) {
$(v).attr('tabindex', -1);
});
}
if (!checked) {
$optionGroup