]>
Commit | Line | Data |
---|---|---|
1 | import { DatePipe } from '@angular/common' | |
2 | import { Component, Input, OnChanges, OnInit } from '@angular/core' | |
3 | import { FromNowPipe } from '../angular/from-now.pipe' | |
4 | ||
5 | @Component({ | |
6 | selector: 'my-date-toggle', | |
7 | templateUrl: './date-toggle.component.html', | |
8 | styleUrls: [ './date-toggle.component.scss' ] | |
9 | }) | |
10 | export class DateToggleComponent implements OnInit, OnChanges { | |
11 | @Input() date: Date | |
12 | @Input() toggled = false | |
13 | ||
14 | dateRelative: string | |
15 | dateAbsolute: string | |
16 | ||
17 | constructor ( | |
18 | private datePipe: DatePipe, | |
19 | private fromNowPipe: FromNowPipe | |
20 | ) { } | |
21 | ||
22 | ngOnInit () { | |
23 | this.updateDates() | |
24 | } | |
25 | ||
26 | ngOnChanges () { | |
27 | this.updateDates() | |
28 | } | |
29 | ||
30 | toggle () { | |
31 | this.toggled = !this.toggled | |
32 | } | |
33 | ||
34 | getTitle () { | |
35 | return this.toggled ? this.dateRelative : this.dateAbsolute | |
36 | } | |
37 | ||
38 | getContent () { | |
39 | return this.toggled ? this.dateAbsolute : this.dateRelative | |
40 | } | |
41 | ||
42 | private updateDates () { | |
43 | this.dateRelative = this.fromNowPipe.transform(this.date) | |
44 | this.dateAbsolute = this.datePipe.transform(this.date, 'long') | |
45 | } | |
46 | } |