aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/date
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/shared/date')
-rw-r--r--client/src/app/shared/date/date-toggle.component.html6
-rw-r--r--client/src/app/shared/date/date-toggle.component.scss5
-rw-r--r--client/src/app/shared/date/date-toggle.component.ts47
3 files changed, 58 insertions, 0 deletions
diff --git a/client/src/app/shared/date/date-toggle.component.html b/client/src/app/shared/date/date-toggle.component.html
new file mode 100644
index 000000000..ebd4ce442
--- /dev/null
+++ b/client/src/app/shared/date/date-toggle.component.html
@@ -0,0 +1,6 @@
1<span
2 class="date-toggle"
3 [title]="getTitle()"
4 [innerHtml]="getContent()"
5 (click)="toggle()"
6></span>
diff --git a/client/src/app/shared/date/date-toggle.component.scss b/client/src/app/shared/date/date-toggle.component.scss
new file mode 100644
index 000000000..86700d1d4
--- /dev/null
+++ b/client/src/app/shared/date/date-toggle.component.scss
@@ -0,0 +1,5 @@
1.date-toggle {
2 &:hover {
3 cursor: default
4 }
5}
diff --git a/client/src/app/shared/date/date-toggle.component.ts b/client/src/app/shared/date/date-toggle.component.ts
new file mode 100644
index 000000000..fa48da8e8
--- /dev/null
+++ b/client/src/app/shared/date/date-toggle.component.ts
@@ -0,0 +1,47 @@
1import { Component, Input, OnInit, OnChanges } from '@angular/core'
2import { DatePipe } from '@angular/common'
3import { 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 providers: [ DatePipe, FromNowPipe ]
10})
11export class DateToggleComponent implements OnInit, OnChanges {
12 @Input() date: Date
13 @Input() toggled = false
14
15 dateRelative: string
16 dateAbsolute: string
17
18 constructor (
19 private datePipe: DatePipe,
20 private fromNowPipe: FromNowPipe
21 ) { }
22
23 ngOnInit () {
24 this.updateDates()
25 }
26
27 ngOnChanges () {
28 this.updateDates()
29 }
30
31 toggle () {
32 this.toggled = !this.toggled
33 }
34
35 getTitle () {
36 return this.toggled ? this.dateRelative : this.dateAbsolute
37 }
38
39 getContent () {
40 return this.toggled ? this.dateAbsolute : this.dateRelative
41 }
42
43 private updateDates () {
44 this.dateRelative = this.fromNowPipe.transform(this.date)
45 this.dateAbsolute = this.datePipe.transform(this.date, 'long')
46 }
47}