clappr / dash-shaka-playback Goto Github PK

View Code? Open in Web Editor NEW

73.0 19.0 27.0 5.66 MB

A dash playback (based on shaka-player) for :clapper: Clappr

License: BSD 3-Clause "New" or "Revised" License

JavaScript 80.24% HTML 12.77% Shell 6.99%

shaka-player clappr dash playback player plugin

dash-shaka-playback's Introduction

dash-shaka-playback

A clappr playback to play dash based on the amazing shaka-player.

CDN JSDELIVR: https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.js

CDNJS: https://cdnjs.cloudflare.com/ajax/libs/dash-shaka-playback/2.0.5/dash-shaka-playback.js

NPM: https://www.npmjs.com/package/dash-shaka-playback/

Changelog

supports closed caption (subtitles)

Demo

Usage

<html>
  <head>
    <script src="https://cdn.jsdelivr.net/gh/clappr/clappr@latest/dist/clappr.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.js"></script>
  </head>

  <body>
    <div id="player"></div>
    <script>
      var player = new Clappr.Player(
        {
          source: '//storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd',
          plugins: [DashShakaPlayback],
          shakaConfiguration: {
            preferredAudioLanguage: 'pt-BR',
            streaming: {
              rebufferingGoal: 15
            }
          },
          shakaOnBeforeLoad: function(shaka_player) {
            // shaka_player.getNetworkingEngine().registerRequestFilter() ...
          },
          parentId: '#player'
        });
    </script>
  </body>
</html>

DRM

If need to protect your content (DRM) you must use the shakaConfiguration following the shaka configuration need.

License Wrapping

If need to wrap DRM license requests or responses you use shakaOnBeforeLoad following shaka License Wrapping guide.

Development

Install yarn:

https://yarnpkg.com/lang/en/docs/install/

Install dependencies:

yarn install

Run dev. server :

yarn start

By default, dev. server is listening on http://0.0.0.0:8080.

Build plugin:

yarn dist

By default, Shaka player is bundled with plugin. A "lightweight" version of this plugin, without shaka player bundled, dash-shaka-playback-external.min.js is available.

"extra" features

This playback offers you an API for handling with: audio, video and text tracks.

selectTrack(track)
textTracks()
audioTracks()
videoTracks()

For the older versions check

dash-shaka-playback's People

Contributors

Stargazers

Watchers

dash-shaka-playback's Issues

getManifestUri is deprecated

getManifestUri has been deprecated and will be removed in v2.6 . We are currently at version v2.5 . Additional information: Please use "getAssetUri" instead.

Playback does not work with dash-shaka-playback v2.3.1 build with shaka-player v2.5.10

For the development purpose i am trying to build dash-shaka-playback v2.3.1 with shaka-player v2.5.10.
Build is success but when i tried using dash-shaka-playback/dist/dash-shaka-playback.js playback is not working.
getting below error

Could you please help me out why this error is coming?

Add tests

shame on me (this is not even an issue)

Implement a basic canPlay

Playback ready event logic issue

I have done some debug with this plugin, to understand why the "CORE_READY" event is not trigger when a Clappr player instance is created.

In the current latest version, it seems that the "CORE_READY" event is trigger only when play() method is called.

I think this is because the PLAYBACK_READY event is trigger in _onShakaReady() method. (this method is called only after shaka instance is ready, and therefore after calling play() method).

It seems to be not consistent with other playbacks.

The first possible solution which come to my mind is to move the "PLAYBACK_READY" trigger in the _ready method which is currently "no-op". But if we do this, some changes will be required in several methods, to add additional checks. (ie: check if shaka instance is created, some getter may return null, etc...)

/ping @leandromoreira @jhonatangomes what do you think ?

debugging options

Hi,

are there any debugging options?
Sometimes the video doesn't start or is buffering very often.

In JS console of my browser, I can't see any logs

Gruß
Bias

JFYI: Shaka 2 coming soon

JFYI, Shaka team is hard at work on Shaka 2, which will have a new API. You can see a preview of the work-in-progress on the preview branch. We also published a redesign doc with a roughed-out version of the new APIs and diagrams of the new architecture.

I'll update this ticket once we go into beta so that you have a chance to give feedback on the API and start working on updates to your clappr plugin to support Shaka 2. We expect the official release of Shaka 2.0.0 by end of March. Thanks!

Level selector shows all the bitrates for all the possible tracks

External subtitle support

Is there any support for external subtitle files?

Shaka fails to play when Clappr.autoplay is false

I'm running into a peculiar issue with Clappr + DASH.

When Clappr.autoplay is true, the video plays fine and everything works as expected. However, if I set the autoplay to false, the video won't load and all I get is this error:

No warnings in console.

Dependencies:

    "clappr": "^0.2.86",
    "dash-shaka-playback": "^2.2.1",

Initialization code:

        player = new Clappr.Player({
            sources: sources,
            poster: `${cdnUrl}/${manifest.cover}`,
            mute: false,
            height: window.innerHeight - 1,
            width: '100%',
            autoPlay: {{ autoPlay | int }},
            scrubThumbnails: {
                backdropHeight: 0,  // 100 gives a nice effect
                spotlightHeight: 135,  // original is 135
                thumbs: thumbnailsSprite(manifest)
            },
            plugins: [
                DashShakaPlayback,
                ClapprThumbnailsPlugin,
                PlaybackSpeedPlugin
            ]
        });
        player.attachTo(document.getElementById("player-full"));

Sources:

let sources = ["http://cdn-dev.view.ly/v1/jpYtZ8IgEiSb/mpeg-dash/main.mpd", "http://cdn-dev.view.ly/v1/jpYtZ8IgEiSb/fallback/720p.mp4"]

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Embedded Player</title>
    <style>body {margin:0}</style>
    {% include 'partials/player_js.html' %}
</head>
<body>

<span id="player-full"
      style="border: 0px;border-radius: 0px;width: 100%;height: 100%"></span>

</body>
</html>

EDIT:
This issue is present in both Chrome or Firefox.

Audio tracks

How to call audio API in order to list / set audio tracks. Example: https://jsfiddle.net/halibegic/ohovkrbv/

P.S stream "angel-one" contains the following tracks:

language: de, 131357 bits/s
language: en, 130201 bits/s
language: es, 132963 bits/s
language: fr, 134350 bits/s
language: it, 134045 bits/s

Error: dash_shaka_playback_1_1002

http://...

I get this error code many times during the playback: dash_shaka_playback_1_1002
Refreshing the page the stream continues, but after a few seconds the error message reappears.
However VLC works without any problem.

Is there any way to fix it?

Thank you in advance.

dash-shaka-playback is not updated with Shaka version above 2.5.5

The TTML subtitles had some styling issues with dash-shaka-playback and the styling is proper in standalone shaka-player ^2.5.6. When the dash-shaka-playback source code is inspected , the fix for TTML subtitles styling was missing in the dash-shaka-playback.js

Please see below TTML subtitle styling fix given by shaka-player.
shaka-project/shaka-player@9f7652e

Also, dash-shaka-playback seems to pick the older shaka-player version rather picking the latest version.

Shaka namespace needed

To integrate P2P Media Loader engine with Shaka Player in Clappr we need both: shaka player instance and shaka namespace object. Namespace object is not available.

function registerParserProxies() {
    debug("register parser proxies");
    shaka.media.ManifestParser.registerParserByExtension("mpd", ShakaDashManifestParserProxy);
    shaka.media.ManifestParser.registerParserByMime("application/dash+xml", ShakaDashManifestParserProxy);
    shaka.media.ManifestParser.registerParserByExtension("m3u8", ShakaHlsManifestParserProxy);
    shaka.media.ManifestParser.registerParserByMime("application/x-mpegurl", ShakaHlsManifestParserProxy);
    shaka.media.ManifestParser.registerParserByMime("application/vnd.apple.mpegurl", ShakaHlsManifestParserProxy);
}

function initializeNetworkingEngine() {
    debug("init networking engine");
    shaka.net.NetworkingEngine.registerScheme("http", processNetworkRequest);
    shaka.net.NetworkingEngine.registerScheme("https", processNetworkRequest);
}

See details:
https://github.com/Novage/p2p-media-loader/blob/master/p2p-media-loader-shaka/lib/integration.ts

Can you make somehow the namespace available to hook into shaka.net and shaka.media before Shaka Player object creation? For example:

var shakaNamespace = DashShakaPlayback.getShakaNamespace();

player.destroy() doesn't work for DASH

Hi,

Using player version 0.2.56, if calling the player.destroy() javascript, the playback stops but the player body remains on the page.

This is only when using the DASH configuration, it works great when playing back HLS.

[2.0.3-beta] Cannot read property 'isLive' of undefined

Browser: All with MSE? (tested on Chrome, Chromium)

Clappr Version: 0.2.49
dash-shaka-playback version: 2.0.3-beta

Steps to reproduce:

open http://cdn.clappr.io/ and change source to http://demo.unified-streaming.com/video/ateam/ateam.ism/ateam.mpd
enable dash-shaka-playback Plugin https://cdn.jsdelivr.net/clappr.dash-shaka-playback/latest/dash-shaka-playback.js
click on Run button,
you'll see an error message: Cannot read property 'isLive' of undefined
click on Play button - default mp4 source (http://clappr.io/highline.mp4) playing instead of mpeg-dash stream

config tested with cdn.clappr.io:

var playerElement = document.getElementById("player-wrapper");

var player = new Clappr.Player({
source: 'http://demo.unified-streaming.com/video/ateam/ateam.ism/ateam.mpd',
baseUrl: '/latest',
poster: 'http://clappr.io/poster.png',
mute: true,
height: 360,
width: 640,
plugins: [DashShakaPlayback]
});

player.attachTo(playerElement);

Level label formatting issue

i have done some tests with the "angel" dash source url (Star Trek) from demo page and as described in this issue, sometimes the mafinest expose several video representation with the same height but for different language, which result in duplicated labels.

This could be fixed by changing label formatting, maybe add language when available ?

Currently it result in 576p, 480p, ...

Maybe we could change to 576p (en), 480p (en), 576p (de), 480p (de), ... ?

I could push a fix proposition, but i would like first some feedbacks/ideas on potential new label string format. /ping @leandromoreira @jhonatangomes

EDIT: another issue is when levels elements count is high, the select ui is overflow hidden by player container. (maybe find a way to display on higher z-index and maybe display on bottom of button instead of top depending if enough space : not sure how to do that my css is terrible ;-) )

accepts configuration object

http://shaka-player-demo.appspot.com/docs/api/tutorial-config.html

Does not play specific manifests with a new url in location .

I have a manifest like this in the location section there is a new url to the complete manifest but the player will not follow and just stops and does not play.

<?xml version="1.0" encoding="utf-8"?>
<MPD xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="urn:mpeg:dash:schema:mpd:2011"
    xmlns:xlink="http://www.w3.org/1999/xlink"
    xsi:schemaLocation="urn:mpeg:DASH:schema:MPD:2011 http://standards.iso.org/ittf/PubliclyAvailableStandards/MPEG-DASH_schema_files/DASH-MPD.xsd"
    profiles="urn:mpeg:dash:profile:isoff-main:2011"
    type="dynamic"
    availabilityStartTime="1970-01-01T00:00:00Z"
    publishTime="2021-08-02T09:59:22Z"
    minimumUpdatePeriod="PT05S"
    suggestedPresentationDelay="PT10S"
    minBufferTime="PT02S">
    <Location>HERE IS THE NEW COMPLETE URL TO THE FULL MPD.</Location>
</MPD>

dist folder not updated with latest built library

Hi, the javascript files in the dist folder (e.g. dash-shaka-playback.js) seem to have been compiled with the older sources.

Can you please update the dist folder with the latest build output?

My project uses dash-shaka-playback module and since webpack always takes dash-shaka-playback.js from the dist folder (as specified in "main" attribute of package.json), I am not getting the udpated dash-shaka-playback-functionality.

dash-shaka player could not fetch the SMPTE-TT images

When the smpte based subtitle language is selected in the player during playback, player is requesting the xml file for the bitmap based subtitles and the response xml file has the list of available bitmap images .
The player is able to parse the available bitmap-images list from the xml file and add those list to the cue but fails to send the request to fetch the parsed images. So the bitmap based subtitles are not displayed.

Please, help us to fix the issue with dash-shaka-playback.Thanks in advance.

Typo variable make level selector pulsing forever

_pendingAdaptationEvent_ should be _pendingAdaptationEvent

dash-shaka-playback/src/clappr-dash-shaka-playback.js

Line 342 in a3f96f9

if (this._pendingAdaptationEvent_) {

DRM License URL

A lot of people use Shaka Player for it's capabilities to play DRM (widevine and playready) protected content.

Can you please add a way to let people specify license-urls?

The easiest way I think of:

this._player.load(new shaka.player.DashVideoSource(this.options.src, interpretContentProtection))

 /**
     * @param {string} schemeIdUri The ContentProtection's scheme ID URI.
     * @param {!Element} contentProtection The ContentProtection element.
     * @return {!Array.<shaka.player.DrmInfo.Config>} An array of Config
     *     objects or null if the element is not understood by this application.
     */
     function interpretContentProtection (schemeIdUri, contentProtection) {

      }

Let people override interpretContentProtection?

Thank you
-abdul

Break the single class into several components

This abstraction is getting bigger, therefore, I think we should split it, maybe compose it with:

DashShakaTracks - deals with tracks behavior
DashShakaEvents - deals with _onXXXX

class DashShakaTracks {
  constructor (dashShakaPlayback) {
    this._dashShakaPlayback = dashShakaPlayback;
  }
}

SSL Issue locally

Already mentioned here: clappr/clappr#1756

But it might be directly connect with dash shaka playback, that's why I wanted to post it here as well:

Browser: Chrome Version 71.0.3578.98 (Official Build) (64-bit)

OS: Ubuntu 18

Clappr Version: 0.3.0

There seems to be an issue with local ssl certificates. I have local videos.localhost.com hostname with self signed certificates. On playing the video, I get this in the console:

Mixed Content: The page at '<URL>' was loaded over HTTPS, but requested an insecure resource '<URL>'. This request has been blocked; the content must be served over HTTPS.
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/init-f1-a1-x3.mp4'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/segment-1-f1-a1-x3.m4s'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/init-f1-v1-x3.mp4'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/segment-1-f1-v1-x3.m4s'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/init-f1-a1-x3.mp4'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/init-f1-v1-x3.mp4'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/segment-1-f1-a1-x3.m4s'. This request has been blocked; the content must be served over HTTPS.
(anonymous) @ dash-shaka-playback.js:885
xa @ dash-shaka-playback.js:590
next @ dash-shaka-playback.js:591
(anonymous) @ dash-shaka-playback.js:586
ka @ dash-shaka-playback.js:586
p @ dash-shaka-playback.js:586
W.f @ dash-shaka-playback.js:885
W @ dash-shaka-playback.js:884
(anonymous) @ dash-shaka-playback.js:633
fb @ dash-shaka-playback.js:625
(anonymous) @ dash-shaka-playback.js:624
dash-shaka-playback.js:885 Mixed Content: The page at 'https://videos.localhost.com/' was loaded over HTTPS, but requested an insecure resource 'http://videos.localhost.com/dash/devito,360p.mp4,480p.mp4,720p.mp4,.urlset/segment-1-f1-v1-x3.m4s'. This request has been blocked; the content must be served over HTTPS.

Feature request : add "external" shaka plugin version in compilation

I created an issue to continue discution started in #22 (comment).

(will also create a PR proposal).

Goal is to modify plugin compilation to add an additional version of the plugin without shaka-player bundled.

My current proposition is :

to keep the current filename dash-shaka-playback.js for the version with shaka-player bundled.
to add a new dash-shaka-playback-external.js file for version without shaka-player bundled.

Note: dash-shaka-playback-external.js name is only a proposition, i guess someone may have a better idea 😄

/poke @tchakabam @leandromoreira @vagnervjs @towerz

"Extra" Features

Some api's are depreciated, and replaced please update them in the Read me section.

I want to know how to set default level

I need some function to set default level when I click play, but I don't know how to select default level rather than playing to change level

autoplay broken in Clappr 0.2.31 with dash_shaka_playback

With autoPlay: false stream is playing

debug log w/ autoplay enabled

[debug][MediaControl] mediacontrol:notplaying
[debug][MediaControl] mediacontrol:rendered
[debug][Container] container:mediacontrol:disable
[debug][Core] core:containers:created
[debug][MediaControl] mediacontrol:notplaying
[debug][Container] container:dvr false
[debug][MediaControl] mediacontrol:hide MediaControl
[debug][Container] container:mediacontrol:hide
[debug][MediaControl] mediacontrol:containerchanged
[debug][MediaControl] mediacontrol:notplaying
[debug][MediaControl] mediacontrol:rendered
[debug][Events] 1:resize Object {width: 854, height: 480}
[debug][Events] 1:resize Object {width: 854, height: 480}
[debug][Container] container:mediacontrol:disable
[debug][dash_shaka_playback] playback:buffering dash_shaka_playback
[debug][Container] container:state:buffering Container
[debug][Container] container:mediacontrol:disable
[debug][dash_shaka_playback] playback:error MediaError {}code: 4__proto__: MediaErrorMEDIA_ERR_ABORTED: 1MEDIA_ERR_DECODE: 3MEDIA_ERR_NETWORK: 2MEDIA_ERR_SRC_NOT_SUPPORTED: 4code: (...)get code: ()constructor:    MediaError()__proto__: Object dash_shaka_playback
[debug][Container] container:ready Container
[debug][Core] core:ready
[debug][Player] ready
[debug][Container] container:volume 100 Container
[debug][Player] volumeupdate 100 
[debug][Container] container:volume 100 Container
[debug][Player] volumeupdate 100 
[debug][Container] container:error Object {error: MediaError, container: Container}container: Containererror: MediaErrorcode: 4__proto__: MediaError__proto__: Object Container
[debug][Player] error Object {error: MediaError, container: Container}
[debug][Container] container:mouseenter
[debug][Container] container:mouseleave

enables DRM

handles buffering

The volume cannot drag

Hi author,

Please help check the volume cannot drag when using dash plugin with clappr lastest version

SMPTE-TT bitmap based Subtitle Support

shaka-player "version": "2.5.0-beta3" has fixed the issue. In dash-shaka-playback it shows shaka-player version 2.4.4. I tried some approach but it could not helped to update nested dependencies.
Can you please upgrade if it possible or suggest the alternatives.

Kindly refer the link
shaka-project/shaka-player#1859
Thanks in advance

Error: libwv exception: Invalid Keyid in PSSH

Hi there
I have a problem at the time of the widevine request

I was seeing that 2 requests are generated, the first if in the body of the request the key but the second shows me this message: Error: libwv exception: Invalid Keyid in PSSH
and the player stops
and in the console I get this message:

description: "Category: 6, code: 6008, severity: 2"
level: "FATAL"
origin: "dash_shaka_playback"
scope: "playback"
raw: I
detail: D
severity: 2
category: 6
code: 6008
data: Array(1)
0: "The response parameter is empty."
length: 1
proto: Array(0)
handled: false
proto: Object
bubbles: false
cancelable: false
defaultPrevented: false
timeStamp: 14887.719999998808
type: "error"
isTrusted: false

Captions not working

Hi all,

How do we get captions working with this plugin? I've tried the normal way with clappr which seems to work with mp4s but not with this plugin:

 playback: {
   externalTracks: captions
  }

But the captions button does show up.

Edit: If I go to inspect element, the subtitle tracks have indeed been added under the video tag, but can't do anything wit them

Thanks

Release a new version

[stable 1.0.12] Cannot set property 'shaka' of undefined

Browser: All with MSE (tested on Chrome, Chromium)

Clappr Version: 0.2.57
dash-shaka-playback version: 1.0.12

Steps to reproduce:

open http://cdn.clappr.io/ and change source to http://demo.unified-streaming.com/video/ateam/ateam.ism/ateam.mpd
enable dash-shaka-playback Plugin (1.0.12) https://cdn.jsdelivr.net/clappr.dash-shaka-playback/1.0.12/dash-shaka-playback.js
click on Run button, you'll see an error message: Cannot set property 'shaka' of undefined
click on Play button - default mp4 source (http://clappr.io/highline.mp4) playing instead of mpeg-dash stream

config tested with cdn.clappr.io:

var playerElement = document.getElementById("player-wrapper");
Clappr.Log.setLevel(0);
var player = new Clappr.Player({
  source: 'http://demo.unified-streaming.com/video/ateam/ateam.ism/ateam.mpd',
  baseUrl: '/latest',
  poster: 'http://clappr.io/poster.png',
  mute: true,
  height: 360,
  width: 640,
  plugins: [DashShakaPlayback]
});
player.attachTo(playerElement);

Clappr doesn't load my mpd

override setupSrc

hls as fallback when using shaka plugin

Hi.

My idea is using dash as primary and for old browsers, fallback to an hls with Flash. My code as follow:

<html>
  <head>
    <script src="https://cdn.jsdelivr.net/clappr/latest/clappr.min.js"></script>
    <script src="https://cdn.jsdelivr.net/clappr.dash-shaka-playback/latest/dash-shaka-playback.js"></script>
  </head>

  <body>
    <div id="player"></div>
    <script>
      var player = new Clappr.Player(
        {
          source: 'https://shaka-player-demo.appspot.com/assets/angel_one.mpd?_=1446383792251',
          source: 'http://nasatv-lh.akamaihd.net/i/NASA_101@319270/master.m3u8',
          plugins: {
            'playback': [DashShakaPlayback],

          },

          parentId: '#player'
        });
    </script>
  </body>
</html>

Even on browsers with MSE enabled, tha player gives priority to the hls stream. How to state the priority to the MPEG DASH stream ?

many thanks in advance

Adding headers to requests

Hi all!

I was wondering is it possible to add custom headers to the requests made by this plugin?

Thanks

Audio switch not being handled first time

I don't know why but when stream is played for the first time I need to click two times in order to change audio https://jsfiddle.net/halibegic/ohovkrbv/12/

#16

It seems that buffering is messing around

Uncaught TypeError: Cannot read property 'Document' of undefined

Hey,
Getting this error while using dash-shaka-playback with webpack, are there any specific instructions we need to follow while using it with webpack?

The Error:

plugin.js

...
import chatPortraitMode from '../chatPlugin/chatPortrait.html';
import DashShakaPlayback from 'dash-shaka-playback';
...
let player1 = new Player({
        baseUrl: "http://localhost/Shaka/node_modules/clappr/dist",
        source: "http://dash.edgesuite.net/akamai/bbb_30fps/bbb_30fps.mpd",
        parentId: '#container1',
        height: '100%',
        width: '100%',
        plugins: [DashShakaPlayback, PipPlugin, DialogPlugin, ChatPlugin ],
})

webpack.config.js

/**
 * Created by Aditya on 05/06/2017.
 */
var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: './src/main/main.js',
    externals: {
        "clappr-zepto": "clappr-zepto",
        'ws': 'socket.io'
    },
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'main.bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                query: {presets: ['es2015']}
            },

            {
                test: /\.scss$/,
                loaders: ['css-loader', 'sass-loader?includePaths[]='
                + path.resolve(__dirname, './node_modules/clappr/src/base/scss')
                + '&includePaths[]='
                + path.resolve(__dirname, './src/base/scss')
                ],
                include: path.resolve(__dirname, 'src'),
            },
            {
                test: /\.(png|woff|eot|ttf|swf|cur)/, loader: 'url-loader?limit=1'
            },
            {
                test: /\.svg/, loader: 'svg-inline-loader'
            },
            {
                test: /\.html/, loader: 'html-loader?minimize=false'
            }
        ]
    },
    resolve: {
        extensions: [ '.js'],
        alias: {
            'clappr-zepto': 'clappr-zepto/zepto.js',
            'dash-shaka-playback' : 'dash-shaka-playback/index.js'
        },
        modules: ['node_modules']
    },
    stats: {
        colors: true
    },
    node: {
        fs: "empty"
    },
    devtool: 'source-map',

};

Any help is much appreciated!

Thanks,
Aditya

update

Please update, some features are depreciated.