javascript-time-ago 2.6.0 → 2.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +75 -67
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -63,6 +63,8 @@ timeAgo.format(Date.now() - 24 * 60 * 60 * 1000)
|
|
|
63
63
|
// "1 day ago"
|
|
64
64
|
```
|
|
65
65
|
|
|
66
|
+
To change the output style, see the list of available [formatting styles](#formatting-styles).
|
|
67
|
+
|
|
66
68
|
P.S. After rendering a label, don't forget to [refresh](#refreshing) it as the time goes by.
|
|
67
69
|
|
|
68
70
|
## Languages
|
|
@@ -161,32 +163,13 @@ timeAgo.format(Date.now() - 24 * 60 * 60 * 1000)
|
|
|
161
163
|
|
|
162
164
|
## Formatting Styles
|
|
163
165
|
|
|
164
|
-
|
|
166
|
+
A "formatting style" defines how a date should be formatted relative to the current time.
|
|
165
167
|
|
|
166
|
-
|
|
167
|
-
* Interval from `-1 second` to `-1 minute` is assigned `"{0} second(s) ago"` label.
|
|
168
|
-
* Interval from `-1 minute` to `-1 hour` is assigned `"{0} minute(s) ago"` label.
|
|
169
|
-
* ...
|
|
170
|
-
* Interval from `0` to `+1 second` is assigned `"in a moment"` label.
|
|
171
|
-
* Interval from `+1 second` to `+1 minute` is assigned `"in {0} second(s)"` label.
|
|
172
|
-
* Interval from `+1 minute` to `+1 hour` is assigned `"in {0} minute(s)"` label.
|
|
173
|
-
* ...
|
|
168
|
+
It could be precise up to a second with `"1 second ago"`, `"2 seconds ago"`, `"3 seconds ago"`, etc labels, or it could prefer to combine all those under a single `"less than a minute ago"` label.
|
|
174
169
|
|
|
175
|
-
|
|
170
|
+
It could use verbose labels like `"1 minute ago"` or it could prefer shorter variants like `"1 min. ago"` or even `"1m"`. Or it could prefer to output a full date like `"Dec 11, 2015"` for dates that're older than 1 year from now.
|
|
176
171
|
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
For example, for `const date = new Date(Date.now() - 2 * 60 * 1000)`, `format(date)` first calculates the difference between the `date` and `Date.now()`, which is `-2 * 60` seconds, and then maps those `-2 * 60` seconds onto the time range and finds that it falls into the `-1 min … -1 hour` interval. So it returns the label for that interval, which is `"{0} minute(s) ago"`, replacing `{0}` with `2` because the unit of time used by the interval is `"minute"` which is equal to `60` seconds, so `-2 * 60 / 60 === -2`.
|
|
180
|
-
|
|
181
|
-
As one can see, with this approach, there can be an infinite amount of formatting styles, and any possible formatting style can be expressed with this simple logic.
|
|
182
|
-
|
|
183
|
-
It could be precise up to a second with `"1 second ago"`, `"2 seconds ago"`, `"3 seconds ago"`, etc labels, or it could hide the amount of seconds under a `"less than minute ago"` label.
|
|
184
|
-
|
|
185
|
-
It could use verbose labels like `"1 minute ago"` or it could prefer shorter variants like `"1 min. ago"` or even `"1m"`. Or it could choose to output a full date like `"Dec 11, 2015"` starting from `-1 year` threshold.
|
|
186
|
-
|
|
187
|
-
The possibilities are endless, and it's all defined by a formatting "style".
|
|
188
|
-
|
|
189
|
-
While one could implement their own [custom](#custom-style) formatting "style" from scratch, most developers will find exactly what they're looking for in one of the few built-in styles that're described below.
|
|
172
|
+
While one could certainly implement their own [custom](#custom-style) formatting "style" from scratch, most applications would be totally fine with one of the few already-available styles that're described below.
|
|
190
173
|
|
|
191
174
|
### Round
|
|
192
175
|
|
|
@@ -194,19 +177,19 @@ While one could implement their own [custom](#custom-style) formatting "style" f
|
|
|
194
177
|
|
|
195
178
|
```js
|
|
196
179
|
timeAgo.format(Date.now(), 'round')
|
|
197
|
-
// 0 seconds ago
|
|
180
|
+
// 0 seconds ago: "just now"
|
|
198
181
|
|
|
199
182
|
timeAgo.format(Date.now() - 1 * 1000, 'round')
|
|
200
|
-
// 1 second ago
|
|
183
|
+
// 1 second ago: "1 second ago"
|
|
201
184
|
|
|
202
185
|
timeAgo.format(Date.now() - 29 * 1000, 'round')
|
|
203
|
-
// 29 seconds ago
|
|
186
|
+
// 29 seconds ago: "29 seconds ago"
|
|
204
187
|
|
|
205
188
|
timeAgo.format(Date.now() - 30 * 1000, 'round')
|
|
206
|
-
// 30 seconds ago
|
|
189
|
+
// 30 seconds ago: "1 minute ago"
|
|
207
190
|
|
|
208
191
|
timeAgo.format(Date.now() - 1.5 * 60 * 1000, 'round')
|
|
209
|
-
// 1.5 minutes ago
|
|
192
|
+
// 1.5 minutes ago: "2 minutes ago"
|
|
210
193
|
```
|
|
211
194
|
|
|
212
195
|
* just now
|
|
@@ -241,17 +224,17 @@ timeAgo.format(Date.now() - 1.5 * 60 * 1000, 'round')
|
|
|
241
224
|
|
|
242
225
|
### Round (minute)
|
|
243
226
|
|
|
244
|
-
`"round-minute"` style is same as `"round"` style but without seconds. This is the default style.
|
|
227
|
+
`"round-minute"` style is same as `"round"` style but without seconds. This is the default style that is used when no custom style is specified.
|
|
245
228
|
|
|
246
229
|
```js
|
|
247
230
|
timeAgo.format(Date.now(), 'round-minute')
|
|
248
|
-
// 0 seconds ago
|
|
231
|
+
// 0 seconds ago: "just now"
|
|
249
232
|
|
|
250
233
|
timeAgo.format(Date.now() - 29 * 1000, 'round-minute')
|
|
251
|
-
// 29 seconds ago
|
|
234
|
+
// 29 seconds ago: "just now"
|
|
252
235
|
|
|
253
236
|
timeAgo.format(Date.now() - 30 * 1000, 'round-minute')
|
|
254
|
-
// 30 seconds ago
|
|
237
|
+
// 30 seconds ago: "1 minute ago"
|
|
255
238
|
|
|
256
239
|
// The rest is same as "round" style.
|
|
257
240
|
```
|
|
@@ -267,28 +250,28 @@ timeAgo.format(Date.now() - 30 * 1000, 'round-minute')
|
|
|
267
250
|
|
|
268
251
|
```js
|
|
269
252
|
timeAgo.format(new Date(), 'mini')
|
|
270
|
-
// 0 seconds ago
|
|
253
|
+
// 0 seconds ago: "0s"
|
|
271
254
|
|
|
272
255
|
timeAgo.format(new Date() - 1 * 1000, 'mini')
|
|
273
|
-
// 1 second ago
|
|
256
|
+
// 1 second ago: "1s"
|
|
274
257
|
|
|
275
258
|
timeAgo.format(Date.now() - 2 * 60 * 1000, 'mini')
|
|
276
|
-
// 2 minutes ago
|
|
259
|
+
// 2 minutes ago: "2m"
|
|
277
260
|
|
|
278
261
|
timeAgo.format(Date.now() - 3 * 60 * 60 * 1000, 'mini')
|
|
279
|
-
// 3 hours ago
|
|
262
|
+
// 3 hours ago: "3h"
|
|
280
263
|
|
|
281
264
|
timeAgo.format(Date.now() - 4 * 24 * 60 * 60 * 1000, 'mini')
|
|
282
|
-
// 4 days ago
|
|
265
|
+
// 4 days ago: "4d"
|
|
283
266
|
|
|
284
267
|
timeAgo.format(Date.now() - 23 * 24 * 60 * 60 * 1000, 'mini')
|
|
285
|
-
// 23 days ago
|
|
268
|
+
// 23 days ago: "23d"
|
|
286
269
|
|
|
287
270
|
timeAgo.format(Date.now() - 5 * 30 * 24 * 60 * 60 * 1000, 'mini')
|
|
288
|
-
// 5 months ago
|
|
271
|
+
// 5 months ago: "5mo"
|
|
289
272
|
|
|
290
273
|
timeAgo.format(Date.now() - 12 * 30 * 24 * 60 * 60 * 1000, 'mini')
|
|
291
|
-
// 1 year ago
|
|
274
|
+
// 1 year ago: "1yr"
|
|
292
275
|
```
|
|
293
276
|
|
|
294
277
|
For best compatibility, `mini.json` labels should be [defined](https://github.com/catamphetamine/javascript-time-ago/tree/master/locale-more-styles) for a locale, otherwise you might [end up with](https://github.com/catamphetamine/javascript-time-ago/issues/49) labels like `"-1m"` for "one minute ago" for some languages. Send `mini.json` pull requests for the missing languages if you speak those.
|
|
@@ -299,10 +282,10 @@ For best compatibility, `mini.json` labels should be [defined](https://github.co
|
|
|
299
282
|
|
|
300
283
|
```js
|
|
301
284
|
timeAgo.format(new Date(), 'mini-now')
|
|
302
|
-
// 0 seconds ago
|
|
285
|
+
// 0 seconds ago: "now"
|
|
303
286
|
|
|
304
287
|
timeAgo.format(new Date() - 1 * 1000, 'mini-now')
|
|
305
|
-
// 1 second ago
|
|
288
|
+
// 1 second ago: "1s"
|
|
306
289
|
|
|
307
290
|
// The rest is same as "mini" style.
|
|
308
291
|
```
|
|
@@ -313,13 +296,13 @@ timeAgo.format(new Date() - 1 * 1000, 'mini-now')
|
|
|
313
296
|
|
|
314
297
|
```js
|
|
315
298
|
timeAgo.format(new Date(), 'mini-minute')
|
|
316
|
-
// 0 seconds ago
|
|
299
|
+
// 0 seconds ago: "0m"
|
|
317
300
|
|
|
318
301
|
timeAgo.format(new Date() - 29 * 1000, 'mini-minute')
|
|
319
|
-
// 29 seconds ago
|
|
302
|
+
// 29 seconds ago: "0m"
|
|
320
303
|
|
|
321
304
|
timeAgo.format(new Date() - 30 * 1000, 'mini-minute')
|
|
322
|
-
// 30 seconds ago
|
|
305
|
+
// 30 seconds ago: "1m"
|
|
323
306
|
|
|
324
307
|
// The rest is same as "mini" style.
|
|
325
308
|
```
|
|
@@ -330,13 +313,13 @@ timeAgo.format(new Date() - 30 * 1000, 'mini-minute')
|
|
|
330
313
|
|
|
331
314
|
```js
|
|
332
315
|
timeAgo.format(new Date(), 'mini-minute-now')
|
|
333
|
-
// 0 seconds ago
|
|
316
|
+
// 0 seconds ago: "now"
|
|
334
317
|
|
|
335
318
|
timeAgo.format(new Date() - 29 * 1000, 'mini-minute-now')
|
|
336
|
-
// 29 seconds ago
|
|
319
|
+
// 29 seconds ago: "now"
|
|
337
320
|
|
|
338
321
|
timeAgo.format(new Date() - 30 * 1000, 'mini-minute-now')
|
|
339
|
-
// 30 seconds ago
|
|
322
|
+
// 30 seconds ago: "1m"
|
|
340
323
|
|
|
341
324
|
// The rest is same as "mini" style.
|
|
342
325
|
```
|
|
@@ -348,13 +331,13 @@ Same as `"twitter"` style but doesn't output anything before the first minute.
|
|
|
348
331
|
|
|
349
332
|
```js
|
|
350
333
|
timeAgo.format(new Date(), 'twitter-first-minute')
|
|
351
|
-
// 0 seconds ago
|
|
334
|
+
// 0 seconds ago: ""
|
|
352
335
|
|
|
353
336
|
timeAgo.format(new Date() - 59 * 1000, 'twitter-first-minute')
|
|
354
|
-
// 59 seconds ago
|
|
337
|
+
// 59 seconds ago: ""
|
|
355
338
|
|
|
356
339
|
timeAgo.format(new Date() - 60 * 1000, 'twitter-first-minute')
|
|
357
|
-
// 1 minute ago
|
|
340
|
+
// 1 minute ago: "1m"
|
|
358
341
|
|
|
359
342
|
// The rest is same as "twitter" style.
|
|
360
343
|
```
|
|
@@ -366,16 +349,16 @@ timeAgo.format(new Date() - 60 * 1000, 'twitter-first-minute')
|
|
|
366
349
|
|
|
367
350
|
```js
|
|
368
351
|
timeAgo.format(new Date(), 'twitter')
|
|
369
|
-
// 0 seconds ago
|
|
352
|
+
// 0 seconds ago: "0s"
|
|
370
353
|
|
|
371
354
|
timeAgo.format(new Date() - 1 * 1000, 'twitter')
|
|
372
|
-
// 1 second ago
|
|
355
|
+
// 1 second ago: "1s"
|
|
373
356
|
|
|
374
357
|
timeAgo.format(Date.now() - 2 * 60 * 1000, 'twitter')
|
|
375
|
-
// 2 minutes ago
|
|
358
|
+
// 2 minutes ago: "2m"
|
|
376
359
|
|
|
377
360
|
timeAgo.format(Date.now() - 3 * 60 * 60 * 1000, 'twitter')
|
|
378
|
-
// 3 hours ago
|
|
361
|
+
// 3 hours ago: "3h"
|
|
379
362
|
|
|
380
363
|
timeAgo.format(Date.now() - 4 * 24 * 60 * 60 * 1000, 'twitter')
|
|
381
364
|
// More than 24 hours ago → `month/day` ("Mar 4")
|
|
@@ -394,10 +377,10 @@ For best compatibility, `mini.json` labels should be [defined](https://github.co
|
|
|
394
377
|
|
|
395
378
|
```js
|
|
396
379
|
timeAgo.format(new Date(), 'twitter-now')
|
|
397
|
-
// 0 seconds ago
|
|
380
|
+
// 0 seconds ago: "now"
|
|
398
381
|
|
|
399
382
|
timeAgo.format(new Date() - 1 * 1000, 'twitter-now')
|
|
400
|
-
// 1 second ago
|
|
383
|
+
// 1 second ago: "1s"
|
|
401
384
|
|
|
402
385
|
// The rest is same as "twitter" style.
|
|
403
386
|
```
|
|
@@ -408,13 +391,13 @@ timeAgo.format(new Date() - 1 * 1000, 'twitter-now')
|
|
|
408
391
|
|
|
409
392
|
```js
|
|
410
393
|
timeAgo.format(new Date(), 'twitter-minute')
|
|
411
|
-
// 0 seconds ago
|
|
394
|
+
// 0 seconds ago: "0m"
|
|
412
395
|
|
|
413
396
|
timeAgo.format(new Date() - 29 * 1000, 'twitter-minute')
|
|
414
|
-
// 29 seconds ago
|
|
397
|
+
// 29 seconds ago: "0m"
|
|
415
398
|
|
|
416
399
|
timeAgo.format(new Date() - 30 * 1000, 'twitter-minute')
|
|
417
|
-
// 30 seconds ago
|
|
400
|
+
// 30 seconds ago: "1m"
|
|
418
401
|
|
|
419
402
|
// The rest is same as "twitter" style.
|
|
420
403
|
```
|
|
@@ -425,13 +408,13 @@ timeAgo.format(new Date() - 30 * 1000, 'twitter-minute')
|
|
|
425
408
|
|
|
426
409
|
```js
|
|
427
410
|
timeAgo.format(new Date(), 'twitter-minute-now')
|
|
428
|
-
// 0 seconds ago
|
|
411
|
+
// 0 seconds ago: "now"
|
|
429
412
|
|
|
430
413
|
timeAgo.format(new Date() - 29 * 1000, 'twitter-minute-now')
|
|
431
|
-
// 29 seconds ago
|
|
414
|
+
// 29 seconds ago: "now"
|
|
432
415
|
|
|
433
416
|
timeAgo.format(new Date() - 30 * 1000, 'twitter-minute-now')
|
|
434
|
-
// 30 seconds ago
|
|
417
|
+
// 30 seconds ago: "1m"
|
|
435
418
|
|
|
436
419
|
// The rest is same as "twitter" style.
|
|
437
420
|
```
|
|
@@ -442,13 +425,13 @@ timeAgo.format(new Date() - 30 * 1000, 'twitter-minute-now')
|
|
|
442
425
|
|
|
443
426
|
```js
|
|
444
427
|
timeAgo.format(new Date(), 'twitter-first-minute')
|
|
445
|
-
// 0 seconds ago
|
|
428
|
+
// 0 seconds ago: ""
|
|
446
429
|
|
|
447
430
|
timeAgo.format(new Date() - 29 * 1000, 'twitter-first-minute')
|
|
448
|
-
// 29 seconds ago
|
|
431
|
+
// 29 seconds ago: ""
|
|
449
432
|
|
|
450
433
|
timeAgo.format(new Date() - 30 * 1000, 'twitter-first-minute')
|
|
451
|
-
// 30 seconds ago
|
|
434
|
+
// 30 seconds ago: "1m"
|
|
452
435
|
|
|
453
436
|
// The rest is same as "twitter" style.
|
|
454
437
|
```
|
|
@@ -459,6 +442,31 @@ A custom "style" object may be passed as a second argument to `.format(date, sty
|
|
|
459
442
|
|
|
460
443
|
Refer to the definition of the [built-in styles](https://github.com/catamphetamine/javascript-time-ago/tree/master/source/style) for an example.
|
|
461
444
|
|
|
445
|
+
<details>
|
|
446
|
+
<summary>How does a formatting style work</summary>
|
|
447
|
+
|
|
448
|
+
######
|
|
449
|
+
|
|
450
|
+
The time range (in seconds) spans from `-∞` to `+∞`, with "now" at `0` point. This entire range gets split into intervals, each with its own label. Example:
|
|
451
|
+
|
|
452
|
+
* Interval from `0` to `-1 second` is assigned `"just now"` label.
|
|
453
|
+
* Interval from `-1 second` to `-1 minute` is assigned `"{0} second(s) ago"` label.
|
|
454
|
+
* Interval from `-1 minute` to `-1 hour` is assigned `"{0} minute(s) ago"` label.
|
|
455
|
+
* ...
|
|
456
|
+
* Interval from `0` to `+1 second` is assigned `"in a moment"` label.
|
|
457
|
+
* Interval from `+1 second` to `+1 minute` is assigned `"in {0} second(s)"` label.
|
|
458
|
+
* Interval from `+1 minute` to `+1 hour` is assigned `"in {0} minute(s)"` label.
|
|
459
|
+
* ...
|
|
460
|
+
|
|
461
|
+
Intervals follow each other without any gaps, so the entire time range is divided into such intervals.
|
|
462
|
+
|
|
463
|
+
Now the job of the `format(date)` function is simple: it calculates the time difference (in seconds) between `date` and "now", and then maps that number onto the time range to see what interval it falls into. Then it returns the label for that interval, replacing `{0}` with the time difference number converted to the unit of time used by the interval.
|
|
464
|
+
|
|
465
|
+
For example, for `const date = new Date(Date.now() - 2 * 60 * 1000)`, `format(date)` first calculates the difference between the `date` and `Date.now()`, which is `-2 * 60` seconds, and then maps those `-2 * 60` seconds onto the time range and finds that it falls into the `-1 min … -1 hour` interval. So it returns the label for that interval, which is `"{0} minute(s) ago"`, replacing `{0}` with `2` because the unit of time used by the interval is `"minute"` which is equal to `60` seconds, so `-2 * 60 / 60 === -2`.
|
|
466
|
+
|
|
467
|
+
As one can see, with this approach, there could be an infinite amount of all kinds of formatting styles, and any possible formatting style could be expressed with this simple logic.
|
|
468
|
+
</details>
|
|
469
|
+
|
|
462
470
|
### Labels
|
|
463
471
|
|
|
464
472
|
`labels` property value should be the type of labels to output. There're several types of labels available:
|
|
@@ -844,7 +852,7 @@ Some people [asked](https://github.com/catamphetamine/javascript-time-ago/issues
|
|
|
844
852
|
|
|
845
853
|
A developer can specify the preferred rounding by passing a `round` parameter to `timeAgo.format(date, [style,] options)`.
|
|
846
854
|
|
|
847
|
-
The default rounding method could also be specified "globally" for a given [style](#styles) by specifying a `round` property in the style object.
|
|
855
|
+
The default rounding method could also be specified "globally" for a given [style](#formatting-styles) by specifying a `round` property in the style object.
|
|
848
856
|
|
|
849
857
|
## Past vs Future
|
|
850
858
|
|