shaka-player 2.5.4 → 2.5.5

package/.csslintrc

@@ -0,0 +1,13 @@
+{
+    "extends": "stylelint-config-standard",
+    "rules": {
+      "font-family-no-missing-generic-family-keyword": null,
+      "declaration-block-single-line-max-declarations": null,
+      "max-line-length": [ 80, {
+        ignorePattern: "/^@import\\s+/",
+      }],
+      "selector-list-comma-newline-after": "never-multi-line",
+      "selector-pseudo-element-colon-notation": "single",
+      "unit-whitelist": ["em", "%", "px", "s", "deg", "vmin", "ms", "vh"]
+    }
+}

package/CHANGELOG.md

@@ -1,3 +1,59 @@
+## 2.5.5 (2019-08-23)
+
+New Features:
+  - Conditionally remove FairPlay formatting
+    - https://github.com/google/shaka-player/issues/1951
+  - Add sessionId field to network request
+  - Make it easier to add custom overflow menu items
+    - https://github.com/google/shaka-player/issues/2091
+  - Add clearBufferOnQualityChange field to UI config
+    - https://github.com/google/shaka-player/issues/1733
+  - Allow filtering out failed HLS text tracks
+    - https://github.com/google/shaka-player/issues/2065
+  - Parse Accessibility tag into text "kind"
+    - https://github.com/google/shaka-player/issues/2060
+  - Re-add MediaSession API
+    - https://github.com/google/shaka-player/issues/1934
+  - Skip WebM streams in HLS instead of throwing
+    - https://github.com/google/shaka-player/issues/2108
+  - Convert `<mspr:pro>` elements to `pssh` init data
+    - https://github.com/google/shaka-player/pull/2106
+    - https://github.com/google/shaka-player/issues/2058
+
+Bugfixes:
+  - Fix duplicate resolution entries in UI menu
+    - https://github.com/google/shaka-player/issues/2085
+  - Fix missing tracks, race on time during startup
+    - https://github.com/google/shaka-player/issues/2045
+  - Fix spinner position on IE11
+    - https://github.com/google/shaka-player/issues/2084
+  - Fix seek bar coloring when nothing buffered
+  - Fix scroll behavior on page load
+    - https://github.com/google/shaka-player/issues/2063
+  - Don't create a UI if the app already has one
+    - https://github.com/google/shaka-player/issues/2073
+  - Fix text display styling when fullscreen
+    - https://github.com/google/shaka-player/issues/2051
+  - Don't enter fullscreen on double click on bottom bar
+    - https://github.com/google/shaka-player/issues/2053
+  - Avoid errors when video ends
+    - https://github.com/google/shaka-player/issues/2050
+  - Fix fullscreen behavior on double click and rotate
+    - https://github.com/google/shaka-player/issues/2043
+  - Fix bug when clicking PIP button while casting
+    - https://github.com/google/shaka-player/issues/2044
+  - Fix CEA captions with multi-Period content
+    - https://github.com/google/shaka-player/issues/2075
+    - https://github.com/google/shaka-player/issues/2094
+
+Demo App:
+  - Added more HLS demo assets
+    - https://github.com/google/shaka-player/issues/2035
+  - Exit PIP on unload in the demo
+    - https://github.com/google/shaka-player/issues/2055
+  - Re-added hidden 'noinput' param to demo
+
+
 ## 2.5.4 (2019-07-19)
 
 Bugfixes:

package/build/build.py

@@ -169,7 +169,9 @@ class Build(object):
     core_files = core_build.include
     if self.exclude & core_files:
       logging.error('Cannot exclude files from core')
+      return False
     self.include |= core_files
+    return True
 
   def has_ui(self):
     """Returns True if the UI library is in the build."""
@@ -264,7 +266,8 @@ class Build(object):
       True on success; False on failure.
     """
     self.add_closure()
-    self.add_core()
+    if not self.add_core():
+      return False
     if self.has_ui():
       self.generate_localizations(locales, force)
 

package/build/check.py

@@ -54,6 +54,22 @@ def check_js_lint(args):
   return linter.lint(fix=args.fix, force=args.force)
 
 
+def check_css_lint(args):
+  """Runs the CSS linter."""
+  logging.info('Linting CSS...')
+
+  match = re.compile(r'.*\.(less|css)$')
+  base = shakaBuildHelpers.get_source_base()
+  def get(*path_components):
+    return shakaBuildHelpers.get_all_files(
+        os.path.join(base, *path_components), match)
+  files = (get('ui') + get('demo'));
+  config_path = os.path.join(base, '.csslintrc')
+
+  linter = compiler.CssLinter(files, config_path)
+  return linter.lint(fix=args.fix, force=args.force)
+
+
 def check_html_lint(args):
   """Runs the HTML linter."""
   logging.info('Linting HTML...')
@@ -169,6 +185,7 @@ def main(args):
   steps = [
       check_js_lint,
       check_html_lint,
+      check_css_lint,
       check_complete,
       check_tests,
   ]

package/build/compiler.py

@@ -306,6 +306,46 @@ class Linter(object):
     return True
 
 
+class CssLinter(object):
+  def __init__(self, source_files, config_path):
+    self.source_files = _canonicalize_source_files(source_files)
+    self.config_path = config_path
+    self.output = _get_source_path('dist/.csslintstamp')
+
+  def lint(self, fix=False, force=False):
+    """Run CSS linter checks on the files in |self.source_files|.
+
+    Args:
+      fix: If True, ask the linter to fix what errors it can automatically.
+      force: Run linter checks even if the inputs have not changed.
+
+    Returns:
+      True on success; False on failure.
+    """
+    deps = self.source_files + [self.config_path]
+    if not force and not _must_build(self.output, deps):
+      return True
+
+    stylelint = shakaBuildHelpers.get_node_binary('stylelint')
+    cmd_line = stylelint + ['--config', self.config_path] + self.source_files
+    # Disables globbing, since that messes up our nightly tests, and we don't
+    # use it anyway.
+    # This is currently a flag added in a fork we maintain, but there is a pull
+    # request in progress for this.
+    # See: https://github.com/stylelint/stylelint/issues/4193
+    cmd_line += ['--disable-globbing'];
+
+    if fix:
+      cmd_line += ['--fix']
+
+    if shakaBuildHelpers.execute_get_code(cmd_line) != 0:
+      return False
+
+    # Update the timestamp of the file that tracks when we last updated.
+    _update_timestamp(self.output)
+    return True
+
+
 class HtmlLinter(object):
   def __init__(self, source_files, config_path):
     self.source_files = _canonicalize_source_files(source_files)

package/build/types/core

@@ -63,6 +63,7 @@
 +../../lib/util/ebml_parser.js
 +../../lib/util/error.js
 +../../lib/util/event_manager.js
++../../lib/util/fairplay_utils.js
 +../../lib/util/fake_event.js
 +../../lib/util/fake_event_target.js
 +../../lib/util/functional.js

package/build/types/ui

@@ -3,6 +3,8 @@
 +../../third_party/language-mapping-list/language-mapping-list.js
 +../../ui/audio_language_selection.js
 +../../ui/externs/ui.js
++../../ui/play_button.js
++../../ui/big_play_button.js
 +../../ui/cast_button.js
 +../../ui/controls.js
 +../../ui/constants.js
@@ -15,12 +17,13 @@
 +../../ui/mute_button.js
 +../../ui/overflow_menu.js
 +../../ui/pip_button.js
-+../../ui/play_pause_button.js
++../../ui/small_play_button.js
 +../../ui/presentation_time.js
 +../../ui/range_element.js
 +../../ui/resolution_selection.js
 +../../ui/rewind_button.js
 +../../ui/seek_bar.js
++../../ui/settings_menu.js
 +../../ui/spacer.js
 +../../ui/text_displayer.js
 +../../ui/text_selection.js

package/demo/asset_card.js

@@ -41,7 +41,14 @@ shakaDemo.AssetCard = class {
     /** @private {!Element} */
     this.featureIconsContainer_ = document.createElement('div');
     /** @private {!Element} */
-    this.progressBar_ = document.createElement('progress');
+    this.progressCircle_ = document.createElement('div');
+    const svgns = 'http://www.w3.org/2000/svg';
+    /** @private {!Element} */
+    this.progressCircleSvg_ = document.createElementNS(svgns, 'svg');
+    /** @private {!Element} */
+    this.progressCircleBack_ = document.createElementNS(svgns, 'circle');
+    /** @private {!Element} */
+    this.progressCircleBar_ = document.createElementNS(svgns, 'circle');
     /** @private {function(!shakaDemo.AssetCard)} */
     this.remakeButtonsFn_ = remakeButtonsFn;
 
@@ -56,7 +63,8 @@ shakaDemo.AssetCard = class {
     this.card_.appendChild(titleDiv);
     const titleText = document.createElement('h2');
     titleText.classList.add('mdl-card__title-text');
-    titleText.textContent = asset.shortName || asset.name;
+    titleText.textContent =
+        isFeatured ? (asset.shortName || asset.name) : asset.name;
     titleDiv.appendChild(titleText);
 
     if (asset.iconUri) {
@@ -95,12 +103,17 @@ shakaDemo.AssetCard = class {
     this.actions_.classList.add('mdl-card--border');
     this.card_.appendChild(this.actions_);
 
-    const progressContainer = document.createElement('div');
-    this.progressBar_.classList.add('hidden');
-    this.progressBar_.setAttribute('max', 1);
-    this.progressBar_.setAttribute('value', asset.storedProgress);
-    progressContainer.appendChild(this.progressBar_);
-    this.card_.appendChild(progressContainer);
+    this.progressCircle_.classList.add('hidden');
+    this.progressCircle_.classList.add('progress-circle');
+    this.card_.appendChild(this.progressCircle_);
+    this.progressCircleSvg_.appendChild(this.progressCircleBack_);
+    this.progressCircleSvg_.appendChild(this.progressCircleBar_);
+    this.progressCircle_.appendChild(this.progressCircleSvg_);
+    // You can't use access the classList of an svg on IE, so set the class
+    // attribute instead.
+    this.progressCircleSvg_.setAttribute('class', 'progress-circle-svg');
+    this.progressCircleBack_.setAttribute('class', 'progress-circle-back');
+    this.progressCircleBar_.setAttribute('class', 'progress-circle-bar');
 
     parentDiv.appendChild(this.card_);
     // Remake buttons AFTER appending to parent div, so that any tooltips can
@@ -108,6 +121,23 @@ shakaDemo.AssetCard = class {
     this.remakeButtons();
   }
 
+  /**
+   * @param {number} progress
+   * @private
+   */
+  styleProgressCircle_(progress) {
+    const svg = this.progressCircleSvg_;
+    const bar = this.progressCircleBar_;
+    const circleSize = 45;
+    const circleThickness = 5;
+    const circleRadius = (circleSize - circleThickness) / 2;
+    const circumference = 2 * Math.PI * circleRadius;
+
+    svg.setAttribute('viewBox', '0 0 ' + circleSize + ' ' + circleSize);
+    bar.setAttribute('stroke-dasharray', circumference);
+    bar.setAttribute('stroke-dashoffset', (circumference * (1 - progress)));
+  }
+
   /**
    * @param {string} icon
    * @param {string} title
@@ -327,17 +357,17 @@ shakaDemo.AssetCard = class {
    */
   updateProgress() {
     if (this.asset_.storedProgress < 1) {
-      this.progressBar_.classList.remove('hidden');
+      this.progressCircle_.classList.remove('hidden');
       for (const button of this.actions_.childNodes) {
         button.disabled = true;
       }
     } else {
-      this.progressBar_.classList.add('hidden');
+      this.progressCircle_.classList.add('hidden');
       for (const button of this.actions_.childNodes) {
         button.disabled = false;
       }
     }
-    this.progressBar_.setAttribute('value', this.asset_.storedProgress);
+    this.styleProgressCircle_(this.asset_.storedProgress);
   }
 
   /**

package/demo/cast_receiver/receiver_app.css

@@ -72,7 +72,6 @@ body {
    * they will be visible on top until we decide to hide them and show the
    * player. */
   z-index: 99;
-
   padding-top: 60px;
   padding-left: 0;
   background-color: black;
@@ -105,18 +104,25 @@ body:after {
 }
 
 @keyframes bg-change {
-  0%   { background-image: url('idle1.jpg'); padding-left: 0; }
-  32%  { background-image: url('idle1.jpg'); padding-left: 0; }
-
-  34%  { background-image: url('idle2.jpg'); padding-left: 0; }
-  49%  { background-image: url('idle2.jpg'); padding-left: 0; }
-  50%  { background-image: url('idle2.jpg'); padding-left: 400px; }
-  65%  { background-image: url('idle2.jpg'); padding-left: 400px; }
-
-  67%  { background-image: url('idle3.jpg'); padding-left: 400px; }
-  87%  { background-image: url('idle3.jpg'); padding-left: 400px; }
-  88%  { background-image: url('idle3.jpg'); padding-left: 0; }
-  98%  { background-image: url('idle3.jpg'); padding-left: 0; }
+  0% { background-image: url('idle1.jpg'); padding-left: 0; }
+
+  32% { background-image: url('idle1.jpg'); padding-left: 0; }
+
+  34% { background-image: url('idle2.jpg'); padding-left: 0; }
+
+  49% { background-image: url('idle2.jpg'); padding-left: 0; }
+
+  50% { background-image: url('idle2.jpg'); padding-left: 400px; }
+
+  65% { background-image: url('idle2.jpg'); padding-left: 400px; }
+
+  67% { background-image: url('idle3.jpg'); padding-left: 400px; }
+
+  87% { background-image: url('idle3.jpg'); padding-left: 400px; }
+
+  88% { background-image: url('idle3.jpg'); padding-left: 0; }
+
+  98% { background-image: url('idle3.jpg'); padding-left: 0; }
 
   100% { background-image: url('idle1.jpg'); padding-left: 0; }
 }

package/demo/close_button.js

@@ -39,12 +39,6 @@ shakaDemo.CloseButton = class extends shaka.ui.Element {
     this.parent.appendChild(this.button_);
 
     this.button_.addEventListener('click', () => {
-      if (document.fullscreenElement) {
-        document.exitFullscreen();
-      }
-      if (document.pictureInPictureElement) {
-        document.exitPictureInPicture();
-      }
       shakaDemoMain.unload();
     });
 

package/demo/common/asset.js

@@ -136,7 +136,7 @@ const ShakaDemoAssetInfo = class {
    * @return {!ShakaDemoAssetInfo}
    */
   addKeySystem(keySystem) {
-    if (this.drm.length == 1 && this.drm[0] == shakaAssets.KeySystem.CLEAR) {
+    if (this.isClear()) {
       // Once an asset has an actual key system, it's no longer a CLEAR asset.
       this.drm = [];
     }
@@ -146,6 +146,11 @@ const ShakaDemoAssetInfo = class {
     return this;
   }
 
+  /** @return {boolean} */
+  isClear() {
+    return this.drm.length == 1 && this.drm[0] == shakaAssets.KeySystem.CLEAR;
+  }
+
   /**
    * @param {!Object} extraConfig
    * @return {!ShakaDemoAssetInfo}

package/demo/common/assets.js

@@ -42,6 +42,8 @@ shakaAssets.Source = {
   AZURE_MEDIA_SERVICES: 'Azure Media Services',
   GPAC: 'GPAC',
   UPLYNK: 'Verizon Digital Media Services',
+  APPLE: 'Apple',
+  IRT: 'IRT',
 };
 
 
@@ -584,6 +586,17 @@ shakaAssets.testAssets = [
     .addFeature(shakaAssets.Feature.HIGH_DEFINITION)
     .addFeature(shakaAssets.Feature.MP4)
     .addFeature(shakaAssets.Feature.OFFLINE),
+  new ShakaDemoAssetInfo(
+      /* name= */ 'Tears of Steel (HLS, Subtitles)',
+      /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/tears_of_steel.png',
+      /* manifestUri= */ 'https://demo.unified-streaming.com/video/tears-of-steel/tears-of-steel-multiple-subtitles.ism/.m3u8',
+      /* source= */ shakaAssets.Source.UNIFIED_STREAMING)
+      .addFeature(shakaAssets.Feature.HLS)
+      .addFeature(shakaAssets.Feature.HIGH_DEFINITION)
+      .addFeature(shakaAssets.Feature.MP4)
+      .addFeature(shakaAssets.Feature.SUBTITLES)
+      .addFeature(shakaAssets.Feature.WEBVTT)
+      .addFeature(shakaAssets.Feature.OFFLINE),
   new ShakaDemoAssetInfo(
       /* name= */ 'Tears of Steel (Widevine)',
       /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/tears_of_steel.png',
@@ -948,19 +961,64 @@ shakaAssets.testAssets = [
       /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/sintel.png',
       /* manifestUri= */ 'https://content.uplynk.com/1eb40d8e64234f5c9879db7045c3d48c.mpd?ad=cleardash&rays=cdefg',
       /* source= */ shakaAssets.Source.UPLYNK)
-    // Disabled until we figure out the CORS errors and PlayReady status.
-    .markAsDisabled()
-    .addKeySystem(shakaAssets.KeySystem.WIDEVINE)
-    .addFeature(shakaAssets.Feature.DASH)
-    .addFeature(shakaAssets.Feature.MP4)
-    .addFeature(shakaAssets.Feature.MULTIPLE_LANGUAGES)
-    .addFeature(shakaAssets.Feature.MULTIPERIOD)
-    .addFeature(shakaAssets.Feature.MULTIKEY)
-    .addFeature(shakaAssets.Feature.HIGH_DEFINITION)
-    .addFeature(shakaAssets.Feature.AESCTR_16_BYTE_IV)
-    .addFeature(shakaAssets.Feature.ENCRYPTED_WITH_CLEAR)
-    .addLicenseServer('com.widevine.alpha', 'https://content.uplynk.com/wv')
-    .setRequestFilter(shakaAssets.UplynkRequestFilter)
-    .setResponseFilter(shakaAssets.UplynkResponseFilter),
+  // Disabled until we figure out the CORS errors and PlayReady status.
+      .markAsDisabled()
+      .addKeySystem(shakaAssets.KeySystem.WIDEVINE)
+      .addFeature(shakaAssets.Feature.DASH)
+      .addFeature(shakaAssets.Feature.MP4)
+      .addFeature(shakaAssets.Feature.MULTIPLE_LANGUAGES)
+      .addFeature(shakaAssets.Feature.MULTIPERIOD)
+      .addFeature(shakaAssets.Feature.MULTIKEY)
+      .addFeature(shakaAssets.Feature.HIGH_DEFINITION)
+      .addFeature(shakaAssets.Feature.AESCTR_16_BYTE_IV)
+      .addFeature(shakaAssets.Feature.ENCRYPTED_WITH_CLEAR)
+      .addLicenseServer('com.widevine.alpha', 'https://content.uplynk.com/wv')
+      .setRequestFilter(shakaAssets.UplynkRequestFilter)
+      .setResponseFilter(shakaAssets.UplynkResponseFilter),
+  // End Verizon Digital Media Services (VDMS) assets }}}
+
+  // Apple assets {{{
+  // Src: https://developer.apple.com/streaming/examples/
+  new ShakaDemoAssetInfo(
+      /* name= */ 'Apple Advanced HLS Stream (fMP4)',
+      /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/apple_test_pattern.png',
+      /* manifestUri= */ 'https://storage.googleapis.com/shaka-demo-assets/apple-advanced-stream-fmp4/master.m3u8',
+      /* source= */ shakaAssets.Source.APPLE)
+      .addFeature(shakaAssets.Feature.HLS)
+      .addFeature(shakaAssets.Feature.MP4)
+      .addFeature(shakaAssets.Feature.CAPTIONS)
+      .addFeature(shakaAssets.Feature.WEBVTT)
+      .addFeature(shakaAssets.Feature.OFFLINE),
+  new ShakaDemoAssetInfo(
+      /* name= */ 'Apple Advanced HLS Stream (TS)',
+      /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/apple_test_pattern.png',
+      /* manifestUri= */ 'https://storage.googleapis.com/shaka-demo-assets/apple-advanced-stream-ts/master.m3u8',
+      /* source= */ shakaAssets.Source.APPLE)
+      .addFeature(shakaAssets.Feature.HLS)
+      .addFeature(shakaAssets.Feature.MP2TS)
+      .addFeature(shakaAssets.Feature.CAPTIONS)
+      .addFeature(shakaAssets.Feature.WEBVTT)
+      .addFeature(shakaAssets.Feature.OFFLINE),
+  // }}}
+
+  // IRT assets {{{
+  // Src: http://subtitling.irt.de/cmaf/#urls
+  // Note: According to the website, these assets may not be available 24/7.
+  new ShakaDemoAssetInfo(
+      /* name= */ 'Bayerischer Rundfunk Recorded Loop (DASH)',
+      /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/bayerischer_rundfunk.png',
+      /* manifestUri= */ 'https://irtdashreference-i.akamaihd.net/dash/live/901161/keepixo1/manifestBR2.mpd',
+      /* source= */ shakaAssets.Source.IRT)
+      .addFeature(shakaAssets.Feature.DASH)
+      .addFeature(shakaAssets.Feature.MP4)
+      .addFeature(shakaAssets.Feature.LIVE),
+  new ShakaDemoAssetInfo(
+      /* name= */ 'Bayerischer Rundfunk Recorded Loop (HLS)',
+      /* iconUri= */ 'https://storage.googleapis.com/shaka-asset-icons/bayerischer_rundfunk.png',
+      /* manifestUri= */ 'https://irtdashreference-i.akamaihd.net/dash/live/901161/keepixo1/playlistBR2.m3u8',
+      /* source= */ shakaAssets.Source.IRT)
+      .addFeature(shakaAssets.Feature.HLS)
+      .addFeature(shakaAssets.Feature.MP4)
+      .addFeature(shakaAssets.Feature.LIVE),
   // }}}
 ];