Merge branch 'main' into main

docs/translations-needed.md

@@ -16,9 +16,7 @@ This default value is hardcoded as a default to the localize method in the SeekB
 
 | Language file           | Missing translations                                                                |
 | ----------------------- | ----------------------------------------------------------------------------------- |
-| ar.json (missing 3)     | Playing in Picture-in-Picture                                                       |
-|                         | Skip backward {1} seconds                                                           |
-|                         | Skip forward {1} seconds                                                            |
+| ar.json (missing 1)     | Playing in Picture-in-Picture                                                       |
 | az.json (Complete)      |                                                                                     |
 | ba.json (missing 71)    | Audio Player                                                                        |
 |                         | Video Player                                                                        |
@@ -574,6 +572,15 @@ This default value is hardcoded as a default to the localize method in the SeekB
 |                         | Playing in Picture-in-Picture                                                       |
 |                         | Skip backward {1} seconds                                                           |
 |                         | Skip forward {1} seconds                                                            |
+| np.json (missing 9)     | Drop shadow                                                                         |
+|                         | No content                                                                          |
+|                         | Color                                                                               |
+|                         | Opacity                                                                             |
+|                         | Text Background                                                                     |
+|                         | Caption Area Background                                                             |
+|                         | Playing in Picture-in-Picture                                                       |
+|                         | Skip backward {1} seconds                                                           |
+|                         | Skip forward {1} seconds                                                            |
 | oc.json (missing 7)     | Color                                                                               |
 |                         | Opacity                                                                             |
 |                         | Text Background                                                                     |

lang/ar.json

@@ -90,5 +90,7 @@
   "Color": "اللون",
   "Opacity": "معدل الشفافية",
   "Text Background": "خلفية النص",
-  "Caption Area Background": "خلفية منطقة التسمية التوضيحية"
+  "Caption Area Background": "خلفية منطقة التسمية التوضيحية",
+  "Skip forward {1} seconds": "التخطي للأمام {1}",
+  "Skip backward {1} seconds": "الرجوع للخلف {1}"
 }

lang/it.json

@@ -20,8 +20,8 @@
   "Playback Rate": "Velocità di riproduzione",
   "Subtitles": "Sottotitoli",
   "subtitles off": "Senza sottotitoli",
-  "Captions": "Sottotitoli non udenti",
-  "captions off": "Senza sottotitoli non udenti",
+  "Captions": "Didascalie",
+  "captions off": "Senza didascalie",
   "Chapters": "Capitolo",
   "Descriptions": "Descrizioni",
   "descriptions off": "Descrizioni disattivate",
@@ -42,13 +42,13 @@
   "This is a modal window": "Questa è una finestra di dialogo",
   "This modal can be closed by pressing the Escape key or activating the close button.":
     "Questa finestra di dialogo può essere chiusa premendo sul tasto Esc o attivando il pulsante di chiusura.",
-  ", opens captions settings dialog": ", aprire i parametri della trascrizione dei sottotitoli",
-  ", opens subtitles settings dialog": ", aprire i parametri dei sottotitoli",
-  ", opens descriptions settings dialog": ", aprire i parametri delle descrizioni",
+  ", opens captions settings dialog": ", aprire le impostazioni delle didascalie",
+  ", opens subtitles settings dialog": ", aprire le impostazioni dei sottotitoli",
+  ", opens descriptions settings dialog": ", aprire le impostazioni delle descrizioni",
   ", selected": ", selezionato",
-  "captions settings": "Parametri sottotitoli non udenti",
-  "subtitles settings": "Parametri sottotitoli",
-  "descriptions settings": "Parametri descrizioni",
+  "captions settings": "Impostazioni didascalie",
+  "subtitles settings": "Impostazioni sottotitoli",
+  "descriptions settings": "Impostazioni descrizioni",
   "Text": "Testo",
   "White": "Bianco",
   "Black": "Nero",

lang/mr.json

@@ -0,0 +1,98 @@
+{
+    "Audio Player": "ध्वनि वादक",
+    "Video Player": "चित्रवाणी वादक",
+    "Play": "वाजवा",
+    "Pause": "थांबा",
+    "Replay": "पुन्हा वाजवा",
+    "Current Time": "वर्तमान वेळ",
+    "Duration": "कालावधी",
+    "Remaining Time": "उर्वरित वेळ",
+    "Stream Type": "प्रवाह प्रकार",
+    "LIVE": "थेट प्रसारण",
+    "Seek to live, currently behind live": "थेट प्रसारणकडे जा, चालू क्षणाला थेट प्रसारण पासुन मागे आहे",
+    "Seek to live, currently playing live": "थेट प्रसारणकडे जा, चालू क्षणाला थेट प्रसारण आहे",
+    "Loaded": "सज्ज",
+    "Progress": "प्रगती",
+    "Progress Bar": "प्रगती पट्टा",
+    "progress bar timing: currentTime={1} duration={2}": "{2} पैकी {1}",
+    "Fullscreen": "संपूर्ण पडदा",
+    "Exit Fullscreen": "संपूर्ण पडद्यातून बाहेर पडा",
+    "Mute": "मुक",
+    "Unmute": "अमूक",
+    "Playback Rate": "प्लेबॅक दर",
+    "Subtitles": "उपशीर्षके",
+    "subtitles off": "उपशीर्षके बंद",
+    "Captions": "मथळे",
+    "captions off": "मथळे बंद",
+    "Chapters": "अध्याय",
+    "Descriptions": "वर्णने",
+    "descriptions off": "वर्णने बंद",
+    "Audio Track": "ध्वनि मार्ग",
+    "Volume Level": "आवाज पातळी",
+    "You aborted the media playback": "तुम्ही मीडिया प्लेबॅक रद्द केला",
+    "A network error caused the media download to fail part-way.": "नेटवर्क त्रुटीमुळे मीडिया डाउनलोड अर्ध्यात अयशस्वी झाला.",
+    "The media could not be loaded, either because the server or network failed or because the format is not supported.": "मीडिया लोड करता आला नाही, एकतर सर्व्हर किंवा नेटवर्क अयशस्वी झाल्यामुळे किंवा फॉरमॅट समर्थित नसल्यामुळे.",
+    "The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "मीडिया प्लेबॅक भ्रष्टाचाराच्या समस्येमुळे किंवा मीडियाने वापरलेल्या वैशिष्ट्यांमुळे तुमचा ब्राउझर सपोर्ट करत नसल्यामुळे रद्द करण्यात आला.",
+    "No compatible source was found for this media.": "या मीडियासाठी कोणताही सुसंगत स्रोत सापडला नाही.",
+    "The media is encrypted and we do not have the keys to decrypt it.": "मीडिया एन्क्रिप्ट केलेला आहे आणि तो डिक्रिप्ट करण्यासाठी आमच्याकडे कळा नाहीत.",
+    "Play Video": "चित्रवाणी वाजवा",
+    "Close": "बंद",
+    "Close Modal Dialog": "संवादी प्रलेखन बंद करा",
+    "Modal Window": "संवादी प्रलेखन",
+    "This is a modal window": "हे एक संवादी प्रलेखन आहे",
+    "This modal can be closed by pressing the Escape key or activating the close button.": "एस्केप कळ दाबून किंवा बंद कळ सक्रिय करून हे संवादी प्रलेखन बंद केले जाऊ शकते.",
+    ", opens captions settings dialog": ", मथळे नियंत्रण संवाद प्रलेखन उघडतो",
+    ", opens subtitles settings dialog": ", उपशीर्षक नियंत्रण संवाद प्रलेखन उघडतो",
+    ", opens descriptions settings dialog": ", वर्णन नियंत्रण संवाद प्रलेखन उघडतो",
+    ", selected": ", निवडले",
+    "captions settings": "मथळे नियंत्रण",
+    "subtitles settings": "उपशीर्षक नियंत्रण",
+    "descriptions settings": "वर्णन नियंत्रण",
+    "Text": "मजकूर",
+    "White": "पांढरा",
+    "Black": "काळा",
+    "Red": "लाल",
+    "Green": "हिरवा",
+    "Blue": "निळा",
+    "Yellow": "पिवळा",
+    "Magenta": "किरमिजी तांबडा",
+    "Cyan": "निळसर",
+    "Background": "पृष्ठभाग",
+    "Window": "चौकट",
+    "Transparent": "पारदर्शक",
+    "Semi-Transparent": "अर्ध-पारदर्शक",
+    "Opaque": "अपारदर्शक",
+    "Font Size": "अक्षराचा आकार",
+    "Text Edge Style": "मजकूर एज शैली",
+    "None": "काहीही नाही",
+    "Raised": "वाढवले",
+    "Depressed": "न दाबलेले",
+    "Uniform": "एकसमान",
+    "Drop shadow": "सावली सोडा",
+    "Font Family": "अक्षर कुटुंब",
+    "Proportional Sans-Serif": "आनुपातिक सॅन्स-सेरिफ",
+    "Monospace Sans-Serif": "मोनोस्पेस सॅन्स-सेरिफ",
+    "Proportional Serif": "आनुपातिक सेरिफ",
+    "Monospace Serif": "मोनोस्पेस सेरिफ",
+    "Casual": "प्रासंगिक",
+    "Script": "लेख",
+    "Small Caps": "लहान अक्षरे",
+    "Reset": "पुन्हा कर",
+    "restore all settings to the default values": "सर्व नियंत्रण डीफॉल्ट मूल्यांवर पुनर्संचयित करा",
+    "Done": "झाले",
+    "Caption Settings Dialog": "मथळा नियंत्रण संवाद प्रलेखन",
+    "Beginning of dialog window. Escape will cancel and close the window.": "डायलॉग विंडोची सुरुवात. Escape रद्द करेल आणि विंडो बंद करेल.",
+    "End of dialog window.": "डायलॉग विंडोचा शेवट.",
+    "{1} is loading.": "{1} लोड होत आहे.",
+    "Exit Picture-in-Picture": "पिक्चर-इन-पिक्चरमधून बाहेर पडा",
+    "Picture-in-Picture": "पिक्चर-इन-पिक्चर",
+    "No content": "सामग्री नाही",
+    "Color": "रंग",
+    "Opacity": "अपारदर्शकता",
+    "Text Background": "मजकूर पार्श्वभूमी",
+    "Caption Area Background": "मथळा क्षेत्र पार्श्वभूमी",
+    "Playing in Picture-in-Picture": "पिक्चर-इन-पिक्चरमध्ये वाजवत आहे",
+    "Skip backward {1} seconds": "मागे जा {1} सेकंद",
+    "Skip forward {1} seconds": "पुढे जा {1} सेकंद"
+  }
+

src/js/consts/errors.js

@@ -17,15 +17,14 @@ export default {
   AdsMacroReplacementFailed: 'ads-macro-replacement-failed',
   AdsResumeContentFailed: 'ads-resume-content-failed',
   // Errors used in contrib-eme:
-  EMEEncryptedError: 'eme-encrypted-error',
-  MSKeyError: 'ms-key-error',
-  WebkitKeyError: 'webkit-key-error',
   EMEFailedToRequestMediaKeySystemAccess: 'eme-failed-request-media-key-system-access',
   EMEFailedToCreateMediaKeys: 'eme-failed-create-media-keys',
   EMEFailedToAttachMediaKeysToVideoElement: 'eme-failed-attach-media-keys-to-video',
   EMEFailedToCreateMediaKeySession: 'eme-failed-create-media-key-session',
   EMEFailedToSetServerCertificate: 'eme-failed-set-server-certificate',
   EMEFailedToGenerateLicenseRequest: 'eme-failed-generate-license-request',
   EMEFailedToUpdateSessionWithReceivedLicenseKeys: 'eme-failed-update-session',
-  EMEFailedToCloseSession: 'eme-failed-close-session'
+  EMEFailedToCloseSession: 'eme-failed-close-session',
+  EMEFailedToRemoveKeysFromSession: 'eme-failed-remove-keys',
+  EMEFailedToLoadSessionBySessionId: 'eme-failed-load-session'
 };

src/js/control-bar/progress-control/time-tooltip.js

@@ -66,15 +66,24 @@ class TimeTooltip extends Component {
     // of the player. We calculate any gap between the left edge of the player
     // and the left edge of the `SeekBar` and add the number of pixels in the
     // `SeekBar` before hitting the `seekBarPoint`
-    const spaceLeftOfPoint = (seekBarRect.left - playerRect.left) + seekBarPointPx;
+    let spaceLeftOfPoint = (seekBarRect.left - playerRect.left) + seekBarPointPx;
 
     // This is the space right of the `seekBarPoint` available within the bounds
     // of the player. We calculate the number of pixels from the `seekBarPoint`
     // to the right edge of the `SeekBar` and add to that any gap between the
     // right edge of the `SeekBar` and the player.
-    const spaceRightOfPoint = (seekBarRect.width - seekBarPointPx) +
+    let spaceRightOfPoint = (seekBarRect.width - seekBarPointPx) +
       (playerRect.right - seekBarRect.right);
 
+    // spaceRightOfPoint is always NaN for mouse time display
+    // because the seekbarRect does not have a right property. This causes
+    // the mouse tool tip to be truncated when it's close to the right edge of the player.
+    // In such cases, we ignore the `playerRect.right - seekBarRect.right` value when calculating.
+    // For the sake of consistency, we ignore seekBarRect.left - playerRect.left for the left edge.
+    if (!spaceRightOfPoint) {
+      spaceRightOfPoint = seekBarRect.width - seekBarPointPx;
+      spaceLeftOfPoint = seekBarPointPx;
+    }
     // This is the number of pixels by which the tooltip will need to be pulled
     // further to the right to center it over the `seekBarPoint`.
     let pullTooltipBy = tooltipRect.width / 2;

src/js/control-bar/skip-buttons/skip-backward.js

@@ -18,7 +18,7 @@ class SkipBackward extends Button {
 
     if (this.skipTime && this.validOptions.includes(this.skipTime)) {
       this.setIcon(`replay-${this.skipTime}`);
-      this.controlText(this.localize('Skip backward {1} seconds', [this.skipTime]));
+      this.controlText(this.localize('Skip backward {1} seconds', [this.skipTime.toLocaleString(player.language())]));
       this.show();
     } else {
       this.hide();

src/js/control-bar/skip-buttons/skip-forward.js

@@ -18,7 +18,7 @@ class SkipForward extends Button {
 
     if (this.skipTime && this.validOptions.includes(this.skipTime)) {
       this.setIcon(`forward-${this.skipTime}`);
-      this.controlText(this.localize('Skip forward {1} seconds', [this.skipTime]));
+      this.controlText(this.localize('Skip forward {1} seconds', [this.skipTime.toLocaleString(player.language())]));
       this.show();
     } else {
       this.hide();

src/js/player.js

@@ -776,6 +776,19 @@ class Player extends Component {
     // Default state of video is paused
     this.addClass('vjs-paused');
 
+    const deviceClassNames = [
+      'IS_SMART_TV',
+      'IS_TIZEN',
+      'IS_WEBOS',
+      'IS_ANDROID',
+      'IS_IPAD',
+      'IS_IPHONE'
+    ].filter(key => browser[key]).map(key => {
+      return 'vjs-device-' + key.substring(3).toLowerCase().replace(/\_/g, '-');
+    });
+
+    this.addClass(...deviceClassNames);
+
     // Add a style element in the player that we'll use to set the width/height
     // of the player in a way that's still overridable by CSS, just like the
     // video element

src/js/utils/browser.js

@@ -156,6 +156,14 @@ export let IS_TIZEN = false;
  */
 export let IS_WEBOS = false;
 
+/**
+ * Whether or not this is a Smart TV (Tizen or WebOS) device.
+ *
+ * @static
+ * @type {Boolean}
+ */
+export let IS_SMART_TV = false;
+
 /**
  * Whether or not this device is touch-enabled.
  *
@@ -255,7 +263,9 @@ if (!IS_CHROMIUM) {
 
   IS_WEBOS = (/Web0S/i).test(USER_AGENT);
 
-  IS_SAFARI = (/Safari/i).test(USER_AGENT) && !IS_CHROME && !IS_ANDROID && !IS_EDGE && !IS_TIZEN && !IS_WEBOS;
+  IS_SMART_TV = IS_TIZEN || IS_WEBOS;
+
+  IS_SAFARI = (/Safari/i).test(USER_AGENT) && !IS_CHROME && !IS_ANDROID && !IS_EDGE && !IS_SMART_TV;
 
   IS_WINDOWS = (/Windows/i).test(USER_AGENT);
 

test/unit/player.test.js

@@ -967,6 +967,84 @@ QUnit.test('should add a touch-enabled classname when touch is supported', funct
   player.dispose();
 });
 
+QUnit.test('should add smart-tv classname when on smart tv', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_SMART_TV(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-smart-tv'), 'smart-tv classname added');
+
+  browser.reset_IS_SMART_TV();
+  player.dispose();
+});
+
+QUnit.test('should add webos classname when on webos', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_WEBOS(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-webos'), 'webos classname added');
+
+  browser.reset_IS_WEBOS();
+  player.dispose();
+});
+
+QUnit.test('should add tizen classname when on tizen', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_TIZEN(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-tizen'), 'tizen classname added');
+
+  browser.reset_IS_TIZEN();
+  player.dispose();
+});
+
+QUnit.test('should add android classname when on android', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_ANDROID(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-android'), 'android classname added');
+
+  browser.reset_IS_ANDROID();
+  player.dispose();
+});
+
+QUnit.test('should add ipad classname when on ipad', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_IPAD(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-ipad'), 'ipad classname added');
+
+  browser.reset_IS_IPAD();
+  player.dispose();
+});
+
+QUnit.test('should add iphone classname when on iphone', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_IPHONE(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-iphone'), 'iphone classname added');
+
+  browser.reset_IS_IPHONE();
+  player.dispose();
+});
+
 QUnit.test('should add a svg-icons-enabled classname when svg icons are supported', function(assert) {
   // Stub a successful parsing of the SVG sprite.
   sinon.stub(window.DOMParser.prototype, 'parseFromString').returns({
@@ -3492,3 +3570,4 @@ QUnit.test('smooth seeking set to true should update the display time components
   seekBarUpdate.restore();
   player.dispose();
 });
+