Chromium Code Reviews| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <link rel="import" href="polymer/polymer/polymer.html"> | |
| 2 <link rel="import" href="polymer/paper-progress/paper-progress.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. | |
|
Nikita (slow)
2014/10/14 13:27:12
nit: Please file a tracking bug for that.
dzhioev (left Google)
2014/10/15 14:07:42
Done, http://crbug.com/423363
| |
| 17 | |
| 18 --> | |
| 19 <polymer-element name="indeterminate-progress" | |
| 20 attributes="backgroundColor rate runnerColor runnerPortion"> | |
| 21 <template> | |
| 22 <style> | |
| 23 :host { | |
| 24 display: block; | |
| 25 height: 4px; | |
| 26 } | |
| 27 | |
| 28 paper-progress { | |
| 29 display: block; | |
| 30 width: 100%; | |
| 31 height: 100%; | |
| 32 } | |
| 33 | |
| 34 paper-progress::shadow #secondaryProgress { | |
| 35 background-color: {{runnerColor}}; | |
| 36 } | |
| 37 | |
| 38 paper-progress::shadow #activeProgress, | |
| 39 paper-progress::shadow #progressContainer { | |
| 40 background-color: {{backgroundColor}}; | |
| 41 } | |
| 42 </style> | |
| 43 | |
| 44 <paper-progress id="progress" value="{{primaryProgress}}" | |
| 45 secondaryProgress="{{secondaryProgress}}"></paper-progress> | |
| 46 </template> | |
| 47 </polymer-element> | |
| OLD | NEW |