shaka-player 3.3.4 → 4.0.1

package/test/util/periods_unit.js

@@ -996,6 +996,85 @@ describe('PeriodCombiner', () => {
     expect(audio2.originalId).toBe('2,4');
   });
 
+  it('Matches streams with related codecs', async () => {
+    const stream1 = makeVideoStream(1080);
+    stream1.originalId = '1';
+    stream1.bandwidth = 120000;
+    stream1.codecs = 'hvc1.1.4.L126.B0';
+
+    const stream2 = makeVideoStream(1080);
+    stream2.originalId = '2';
+    stream2.bandwidth = 120000;
+    stream2.codecs = 'hev1.2.4.L123.B0';
+
+    const stream3 = makeVideoStream(1080);
+    stream3.originalId = '3';
+    stream3.bandwidth = 120000;
+    stream3.codecs = 'dvhe.05.01';
+
+    const stream4 = makeVideoStream(1080);
+    stream4.originalId = '4';
+    stream4.bandwidth = 120000;
+    stream4.codecs = 'dvh1.05.01';
+
+    const stream5 = makeVideoStream(1080);
+    stream5.originalId = '5';
+    stream5.bandwidth = 120000;
+    stream5.codecs = 'avc1.42001f';
+
+    const stream6 = makeVideoStream(1080);
+    stream6.originalId = '6';
+    stream6.bandwidth = 120000;
+    stream6.codecs = 'avc3.42001f';
+
+    const stream7 = makeVideoStream(1080);
+    stream7.originalId = '7';
+    stream7.bandwidth = 120000;
+    stream7.codecs = 'vp09.00.10.08';
+
+    const stream8 = makeVideoStream(1080);
+    stream8.originalId = '8';
+    stream8.bandwidth = 120000;
+    stream8.codecs = 'vp09.01.20.08.01';
+
+    /** @type {!Array.<shaka.util.PeriodCombiner.Period>} */
+    const periods = [
+      {
+        id: '0',
+        videoStreams: [
+          stream1, stream3, stream5, stream7,
+        ],
+        audioStreams: [],
+        textStreams: [],
+        imageStreams: [],
+      },
+      {
+        id: '1',
+        videoStreams: [
+          stream2, stream4, stream6, stream8,
+        ],
+        audioStreams: [],
+        textStreams: [],
+        imageStreams: [],
+      },
+    ];
+
+    await combiner.combinePeriods(periods, /* isDynamic= */ true);
+    const variants = combiner.getVariants();
+    expect(variants.length).toBe(4);
+    // We can use the originalId field to see what each track is composed of.
+    const video1 = variants[0].video;
+    expect(video1.originalId).toBe('1,2');
+
+    const video2 = variants[1].video;
+    expect(video2.originalId).toBe('3,4');
+
+    const video3 = variants[2].video;
+    expect(video3.originalId).toBe('5,6');
+
+    const video4 = variants[3].video;
+    expect(video4.originalId).toBe('7,8');
+  });
 
   it('Matches streams with most roles in common', async () => {
     const makeAudioStreamWithRoles = (roles) => {

package/test/util/stream_utils_unit.js

@@ -619,11 +619,20 @@ describe('StreamUtils', () => {
           stream.mimeType = 'image/png';
         });
         manifest.addImageStream(3, (stream) => {
-          stream.mimeType = 'image/jpeg';
+          stream.mimeType = 'image/jpg';
         });
         manifest.addImageStream(4, (stream) => {
+          stream.mimeType = 'image/jpeg';
+        });
+        manifest.addImageStream(5, (stream) => {
           stream.mimeType = 'image/bogus';
         });
+        manifest.addImageStream(6, (stream) => {
+          stream.mimeType = 'image/avif';
+        });
+        manifest.addImageStream(7, (stream) => {
+          stream.mimeType = 'image/webp';
+        });
       });
 
       const noVariant = null;
@@ -631,12 +640,19 @@ describe('StreamUtils', () => {
           fakeDrmEngine, noVariant, manifest);
 
       // Covers a regression in which we would remove streams with codecs.
-      // The last two streams should be removed because their full MIME types
-      // are bogus.
-      expect(manifest.imageStreams.length).toBe(3);
-      expect(manifest.imageStreams[0].id).toBe(1);
-      expect(manifest.imageStreams[1].id).toBe(2);
-      expect(manifest.imageStreams[2].id).toBe(3);
+      // The first 4 streams should be there because they are always supported.
+      // The 5th stream should be removed because the MIME type is bogus.
+      // The 6th and 7th streams may be there, based on platform support.
+      expect(manifest.imageStreams).toContain(
+          jasmine.objectContaining({id: 1}));
+      expect(manifest.imageStreams).toContain(
+          jasmine.objectContaining({id: 2}));
+      expect(manifest.imageStreams).toContain(
+          jasmine.objectContaining({id: 3}));
+      expect(manifest.imageStreams).toContain(
+          jasmine.objectContaining({id: 4}));
+      expect(manifest.imageStreams).not.toContain(
+          jasmine.objectContaining({id: 5}));
     });
 
     it('filters transport streams', async () => {

package/ui/controls.js

@@ -9,7 +9,6 @@ goog.provide('shaka.ui.Controls');
 goog.provide('shaka.ui.ControlsPanel');
 
 goog.require('goog.asserts');
-goog.require('shaka.Deprecate');
 goog.require('shaka.ads.AdManager');
 goog.require('shaka.cast.CastProxy');
 goog.require('shaka.log');
@@ -556,33 +555,74 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
     this.hideSettingsMenusTimer_.tickNow();
   }
 
+  /**
+   * @return {boolean}
+   * @export
+   */
+  isFullScreenSupported() {
+    if (document.fullscreenEnabled) {
+      return true;
+    }
+    const video = /** @type {HTMLVideoElement} */(this.localVideo_);
+    if (video.webkitSupportsFullscreen) {
+      return true;
+    }
+    return false;
+  }
+
+  /**
+   * @return {boolean}
+   * @export
+   */
+  isFullScreenEnabled() {
+    if (document.fullscreenEnabled) {
+      return !!document.fullscreenElement;
+    }
+    const video = /** @type {HTMLVideoElement} */(this.localVideo_);
+    if (video.webkitSupportsFullscreen) {
+      return video.webkitDisplayingFullscreen;
+    }
+    return false;
+  }
+
   /** @export */
   async toggleFullScreen() {
-    if (document.fullscreenElement) {
-      if (screen.orientation) {
-        screen.orientation.unlock();
-      }
-      await document.exitFullscreen();
-    } else {
-      // If we are in PiP mode, leave PiP mode first.
-      try {
-        if (document.pictureInPictureElement) {
-          await document.exitPictureInPicture();
+    if (document.fullscreenEnabled) {
+      if (document.fullscreenElement) {
+        if (screen.orientation) {
+          screen.orientation.unlock();
         }
-        await this.videoContainer_.requestFullscreen({navigationUI: 'hide'});
-        if (this.config_.forceLandscapeOnFullscreen && screen.orientation) {
-          try {
-            // Locking to 'landscape' should let it be either
-            // 'landscape-primary' or 'landscape-secondary' as appropriate.
-            await screen.orientation.lock('landscape');
-          } catch (error) {
-            // If screen.orientation.lock does not work on a device, it will
-            // be rejected with an error. Suppress that error.
+        await document.exitFullscreen();
+      } else {
+        // If we are in PiP mode, leave PiP mode first.
+        try {
+          if (document.pictureInPictureElement) {
+            await document.exitPictureInPicture();
+          }
+          await this.videoContainer_.requestFullscreen({navigationUI: 'hide'});
+          if (this.config_.forceLandscapeOnFullscreen && screen.orientation) {
+            try {
+              // Locking to 'landscape' should let it be either
+              // 'landscape-primary' or 'landscape-secondary' as appropriate.
+              await screen.orientation.lock('landscape');
+            } catch (error) {
+              // If screen.orientation.lock does not work on a device, it will
+              // be rejected with an error. Suppress that error.
+            }
           }
+        } catch (error) {
+          this.dispatchEvent(new shaka.util.FakeEvent(
+              'error', (new Map()).set('detail', error)));
+        }
+      }
+    } else {
+      const video = /** @type {HTMLVideoElement} */(this.localVideo_);
+      if (video.webkitSupportsFullscreen) {
+        if (video.webkitDisplayingFullscreen) {
+          video.webkitExitFullscreen();
+        } else {
+          video.webkitEnterFullscreen();
         }
-      } catch (error) {
-        this.dispatchEvent(new shaka.util.FakeEvent(
-            'error', (new Map()).set('detail', error)));
       }
     }
   }
@@ -702,7 +742,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
     });
 
     this.eventManager_.listen(this.controlsContainer_, 'dblclick', () => {
-      if (this.config_.doubleClickForFullscreen && document.fullscreenEnabled) {
+      if (this.config_.doubleClickForFullscreen &&
+          this.isFullScreenSupported()) {
         this.toggleFullScreen();
       }
     });
@@ -826,22 +867,6 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
         const factory =
             shaka.ui.ControlsPanel.elementNamesToFactories_.get(name);
         const element = factory.create(this.controlsButtonPanel_, this);
-
-        if (typeof element.release != 'function') {
-          shaka.Deprecate.deprecateFeature(4,
-              'shaka.extern.IUIElement',
-              'Please update UI elements to have a release() method.');
-
-          // This cast works around compiler strictness about the IUIElement
-          // type being "@struct" (as ES6 classes are by default).
-          const moddableElement = /** @type {Object} */(element);
-          moddableElement['release'] = () => {
-            if (moddableElement['destroy']) {
-              moddableElement['destroy']();
-            }
-          };
-        }
-
         this.elements_.push(element);
       } else {
         shaka.log.alwaysWarn('Unrecognized control panel element requested:',

package/ui/fullscreen_button.js

@@ -28,16 +28,16 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
   constructor(parent, controls) {
     super(parent, controls);
 
+    /** @private {HTMLMediaElement} */
+    this.localVideo_ = this.controls.getLocalVideo();
+
     /** @private {!HTMLButtonElement} */
     this.button_ = shaka.util.Dom.createButton();
     this.button_.classList.add('shaka-fullscreen-button');
     this.button_.classList.add('material-icons-round');
     this.button_.classList.add('shaka-tooltip');
 
-    // Don't show the button if fullscreen is not supported
-    if (!document.fullscreenEnabled) {
-      this.button_.classList.add('shaka-hidden');
-    }
+    this.checkSupport_();
 
     this.button_.textContent = shaka.ui.Enums.MaterialDesignIcons.FULLSCREEN;
     this.parent.appendChild(this.button_);
@@ -61,6 +61,26 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
       this.updateIcon_();
       this.updateAriaLabel_();
     });
+
+    this.eventManager.listen(this.localVideo_, 'loadedmetadata', () => {
+      this.checkSupport_();
+    });
+
+    this.eventManager.listen(this.localVideo_, 'loadeddata', () => {
+      this.checkSupport_();
+    });
+  }
+
+  /**
+   * @private
+   */
+  checkSupport_() {
+    // Don't show the button if fullscreen is not supported
+    if (!this.controls.isFullScreenSupported()) {
+      this.button_.classList.add('shaka-hidden');
+    } else {
+      this.button_.classList.remove('shaka-hidden');
+    }
   }
 
   /**
@@ -68,7 +88,7 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
    */
   updateAriaLabel_() {
     const LocIds = shaka.ui.Locales.Ids;
-    const label = document.fullscreenElement ?
+    const label = this.controls.isFullScreenEnabled() ?
         LocIds.EXIT_FULL_SCREEN : LocIds.FULL_SCREEN;
 
     this.button_.ariaLabel = this.localization.resolve(label);
@@ -79,7 +99,7 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
    */
   updateIcon_() {
     this.button_.textContent =
-      document.fullscreenElement ?
+      this.controls.isFullScreenEnabled() ?
       shaka.ui.Enums.MaterialDesignIcons.EXIT_FULLSCREEN :
       shaka.ui.Enums.MaterialDesignIcons.FULLSCREEN;
   }

package/ui/less/containers.less

@@ -337,8 +337,8 @@
 
 .shaka-spinner {
   /* This uses the same trickery as the big play button define
-   * the spinner's width and height. See .shaka-play-button
-   * for the detailed explanation. */
+  the spinner's width and height. See .shaka-play-button
+  for the detailed explanation. */
 
   /* For the padding thing to work, spinner div needs to be an
   overlay-parent and spinner svg - an overlay child. */
@@ -351,6 +351,6 @@
   height: 0;
 
   /* Add a bit of a white shadow to keep our black spinner visible
-   * on a black background. */
+  on a black background. */
   filter: drop-shadow(0 0 2px rgba(255 255 255 / 50%));
 }

package/ui/locales/en.json

@@ -27,6 +27,7 @@
   "PICTURE_IN_PICTURE": "Picture-in-Picture",
   "PLAY": "Play",
   "PLAYBACK_RATE": "Playback speed",
+  "QUALITY": "Quality",
   "REPLAY": "Replay",
   "RESOLUTION": "Resolution",
   "REWIND": "Rewind",

package/ui/locales/source.json

@@ -113,6 +113,11 @@
     "message": "Playback speed",
     "description": "Label for a button used to navigate to a submenu to choose the playback speed in the video player."
   },
+  "QUALITY": {
+    "description": "Label for a button used to open a submenu to choose audio quality in the video player.",
+    "meaning": "Audio quality",
+    "message": "Quality"
+  },
   "REPLAY": {
     "description": "Label for a button used to replay the video in a video player.",
     "message": "Replay"

package/ui/resolution_selection.js

@@ -61,9 +61,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
     });
 
     this.updateResolutionSelection_();
-
-    // Set up all the strings in the user's preferred language.
-    this.updateLocalizedStrings_();
   }
 
 
@@ -72,27 +69,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
     /** @type {!Array.<shaka.extern.Track>} */
     let tracks = this.player.getVariantTracks();
 
-    // Hide resolution menu and button for audio-only content and src= content
-    // without resolution information.
-    // TODO: for audio-only content, this should be a bitrate selection menu
-    // instead.
-    if (tracks.length && !tracks[0].height) {
-      shaka.ui.Utils.setDisplay(this.menu, false);
-      shaka.ui.Utils.setDisplay(this.button, false);
-      return;
-    }
-    // Otherwise, restore it.
-    shaka.ui.Utils.setDisplay(this.button, true);
-
-    tracks.sort((t1, t2) => {
-      // We have already screened for audio-only content, but the compiler
-      // doesn't know that.
-      goog.asserts.assert(t1.height != null, 'Null height');
-      goog.asserts.assert(t2.height != null, 'Null height');
-
-      return t2.height - t1.height;
-    });
-
     // If there is a selected variant track, then we filter out any tracks in
     // a different language.  Then we use those remaining tracks to display the
     // available resolutions.
@@ -104,14 +80,31 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
               track.channelsCount == selectedTrack.channelsCount);
     }
 
-    // Remove duplicate entries with the same height.  This can happen if
-    // we have multiple resolutions of audio.  Pick an arbitrary one.
+    // Remove duplicate entries with the same resolution or quality depending
+    // on content type.  Pick an arbitrary one.
     tracks = tracks.filter((track, idx) => {
-      // Keep the first one with the same height.
-      const otherIdx = tracks.findIndex((t) => t.height == track.height);
+      // Keep the first one with the same height or bandwidth.
+      const otherIdx = this.player.isAudioOnly() ?
+          tracks.findIndex((t) => t.bandwidth == track.bandwidth) :
+          tracks.findIndex((t) => t.height == track.height);
       return otherIdx == idx;
     });
 
+    // Sort the tracks by height or bandwidth depending on content type.
+    if (this.player.isAudioOnly()) {
+      tracks.sort((t1, t2) => {
+        goog.asserts.assert(t1.bandwidth != null, 'Null bandwidth');
+        goog.asserts.assert(t2.bandwidth != null, 'Null bandwidth');
+        return t2.bandwidth - t1.bandwidth;
+      });
+    } else {
+      tracks.sort((t1, t2) => {
+        goog.asserts.assert(t1.height != null, 'Null height');
+        goog.asserts.assert(t2.height != null, 'Null height');
+        return t2.height - t1.height;
+      });
+    }
+
     // Remove old shaka-resolutions
     // 1. Save the back to menu button
     const backButton = shaka.ui.Utils.getFirstDescendantWithClassName(
@@ -133,7 +126,8 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
           () => this.onTrackSelected_(track));
 
       const span = shaka.util.Dom.createHTMLElement('span');
-      span.textContent = track.height + 'p';
+      span.textContent = this.player.isAudioOnly() ?
+          Math.round(track.bandwidth / 1000) + ' kbits/s' : track.height + 'p';
       button.appendChild(span);
 
       if (!abrEnabled && track == selectedTrack) {
@@ -179,6 +173,8 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
     shaka.ui.Utils.focusOnTheChosenItem(this.menu);
     this.controls.dispatchEvent(
         new shaka.util.FakeEvent('resolutionselectionupdated'));
+
+    this.updateLocalizedStrings_();
   }
 
 
@@ -200,13 +196,15 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
    */
   updateLocalizedStrings_() {
     const LocIds = shaka.ui.Locales.Ids;
+    const locId = this.player.isAudioOnly() ?
+        LocIds.QUALITY : LocIds.RESOLUTION;
 
-    this.button.ariaLabel = this.localization.resolve(LocIds.RESOLUTION);
-    this.backButton.ariaLabel = this.localization.resolve(LocIds.RESOLUTION);
+    this.button.ariaLabel = this.localization.resolve(locId);
+    this.backButton.ariaLabel = this.localization.resolve(locId);
     this.backSpan.textContent =
-        this.localization.resolve(LocIds.RESOLUTION);
+        this.localization.resolve(locId);
     this.nameSpan.textContent =
-        this.localization.resolve(LocIds.RESOLUTION);
+        this.localization.resolve(locId);
     this.abrOnSpan_.textContent =
         this.localization.resolve(LocIds.AUTO_QUALITY);
 

package/ui/ui.js

@@ -448,14 +448,6 @@ shaka.ui.Overlay.TrackLabelFormat = {
   'LABEL': 3,
 };
 
-/*
- * "shaka.ui.TrackLabelFormat" is deprecated and will be removed in v4.
- *
- * @deprecated
- * @enum {number}
- */
-shaka.ui.TrackLabelFormat = shaka.ui.Overlay.TrackLabelFormat;
-
 /**
  * Describes the possible reasons that the UI might fail to load.
  *
@@ -468,15 +460,6 @@ shaka.ui.Overlay.FailReasonCode = {
 };
 
 
-/**
- * "shaka.ui.FailReasonCode" is deprecated and will be removed in v4.
- *
- * @deprecated
- * @enum {number}
- */
-shaka.ui.FailReasonCode = shaka.ui.Overlay.FailReasonCode;
-
-
 if (document.readyState == 'complete') {
   // Don't fire this event synchronously.  In a compiled bundle, the "shaka"
   // namespace might not be exported to the window until after this point.

package/docs/tutorials/gsoc-ideas-list.md

@@ -1,3 +0,0 @@
-# Google Summer of Code Ideas List
-
-Please see the latest project ideas list [here](https://storage.googleapis.com/wvtemp/shaka/Shaka%20Player%20GSoC%20Projects%20List.pdf).