aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2020-04-11 18:30:39 +0200
committerRigel Kent <sendmemail@rigelk.eu>2020-04-11 19:05:11 +0200
commit1242fd55f9617cf22fa7568e2b0c9b2050045629 (patch)
tree3236f3e72996deab4e1cdb2d8f9395e8cff87cae /client/src
parent41a94d07f00f53d4624205fa4b23553a11e305dc (diff)
downloadPeerTube-1242fd55f9617cf22fa7568e2b0c9b2050045629.tar.gz
PeerTube-1242fd55f9617cf22fa7568e2b0c9b2050045629.tar.zst
PeerTube-1242fd55f9617cf22fa7568e2b0c9b2050045629.zip
Improve from-now pipe readability
Diffstat (limited to 'client/src')
-rw-r--r--client/src/app/shared/angular/from-now.pipe.ts21
-rw-r--r--client/src/sass/primeng-custom.scss5
2 files changed, 17 insertions, 9 deletions
diff --git a/client/src/app/shared/angular/from-now.pipe.ts b/client/src/app/shared/angular/from-now.pipe.ts
index c3c0efbfc..61a3c498d 100644
--- a/client/src/app/shared/angular/from-now.pipe.ts
+++ b/client/src/app/shared/angular/from-now.pipe.ts
@@ -8,7 +8,7 @@ export class FromNowPipe implements PipeTransform {
8 8
9 constructor (private i18n: I18n) { } 9 constructor (private i18n: I18n) { }
10 10
11 transform (arg: number | Date | string) { 11 transform (arg: number | Date | string, short = true) {
12 const argDate = new Date(arg) 12 const argDate = new Date(arg)
13 const seconds = Math.floor((Date.now() - argDate.getTime()) / 1000) 13 const seconds = Math.floor((Date.now() - argDate.getTime()) / 1000)
14 let intervals = [ 14 let intervals = [
@@ -48,19 +48,22 @@ export class FromNowPipe implements PipeTransform {
48 plural: (i: number) => this.i18n('{{i}} min', { i }) 48 plural: (i: number) => this.i18n('{{i}} min', { i })
49 } 49 }
50 ] 50 ]
51 .map(i => ({ ...i, interval: Math.floor(seconds / i.unit) })) // absolute interval 51 // compute the number of units each unit of time has, store it in "interval"
52 .map((i, index, array) => ({ // interval relative to remainder 52 .map(i => ({
53 ...i,
54 interval: Math.floor(seconds / i.unit)
55 }))
56 // compute the number of units each unit of time has, from the remainder of the previous bigger unit, store it in "interval"
57 .map((i, index, array) => ({
53 ...i, 58 ...i,
54 interval: index === 0 59 interval: index === 0
55 ? i.interval 60 ? i.interval
56 : Math.floor((seconds - array[index - 1].interval * array[index - 1].unit) / i.unit) 61 : Math.floor((seconds - array[index - 1].interval * array[index - 1].unit) / i.unit)
57 })) 62 }))
58 .map(i => ({ // value, interval put in its translated text wrt max value 63 // compute the final string from the "interval", cap it to the max value for the time unit
64 .map(i => ({
59 ...i, 65 ...i,
60 value: (i.interval > 1 66 value: (i.interval > 1 ? i.plural : i.singular)(Math.min(i.max, i.interval))
61 ? i.plural
62 : i.singular
63 )(Math.min(i.max, i.interval)) // respect the max value
64 })) 67 }))
65 68
66 // only keep the first two intervals with enough seconds to be considered 69 // only keep the first two intervals with enough seconds to be considered
@@ -73,7 +76,7 @@ export class FromNowPipe implements PipeTransform {
73 return this.i18n('just now') 76 return this.i18n('just now')
74 } 77 }
75 78
76 return intervals.length == 1 79 return intervals.length === 1 || short
77 ? this.i18n('{{interval}} ago', { interval: intervals[0].value }) 80 ? this.i18n('{{interval}} ago', { interval: intervals[0].value })
78 : this.i18n('{{big_interval}} {{small_interval}} ago', { 81 : this.i18n('{{big_interval}} {{small_interval}} ago', {
79 big_interval: intervals[0].value, 82 big_interval: intervals[0].value,
diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss
index 186146b3b..869532fe9 100644
--- a/client/src/sass/primeng-custom.scss
+++ b/client/src/sass/primeng-custom.scss
@@ -232,6 +232,11 @@ p-table {
232 color: #fff !important; 232 color: #fff !important;
233 background-color: var(--mainColor) !important; 233 background-color: var(--mainColor) !important;
234 } 234 }
235
236 &.focus-within,
237 &:focus {
238 box-shadow: #{$focus-box-shadow-form} var(--mainColorLightest);
239 }
235 } 240 }
236 } 241 }
237 } 242 }