Clarification of correct line position for vertical-rl and vertical-lr cues

[jonknowles]

I have a question about the specification for line position for vertical text cues. For cues with either a vertical:rl or vertical:lr property, the spec seems to state that the line position is relative to the direction of growth:

The line offsets the cue box from the top, the right or left of the video viewport as defined by the writing direction, the snap-to-lines flag, or the lines occupied by any other showing tracks. https://www.w3.org/TR/webvtt1/#webvtt-cue-line

However, it doesn't seem to explicitly state which side is at line 0% and which side is at line 100% for each growth direction.

The videojs/vtt.js project implements the line position as a percentage from the left side for vertical:rl and a percentage from the right side for vertical:lr, so the following cues are placed so:

00:00:06.000 --> 00:00:08.000 line:10% vertical:rl
text
________________________________
|    t                           |
|    e                           |
|    x                           |
|    t                           |
|________________________________|

00:00:06.000 --> 00:00:08.000 line:90% vertical:rl
text
________________________________
|                            t   |
|                            e   |
|                            x   |
|                            t   |
|________________________________|

To me, this seems the opposite of a common-sense interpretation, since 'rl' ('vertical growing left'), seems to imply that we start on the right at line position 0 and grow leftward toward line position 100. In my mind, the position of these two cues should be reversed, with line:10% on the right side of the screen and line:90% on the left side of the screen.

Is there something I am missing in the spec that lays this out explicitly? Is the videojs/vtt.js implementation of this positioning correct?

[silviapfeiffer]

To me it looks like the implementation is offsetting from the wrong edge.

[silviapfeiffer]

Step 5 of the cue setting rendering section explains it: https://www.w3.org/TR/webvtt1/#processing-cue-settings

[nigelmegitt]

Looks like a good candidate for a test.

[jonknowles]

Thanks for your input! I will open an issue in the videojs/vtt project to follow up on this.

[gkatsev]

It's likely that vtt.js doesn't currently consider the vertical value when dealing with the line property. An issue against vtt.js would be helpful, thanks.

[jonknowles]

I'd just like to add that Chome and Firefox appear to agree with vtt.js on this one. They both render a vertical:rl line:0% cue at the far left of the viewport.

[gkatsev]

Interesting. I wonder if that is correct behavior according to the spec (I'll have to dig deeper later) but intuitively, it kind of makes sense. In the horizontal caption layout your captions are at the bottom of the video, and when you have line:0% the cue gets positioned at the top of the video. When you set vertical:rl the "bottom" of the screen now becomes the right of the video, so, makes sense for line:0% in that case to be the "top" of the screen and the left side.

[gkatsev]

Looking at the spec, under step 6, when snap-to-lines is false, we set the x-position to be the value of line, interestingly enough, regardless of which vertical value it is:

If the WebVTT cue writing direction is vertical growing left or vertical growing right

Let x-position be the computed line.

I wonder if it makes sense to have the same interpretation for both values of vertical or if vertical:rl should be the computed line value and vertical:lr should be 100- computed line value.

[jonknowles]

When you set vertical:rl the "bottom" of the screen now becomes the right of the video

This is what maybe doesn't make sense to me intuitively - if vertical:rl is growing from right to left, shouldn't the "top" (0%) be on the right side, and it would grow leftward with higher percentages, just as a top to bottom cue would grow from the top toward the bottom?

I could definitely see the argument for making positioning the same in both cases of vertical cues, it would simplify the rule a lot!

[gkatsev]

Cues actually grow from the bottom to the top. For example, if you have a cue from 0-10s and then a second cue from 5-10s, the default positioning would put the second cue on top of the first cue. For a vertical:rl, the first cue would be on the right of the video with the second cue being immediately to it's left.

[jonknowles]

Sorry, I used imprecise language there. By "growth", I meant the way one single cue expands when you add additional lines to it. But now that I think about it, I don't think that's a helpful way to think about it and probably has nothing to do with the spec. Sorry for the confusion.

[gkatsev]

No worries, thanks for taking a look at these. Definitely worth more eyes on these things.