1 // Copyright 2014 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
5 Polymer('viewer-progress-bar', {
11 this.numSegmentsChanged();
13 progressChanged: function() {
14 var numVisible
= this.progress
* this.segments
.length
/ 100.0;
15 for (var i
= 0; i
< this.segments
.length
; i
++) {
16 this.segments
[i
].style
.visibility
=
17 i
< numVisible
? 'visible' : 'hidden';
20 if (this.progress
>= 100 || this.progress
< 0)
21 this.style
.opacity
= 0;
23 numSegmentsChanged: function() {
24 // Clear the existing segments.
26 var segmentsElement
= this.$.segments
;
27 segmentsElement
.innerHTML
= '';
29 // Create the new segments.
30 var segment
= document
.createElement('li');
31 segment
.classList
.add('segment');
32 var angle
= 360 / this.numSegments
;
33 for (var i
= 0; i
< this.numSegments
; ++i
) {
34 var segmentCopy
= segment
.cloneNode(true);
35 segmentCopy
.style
.webkitTransform
=
36 'rotate(' + (i
* angle
) + 'deg) skewY(' +
37 -1 * (90 - angle
) + 'deg)';
38 segmentsElement
.appendChild(segmentCopy
);
39 this.segments
.push(segmentCopy
);
41 this.progressChanged();