| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | // #docregion
 | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  | import {Component, OnInit, OnDestroy} from 'angular2/core'; | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | @Component({ | 
					
						
							|  |  |  |   selector:'countdown-timer', | 
					
						
							|  |  |  |   template: '<p>{{message}}</p>' | 
					
						
							|  |  |  | }) | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  | export class CountdownTimerComponent implements OnInit, OnDestroy { | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  |   intervalId = 0; | 
					
						
							|  |  |  |   message = ''; | 
					
						
							|  |  |  |   seconds = 11; | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  |   clearTimer() {clearInterval(this.intervalId);} | 
					
						
							| 
									
										
										
										
											2016-03-07 11:50:14 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  |   ngOnInit()    { this.start(); } | 
					
						
							|  |  |  |   ngOnDestroy() { this.clearTimer(); } | 
					
						
							| 
									
										
										
										
											2016-03-07 11:50:14 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  |   start() { this._countDown(); } | 
					
						
							|  |  |  |   stop()  { | 
					
						
							|  |  |  |     this.clearTimer(); | 
					
						
							|  |  |  |     this.message = `Holding at T-${this.seconds} seconds`; | 
					
						
							|  |  |  |   } | 
					
						
							| 
									
										
										
										
											2016-03-07 11:50:14 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  |   private _countDown() { | 
					
						
							| 
									
										
										
										
											2016-02-22 02:40:57 -08:00
										 |  |  |     this.clearTimer(); | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  |     this.intervalId = setInterval(()=>{ | 
					
						
							|  |  |  |       this.seconds -= 1; | 
					
						
							|  |  |  |       if (this.seconds == 0) { | 
					
						
							|  |  |  |         this.message = "Blast off!"; | 
					
						
							|  |  |  |       } else { | 
					
						
							| 
									
										
										
										
											2016-03-07 11:50:14 -08:00
										 |  |  |         if (this.seconds < 0) { this.seconds = 10;} // reset
 | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  |         this.message = `T-${this.seconds} seconds and counting`; | 
					
						
							|  |  |  |       } | 
					
						
							|  |  |  |     }, 1000); | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } |