From 253a041d9514a196d4c1bdd3cc7fb4140bb1df1b Mon Sep 17 00:00:00 2001 From: Connor Lewis Date: Tue, 15 Aug 2017 19:15:15 -0400 Subject: [PATCH] Adds `amFromUtc` pipe (#163) * Parse input as UTC formatted date using moment.utc() --- .gitignore | 3 ++ README.md | 15 +++++++++ package.json | 4 +++ src/from-utc.pipe.spec.ts | 69 +++++++++++++++++++++++++++++++++++++++ src/from-utc.pipe.ts | 11 +++++++ src/index.ts | 1 + src/moment.module.ts | 2 ++ tsconfig.json | 2 ++ 8 files changed, 107 insertions(+) create mode 100644 src/from-utc.pipe.spec.ts create mode 100644 src/from-utc.pipe.ts diff --git a/.gitignore b/.gitignore index f4fc356..ff133a0 100644 --- a/.gitignore +++ b/.gitignore @@ -34,6 +34,9 @@ subtract.pipe.d.ts utc.pipe.js utc.pipe.js.map utc.pipe.d.ts +from-utc.pipe.js +from-utc.pipe.js.map +from-utc.pipe.d.ts parse.pipe.js parse.pipe.js.map parse.pipe.d.ts diff --git a/README.md b/README.md index f6b58ee..095d4d7 100644 --- a/README.md +++ b/README.md @@ -253,6 +253,21 @@ Prints `Expiration: 2017-03-17 18:55` ``` Prints `Last updated: 2012-03-17 16:55` +## amFromUtc pipe + +Parses the date as UTC and enables mode for subsequent moment operations (such as displaying the time in UTC). This can be combined with `amLocal` to display a UTC date in local time. + +``` typescript +@Component({ + selector: 'app', + template: ` + Last updated: {{ '2016-12-31T23:00:00.000-01:00' | amFromUtc | amDateFormat: 'YYYY-MM-DD' }} + ` +}) +``` + +Prints `Last updated: 2017-01-01` + ## amUtc pipe Enables UTC mode for subsequent moment operations (such as displaying the time in UTC). diff --git a/package.json b/package.json index c7fe841..531e11a 100644 --- a/package.json +++ b/package.json @@ -49,6 +49,10 @@ "utc.pipe.js.map", "utc.pipe.d.ts", "utc.pipe.metadata.json", + "from-utc.pipe.js", + "from-utc.pipe.js.map", + "from-utc.pipe.d.ts", + "from-utc.pipe.metadata.json", "parse.pipe.js", "parse.pipe.js.map", "parse.pipe.d.ts", diff --git a/src/from-utc.pipe.spec.ts b/src/from-utc.pipe.spec.ts new file mode 100644 index 0000000..7cb1972 --- /dev/null +++ b/src/from-utc.pipe.spec.ts @@ -0,0 +1,69 @@ +import 'es6-shim'; +import 'reflect-metadata'; +import * as moment from 'moment'; +import { DateFormatPipe } from './date-format.pipe'; +import { FromUtcPipe } from './from-utc.pipe'; + +describe('UtcPipe', () => { + + describe('#transform', () => { + + let utcDatePipe: FromUtcPipe; + + beforeEach(() => { + utcDatePipe = new FromUtcPipe(); + }); + + it('should output an invalid momemt object for a null input', () => { + const utcDate = utcDatePipe.transform(null); + expect(utcDate).toEqual(expect.any(moment)); + expect(utcDate.isValid()).toBe(false); + }); + + it('should output a moment object for a moment input', () => { + const momentDate = moment(); + const utcDate = utcDatePipe.transform(momentDate); + expect(utcDate).toEqual(expect.any(moment)); + expect(utcDate.isValid()).toBe(true); + }); + + it('should output a moment object for a date input', () => { + const date = new Date(); + const utcDate = utcDatePipe.transform(date); + expect(utcDate).toEqual(expect.any(moment)); + expect(utcDate.isValid()).toBe(true); + }); + + it('should output a moment object for a string date', () => { + const dateString = '2016-01-01'; + const utcDate = utcDatePipe.transform(dateString); + expect(utcDate).toEqual(expect.any(moment)); + expect(utcDate.isValid()).toBe(true); + }); + + it('should output a moment object for a timestamp', () => { + const timestamp: number = Date.now(); + const utcDate = utcDatePipe.transform(timestamp); + expect(utcDate).toEqual(expect.any(moment)); + expect(utcDate.isValid()).toBe(true); + }); + + it('should parse with provided timezone and format to UTC', () => { + const amDateFormat = new DateFormatPipe(); + const datetimeString = '2016-12-31T23:00:00.000-01:00'; + const momentFormatString = 'YYYY-MM-DD'; + const utcOutput = utcDatePipe.transform(datetimeString); + expect(amDateFormat.transform(utcOutput, momentFormatString)).toEqual('2017-01-01'); + }); + + it('should parse as UTC without provided timezone', () => { + const amDateFormat = new DateFormatPipe(); + const datetimeString = '2016-12-31T23:00:00.000'; + const momentFormatString = 'YYYY-MM-DD'; + const utcOutput = utcDatePipe.transform(datetimeString); + expect(amDateFormat.transform(utcOutput, momentFormatString)).toEqual('2016-12-31'); + }); + + }); + +}); diff --git a/src/from-utc.pipe.ts b/src/from-utc.pipe.ts new file mode 100644 index 0000000..c1a38fd --- /dev/null +++ b/src/from-utc.pipe.ts @@ -0,0 +1,11 @@ +/* angular2-moment (c) 2015, 2016 Uri Shaked / MIT Licence */ + +import {Pipe, PipeTransform} from '@angular/core'; +import * as moment from 'moment'; + +@Pipe({ name: 'amFromUtc' }) +export class FromUtcPipe implements PipeTransform { + transform(value: any, ...args: string[]): any { + return moment.utc(value); + } +} diff --git a/src/index.ts b/src/index.ts index 830a07e..9ea6ace 100644 --- a/src/index.ts +++ b/src/index.ts @@ -9,5 +9,6 @@ export { MomentModule } from './moment.module'; export { SubtractPipe } from './subtract.pipe'; export { TimeAgoPipe } from './time-ago.pipe'; export { UtcPipe } from './utc.pipe'; +import { FromUtcPipe } from './from-utc.pipe'; export { LocalTimePipe } from './local.pipe'; export { LocalePipe } from './locale.pipe'; diff --git a/src/moment.module.ts b/src/moment.module.ts index 9842840..39d3bce 100644 --- a/src/moment.module.ts +++ b/src/moment.module.ts @@ -10,6 +10,7 @@ import { ParsePipe } from './parse.pipe'; import { SubtractPipe } from './subtract.pipe'; import { TimeAgoPipe } from './time-ago.pipe'; import { UtcPipe } from './utc.pipe'; +import { FromUtcPipe } from './from-utc.pipe'; import { LocalTimePipe } from './local.pipe'; import { LocalePipe } from './locale.pipe'; @@ -24,6 +25,7 @@ const ANGULAR_MOMENT_PIPES = [ SubtractPipe, TimeAgoPipe, UtcPipe, + FromUtcPipe, LocalTimePipe, LocalePipe ]; diff --git a/tsconfig.json b/tsconfig.json index bf70510..29477e3 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -37,6 +37,8 @@ "src/time-ago.pipe.spec.ts", "src/utc.pipe.ts", "src/utc.pipe.spec.ts", + "src/from-utc.pipe.ts", + "src/from-utc.pipe.spec.ts", "src/local.pipe.ts", "src/local.pipe.spec.ts", "src/locale.pipe.ts",