clappr / clappr-level-selector-plugin

Clappr Level Selector Plugin
MIT License
76 stars 56 forks source link

Double levels #77

Open katsar0v opened 5 years ago

katsar0v commented 5 years ago

Somehow I get the list of qualities doubled:

image

and I get this error:

[error][dash_shaka_playback] error on event playback:levels:available trigger - TypeError: Cannot read property 'height' of undefined
    at labelCallback ((index):29)
    at e.configureLevelsLabels (level-selector.min.js:1)
    at e.fillLevels (level-selector.min.js:1)
    at n (clappr.min.js:1)
    at n (clappr.min.js:1)
    at y (clappr.min.js:1)
    at DashShakaPlayback.t.trigger (clappr.min.js:1)
    at DashShakaPlayback._fillLevels (dash-shaka-playback.js:388)
    at DashShakaPlayback._loaded (dash-shaka-playback.js:378)
    at dash-shaka-playback.js:352

Source code:

<script type="text/javascript">
  const options = {
    source: "/dash/vid,360p.mp4,480p.mp4,720p.mp4,1080p.mp4,.urlset/manifest.mpd",
    plugins: [DashShakaPlayback, LevelSelector],
    autoPlay: true,
    shakaConfiguration: {
      preferredAudioLanguage: "de",
      streaming: {
        rebufferingGoal: 15
      }
    },
    levelSelectorConfig: {
      title: 'Quality',
      labelCallback: function(playbackLevel, customLabel) {
        return customLabel + playbackLevel.level.height+'p'; // High 720p
      }
    },
    parentId: "#player",
    width: 800,
    height: 600
  }
  let player = new Clappr.Player(options);
</script>
leandromoreira commented 5 years ago

can you post the mpd xml here?

katsar0v commented 5 years ago
<?xml version="1.0"?>
<MPD
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="urn:mpeg:dash:schema:mpd:2011"
    xsi:schemaLocation="urn:mpeg:dash:schema:mpd:2011 http://standards.iso.org/ittf/PubliclyAvailableStandards/MPEG-DASH_schema_files/DASH-MPD.xsd"
    type="static"
    mediaPresentationDuration="PT323.675S"
    minBufferTime="PT9S"
    profiles="urn:mpeg:dash:profile:isoff-main:2011">
  <Period>
    <AdaptationSet
        id="1"
        segmentAlignment="true"
        maxWidth="1920"
        maxHeight="1080"
        maxFrameRate="25">
        <SegmentTemplate
            timescale="1000"
            media="https://localhost/dash/daw/kapitel-01/1_V01_willkommen,_360p.mp4,_480p.mp4,_720p.mp4,_1080p.mp4,.urlset/segment-$Number$-$RepresentationID$.m4s"
            initialization="https://localhost/dash/daw/kapitel-01/1_V01_willkommen,_360p.mp4,_480p.mp4,_720p.mp4,_1080p.mp4,.urlset/init-$RepresentationID$.mp4"
            startNumber="1">
            <SegmentTimeline>
                <S d="10000" r="3"/>
                <S d="11480"/>
                <S d="10000" r="1"/>
                <S d="1280"/>
                <S d="9920"/>
                <S d="10000"/>
                <S d="9120"/>
                <S d="8560"/>
                <S d="10000" r="6"/>
                <S d="0"/>
                <S d="18480"/>
                <S d="0"/>
                <S d="10000" r="3"/>
                <S d="5960"/>
                <S d="10000" r="6"/>
                <S d="8840"/>
            </SegmentTimeline>
        </SegmentTemplate>
      <Representation
          id="f1-v1-x3"
          mimeType="video/mp4"
          codecs="avc1.64001e"
          width="640"
          height="360"
          frameRate="25"
          sar="1:1"
          startWithSAP="1"
          bandwidth="177119">
      </Representation>
      <Representation
          id="f2-v1-x3"
          mimeType="video/mp4"
          codecs="avc1.64001e"
          width="854"
          height="480"
          frameRate="25"
          sar="1:1"
          startWithSAP="1"
          bandwidth="265437">
      </Representation>
      <Representation
          id="f3-v1-x3"
          mimeType="video/mp4"
          codecs="avc1.64001f"
          width="1280"
          height="720"
          frameRate="25"
          sar="1:1"
          startWithSAP="1"
          bandwidth="508238">
      </Representation>
      <Representation
          id="f4-v1-x3"
          mimeType="video/mp4"
          codecs="avc1.640028"
          width="1920"
          height="1080"
          frameRate="25"
          sar="1:1"
          startWithSAP="1"
          bandwidth="1260898">
      </Representation>
    </AdaptationSet>
    <AdaptationSet
        id="2"
        segmentAlignment="true">
      <AudioChannelConfiguration
          schemeIdUri="urn:mpeg:dash:23003:3:audio_channel_configuration:2011"
          value="1"/>
        <SegmentTemplate
            timescale="1000"
            media="https://localhost/dash/daw/kapitel-01/1_V01_willkommen,_360p.mp4,_480p.mp4,_720p.mp4,_1080p.mp4,.urlset/segment-$Number$-$RepresentationID$.m4s"
            initialization="https://localhost/dash/daw/kapitel-01/1_V01_willkommen,_360p.mp4,_480p.mp4,_720p.mp4,_1080p.mp4,.urlset/init-$RepresentationID$.mp4"
            startNumber="1">
            <SegmentTimeline>
                <S d="9003" r="6"/>
                <S d="8981"/>
                <S d="9003" r="6"/>
                <S d="8981"/>
                <S d="9003" r="6"/>
                <S d="8981"/>
                <S d="9003" r="6"/>
                <S d="8981"/>
                <S d="9003" r="2"/>
                <S d="8667"/>
            </SegmentTimeline>
        </SegmentTemplate>
      <Representation
          id="f1-a1-x3"
          mimeType="audio/mp4"
          codecs="mp4a.40.2"
          audioSamplingRate="48000"
          startWithSAP="1"
          bandwidth="132724">
      </Representation>
    </AdaptationSet>
  </Period>
</MPD>
Media182 commented 4 years ago

I have the same double quality list with latest current Clappr+Shaka, xml generating by kaltura/nginx-vod-module.

kslimani commented 4 years ago

i confirm the issue with some manifest (does not happen with all sources). I am gonna investigate and propose a fix.

EDIT: it seems an issue with shaka playback. Because levels are already duplicated when provided to level selector plugin by PLAYBACK_LEVELS_AVAILABLEevent. Anyway i will push some minor fixes with event binding and backward compatibility with Clappr 0.2.x (and hopefully a fix in dash playback plugin)

EDIT 2: i confirm that i think the issue is not related to this plugin. The level "label formatting" has been delegated to playback plugins (ie: Dash Shaka plugin) and my tests are pointing out an issue where manifest can expose video stream in different language for the same video "height" which result in duplicated labels (but different streams) leading to confusion.