From 67ed6552b831df66713bac9e672738796128d33f Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Tue, 23 Jun 2020 14:10:17 +0200 Subject: Reorganize client shared modules --- .../shared-main/date/date-toggle.component.html | 6 +++ .../shared-main/date/date-toggle.component.scss | 5 +++ .../shared-main/date/date-toggle.component.ts | 46 ++++++++++++++++++++++ client/src/app/shared/shared-main/date/index.ts | 1 + 4 files changed, 58 insertions(+) create mode 100644 client/src/app/shared/shared-main/date/date-toggle.component.html create mode 100644 client/src/app/shared/shared-main/date/date-toggle.component.scss create mode 100644 client/src/app/shared/shared-main/date/date-toggle.component.ts create mode 100644 client/src/app/shared/shared-main/date/index.ts (limited to 'client/src/app/shared/shared-main/date') diff --git a/client/src/app/shared/shared-main/date/date-toggle.component.html b/client/src/app/shared/shared-main/date/date-toggle.component.html new file mode 100644 index 000000000..ebd4ce442 --- /dev/null +++ b/client/src/app/shared/shared-main/date/date-toggle.component.html @@ -0,0 +1,6 @@ + diff --git a/client/src/app/shared/shared-main/date/date-toggle.component.scss b/client/src/app/shared/shared-main/date/date-toggle.component.scss new file mode 100644 index 000000000..86700d1d4 --- /dev/null +++ b/client/src/app/shared/shared-main/date/date-toggle.component.scss @@ -0,0 +1,5 @@ +.date-toggle { + &:hover { + cursor: default + } +} diff --git a/client/src/app/shared/shared-main/date/date-toggle.component.ts b/client/src/app/shared/shared-main/date/date-toggle.component.ts new file mode 100644 index 000000000..bedf0ba4e --- /dev/null +++ b/client/src/app/shared/shared-main/date/date-toggle.component.ts @@ -0,0 +1,46 @@ +import { DatePipe } from '@angular/common' +import { Component, Input, OnChanges, OnInit } from '@angular/core' +import { FromNowPipe } from '../angular/from-now.pipe' + +@Component({ + selector: 'my-date-toggle', + templateUrl: './date-toggle.component.html', + styleUrls: [ './date-toggle.component.scss' ] +}) +export class DateToggleComponent implements OnInit, OnChanges { + @Input() date: Date + @Input() toggled = false + + dateRelative: string + dateAbsolute: string + + constructor ( + private datePipe: DatePipe, + private fromNowPipe: FromNowPipe + ) { } + + ngOnInit () { + this.updateDates() + } + + ngOnChanges () { + this.updateDates() + } + + toggle () { + this.toggled = !this.toggled + } + + getTitle () { + return this.toggled ? this.dateRelative : this.dateAbsolute + } + + getContent () { + return this.toggled ? this.dateAbsolute : this.dateRelative + } + + private updateDates () { + this.dateRelative = this.fromNowPipe.transform(this.date) + this.dateAbsolute = this.datePipe.transform(this.date, 'long') + } +} diff --git a/client/src/app/shared/shared-main/date/index.ts b/client/src/app/shared/shared-main/date/index.ts new file mode 100644 index 000000000..db00aef52 --- /dev/null +++ b/client/src/app/shared/shared-main/date/index.ts @@ -0,0 +1 @@ +export * from './date-toggle.component' -- cgit v1.2.3