added aria attributes to tree and show/hide functions

2 files changed, 19 insertions, 3 deletions

diff --git a/lib/scripts/behaviour.js b/lib/scripts/behaviour.js
index f1c46bf4c..85ddf503e 100644
--- a/lib/scripts/behaviour.js
+++ b/lib/scripts/behaviour.js
@@ -5,6 +5,7 @@
  * @author Adrian Lang <mail@adrianlang.de>
  */
 jQuery.fn.dw_hide = function(fn) {
+    this.attr('aria-expanded', 'false');
     return this.slideUp('fast', fn);
 };
 
@@ -15,6 +16,7 @@ jQuery.fn.dw_hide = function(fn) {
  * @author Adrian Lang <mail@adrianlang.de>
  */
 jQuery.fn.dw_show = function(fn) {
+    this.attr('aria-expanded', 'true');
     return this.slideDown('fast', fn);
 };
 
diff --git a/lib/scripts/tree.js b/lib/scripts/tree.js
index 96763053d..c4e1da3f7 100644
--- a/lib/scripts/tree.js
+++ b/lib/scripts/tree.js
@@ -14,6 +14,12 @@ jQuery.fn.dw_tree = function(overrides) {
         init: function () {
             this.$obj.delegate(this.toggle_selector, 'click', this,
                                this.toggle);
+            jQuery('ul:first', this.$obj).attr('role', 'tree');
+            jQuery('ul', this.$obj).not(':first').attr('role', 'group');
+            jQuery('li', this.$obj).attr('role', 'treeitem');
+            jQuery('li.open > ul', this.$obj).attr('aria-expanded', 'true');
+            jQuery('li.closed > ul', this.$obj).attr('aria-expanded', 'false');
+            jQuery('li.closed', this.$obj).attr('aria-live', 'assertive');
         },
 
         /**
@@ -35,8 +41,14 @@ jQuery.fn.dw_tree = function(overrides) {
             $listitem = $clicky.closest('li');
             $sublist = $listitem.find('ul').first();
             opening = $listitem.hasClass('closed');
-            $listitem.toggleClass('open closed');
             dw_tree.toggle_display($clicky, opening);
+            if ($sublist.is(':visible')) {
+                $listitem.removeClass('open').addClass('closed');
+                $sublist.attr('aria-expanded', 'false');
+            } else {
+                $listitem.removeClass('closed').addClass('open');
+                $sublist.attr('aria-expanded', 'true');
+            }
 
             // if already open, close by hiding the sublist
             if (!opening) {
@@ -48,6 +60,8 @@ jQuery.fn.dw_tree = function(overrides) {
                 $sublist.hide();
                 if (typeof data !== 'undefined') {
                     $sublist.html(data);
+                    $sublist.parent().attr('aria-busy', 'false').removeAttr('aria-live');
+                    jQuery('li.closed', $sublist).attr('aria-live', 'assertive');
                 }
                 if ($listitem.hasClass('open')) {
                     // Only show if user didn’t close the list since starting
@@ -63,11 +77,11 @@ jQuery.fn.dw_tree = function(overrides) {
             }
 
             //prepare the new ul
-            $sublist = jQuery('<ul class="idx"/>');
+            $sublist = jQuery('<ul class="idx" role="group"/>');
             $listitem.append($sublist);
 
             timeout = window.setTimeout(
-                bind(show_sublist, '<li><img src="' + DOKU_BASE + 'lib/images/throbber.gif" alt="loading..." title="loading..." /></li>'), dw_tree.throbber_delay);
+                bind(show_sublist, '<li aria-busy="true"><img src="' + DOKU_BASE + 'lib/images/throbber.gif" alt="loading..." title="loading..." /></li>'), dw_tree.throbber_delay);
 
             dw_tree.load_data(function (data) {
                                   window.clearTimeout(timeout);