From 735ef0246682b7cfac8003837c57a35619791201 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sat, 20 Aug 2022 14:50:49 +0200
Subject: [PATCH 01/10] display time left until video premiers:
---
src/renderer/views/Watch/Watch.js | 4 ++++
src/renderer/views/Watch/Watch.vue | 2 +-
static/locales/en-US.yaml | 1 +
3 files changed, 6 insertions(+), 1 deletion(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index 69ae3189eab33..b3d673ffa6971 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -49,6 +49,7 @@ export default Vue.extend({
isLiveContent: false,
isUpcoming: false,
upcomingTimestamp: null,
+ upcomingTimeLeft: null,
activeFormat: 'legacy',
thumbnail: '',
videoId: '',
@@ -391,6 +392,9 @@ export default Vue.extend({
if (typeof startTimestamp !== 'undefined') {
const upcomingTimestamp = new Date(result.videoDetails.liveBroadcastDetails.startTimestamp)
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
+
+ const upcomingTimeLeft = upcomingTimestamp - new Date();
+ this.upcomingTimeLeft = Math.floor(upcomingTimeLeft / 1000 / 60);
} else {
this.upcomingTimestamp = null
}
diff --git a/src/renderer/views/Watch/Watch.vue b/src/renderer/views/Watch/Watch.vue
index db724a5f04c38..84631404a1503 100644
--- a/src/renderer/views/Watch/Watch.vue
+++ b/src/renderer/views/Watch/Watch.vue
@@ -53,7 +53,7 @@
v-if="upcomingTimestamp !== null"
class="premiereText"
>
- {{ $t("Video.Premieres on") }}:
+ {{ $t("Video.Premieres in") }} {{ upcomingTimeLeft }}
{{ upcomingTimestamp }}
diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml
index 8247bb1f40936..e59d2b449d66e 100644
--- a/static/locales/en-US.yaml
+++ b/static/locales/en-US.yaml
@@ -524,6 +524,7 @@ Video:
the page to check again
# As in a Live Video
Premieres on: Premieres on
+ Premieres in: Premieres in
Live: Live
Live Now: Live Now
Live Chat: Live Chat
From 96bb3dd8e4b49be671f780b7f7ceb9d5720c2ab1 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sat, 20 Aug 2022 16:14:05 +0200
Subject: [PATCH 02/10] video premiere display time left with time units
Displays time left in seconds, minutes, hours, and days.
This depends on how much time is left.
---
src/renderer/views/Watch/Watch.js | 31 +++++++++++++++++++++++++++++--
1 file changed, 29 insertions(+), 2 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index b3d673ffa6971..b1ab40797d82e 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -393,10 +393,37 @@ export default Vue.extend({
const upcomingTimestamp = new Date(result.videoDetails.liveBroadcastDetails.startTimestamp)
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
- const upcomingTimeLeft = upcomingTimestamp - new Date();
- this.upcomingTimeLeft = Math.floor(upcomingTimeLeft / 1000 / 60);
+ let upcomingTimeLeft = upcomingTimestamp - new Date();
+ let timeUnit;
+ if(upcomingTimeLeft <= 0) {
+ //TODO use string from locale files.
+ this.upcomingTimeLeft = "Starting now";
+ } else {
+ upcomingTimeLeft = upcomingTimeLeft / 1000;
+ if (upcomingTimeLeft <= 60) {
+ timeUnit = this.$t('Video.Published.Seconds');
+ } else {
+
+ upcomingTimeLeft = upcomingTimeLeft / 60;
+ if (upcomingTimeLeft <= 120) {
+ timeUnit = this.$t('Video.Published.Minutes');
+ } else {
+
+ upcomingTimeLeft = upcomingTimeLeft / 60;
+ if (upcomingTimeLeft <= 24) {
+ timeUnit = this.$t('Video.Published.Hours');
+ } else {
+ upcomingTimeLeft = upcomingTimeLeft / 24;
+ timeUnit = this.$t('Video.Published.Days');
+ }
+ }
+ }
+ //TODO lowercase timeunit + a template might be needed here
+ this.upcomingTimeLeft = Math.floor(upcomingTimeLeft) + " " + timeUnit;
+ }
} else {
this.upcomingTimestamp = null
+ this.upcomingTimeLeft = null
}
} else {
this.videoLengthSeconds = parseInt(result.videoDetails.lengthSeconds)
From 50b607be4219c4adb2d8136b46cb5796ddf8e014 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sat, 20 Aug 2022 17:53:04 +0200
Subject: [PATCH 03/10] premiere time left, display time in singular if needed
also simplified the big if block
---
src/renderer/views/Watch/Watch.js | 29 +++++++++++++++--------------
1 file changed, 15 insertions(+), 14 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index b0f359316b7d3..10c6d576e3641 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -404,26 +404,27 @@ export default Vue.extend({
this.upcomingTimeLeft = "Starting now";
} else {
upcomingTimeLeft = upcomingTimeLeft / 1000;
- if (upcomingTimeLeft <= 60) {
- timeUnit = this.$t('Video.Published.Seconds');
- } else {
-
+ timeUnit = 'Second';
+ if (upcomingTimeLeft > 60) {
upcomingTimeLeft = upcomingTimeLeft / 60;
- if (upcomingTimeLeft <= 120) {
- timeUnit = this.$t('Video.Published.Minutes');
- } else {
-
+ timeUnit = 'Minute';
+ if (upcomingTimeLeft > 120) {
upcomingTimeLeft = upcomingTimeLeft / 60;
- if (upcomingTimeLeft <= 24) {
- timeUnit = this.$t('Video.Published.Hours');
- } else {
- upcomingTimeLeft = upcomingTimeLeft / 24;
- timeUnit = this.$t('Video.Published.Days');
+ timeUnit = 'Hour';
+ if (upcomingTimeLeft > 24) {
+ upcomingTimeLeft = upcomingTimeLeft / 24;
+ timeUnit = 'Day';
}
}
}
+ upcomingTimeLeft = Math.floor(upcomingTimeLeft);
+ if (upcomingTimeLeft !== 1) {
+ timeUnit = timeUnit + 's'
+ }
+ timeUnit = this.$t('Video.Published.' + timeUnit)
+
//TODO lowercase timeunit + a template might be needed here
- this.upcomingTimeLeft = Math.floor(upcomingTimeLeft) + " " + timeUnit;
+ this.upcomingTimeLeft = upcomingTimeLeft + " " + timeUnit;
}
} else {
this.upcomingTimestamp = null
From a7d99b5d3c1a1beaccd3b29ef7bc11cb97fa64b0 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sat, 20 Aug 2022 19:35:27 +0200
Subject: [PATCH 04/10] premiere time left, display time unit in lowercase
---
src/renderer/views/Watch/Watch.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index 10c6d576e3641..ffbc5892db342 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -423,8 +423,8 @@ export default Vue.extend({
}
timeUnit = this.$t('Video.Published.' + timeUnit)
- //TODO lowercase timeunit + a template might be needed here
- this.upcomingTimeLeft = upcomingTimeLeft + " " + timeUnit;
+ //TODO a template might be needed here but idk how they work
+ this.upcomingTimeLeft = upcomingTimeLeft + " " + timeUnit.toLowerCase();
}
} else {
this.upcomingTimestamp = null
From 660177de9876a4210f45abeae28a3016776aa393 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sat, 20 Aug 2022 20:19:34 +0200
Subject: [PATCH 05/10] Add Starting Soon string to locale file
---
src/renderer/views/Watch/Watch.js | 3 +--
static/locales/en-US.yaml | 1 +
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index ffbc5892db342..b6ac4f5213247 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -400,8 +400,7 @@ export default Vue.extend({
let upcomingTimeLeft = upcomingTimestamp - new Date();
let timeUnit;
if(upcomingTimeLeft <= 0) {
- //TODO use string from locale files.
- this.upcomingTimeLeft = "Starting now";
+ this.upcomingTimeLeft = this.$t('Video.Starting Soon');
} else {
upcomingTimeLeft = upcomingTimeLeft / 1000;
timeUnit = 'Second';
diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml
index 3e533c77c0236..011304b44aa86 100644
--- a/static/locales/en-US.yaml
+++ b/static/locales/en-US.yaml
@@ -541,6 +541,7 @@ Video:
Starting soon, please refresh the page to check again: Starting soon, please refresh
the page to check again
# As in a Live Video
+ Starting soon: Starting soon
Premieres on: Premieres on
Premieres in: Premieres in
Live: Live
From 4a54eb8bb8c6f7727311f9e394af8d55a0df5751 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Sun, 21 Aug 2022 13:16:56 +0200
Subject: [PATCH 06/10] apply fixes reported by linter
---
src/renderer/views/Watch/Watch.js | 32 +++++++++++++++----------------
1 file changed, 16 insertions(+), 16 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index b6ac4f5213247..e00779e27244c 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -397,33 +397,33 @@ export default Vue.extend({
const upcomingTimestamp = new Date(result.videoDetails.liveBroadcastDetails.startTimestamp)
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
- let upcomingTimeLeft = upcomingTimestamp - new Date();
- let timeUnit;
- if(upcomingTimeLeft <= 0) {
- this.upcomingTimeLeft = this.$t('Video.Starting Soon');
+ let upcomingTimeLeft = upcomingTimestamp - new Date()
+ let timeUnit
+ if (upcomingTimeLeft <= 0) {
+ this.upcomingTimeLeft = this.$t('Video.Starting Soon')
} else {
- upcomingTimeLeft = upcomingTimeLeft / 1000;
- timeUnit = 'Second';
+ upcomingTimeLeft = upcomingTimeLeft / 1000
+ timeUnit = 'Second'
if (upcomingTimeLeft > 60) {
- upcomingTimeLeft = upcomingTimeLeft / 60;
- timeUnit = 'Minute';
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnit = 'Minute'
if (upcomingTimeLeft > 120) {
- upcomingTimeLeft = upcomingTimeLeft / 60;
- timeUnit = 'Hour';
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnit = 'Hour'
if (upcomingTimeLeft > 24) {
- upcomingTimeLeft = upcomingTimeLeft / 24;
- timeUnit = 'Day';
+ upcomingTimeLeft = upcomingTimeLeft / 24
+ timeUnit = 'Day'
}
}
}
- upcomingTimeLeft = Math.floor(upcomingTimeLeft);
+ upcomingTimeLeft = Math.floor(upcomingTimeLeft)
if (upcomingTimeLeft !== 1) {
- timeUnit = timeUnit + 's'
+ timeUnit = timeUnit + 's'
}
timeUnit = this.$t('Video.Published.' + timeUnit)
- //TODO a template might be needed here but idk how they work
- this.upcomingTimeLeft = upcomingTimeLeft + " " + timeUnit.toLowerCase();
+ // TODO a template might be needed here but idk how they work
+ this.upcomingTimeLeft = upcomingTimeLeft + ' ' + timeUnit.toLowerCase()
}
} else {
this.upcomingTimestamp = null
From 086b1185b87889b0868ea349b40c8e946a2e3852 Mon Sep 17 00:00:00 2001
From: Aiz <66974576+Aiz0@users.noreply.github.com>
Date: Tue, 23 Aug 2022 16:49:50 +0000
Subject: [PATCH 07/10] premiere time left, add suggested changes
Better temp variable scoping, flatten nested code, rename temp variables, use string intepolation
Co-authored-by: PikachuEXE
---
src/renderer/views/Watch/Watch.js | 37 ++++++++++++++++++-------------
1 file changed, 22 insertions(+), 15 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index e00779e27244c..994e9baa12838 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -398,32 +398,39 @@ export default Vue.extend({
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
let upcomingTimeLeft = upcomingTimestamp - new Date()
- let timeUnit
if (upcomingTimeLeft <= 0) {
this.upcomingTimeLeft = this.$t('Video.Starting Soon')
} else {
+ // Convert from ms to second
upcomingTimeLeft = upcomingTimeLeft / 1000
- timeUnit = 'Second'
+ let timeUnitI18nPartialKey = 'Second'
+
if (upcomingTimeLeft > 60) {
upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnit = 'Minute'
- if (upcomingTimeLeft > 120) {
- upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnit = 'Hour'
- if (upcomingTimeLeft > 24) {
- upcomingTimeLeft = upcomingTimeLeft / 24
- timeUnit = 'Day'
- }
- }
+ timeUnitI18nPartialKey = 'Minute'
}
+
+ // Youtube switches to showing time left in minutes at 120 minutes remaining
+ if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnitI18nPartialKey = 'Hour'
+ }
+
+ if (timeUnitI18nPartialKey === 'Hour' && upcomingTimeLeft > 24) {
+ upcomingTimeLeft = upcomingTimeLeft / 24
+ timeUnitI18nPartialKey = 'Day'
+ }
+
+ // Value after decimal not to be displayed
+ // e.g. > 2 days = display as `2 days`
upcomingTimeLeft = Math.floor(upcomingTimeLeft)
if (upcomingTimeLeft !== 1) {
- timeUnit = timeUnit + 's'
+ timeUnitI18nPartialKey = timeUnitI18nPartialKey + 's'
}
- timeUnit = this.$t('Video.Published.' + timeUnit)
+ const timeUnitTranslated = this.$t(`Video.Published.${timeUnitI18nPartialKey}`).toLowerCase()
- // TODO a template might be needed here but idk how they work
- this.upcomingTimeLeft = upcomingTimeLeft + ' ' + timeUnit.toLowerCase()
+ // TODO a I18n entry for time format might be needed here
+ this.upcomingTimeLeft = `${upcomingTimeLeft} ${timeUnitTranslated}`
}
} else {
this.upcomingTimestamp = null
From c6ba94e702beab45b7beaba55744cf04c5a2f107 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Tue, 23 Aug 2022 18:54:35 +0200
Subject: [PATCH 08/10] replace tabs with spaces
tabs where used in some places in the suggested code
---
src/renderer/views/Watch/Watch.js | 22 +++++++++++-----------
1 file changed, 11 insertions(+), 11 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index 994e9baa12838..512173bae0b5b 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -410,17 +410,17 @@ export default Vue.extend({
timeUnitI18nPartialKey = 'Minute'
}
- // Youtube switches to showing time left in minutes at 120 minutes remaining
- if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
- upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnitI18nPartialKey = 'Hour'
- }
-
- if (timeUnitI18nPartialKey === 'Hour' && upcomingTimeLeft > 24) {
- upcomingTimeLeft = upcomingTimeLeft / 24
- timeUnitI18nPartialKey = 'Day'
- }
-
+ // Youtube switches to showing time left in minutes at 120 minutes remaining
+ if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnitI18nPartialKey = 'Hour'
+ }
+
+ if (timeUnitI18nPartialKey === 'Hour' && upcomingTimeLeft > 24) {
+ upcomingTimeLeft = upcomingTimeLeft / 24
+ timeUnitI18nPartialKey = 'Day'
+ }
+
// Value after decimal not to be displayed
// e.g. > 2 days = display as `2 days`
upcomingTimeLeft = Math.floor(upcomingTimeLeft)
From 1f877633fb0a98cea3288d45d9c1f9f1d93d55a7 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Tue, 23 Aug 2022 20:07:18 +0200
Subject: [PATCH 09/10] display time left, remove "starting soon" string
Since upcomingTimeStamp will be null when the time has passed the scheduled timestamp
it doesn't make sense to use something that will rarely be displayed.
e.g. a user has to click on the video with less than a second remaing until it goes live for it to be displayed
it would also be displayed as "Premieres in Starting soon" which doesn't make sense
---
src/renderer/views/Watch/Watch.js | 57 +++++++++++++++----------------
static/locales/en-US.yaml | 1 -
2 files changed, 28 insertions(+), 30 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index 512173bae0b5b..2ca48c70f2800 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -398,40 +398,39 @@ export default Vue.extend({
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
let upcomingTimeLeft = upcomingTimestamp - new Date()
- if (upcomingTimeLeft <= 0) {
- this.upcomingTimeLeft = this.$t('Video.Starting Soon')
- } else {
- // Convert from ms to second
- upcomingTimeLeft = upcomingTimeLeft / 1000
- let timeUnitI18nPartialKey = 'Second'
-
- if (upcomingTimeLeft > 60) {
- upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnitI18nPartialKey = 'Minute'
- }
+ if (upcomingTimeLeft < 0) {
+ this.upcomingTimeLeft = 0
+ }
+ // Convert from ms to second
+ upcomingTimeLeft = upcomingTimeLeft / 1000
+ let timeUnitI18nPartialKey = 'Second'
- // Youtube switches to showing time left in minutes at 120 minutes remaining
- if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
- upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnitI18nPartialKey = 'Hour'
- }
+ if (upcomingTimeLeft > 60) {
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnitI18nPartialKey = 'Minute'
+ }
- if (timeUnitI18nPartialKey === 'Hour' && upcomingTimeLeft > 24) {
- upcomingTimeLeft = upcomingTimeLeft / 24
- timeUnitI18nPartialKey = 'Day'
- }
+ // Youtube switches to showing time left in minutes at 120 minutes remaining
+ if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
+ upcomingTimeLeft = upcomingTimeLeft / 60
+ timeUnitI18nPartialKey = 'Hour'
+ }
- // Value after decimal not to be displayed
- // e.g. > 2 days = display as `2 days`
- upcomingTimeLeft = Math.floor(upcomingTimeLeft)
- if (upcomingTimeLeft !== 1) {
- timeUnitI18nPartialKey = timeUnitI18nPartialKey + 's'
- }
- const timeUnitTranslated = this.$t(`Video.Published.${timeUnitI18nPartialKey}`).toLowerCase()
+ if (timeUnitI18nPartialKey === 'Hour' && upcomingTimeLeft > 24) {
+ upcomingTimeLeft = upcomingTimeLeft / 24
+ timeUnitI18nPartialKey = 'Day'
+ }
- // TODO a I18n entry for time format might be needed here
- this.upcomingTimeLeft = `${upcomingTimeLeft} ${timeUnitTranslated}`
+ // Value after decimal not to be displayed
+ // e.g. > 2 days = display as `2 days`
+ upcomingTimeLeft = Math.floor(upcomingTimeLeft)
+ if (upcomingTimeLeft !== 1) {
+ timeUnitI18nPartialKey = timeUnitI18nPartialKey + 's'
}
+ const timeUnitTranslated = this.$t(`Video.Published.${timeUnitI18nPartialKey}`).toLowerCase()
+
+ // TODO a I18n entry for time format might be needed here
+ this.upcomingTimeLeft = `${upcomingTimeLeft} ${timeUnitTranslated}`
} else {
this.upcomingTimestamp = null
this.upcomingTimeLeft = null
diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml
index 011304b44aa86..3e533c77c0236 100644
--- a/static/locales/en-US.yaml
+++ b/static/locales/en-US.yaml
@@ -541,7 +541,6 @@ Video:
Starting soon, please refresh the page to check again: Starting soon, please refresh
the page to check again
# As in a Live Video
- Starting soon: Starting soon
Premieres on: Premieres on
Premieres in: Premieres in
Live: Live
From 37c3c4d9d035c771df9a9977eff77b255d319f60 Mon Sep 17 00:00:00 2001
From: Aiz
Date: Wed, 24 Aug 2022 17:13:11 +0200
Subject: [PATCH 10/10] display 'less than a minute' instead of exactly how
many seconds remain
Looks better and works for values less than 0
---
src/renderer/views/Watch/Watch.js | 25 ++++++++++++-------------
static/locales/en-US.yaml | 1 +
2 files changed, 13 insertions(+), 13 deletions(-)
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index 2ca48c70f2800..db3435d343afe 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -398,20 +398,13 @@ export default Vue.extend({
this.upcomingTimestamp = upcomingTimestamp.toLocaleString()
let upcomingTimeLeft = upcomingTimestamp - new Date()
- if (upcomingTimeLeft < 0) {
- this.upcomingTimeLeft = 0
- }
- // Convert from ms to second
- upcomingTimeLeft = upcomingTimeLeft / 1000
- let timeUnitI18nPartialKey = 'Second'
- if (upcomingTimeLeft > 60) {
- upcomingTimeLeft = upcomingTimeLeft / 60
- timeUnitI18nPartialKey = 'Minute'
- }
+ // Convert from ms to second to minute
+ upcomingTimeLeft = (upcomingTimeLeft / 1000) / 60
+ let timeUnitI18nPartialKey = 'Minute'
// Youtube switches to showing time left in minutes at 120 minutes remaining
- if (timeUnitI18nPartialKey === 'Minute' && upcomingTimeLeft > 120) {
+ if (upcomingTimeLeft > 120) {
upcomingTimeLeft = upcomingTimeLeft / 60
timeUnitI18nPartialKey = 'Hour'
}
@@ -429,8 +422,14 @@ export default Vue.extend({
}
const timeUnitTranslated = this.$t(`Video.Published.${timeUnitI18nPartialKey}`).toLowerCase()
- // TODO a I18n entry for time format might be needed here
- this.upcomingTimeLeft = `${upcomingTimeLeft} ${timeUnitTranslated}`
+ // Displays when less than a minute remains
+ // Looks better than `Premieres in x seconds`
+ if (upcomingTimeLeft < 1) {
+ this.upcomingTimeLeft = this.$t('Video.Published.Less than a minute').toLowerCase()
+ } else {
+ // TODO a I18n entry for time format might be needed here
+ this.upcomingTimeLeft = `${upcomingTimeLeft} ${timeUnitTranslated}`
+ }
} else {
this.upcomingTimestamp = null
this.upcomingTimeLeft = null
diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml
index 3e533c77c0236..3fe7c464c0f58 100644
--- a/static/locales/en-US.yaml
+++ b/static/locales/en-US.yaml
@@ -593,6 +593,7 @@ Video:
Years: Years
Ago: Ago
Upcoming: Premieres on
+ Less than a minute: Less than a minute
Published on: Published on
Streamed on: Streamed on
Started streaming on: Started streaming on