refactor(material): use static strings for aria roles

Closes #2542
This commit is contained in:
Pawel Kozlowski 2015-06-14 14:24:19 +02:00
parent da60381c89
commit 98fcf8c6ef
5 changed files with 7 additions and 28 deletions

View File

@ -10,7 +10,7 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
host: { host: {
'(keydown)': 'onKeydown($event)', '(keydown)': 'onKeydown($event)',
'[tabindex]': 'tabindex', '[tabindex]': 'tabindex',
'[attr.role]': 'role', '[attr.role]': '"checkbox"',
'[attr.aria-checked]': 'checked', '[attr.aria-checked]': 'checked',
'[attr.aria-disabled]': 'disabled' '[attr.aria-disabled]': 'disabled'
} }
@ -23,14 +23,10 @@ export class MdCheckbox {
/** Whether this checkbox is disabled. */ /** Whether this checkbox is disabled. */
_disabled: boolean; _disabled: boolean;
/** Setter for `role` attribute. */
role: string;
/** Setter for tabindex */ /** Setter for tabindex */
tabindex: number; tabindex: number;
constructor(@Attribute('tabindex') tabindex: string) { constructor(@Attribute('tabindex') tabindex: string) {
this.role = 'checkbox';
this.checked = false; this.checked = false;
this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0; this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
this._disabled = false; this._disabled = false;

View File

@ -225,7 +225,7 @@ export class MdGridList {
'[style.left]': 'styleLeft', '[style.left]': 'styleLeft',
'[style.marginTop]': 'styleMarginTop', '[style.marginTop]': 'styleMarginTop',
'[style.paddingTop]': 'stylePaddingTop', '[style.paddingTop]': 'stylePaddingTop',
'[role]': 'role' '[role]': '"listitem"'
}, },
lifecycle: [onDestroy, onChange] lifecycle: [onDestroy, onChange]
}) })
@ -241,15 +241,12 @@ export class MdGridTile {
styleLeft: string; styleLeft: string;
styleMarginTop: string; styleMarginTop: string;
stylePaddingTop: string; stylePaddingTop: string;
role: string;
isRegisteredWithGridList: boolean; isRegisteredWithGridList: boolean;
constructor(@Parent() gridList: MdGridList) { constructor(@Parent() gridList: MdGridList) {
this.gridList = gridList; this.gridList = gridList;
this.role = 'listitem';
// Tiles default to 1x1, but rowspan and colspan can be changed via binding. // Tiles default to 1x1, but rowspan and colspan can be changed via binding.
this.rowspan = 1; this.rowspan = 1;
this.colspan = 1; this.colspan = 1;

View File

@ -8,9 +8,9 @@ import {Math} from 'angular2/src/facade/math';
lifecycle: [onChange], lifecycle: [onChange],
properties: ['value', 'bufferValue'], properties: ['value', 'bufferValue'],
host: { host: {
'[attr.role]': 'role', '[attr.role]': '"progressbar"',
'[attr.aria-valuemin]': 'ariaValuemin', '[attr.aria-valuemin]': '"0"',
'[attr.aria-valuemax]': 'ariaValuemax', '[attr.aria-valuemax]': '"100"',
'[attr.aria-valuenow]': 'value' '[attr.aria-valuenow]': 'value'
} }
}) })
@ -34,18 +34,10 @@ export class MdProgressLinear {
/** CSS `transform` property applied to the secondary bar. */ /** CSS `transform` property applied to the secondary bar. */
secondaryBarTransform: string; secondaryBarTransform: string;
role: string;
ariaValuemin: string;
ariaValuemax: string;
constructor(@Attribute('md-mode') mode: string) { constructor(@Attribute('md-mode') mode: string) {
this.primaryBarTransform = ''; this.primaryBarTransform = '';
this.secondaryBarTransform = ''; this.secondaryBarTransform = '';
this.role = 'progressbar';
this.ariaValuemin = '0';
this.ariaValuemax = '100';
this.mode = isPresent(mode) ? mode : Mode.DETERMINATE; this.mode = isPresent(mode) ? mode : Mode.DETERMINATE;
} }

View File

@ -31,7 +31,7 @@ var _uniqueIdCounter: number = 0;
// TODO(jelbourn): Remove ^ when event retargeting is fixed. // TODO(jelbourn): Remove ^ when event retargeting is fixed.
'(^keydown)': 'onKeydown($event)', '(^keydown)': 'onKeydown($event)',
'[tabindex]': 'tabindex', '[tabindex]': 'tabindex',
'[attr.role]': 'role', '[attr.role]': '"radiogroup"',
'[attr.aria-disabled]': 'disabled', '[attr.aria-disabled]': 'disabled',
'[attr.aria-activedescendant]': 'activedescendant' '[attr.aria-activedescendant]': 'activedescendant'
} }
@ -61,8 +61,6 @@ export class MdRadioGroup {
tabindex: number; tabindex: number;
role: string;
constructor(@Attribute('tabindex') tabindex: string, @Attribute('disabled') disabled: string, constructor(@Attribute('tabindex') tabindex: string, @Attribute('disabled') disabled: string,
radioDispatcher: MdRadioDispatcher) { radioDispatcher: MdRadioDispatcher) {
this.name_ = `md-radio-group-${_uniqueIdCounter++}`; this.name_ = `md-radio-group-${_uniqueIdCounter++}`;
@ -72,8 +70,6 @@ export class MdRadioGroup {
this.selectedRadioId = ''; this.selectedRadioId = '';
this.disabled_ = false; this.disabled_ = false;
this.role = 'radiogroup';
// The simple presence of the `disabled` attribute dictates disabled state. // The simple presence of the `disabled` attribute dictates disabled state.
this.disabled = isPresent(disabled); this.disabled = isPresent(disabled);

View File

@ -13,7 +13,7 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
'(keydown)': 'onKeydown($event)', '(keydown)': 'onKeydown($event)',
'[attr.aria-checked]': 'checked', '[attr.aria-checked]': 'checked',
'[attr.aria-disabled]': 'disabled_', '[attr.aria-disabled]': 'disabled_',
'[attr.role]': 'role' '[attr.role]': '"checkbox"'
} }
}) })
@View({templateUrl: 'angular2_material/src/components/switcher/switch.html', directives: []}) @View({templateUrl: 'angular2_material/src/components/switcher/switch.html', directives: []})
@ -25,10 +25,8 @@ export class MdSwitch {
disabled_: boolean; disabled_: boolean;
tabindex: number; tabindex: number;
role: string;
constructor(@Attribute('tabindex') tabindex: string) { constructor(@Attribute('tabindex') tabindex: string) {
this.role = 'checkbox';
this.checked = false; this.checked = false;
this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0; this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
} }