Dash.js: Captions being added to DOM multiple times
Environment
- [X] The MPD passes the DASH-IF Conformance Tool on http://dashif.org/conformance.html
- [X] The stream has correct Access-Control-Allow-Origin headers (CORS)
- [X] There are no network errors such as 404s in the browser console when trying to play the stream
- [X] The issue observed is not mentioned on https://github.com/Dash-Industry-Forum/dash.js/wiki/FAQ
- [X] The issue occurs in the latest reference client on http://reference.dashif.org/dash.js/ and not just on my page
- Link to playable MPD file:
https://dash-vod.cdn1.showtimeanytime.com/dash/v2/affairffetvma_3437300_20180101_20180630_122717/tv_master_sdk.mpd - Widevine License: https://www.showtimeanytime.com/common/drm-certs/cert_license_widevine_com.bin?refid=XPPK0001513852719000&authToken=0:f3b6c81d-67eb-4c59-8f2b-93b2f22f87f8&sd=true
- Playready License: https://www.qa-maint.sho.com/api/drm/playready/license
(I could not get video playback working in the reference player - I assume it's a license issue - but if you scrub to 38:02 you can see the issue occuring)
- Dash.js version: 2.6.7
- Browser name/version: Chrome 65...
- OS name/version: MacOS 10.13.3
Steps to reproduce
Playback video with captions where any cue contains multiple simultaneous captions.
Observed behaviour
Caption text is being added twice to the DOM in two separate cue_TTML_xxx div's. Pulling down the debug player, the errant code appears to be here:
for (j = 0; j < isd.contents.length; j++) {
if (isd.contents[j].contents.length >= 1) {
startTime = mediaTimeEvents[i] + offsetTime < startTimeSegment ? startTimeSegment : mediaTimeEvents[i] + offsetTime;
endTime = mediaTimeEvents[i + 1] + offsetTime > endTimeSegment ? endTimeSegment : mediaTimeEvents[i + 1] + offsetTime;
if (startTime < endTime) {
captionArray.push({
start: startTime,
end: endTime,
type: 'html',
cueID: getCueID(),
isd: isd,
images: images,
embeddedImages: embeddedImages
});
}
}
}
Removing the for(j) loop and skipping right to if (startTime < endTime) appears to fix the issue - I do not understand the original intent behind adding the entire isd object to the captionArray X times, where X is the length of the isd.contents array.
Console output
Output
Paste the contents of the browser console here.
You may need to enable debug logging in dash.js by calling player.getDebug().setLogToBrowserConsole(true) if you are using your own page.
EDIT: Updated to fix code snippet readability
physicsforpoets
All 16 comments
Hi @physicsforpoets ,
I can't access your stream, so it's difficult to investigate....
Nico
nicosang
on 16 Apr 2018
I'm able to load the manifest in the reference player when accessing the reference player via https and using the Playready license - is this what you attempted (as I commented, video playback isn't working for me because I'm in Chrome and it's Playready, but the metadata loads for me and you can scrub and see the caption issues)
physicsforpoets
on 16 Apr 2018
Here in the UK I get a 403 when attempting to retrieve the manifest ...
davemevans
on 16 Apr 2018
Ah, that would explain it, we geoblock content
physicsforpoets
on 16 Apr 2018
@physicsforpoets could you unblock that content, or give us a list of locations where it works so we can use a proxy?
EDIT:
I tried to make it work using a proxy with US IP, I managed to get the MPD and some requests worked, but then I received a 403 when downloading the chunks, please unblock.
aescarcha
on 17 Apr 2018
@aescarcha I'm working on getting unprotected content, but removing geoblocking will be an issue - I'm trying to find another Dash manifest with TTML captioning to replicate the issue, it shouldn't be specific to our content - let me see what I can figure out today, apologies
physicsforpoets
on 17 Apr 2018
I'm now starting to think that this is not an issue with rendering the tracks, but an issue with the imsc library parsing the TTML -
If there are 2 cues active on screen at any given time, the video element's activeCues array contains two VTTCue objects - each of these VTTCue objects contains an ISD object with a 'contents' array that contains ISDContentElements that represent BOTH cues. When using the Shaka player, on a cue change the activeCues array contains 2 top level VTTCue objects with 1 instance of each cue's content:
TTML:
<p begin="00:12:35.458" end="00:12:36.833" region="pop1" style="basic" tts:extent="77.5% 5.33%" tts:origin="10% 79.33%">- LOOK AT IT THIS WAY--IF SHE'S</p>
<p begin="00:12:35.458" end="00:12:36.833" region="pop2" style="basic" tts:extent="67.5% 5.33%" tts:origin="15% 84.66%">NOT HUNGRY, SHE'S NOT HIGH.</p>
Dash.js / imscJS parsed:
activeCues [TextTrackList] [
0 [VTTCue]: {
cueID: "cue_TTML_60",
...
isd: {
contents: [
0 [ISDContentElement]: {
id: "pop1",
contents: [
0 [ISDContentElement]: {
...
text: "- LOOK AT IT THIS WAY--IF SHE'S"
}
]
},
1 [ISDContentElement]: {
id: "pop2",
contents: [
0 [ISDContentElement]: {
...
text: "NOT HUNGRY, SHE'S NOT HIGH."
}
]
}
]
}
},
1 [VTTCue]: {
cueID: "cue_TTML_61",
...
isd: {
contents: [
0 [ISDContentElement]: {
id: "pop1",
contents: [
0 [ISDContentElement]: {
...
text: "- LOOK AT IT THIS WAY--IF SHE'S"
}
]
},
1 [ISDContentElement]: {
id: "pop2",
contents: [
0 [ISDContentElement]: {
...
text: "NOT HUNGRY, SHE'S NOT HIGH."
}
]
}
]
}
}
]
Shaka parsed:
activeCues [TextTrackList] [
0 [VTTCue]: {
...
text: "- LOOK AT IT THIS WAY--IF SHE'S"
},
1 [VTTCue]: {
...
text: "NOT HUNGRY, SHE'S NOT HIGH."
}
]
This doubled up cue behavior does not seem to occur when there is only a single active cue, hence me thinking it's a bug in the imsc parsing:
Only a pop1:
<p begin="00:12:41.625" end="00:12:44.291" region="pop1" style="basic" tts:extent="17.5% 5.33%" tts:origin="40% 84.66%">- FINE.</p>
Dash/ismc parsed:
activeCues [TextTrackList] [
0 [VTTCue]: {
cueID: "cue_TTML_65",
...
isd: {
contents: [
0 [ISDContentElement]: {
id: "pop1",
contents: [
0 [ISDContentElement]: {
...
text: "- FINE"
}
]
}
]
}
}
]
EDIT:
Actually this reinforces my my thought in my initial post that the logic in TTMLParser is incorrect. Instead of for-looping through isd.contents.length and pushing the isd object into the captionArray (lines 128-134), it seems that either the for loop should be skipped - which would produce a single VTTCue object with each active cue inside isd.contents - or continue to perform the loop, but instead of pushing the entire isd object into the captionArray, push isd.contents[j] - which would produce a VTTCue for each value inside of isd.contents, but I believe this would screw up the visual output.
physicsforpoets
on 23 Apr 2018
I've got an updated manifest where you can see the issue occuring:
http://dash-vod.showtime.com/test/dash/fataccess101_RyanTest2/mobile_master.mpd
You can see the full contents of each isd being added to the DOM as many times as the length of isd.contents - you can also see the errant behavior by observing a text track's active cues. Additionally you can see 2 cues enter and exit each time there are 2 active cues, but again, these 2 cues both contain the same 2 TTML cues.
physicsforpoets
on 24 Apr 2018
Hi @physicsforpoets , I can't access that mpd either, I get a 403 Forbidden.
aescarcha
on 24 Apr 2018
@aescarcha it's still going to be geoblocked outside of the US, this is just unencrypted so you won't have to deal with license requests or timeouts
physicsforpoets
on 24 Apr 2018
It's probably worth remembering that since the VTTCue is being used by dash.js for timing and as a data carrier for the ISD, it's fine for all the displayed contents of each ISD to be in a single ISD, even if that covers multiple regions. Shaka adopts a completely different approach, effectively transcoding the TTML into VTT and potentially dropping some important information along the way (I can't see what's in the ... when mapping each region's text to a separate cue so I don't know if anything has been dropped - I'm not trying to say untrue bad things about Shaka here!). They are not directly comparable.
I'm outside the US so get blocked trying to open that MPD - @physicsforpoets is there any way to open this up so people wanting to help can actually do so? Or even attach more of the TTML? Can you construct a simple test case that demonstrates the problem and can be shared?
Without being able to see the whole TTML it is hard to provide more info about this specific issue. For example I can't see from https://github.com/Dash-Industry-Forum/dash.js/issues/2525#issuecomment-383643359 if there is genuinely duplicated content in adjacent ISDs that is correctly leading to the observed behaviour, and I can't see the cue times.
Also, the cues should not both be visible simultaneously, so all the more reason for being able to see the begin and end times of each cue when debugging this. What is the visible result? Can you attach a screenshot?
nigelmegitt
on 24 Apr 2018
@nigelmegitt opening up the geoblocking is out of my control, apologies.
I understand Shaka is using a completely different system, I was just checking it as a comparison as it's our current player.
Visually by default, there is no visible issue because the contents of the 2nd VTTCue are visually rendered outside of the player container (do an inspect element on the 2nd
Here is a brief summary of the issues:
- There are X number of activeCues on 'cuechange' where X = the length of isd.contents
- Each activeCue contains all 'X' cues inside of isd.content
- Custom styling of the cues is made difficult because the caption div contains each cue multiple times in the DOM
- Grabbing the isd cue data via the activeCues array is made difficult because you have to explicitly ignore anything outside of activeCue[0], as all cues are contained inside of each activeCue contents
- A simple test case is playing any media with TTML captions where multiple active cues are visible simultaneously
* Observe the DOM inside of the captioning div
* Observe the activeCues on the player's textTracks
** Observe the cueenter cueexit events is the Dash.js debug output
I'll grab screenshots of the full activeCues output that I abridged (...) above, but the attributes I left out are fairly meaningless, the issue is the duplicated contents array.
Here is the full TTML chunk that I pulled the above sample from - notice the captions that I clipped out do not appear twice in this XML, but appear twice in activeCues and the div.
<?xml version="1.0" encoding="utf-8"?><tt xmlns="http://www.w3.org/ns/ttml" xmlns:smpte="http://www.smpte-ra.org/schemas/2052-1/2010/smpte-tt" xmlns:m608="http://www.smpte-ra.org/schemas/2052-1/2010/smpte-tt#cea608" xmlns:ttm="http://www.w3.org/ns/ttml#metadata" xmlns:ttp="http://www.w3.org/ns/ttml#parameter" xmlns:tts="http://www.w3.org/ns/ttml#styling" xml:lang="en" ttp:frameRate="24" ttp:frameRateMultiplier="1000 1001" ttp:timeBase="media"><head><smpte:information /><metadata><ttm:title></ttm:title><ttm:desc>CaptionMaker V6.6.0.4893 SMPTE-TT Captions (4x3)</ttm:desc><ttm:copyright></ttm:copyright></metadata><styling><style xml:id="basic" tts:backgroundColor="black" tts:color="white" tts:fontFamily="monospace" tts:fontSize="80%" /></styling><layout><region xml:id="pop1" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="pop2" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="pop3" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="pop4" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="paint" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="paint2" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="paint3" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="paint4" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="rollup2" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="rollup3" tts:backgroundColor="transparent" tts:showBackground="whenActive" /><region xml:id="rollup4" tts:backgroundColor="transparent" tts:showBackground="whenActive" /></layout></head><body><div><p begin="00:10:02.958" end="00:10:04.708" region="pop1" style="basic" tts:extent="42.5% 5.33%" tts:origin="27.5% 84.66%">- I HATE GRANDPA.</p><p begin="00:10:04.791" end="00:10:07.333" region="pop1" style="basic" tts:extent="45% 5.33%" tts:origin="27.5% 84.66%">- I KNOW, SO DO I.</p><p begin="00:10:07.416" end="00:10:09.791" region="pop1" style="basic" tts:extent="50% 5.33%" tts:origin="25% 79.33%">LOOK AT IT THIS WAY.</p><p begin="00:10:07.416" end="00:10:09.791" region="pop2" style="basic" tts:extent="72.5% 5.33%" tts:origin="12.5% 84.66%">AT LEAST YOU STAND TO INHERIT</p><p begin="00:10:09.875" end="00:10:11.625" region="pop1" style="basic" tts:extent="77.5% 5.33%" tts:origin="10% 84.66%">SOME OF HIS MONEY WHEN HE DIES.</p><p begin="00:10:11.708" end="00:10:13.541" region="pop1" style="basic" tts:extent="72.5% 5.33%" tts:origin="12.5% 84.66%">- I WON'T TAKE A PENNY OF IT.</p><p begin="00:10:13.625" end="00:10:15.750" region="pop1" style="basic" tts:extent="22.5% 5.33%" tts:origin="37.5% 79.33%">- MARTIN,</p><p begin="00:10:13.625" end="00:10:15.750" region="pop2" style="basic" tts:extent="70% 5.33%" tts:origin="15% 84.66%">I'M A PUBLIC SCHOOL TEACHER.</p><p begin="00:10:15.833" end="00:10:17.875" region="pop1" style="basic" tts:extent="12.5% 5.33%" tts:origin="42.5% 79.33%">- SO?</p><p begin="00:10:15.833" end="00:10:17.875" region="pop2" style="basic" tts:extent="42.5% 5.33%" tts:origin="27.5% 84.66%">- TAKE THE MONEY.</p><p begin="00:10:23.750" end="00:10:24.916" region="pop1" style="basic" tts:extent="52.5% 5.33%" tts:origin="22.5% 79.33%">- IS EVERYTHING OKAY?</p><p begin="00:10:23.750" end="00:10:24.916" region="pop2" style="basic" tts:extent="12.5% 5.33%" tts:origin="42.5% 84.66%">- OW!</p><p begin="00:10:25.000" end="00:10:27.625" region="pop1" style="basic" tts:extent="37.5% 5.33%" tts:origin="30% 79.33%">- HEY, CAREFUL.</p><p begin="00:10:25.000" end="00:10:27.625" region="pop2" style="basic" tts:extent="40% 5.33%" tts:origin="30% 84.66%">EVERYTHING OKAY?</p><p begin="00:10:27.708" end="00:10:29.125" region="pop1" style="basic" tts:extent="30% 5.33%" tts:origin="35% 84.66%">- IT'S FINE.</p><p begin="00:10:33.375" end="00:10:35.375" region="pop1" style="basic" tts:extent="40% 5.33%" tts:origin="30% 84.66%">- WHAT HAPPENED?</p><p begin="00:10:35.458" end="00:10:37.666" region="pop1" style="basic" tts:extent="45% 5.33%" tts:origin="27.5% 79.33%">- HE COULDN'T FIND</p><p begin="00:10:35.458" end="00:10:37.666" region="pop2" style="basic" tts:extent="42.5% 5.33%" tts:origin="27.5% 84.66%">HIS BATHING SUIT.</p><p begin="00:10:37.750" end="00:10:39.416" region="pop1" style="basic" tts:extent="65% 5.33%" tts:origin="17.5% 79.33%">- OH, I PACKED IT FOR YOU,</p><p begin="00:10:37.750" end="00:10:39.416" region="pop2" style="basic" tts:extent="15% 5.33%" tts:origin="42.5% 84.66%">HONEY.</p><p begin="00:10:39.500" end="00:10:41.625" region="pop1" style="basic" tts:extent="60% 5.33%" tts:origin="20% 79.33%">- ONE, TWO, THREE, FOUR.</p><p begin="00:10:39.500" end="00:10:41.625" region="pop2" style="basic" tts:extent="62.5% 5.33%" tts:origin="17.5% 84.66%">THAT'S ALL OF 'EM, RIGHT?</p><p begin="00:10:41.708" end="00:10:44.083" region="pop1" style="basic" tts:extent="55% 5.33%" tts:origin="22.5% 84.66%">- YEP, THAT I KNOW OF.</p><p begin="00:10:51.083" end="00:10:54.000" region="pop1" style="basic" tts:extent="35% 5.33%" tts:origin="32.5% 84.66%">[somber music]</p><p begin="00:10:54.083" end="00:11:02.166" region="pop1" style="basic" tts:extent="7.5% 5.33%" tts:origin="45% 84.66%">♪ ♪</p></div></body></tt>
Here is the DOM while 2 cues are active at the same time - note the 2 cues are present twice:
<div data-v-6f034aea="" id="dash-captions" style="position: absolute; display: flex; overflow: hidden; pointer-events: none; top: 279.75px; left: 0px; width: 1352px; height: 760.5px;">
<div id="cue_TTML_72">
<div style="position: relative; width: 1352px; height: 760px; margin: auto; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 0;">
<div style="position: absolute; margin: 0px; background-color: rgba(0, 0, 0, 0); display: flex; flex-direction: column; justify-content: flex-start; height: 760px; width: 1352px; opacity: 1; top: 0px; left: 0px; overflow: hidden; padding: 0px; visibility: visible; writing-mode: horizontal-tb; z-index: auto;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<p style="margin: 0px; background-color: rgb(0, 0, 0); direction: ltr; line-height: normal; text-align: left; unicode-bidi: normal; visibility: visible;">
<span style="margin: 0px; background-color: rgba(0, 0, 0, 0); color: rgb(255, 255, 255); direction: ltr; font-family: monospace; font-size: 40.5333px; font-style: normal; font-weight: normal; text-decoration: none; unicode-bidi: normal; visibility: visible; white-space: normal;">- OKAY.</span>
</p>
</div>
</div>
</div>
<div style="position: absolute; margin: 0px; background-color: rgba(0, 0, 0, 0); display: flex; flex-direction: column; justify-content: flex-start; height: 760px; width: 1352px; opacity: 1; top: 0px; left: 0px; overflow: hidden; padding: 0px; visibility: visible; writing-mode: horizontal-tb; z-index: auto;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<p style="margin: 0px; background-color: rgb(0, 0, 0); direction: ltr; line-height: normal; text-align: left; unicode-bidi: normal; visibility: visible;">
<span style="margin: 0px; background-color: rgba(0, 0, 0, 0); color: rgb(255, 255, 255); direction: ltr; font-family: monospace; font-size: 40.5333px; font-style: normal; font-weight: normal; text-decoration: none; unicode-bidi: normal; visibility: visible; white-space: normal;">- NOAH?</span>
</p>
</div>
</div>
</div>
</div>
</div>
<div id="cue_TTML_73">
<div style="position: relative; width: 1352px; height: 760px; margin: auto; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 0;">
<div style="position: absolute; margin: 0px; background-color: rgba(0, 0, 0, 0); display: flex; flex-direction: column; justify-content: flex-start; height: 760px; width: 1352px; opacity: 1; top: 0px; left: 0px; overflow: hidden; padding: 0px; visibility: visible; writing-mode: horizontal-tb; z-index: auto;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<p style="margin: 0px; background-color: rgb(0, 0, 0); direction: ltr; line-height: normal; text-align: left; unicode-bidi: normal; visibility: visible;">
<span style="margin: 0px; background-color: rgba(0, 0, 0, 0); color: rgb(255, 255, 255); direction: ltr; font-family: monospace; font-size: 40.5333px; font-style: normal; font-weight: normal; text-decoration: none; unicode-bidi: normal; visibility: visible; white-space: normal;">- OKAY.</span>
</p>
</div>
</div>
</div>
<div style="position: absolute; margin: 0px; background-color: rgba(0, 0, 0, 0); display: flex; flex-direction: column; justify-content: flex-start; height: 760px; width: 1352px; opacity: 1; top: 0px; left: 0px; overflow: hidden; padding: 0px; visibility: visible; writing-mode: horizontal-tb; z-index: auto;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<div style="margin: 0px; background-color: rgba(0, 0, 0, 0); visibility: visible;">
<p style="margin: 0px; background-color: rgb(0, 0, 0); direction: ltr; line-height: normal; text-align: left; unicode-bidi: normal; visibility: visible;">
<span style="margin: 0px; background-color: rgba(0, 0, 0, 0); color: rgb(255, 255, 255); direction: ltr; font-family: monospace; font-size: 40.5333px; font-style: normal; font-weight: normal; text-decoration: none; unicode-bidi: normal; visibility: visible; white-space: normal;">- NOAH?</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
Here is the output of textTracks[0].activeCues while there are 2 cues visible at once - notice there are 2 sets of pop1's and pop2's with the same contents:
{
"0":{
"isd":{
"contents":[
{
"kind":"region",
"id":"pop1",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling showBackground":"whenActive",
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling displayAlign":"before",
"http://www.w3.org/ns/ttml#styling extent":{
"h":1,
"w":1
},
"http://www.w3.org/ns/ttml#styling opacity":1,
"http://www.w3.org/ns/ttml#styling origin":{
"h":0,
"w":0
},
"http://www.w3.org/ns/ttml#styling overflow":"hidden",
"http://www.w3.org/ns/ttml#styling padding":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling writingMode":"lrtb",
"http://www.w3.org/ns/ttml#styling zIndex":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false
},
"contents":[
{
"kind":"body",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"div",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"p",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling lineHeight":"normal",
"http://www.w3.org/ns/ttml#styling textAlign":"start",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"urn:ebu:tt:style linePadding":0,
"urn:ebu:tt:style multiRowAlign":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"contents":[
{
"kind":"span",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling color":[
255,
255,
255,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling fontFamily":[
"monospace"
],
"http://www.w3.org/ns/ttml#styling fontSize":0.05333333333333333,
"http://www.w3.org/ns/ttml#styling fontStyle":"normal",
"http://www.w3.org/ns/ttml#styling fontWeight":"normal",
"http://www.w3.org/ns/ttml#styling textDecoration":[
"none"
],
"http://www.w3.org/ns/ttml#styling textOutline":"none",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling wrapOption":"wrap",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"text":"- [murmurs]",
"space":"default"
}
]
}
]
}
]
}
]
},
{
"kind":"region",
"id":"pop2",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling showBackground":"whenActive",
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling displayAlign":"before",
"http://www.w3.org/ns/ttml#styling extent":{
"h":1,
"w":1
},
"http://www.w3.org/ns/ttml#styling opacity":1,
"http://www.w3.org/ns/ttml#styling origin":{
"h":0,
"w":0
},
"http://www.w3.org/ns/ttml#styling overflow":"hidden",
"http://www.w3.org/ns/ttml#styling padding":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling writingMode":"lrtb",
"http://www.w3.org/ns/ttml#styling zIndex":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false
},
"contents":[
{
"kind":"body",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"div",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"p",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling lineHeight":"normal",
"http://www.w3.org/ns/ttml#styling textAlign":"start",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"urn:ebu:tt:style linePadding":0,
"urn:ebu:tt:style multiRowAlign":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"contents":[
{
"kind":"span",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling color":[
255,
255,
255,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling fontFamily":[
"monospace"
],
"http://www.w3.org/ns/ttml#styling fontSize":0.05333333333333333,
"http://www.w3.org/ns/ttml#styling fontStyle":"normal",
"http://www.w3.org/ns/ttml#styling fontWeight":"normal",
"http://www.w3.org/ns/ttml#styling textDecoration":[
"none"
],
"http://www.w3.org/ns/ttml#styling textOutline":"none",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling wrapOption":"wrap",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"text":"- SHH.",
"space":"default"
}
]
}
]
}
]
}
]
}
],
"aspectRatio":null
},
"images":[
],
"embeddedImages":{
},
"cueID":"cue_TTML_45"
},
"1":{
"isd":{
"contents":[
{
"kind":"region",
"id":"pop1",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling showBackground":"whenActive",
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling displayAlign":"before",
"http://www.w3.org/ns/ttml#styling extent":{
"h":1,
"w":1
},
"http://www.w3.org/ns/ttml#styling opacity":1,
"http://www.w3.org/ns/ttml#styling origin":{
"h":0,
"w":0
},
"http://www.w3.org/ns/ttml#styling overflow":"hidden",
"http://www.w3.org/ns/ttml#styling padding":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling writingMode":"lrtb",
"http://www.w3.org/ns/ttml#styling zIndex":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false
},
"contents":[
{
"kind":"body",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"div",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"p",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling lineHeight":"normal",
"http://www.w3.org/ns/ttml#styling textAlign":"start",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"urn:ebu:tt:style linePadding":0,
"urn:ebu:tt:style multiRowAlign":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"contents":[
{
"kind":"span",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling color":[
255,
255,
255,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling fontFamily":[
"monospace"
],
"http://www.w3.org/ns/ttml#styling fontSize":0.05333333333333333,
"http://www.w3.org/ns/ttml#styling fontStyle":"normal",
"http://www.w3.org/ns/ttml#styling fontWeight":"normal",
"http://www.w3.org/ns/ttml#styling textDecoration":[
"none"
],
"http://www.w3.org/ns/ttml#styling textOutline":"none",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling wrapOption":"wrap",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"text":"- [murmurs]",
"space":"default"
}
]
}
]
}
]
}
]
},
{
"kind":"region",
"id":"pop2",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling showBackground":"whenActive",
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling displayAlign":"before",
"http://www.w3.org/ns/ttml#styling extent":{
"h":1,
"w":1
},
"http://www.w3.org/ns/ttml#styling opacity":1,
"http://www.w3.org/ns/ttml#styling origin":{
"h":0,
"w":0
},
"http://www.w3.org/ns/ttml#styling overflow":"hidden",
"http://www.w3.org/ns/ttml#styling padding":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling writingMode":"lrtb",
"http://www.w3.org/ns/ttml#styling zIndex":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false
},
"contents":[
{
"kind":"body",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"div",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto"
},
"contents":[
{
"kind":"p",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling lineHeight":"normal",
"http://www.w3.org/ns/ttml#styling textAlign":"start",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"urn:ebu:tt:style linePadding":0,
"urn:ebu:tt:style multiRowAlign":"auto",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"contents":[
{
"kind":"span",
"styleAttrs":{
"http://www.w3.org/ns/ttml#styling color":[
255,
255,
255,
255
],
"http://www.w3.org/ns/ttml#styling direction":"ltr",
"http://www.w3.org/ns/ttml#styling fontFamily":[
"monospace"
],
"http://www.w3.org/ns/ttml#styling fontSize":0.05333333333333333,
"http://www.w3.org/ns/ttml#styling fontStyle":"normal",
"http://www.w3.org/ns/ttml#styling fontWeight":"normal",
"http://www.w3.org/ns/ttml#styling textDecoration":[
"none"
],
"http://www.w3.org/ns/ttml#styling textOutline":"none",
"http://www.w3.org/ns/ttml#styling visibility":"visible",
"http://www.w3.org/ns/ttml#styling wrapOption":"wrap",
"http://www.w3.org/ns/ttml/profile/imsc1#styling forcedDisplay":false,
"http://www.w3.org/ns/ttml#styling backgroundColor":[
0,
0,
0,
0
],
"http://www.w3.org/ns/ttml#styling display":"auto",
"http://www.w3.org/ns/ttml#styling unicodeBidi":"normal"
},
"text":"- SHH.",
"space":"default"
}
]
}
]
}
]
}
]
}
],
"aspectRatio":null
},
"images":[
],
"embeddedImages":{
},
"cueID":"cue_TTML_46"
}
}
I can reproduce this locally - it's definitely a bug. The thing I was missing is that the duplicate set of cues are not displayed because of the styling, but, as pointed out, they are definitely active.
The answer does appear to be that one ISD should map to one cue, as alluded to above. I think the original test here was to ensure only cues with actual content were created, but I suspect there wasn't any multiple active cue content available when the initial integration was completed.
I'll submit a patch shortly.
davemevans
on 24 Apr 2018
Thanks @bbcrddave - that answers my https://github.com/Dash-Industry-Forum/dash.js/issues/2525#issuecomment-383922638 earlier.
nigelmegitt
on 24 Apr 2018
Related issues
fabienvallee
·
3Comments
lioun1729
·
6Comments
NguyenTungs
·
5Comments
sandersaares
·
5Comments
davemevans
·
4Comments
Most helpful comment
I can reproduce this locally - it's definitely a bug. The thing I was missing is that the duplicate set of cues are not displayed because of the styling, but, as pointed out, they are definitely active.
The answer does appear to be that one ISD should map to one cue, as alluded to above. I think the original test here was to ensure only cues with actual content were created, but I suspect there wasn't any multiple active cue content available when the initial integration was completed.
I'll submit a patch shortly.