Accessibility improvements (#3088)
This commit is contained in:
parent
9af610943e
commit
6d9d854e65
5 changed files with 49 additions and 34 deletions
|
@ -17,7 +17,8 @@ $labels['changed'] = 'Last Modified';
|
|||
$labels['title'] = 'Title';
|
||||
$labels['now'] = 'Now';
|
||||
$labels['sortby'] = 'Sort by';
|
||||
$labels['createlist'] = 'New Notebook';
|
||||
$labels['newnotebook'] = 'Create a new notebook';
|
||||
$labels['addnotebook'] = 'Add notebook';
|
||||
$labels['editlist'] = 'Edit Notebook';
|
||||
$labels['listname'] = 'Name';
|
||||
$labels['tabsharing'] = 'Sharing';
|
||||
|
@ -39,3 +40,9 @@ $labels['invalidlistproperties'] = 'Invalid notebook properties! Please set a va
|
|||
$labels['entertitle'] = 'Please enter a title for this note.';
|
||||
$labels['aclnorights'] = 'You do not have administrator rights for this notebook.';
|
||||
|
||||
$labels['arialabelnoteslist'] = 'List of notes';
|
||||
$labels['arialabelnotesearchform'] = 'Notes search form';
|
||||
$labels['arialabelnotesquicksearchbox'] = 'Notes search input';
|
||||
$labels['arialabelnotessortmenu'] = 'Notes list sorting options';
|
||||
$labels['arialabelnotesoptionsmenu'] = 'Notebook actions menu';
|
||||
$labels['arialabelnotebookform'] = 'Notebook properties';
|
||||
|
|
|
@ -135,7 +135,7 @@ function rcube_kolab_notes_ui(settings)
|
|||
// initialize notes list widget
|
||||
if (rcmail.gui_objects.noteslist) {
|
||||
noteslist = new rcube_list_widget(rcmail.gui_objects.noteslist,
|
||||
{ multiselect:true, draggable:true, keyboard:false });
|
||||
{ multiselect:true, draggable:true, keyboard:true });
|
||||
noteslist.addEventListener('select', function(list) {
|
||||
var selection_changed = list.selection.length != 1 || !me.selected_note || list.selection[0] != me.selected_note.id;
|
||||
selection_changed && warn_unsaved_changes(function(){
|
||||
|
@ -175,7 +175,7 @@ function rcube_kolab_notes_ui(settings)
|
|||
}
|
||||
folder_drop_target = null;
|
||||
})
|
||||
.init();
|
||||
.init().focus();
|
||||
}
|
||||
|
||||
if (settings.sort_col) {
|
||||
|
|
|
@ -49,7 +49,7 @@
|
|||
}
|
||||
|
||||
.notesview #quicksearchbar {
|
||||
top: 8px;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.notesview #searchmenulink {
|
||||
|
|
|
@ -42,8 +42,8 @@ $(document).ready(function(e){
|
|||
h = form.outerHeight();
|
||||
content.width(w).height(h);
|
||||
|
||||
$('#notecontent_tbl').width(w+'px').height('').css('margin-top', '-1px');
|
||||
$('#notecontent_ifr').width(w+'px').height((h-54)+'px');
|
||||
$('#noteform > div.mce-tinymce').width(w);
|
||||
$('#notecontent_ifr').width(w).height(h - 4 - $('div.mce-toolbar').height());
|
||||
}
|
||||
|
||||
$(window).resize(function(e){
|
||||
|
|
|
@ -9,17 +9,22 @@
|
|||
<roundcube:include file="/includes/header.html" />
|
||||
|
||||
<div id="mainscreen">
|
||||
<div id="notestoolbar" class="toolbar">
|
||||
<h1 class="voice"><roundcube:label name="kolab_notes.navtitle" /></h1>
|
||||
|
||||
<div id="notestoolbar" class="toolbar" role="toolbar" aria-labelledby="aria-label-toolbar">
|
||||
<h2 id="aria-label-toolbar" class="voice"><roundcube:label name="arialabeltoolbar" /></h2>
|
||||
<roundcube:button command="createnote" type="link" class="button createnote disabled" classAct="button createnote" classSel="button createnote pressed" label="kolab_notes.create" title="kolab_notes.createnote" />
|
||||
<roundcube:button command="print" type="link" class="button print disabled" classAct="button print" classSel="button print pressed" label="print" title="print" />
|
||||
<roundcube:button command="sendnote" type="link" class="button sendnote disabled" classAct="button sendnote" classSel="button sendnote pressed" label="kolab_notes.send" title="kolab_notes.sendnote" />
|
||||
<roundcube:container name="toolbar" id="notestoolbar" />
|
||||
</div>
|
||||
|
||||
<div id="quicksearchbar">
|
||||
<a id="searchmenulink" class="iconbutton searchoptions" > </a>
|
||||
<roundcube:object name="plugin.searchform" id="quicksearchbox" />
|
||||
<roundcube:button command="reset-search" id="searchreset" class="iconbutton reset" title="resetsearch" content=" " />
|
||||
</div>
|
||||
<div id="quicksearchbar" role="search" aria-labelledby="aria-label-searchform">
|
||||
<h2 id="aria-label-searchform" class="voice"><roundcube:label name="kolab_notes.arialabelnotesearchform" /></h2>
|
||||
<label for="quicksearchbox" class="voice"><roundcube:label name="kolab_notes.arialabelnotesquicksearchbox" /></label>
|
||||
<a id="searchmenulink" class="iconbutton searchoptions" > </a>
|
||||
<roundcube:object name="plugin.searchform" id="quicksearchbox" />
|
||||
<roundcube:button command="reset-search" id="searchreset" class="iconbutton reset" title="resetsearch" content=" " />
|
||||
</div>
|
||||
|
||||
<div id="mainscreencontent">
|
||||
|
@ -35,30 +40,31 @@
|
|||
<div id="notebooksbox" class="uibox listbox">
|
||||
<h2 class="boxtitle"><roundcube:label name="kolab_notes.lists" /></h2>
|
||||
<div class="scroller withfooter">
|
||||
<roundcube:object name="plugin.notebooks" id="notebooks" class="listing" />
|
||||
<roundcube:object name="plugin.notebooks" id="notebooks" class="listing" />
|
||||
</div>
|
||||
<div class="boxfooter">
|
||||
<roundcube:button command="list-create" type="link" title="kolab_notes.createlist" class="listbutton add disabled" classAct="listbutton add" innerClass="inner" content="+" /><roundcube:button name="notesoptionslink" id="notesoptionsmenulink" type="link" title="kolab_notes.listactions" class="listbutton groupactions" onclick="return UI.toggle_popup('notesoptionsmenu', event)" innerClass="inner" content="⚙" />
|
||||
<roundcube:button command="list-create" type="link" title="kolab_notes.newnotebook" class="listbutton add disabled" classAct="listbutton add" innerClass="inner" label="kolab_notes.addnotebook" /><roundcube:button name="notesoptionslink" id="notesoptionsmenulink" type="link" title="kolab_notes.listactions" class="listbutton groupactions" onclick="return UI.toggle_popup('notesoptionsmenu', event)" innerClass="inner" content="⚙" aria-haspopup="true" aria-expanded="false" aria-owns="notesoptionsmenu-menu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="mainview-right">
|
||||
<div id="noteslistbox" class="uibox listbox">
|
||||
<h2 class="boxtitle"><roundcube:label name="kolab_notes.notes" /></h2>
|
||||
<div class="scroller withfooter">
|
||||
<roundcube:object name="plugin.listing" id="kolabnoteslist" class="listing" />
|
||||
<h3 id="aria-label-noteslist" class="boxtitle"><roundcube:label name="kolab_notes.notes" /></h3>
|
||||
<div class="scroller withfooter" aria-labelledby="aria-label-noteslist">
|
||||
<roundcube:object name="plugin.listing" id="kolabnoteslist" class="listing" summary="kolab_notes.arialabelnoteslist" />
|
||||
</div>
|
||||
<div class="boxfooter">
|
||||
<roundcube:button command="delete" type="link" title="delete" class="listbutton delete disabled" classAct="listbutton delete" innerClass="inner" content="-" />
|
||||
<roundcube:button command="delete" type="link" title="delete" class="listbutton delete disabled" classAct="listbutton delete" innerClass="inner" label="delete" />
|
||||
<roundcube:object name="plugin.recordsCountDisplay" class="countdisplay" label="fromtoshort" />
|
||||
</div>
|
||||
<div class="boxpagenav">
|
||||
<roundcube:button name="notessortmenulink" id="notessortmenulink" type="link" title="kolab_notes.sortby" class="icon sortoptions" onclick="UI.show_popup('notessortmenu');return false" innerClass="inner" content="v" />
|
||||
<roundcube:button name="notessortmenulink" id="notessortmenulink" type="link" title="kolab_notes.sortby" class="icon sortoptions" onclick="return UI.toggle_popup('notessortmenu', event)" innerClass="inner" content="v" aria-haspopup="true" aria-expanded="false" aria-owns="notessortmenu-menu" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="notedetailsbox" class="uibox contentbox">
|
||||
<div id="notedetailsbox" class="uibox contentbox" role="complementary" aria-labelledby="aria-label-noteform">
|
||||
<h3 id="aria-label-noteform" class="voice"><roundcube:label name="kolab_notes.arialabelnoteform" /></h3>
|
||||
<roundcube:object name="plugin.notetitle" id="notedetailstitle" class="boxtitle" />
|
||||
<roundcube:object name="plugin.editform" id="noteform" />
|
||||
<roundcube:object name="plugin.detailview" id="notedetails" class="scroller" />
|
||||
|
@ -76,27 +82,29 @@
|
|||
|
||||
<roundcube:object name="message" id="messagestack" />
|
||||
|
||||
<div id="notesoptionsmenu" class="popupmenu">
|
||||
<ul class="toolbarmenu">
|
||||
<li><roundcube:button command="list-edit" label="edit" classAct="active" /></li>
|
||||
<li><roundcube:button command="list-remove" label="delete" classAct="active" /></li>
|
||||
<li><roundcube:button command="folders" task="settings" type="link" label="managefolders" classAct="active" /></li>
|
||||
<div id="notesoptionsmenu" class="popupmenu" aria-hidden="true">
|
||||
<h3 id="aria-label-optionsmenu" class="voice"><roundcube:label name="kolab_notes.arialabelnotesoptionsmenu" /></h3>
|
||||
<ul class="toolbarmenu" id="notesoptionsmenu-menu" role="menu" aria-labelledby="aria-label-optionsmenu">
|
||||
<li role="menuitem"><roundcube:button command="list-edit" label="edit" classAct="active" /></li>
|
||||
<li role="menuitem"><roundcube:button command="list-remove" label="delete" classAct="active" /></li>
|
||||
<li role="menuitem"><roundcube:button command="folders" task="settings" type="link" label="managefolders" classAct="active" /></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="notessortmenu" class="popupmenu">
|
||||
<ul class="toolbarmenu iconized">
|
||||
<li><roundcube:button command="list-sort" prop="changed" type="link" label="kolab_notes.changed" class="icon active by-changed" innerclass="icon" /></li>
|
||||
<li><roundcube:button command="list-sort" prop="title" type="link" label="kolab_notes.title" class="icon active by-title" innerclass="icon" /></li>
|
||||
<div id="notessortmenu" class="popupmenu" aria-hidden="true">
|
||||
<h3 id="aria-label-sortmenu" class="voice"><roundcube:label name="kolab_notes.arialabelnotessortmenu" /></h3>
|
||||
<ul class="toolbarmenu iconized" id="notessortmenu-menu" role="menu" aria-labelledby="aria-label-sortmenu">
|
||||
<li role="menuitem"><roundcube:button command="list-sort" prop="changed" type="link" label="kolab_notes.changed" class="icon active by-changed" innerclass="icon" /></li>
|
||||
<li role="menuitem"><roundcube:button command="list-sort" prop="title" type="link" label="kolab_notes.title" class="icon active by-title" innerclass="icon" /></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="notebookeditform" class="uidialog">
|
||||
<div id="notebookeditform" class="uidialog" aria-labelledby="aria-label-editform" aria-hidden="true" role="dialog">
|
||||
<h3 id="aria-label-editform" class="voice"><roundcube:label name="kolab_notes.arialabelnotebookform" /></h3>
|
||||
<roundcube:container name="notebookeditform" id="notebookeditform" />
|
||||
<roundcube:label name="loading" />
|
||||
</div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
// UI startup
|
||||
|
@ -136,8 +144,8 @@ $(document).ready(function(e){
|
|||
h = form.outerHeight();
|
||||
content.width(w).height(h);
|
||||
|
||||
$('#notecontent_tbl').width(w+'px').height('').css('margin-top', '-1px');
|
||||
$('#notecontent_ifr').width(w+'px').height((h-54)+'px');
|
||||
$('#noteform > div.mce-tinymce').width(w);
|
||||
$('#notecontent_ifr').width(w).height(h - 4 - $('div.mce-toolbar').height());
|
||||
}
|
||||
|
||||
$(window).resize(function(e){
|
||||
|
@ -148,4 +156,4 @@ $(document).ready(function(e){
|
|||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
Loading…
Add table
Reference in a new issue