Incorrect rendering of CEA608 captions

[squarebracket]

Environment

• Link to playable MPD file: http://vm2.dashif.org/dash/vod/testpic_2s/cea608.mpd
• Dash.js version: nightly
• Browser name/version: Firefox, Chrome
• OS name/version: Linux

Observed behaviour

Nightly now incorrectly renders the size of CEA608 captions when using the TTML renderer. For the CEA608 test stream, it renders correctly when at full size. However, opening the console cuts off the bottom of the captions div:

Having the console closed is obviously the normal use case, but I get much bigger problems with real-world captions:

Captions seem to have enough space when viewing the stream in fullscreen:

Do I now need to manually set fontSize or something? Or is this just a bug in determining video size when not fullscreen?

[TobbeEdgeware]

It is probably scaleCue in TextTracks.js which is not being properly called. I'll try to look into it.

[nicosang]

I don't know CEA608 very well, but @TobbeEdgeware what is the meaning of this values?

aspectRatio = 3.5 / 3.0;
use80Percent = true;

with those values, the getVideoVisibleVideoSize function returns this...

it seems the videoCaptionContainer has not the good aspect. So, according to me, the issue is not the scaleCue but rather the checkVideoSize : do you agree?

[nicosang]

@squarebracket could you, please, have a look to my PR? does it solve your issue?

[squarebracket]

I'm not sure about the aspectRatio, but CEA608 says the safe zone (i.e. where the captions are to appear) is 80% of the display.

As for your PR, it definitely made it better, in that they're now displaying in the right area and at the right size again. The tails of some characters are still a bit chopped off, though:

Setting the CSS of #video-caption to be overflow: visible, as you'd expect, makes that problem disappear. I'm not sure if you want to spend the time pixel-fixing the bounding box to perfection, but IMO setting overflow: visible is totally reasonable since the captions are appearing in the right spot.

[squarebracket]

Oh, I see in the WebVTT spec that you're supposed to have overflow: hidden. Hmm.

[nicosang]

@squarebracket could you, please, test with an older dash.js version? a version before imsc1.js integration....it's probably a cea608 issue....
in the EmbeddedTextHtmlRender file, lineHeight and linePadding are always empty.... :-(

[TobbeEdgeware]

@nicosang Regarding the aspect ratio, CEA-608 was designed as 80% for 4:3 aspect ratio, and it does not look good to extend to 80% for 16:9 content. The aspect ratio

aspectRatio = 3.5 / 3.0;
use80Percent = true;

were heuristically chosen to look good, but may need to be changed. If there is another value that is better, please feel free to suggest a change.

[nicosang]

As I previously said, I'm not an expert of cea608. My question was to help me to understand the problem. So, I prefer to keep those values ;-). Thanks for your answer.
@TobbeEdgeware, have you an idea on the chopped off characters issue? Can we have from ce608 parser lineHeight and linePadding values?

[squarebracket]

@nicosang I see the tails chopped off on 2.5.0 as well.

As far as lineHeight and linePadding. CEA608 doesn't carry padding information. The only line information it has is that it's a grid of 15 rows and 32 columns (inside that 80% window as @TobbeEdgeware mentioned).

One interesting thing to note. The tails only seem to be cut off when there's two or more lines displayed at once. A single line, I can see the tails. Maybe there's something wonky with the rounding of the region size here.

[TobbeEdgeware]

If I remember correctly, each line is its own region in order to be able to have lines which are not adjacent, without needing empty lines in between. One can probably tune these regions together with the fonts to make things look better and the formulas that @squarebracket points out is probably an important part of this.