Index: js/UIOptions.js =================================================================== --- js/UIOptions.js (revision 7196) +++ js/UIOptions.js (working copy) @@ -23,16 +23,38 @@ (function ($, fluid) { + var aria = function (elem, attri) { + elem.attr(attri); + }; + var initTextfieldSlider = function (that) { var textfield = that.locate("textfield"); textfield.val(that.model); - + var sliderOptions = that.options.sliderOptions; sliderOptions.value = that.model; sliderOptions.min = that.options.min; sliderOptions.max = that.options.max; - var slider = that.locate("slider").slider(sliderOptions); + + var slider = that.locate("slider").slider(sliderOptions); + + //finds thumb + var ariaThumb = that.locate("thumb"); + + //object containing default ARIA states + var ariaDefaults = {role: 'slider', + "aria-valuenow": sliderOptions.value, + "aria-valuemin": sliderOptions.min, + "aria-valuemax": sliderOptions.max + }; + + + //set defaults + aria(ariaThumb, ariaDefaults); + + + textfield.change(function () { if (that.isValid(this.value)) { if (!that.isInRange(this.value)) { @@ -94,11 +116,16 @@ * @param {Object} model * @param {Object} source */ + that.updateModel = function (model, source) { if (that.isInRange(model)) { that.events.modelChanged.fire(model, that.model, source); that.model = model; - } else { + var ariaThumb = that.locate("thumb"); + aria(ariaThumb, {'aria-valuenow': that.model}); + + } + else { // TODO: should do something here // Throw an error } @@ -110,7 +137,8 @@ fluid.defaults("fluid.textfieldSlider", { selectors: { textfield: ".flc-textfieldSlider-field", - slider: ".flc-textfieldSlider-slider" + slider: ".flc-textfieldSlider-slider", + thumb: ".ui-slider-handle" }, events: { modelChanged: null