OLD | NEW |
| (Empty) |
1 <link rel="import" href="chrome://resources/polymer/polymer/polymer.html"> | |
2 <link rel="import" href="chrome://resources/polymer/paper-progress/paper-progres
s.html"> | |
3 | |
4 <!-- | |
5 Progress bar for the cases when the length of the task is unknown. | |
6 Displays a cyclic animation without an indication of progress. | |
7 Published properties: | |
8 * backgroundColor | |
9 * rate - [1 - 10]. Sets the animation's rate. | |
10 * runnerColor | |
11 * runnerPortion - [1 - 100]. Portion of runner's width relative to progress | |
12 bar width (in percents). | |
13 | |
14 TODO(dzhioev): Polymer doesn't provide an indeterminate mode for | |
15 <paper-progress> for now, but it will soon. So this element should be replaced | |
16 with <paper-progress> when it'll have an indeterminate mode. | |
17 http://crbug.com/423363 | |
18 --> | |
19 | |
20 <polymer-element name="indeterminate-progress" | |
21 attributes="backgroundColor rate runnerColor runnerPortion"> | |
22 <template> | |
23 <style> | |
24 :host { | |
25 display: block; | |
26 height: 4px; | |
27 } | |
28 | |
29 paper-progress { | |
30 display: block; | |
31 width: 100%; | |
32 height: 100%; | |
33 } | |
34 | |
35 paper-progress::shadow #secondaryProgress { | |
36 background-color: {{runnerColor}}; | |
37 } | |
38 | |
39 paper-progress::shadow #activeProgress, | |
40 paper-progress::shadow #progressContainer { | |
41 background-color: {{backgroundColor}}; | |
42 } | |
43 </style> | |
44 | |
45 <paper-progress id="progress" value="{{primaryProgress}}" | |
46 secondaryProgress="{{secondaryProgress}}"></paper-progress> | |
47 </template> | |
48 </polymer-element> | |
OLD | NEW |