Mercurial > hg > ugly-duckling
annotate src/app/progress-spinner/progress-spinner.component.ts @ 509:041468f553e1 tip master
Merge pull request #57 from LucasThompson/fix/session-stack-max-call-stack
Fix accidental recursion in PersistentStack
author | Lucas Thompson <LucasThompson@users.noreply.github.com> |
---|---|
date | Mon, 27 Nov 2017 11:04:30 +0000 |
parents | cf4a17efb5d4 |
children |
rev | line source |
---|---|
dev@115 | 1 /** |
dev@115 | 2 * Created by lucast on 14/03/2017. |
dev@115 | 3 */ |
dev@115 | 4 |
dev@115 | 5 |
dev@236 | 6 import {Component, Input} from '@angular/core'; |
dev@115 | 7 @Component({ |
dev@115 | 8 selector: 'ugly-progress-spinner', |
dev@115 | 9 template: ` |
dev@115 | 10 <div class="container" [hidden]="!isVisible"> |
dev@505 | 11 <mat-spinner |
dev@115 | 12 class="spinner" |
dev@224 | 13 [attr.color]="'primary'" |
dev@224 | 14 [mode]="isDeterminate ? 'determinate' : 'indeterminate'" |
dev@224 | 15 [value]="currentProcess" |
dev@505 | 16 [diameter]="40" |
dev@505 | 17 [strokeWidth]="3" |
dev@505 | 18 ></mat-spinner> |
dev@115 | 19 </div> |
dev@115 | 20 `, |
dev@115 | 21 styles: [` |
dev@115 | 22 .container { |
dev@505 | 23 height: 50px; |
dev@505 | 24 width: 50px; |
dev@115 | 25 position: absolute; |
dev@505 | 26 left: calc(50% - 25px); |
dev@115 | 27 } |
dev@224 | 28 |
dev@115 | 29 .spinner { |
dev@115 | 30 width: 100%; |
dev@115 | 31 height: 100%; |
dev@115 | 32 } |
dev@115 | 33 `] |
dev@115 | 34 }) |
dev@115 | 35 export class ProgressSpinnerComponent { |
dev@236 | 36 private currentProcess = 0; |
dev@224 | 37 |
dev@236 | 38 @Input() isVisible = true; |
dev@236 | 39 @Input() isDeterminate = false; |
dev@224 | 40 @Input() |
dev@224 | 41 set progress(value: number) { |
dev@224 | 42 if (value < 0) { |
dev@224 | 43 this.currentProcess = 0; |
dev@224 | 44 } else if (value > 100) { |
dev@224 | 45 this.currentProcess = 100; |
dev@224 | 46 } else { |
dev@224 | 47 this.currentProcess = value; |
dev@224 | 48 } |
dev@224 | 49 } |
dev@115 | 50 } |