L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-35925 - File picker - Adding aria attributes to assist in accessibility

Browse Source
This commit is contained in:
Jason Fowler
2013-08-20 14:19:06 +08:00
parent 661777c503
commit 59d18ddfa7
2 changed files with 12 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
files/renderer.php
+5 -5
View File
@@ -201,9 +201,9 @@ class core_files_renderer extends plugin_renderer_base {
<div class="fp-navbar">
<div class="filemanager-toolbar">
<div class="fp-toolbar">
<div class="{!}fp-btn-add"><a href="#"><img src="'.$this->pix_url('a/add_file').'" /> '.$straddfile.'</a></div>
<div class="{!}fp-btn-mkdir"><a href="#"><img src="'.$this->pix_url('a/create_folder').'" /> '.$strmakedir.'</a></div>
<div class="{!}fp-btn-download"><a href="#"><img src="'.$this->pix_url('a/download_all').'" /> '.$strdownload.'</a></div>
<div class="{!}fp-btn-add"><a role="button" href="#"><img src="'.$this->pix_url('a/add_file').'" /> '.$straddfile.'</a></div>
<div class="{!}fp-btn-mkdir"><a role="button" href="#"><img src="'.$this->pix_url('a/create_folder').'" /> '.$strmakedir.'</a></div>
<div class="{!}fp-btn-download"><a role="button" href="#"><img src="'.$this->pix_url('a/download_all').'" /> '.$strdownload.'</a></div>
</div>
<div class="{!}fp-viewbar">
<a title="'. get_string('displayicons', 'repository') .'" class="{!}fp-vb-icons" href="#"></a>
@@ -521,10 +521,10 @@ class core_files_renderer extends plugin_renderer_base {
*/
private function fp_js_template_generallayout() {
$rv = '
<div class="file-picker fp-generallayout">
<div tabindex="0" class="file-picker fp-generallayout" role="dialog" aria-live="assertive">
<div class="fp-repo-area">
<ul class="fp-list">
<li class="{!}fp-repo"><a href="#"><img class="{!}fp-repo-icon" alt="'. get_string('repositoryicon', 'repository') .'" width="16" height="16" />&nbsp;<span class="{!}fp-repo-name"></span></a></li>
<li class="{!}fp-repo"><a href="#"><img class="{!}fp-repo-icon" alt=" " width="16" height="16" />&nbsp;<span class="{!}fp-repo-name"></span></a></li>
</ul>
</div>
<div class="fp-repo-items" tabindex="0">
repository/filepicker.js
+7 -2
View File
@@ -502,6 +502,7 @@ M.core_filepicker.show = function(Y, options) {
M.core_filepicker.init(Y, options);
}
M.core_filepicker.instances[options.client_id].show();
document.getElementById("filepicker-"+ options.client_id).focus();
};
M.core_filepicker.set_templates = function(Y, templates) {
@@ -1292,11 +1293,14 @@ M.core_filepicker.init = function(Y, options) {
},
render: function() {
var client_id = this.options.client_id;
var fpid = "filepicker-"+ client_id;
var labelid = 'fp-dialog-label_'+ client_id;
this.fpnode = Y.Node.createWithFilesSkin(M.core_filepicker.templates.generallayout).
set('id', 'filepicker-'+client_id);
set('id', fpid).set('aria-labelledby', labelid);
this.mainui = new Y.Panel({
srcNode : this.fpnode,
headerContent: M.str.repository.filepicker,
headerContent: '<span id="'+ labelid +'">'+ M.str.repository.filepicker +'</span>',
zIndex : 7500,
centered : true,
modal : true,
@@ -1307,6 +1311,7 @@ M.core_filepicker.init = function(Y, options) {
maxHeight : this.fpnode.getStylePx('maxHeight'),
render : true
});
// allow to move the panel dragging it by it's header:
this.mainui.plug(Y.Plugin.Drag,{handles:['#filepicker-'+client_id+' .yui3-widget-hd']});
this.mainui.show();