r847 - in trunk: tests ui
Author: david.bolter
Date: Wed Oct 29 09:57:04 2008
New Revision: 847
Modified:
trunk/tests/progressbar.js
trunk/ui/ui.progressbar.js
Log:
added ARIA semantics, and tests.
patch review:scott.gonzalez@gmail.com
(fixes bug #3482)
Modified: trunk/tests/progressbar.js
==============================================================================
--- trunk/tests/progressbar.js (original)
+++ trunk/tests/progressbar.js Wed Oct 29 09:57:04 2008
@@ -52,5 +52,20 @@
});
+test("accessibility", function() {
+ expect(7);
+ el = $("#progressbar").progressbar();
+
+ equals(el.ariaRole(), "progressbar", "aria role");
+ equals(el.ariaState("valuemin"), 0, "aria-valuemin");
+ equals(el.ariaState("valuemax"), 100, "aria-valuemax");
+ equals(el.ariaState("valuenow"), 0, "aria-valuenow initially");
+ el.progressbar("progress", 77);
+ equals(el.ariaState("valuenow"), 77, "aria-valuenow");
+ el.progressbar("disable");
+ equals(el.ariaState("disabled"), "true", "aria-disabled");
+ el.progressbar("enable");
+ equals(el.ariaState("disabled"), "false", "enabled");
+});
})(jQuery);
Modified: trunk/ui/ui.progressbar.js
==============================================================================
--- trunk/ui/ui.progressbar.js (original)
+++ trunk/ui/ui.progressbar.js Wed Oct 29 09:57:04 2008
@@ -22,8 +22,14 @@
id = ((new Date()).getTime() + Math.random()),
text = options.text || '0%';
- this.element.addClass("ui-progressbar").width(options.width);
-
+ this.element
+ .addClass("ui-progressbar")
+ .width(options.width)
+ .ariaRole("progressbar")
+ .ariaState("valuemin","0")
+ .ariaState("valuemax","100")
+ .ariaState("valuenow","0");
+
$.extend(this, {
active: false,
pixelState: 0,
@@ -97,11 +103,13 @@
disable: function() {
this.element.addClass("ui-progressbar-disabled");
this.disabled = true;
+ this.element.ariaState("disabled", true);
},
enable: function() {
this.element.removeClass("ui-progressbar-disabled");
this.disabled = false;
+ this.element.ariaState("disabled", false);
},
pause: function() {
@@ -120,9 +128,11 @@
this.bar.width(this.pixelState);
this.textElement.width(this.pixelState);
+ var percent = Math.round(this.percentState);
if (this.options.range && !this.options.text) {
- this.textElement.html(Math.round(this.percentState) + '%');
+ this.textElement.html(percent + '%');
}
+ this.element.ariaState("valuenow", percent);
this._propagate('progress', this.ui());
},