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

add screen reader support to media record buttons 

fixes CNVS-6505

test plan:
  * enable kaltura;
  * in conversations, click the "Compose a new message"
    button and then, in the new message dialog, click the
    media record button;
  * using a screen reader, verify that the webcam and audio
    buttons in the record media tab read as, "record with
    webcam" and "record with microphone only" respectively.

Change-Id: If98ebb62efbc13d1b272d08ea51847ad6cbae27a
Reviewed-on: https://gerrit.instructure.com/24231
Tested-by: Jenkins <jenkins@instructure.com>
Reviewed-by: Braden Anderson <banderson@instructure.com>
QA-Review: Cam Theriault <cam@instructure.com>
Product-Review: Zach Pendleton <zachp@instructure.com>
This commit is contained in:
Zach Pendleton 2013-09-10 09:22:17 -06:00
parent d2ced40a02
commit 853f4d478a
2 changed files with 34 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/views/jst/conversations/composeButtonBar.handlebars
View File

@ -1,11 +1,23 @@
<div class='ui-dialog-buttonset attachments'>
<button class='ui-button ui-widget ui-state-default ui-corner-all attach-file' type="button"
role="button" aria-disabled="false" title="{{#t "titles.add_attachment"}}Add an attachment{{/t}}">
<span class="ui-button-text"><i class='icon-paperclip'></i></span>
<div class="ui-dialog-buttonset attachments">
<button class="ui-button ui-widget ui-state-default ui-corner-all attach-file"
type="button"
title="{{#t "titles.add_attachment"}}Add an attachment{{/t}}">
<span class="ui-button-text">
<i class="icon-paperclip"></i>
<span class="screenreader-only">
{{#t "titles.add_attachment"}}Add an attachment{{/t}}
</span>
</span>
</button>
<button class='ui-button ui-widget ui-state-default ui-corner-all attach-media' type="button"
role="button" aria-disabled="false" title="{{#t "titles.record_media_comment"}}Record an audio or video comment{{/t}}">
<span class="ui-button-text"><i class='icon-media'></i></span>
<button class="ui-button ui-widget ui-state-default ui-corner-all attach-media"
type="button"
title="{{#t "titles.record_media_comment"}}Record an audio or video comment{{/t}}">
<span class="ui-button-text">
<i class="icon-media"></i>
<span class="screenreader-only">
{{#t "titles.record_media_comment"}}Record an audio or video comment{{/t}}
</span>
</span>
</button>
</div>

26
public/partials/_media_comments.html
View File

@ -5,17 +5,17 @@
</ul>
<div id="record_media_tab" class="clearfix media_tab">
<div id="media_record_option_holder">
<a id="video_record_option" class="record_option tooltip" title="Record with Webcam">
<span class="tooltip_wrap" style="display: none;">
<span class="tooltip_text">Record with Webcam</span>
</span>
<span class="icon"><img src="/images/webcam.png" alt="webcam"/></span>
<a id="video_record_option"
class="record_option tooltip"
href="#"
title="Record with Webcam">
<img src="/images/webcam.png" alt="Record with Webcam" />
</a>
<a id="audio_record_option" class="record_option tooltip" title="Record with Microphone Only">
<span class="tooltip_wrap" style="display: none;">
<span class="tooltip_text">Record with Microphone Only</span>
</span>
<span class="icon"><img src="/images/microphone.png" alt="microphone"/></span>
<a id="audio_record_option"
class="record_option tooltip"
href="#"
title="Record with Microphone Only">
<img src="/images/microphone.png" alt="Record with Microphone Only" />
</a>
</div>
<div id="video_record_holder_holder">
@ -23,7 +23,11 @@
<div class="recorder_message">Saving Recording...</div>
</div>
<div style="margin-bottom: 1px; margin-left: 10px;">
Title: <input id="video_record_title" type="text" style="width: 250px;" maxlength="255"/>
<label for="video_record_title">Title:</label>
<input id="video_record_title"
type="text"
style="width: 250px;"
maxlength="255" />
</div>
<div id="video_record_holder">
<div id="video_record_meter" class="volume_meter">