OLD | NEW |
| (Empty) |
1 | |
2 Polymer('paper-spinner',{ | |
3 eventDelegates: { | |
4 'animationend': 'reset', | |
5 'webkitAnimationEnd': 'reset' | |
6 }, | |
7 publish: { | |
8 /** | |
9 * Displays the spinner. | |
10 * | |
11 * @attribute active | |
12 * @type boolean | |
13 * @default false | |
14 */ | |
15 active: {value: false, reflect: true}, | |
16 | |
17 /** | |
18 * Alternative text content for accessibility support. | |
19 * If alt is present, it will add an aria-label whose content matches al
t when active. | |
20 * If alt is not present, it will default to 'loading' as the alt value. | |
21 * @attribute alt | |
22 * @type string | |
23 * @default 'loading' | |
24 */ | |
25 alt: {value: 'loading', reflect: true} | |
26 }, | |
27 | |
28 ready: function() { | |
29 // Allow user-provided `aria-label` take preference to any other text al
ternative. | |
30 if (this.hasAttribute('aria-label')) { | |
31 this.alt = this.getAttribute('aria-label'); | |
32 } else { | |
33 this.setAttribute('aria-label', this.alt); | |
34 } | |
35 if (!this.active) { | |
36 this.setAttribute('aria-hidden', 'true'); | |
37 } | |
38 }, | |
39 | |
40 activeChanged: function() { | |
41 if (this.active) { | |
42 this.$.spinnerContainer.classList.remove('cooldown'); | |
43 this.$.spinnerContainer.classList.add('active'); | |
44 this.removeAttribute('aria-hidden'); | |
45 } else { | |
46 this.$.spinnerContainer.classList.add('cooldown'); | |
47 this.setAttribute('aria-hidden', 'true'); | |
48 } | |
49 }, | |
50 | |
51 altChanged: function() { | |
52 if (this.alt === '') { | |
53 this.setAttribute('aria-hidden', 'true'); | |
54 } else { | |
55 this.removeAttribute('aria-hidden'); | |
56 } | |
57 this.setAttribute('aria-label', this.alt); | |
58 }, | |
59 | |
60 reset: function() { | |
61 this.$.spinnerContainer.classList.remove('active', 'cooldown'); | |
62 } | |
63 }); | |
64 | |
OLD | NEW |