Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Text-shadow in WebVTT not working #5020

Closed
Peterdoo opened this issue Feb 22, 2023 · 0 comments · Fixed by #5499
Closed

Text-shadow in WebVTT not working #5020

Peterdoo opened this issue Feb 22, 2023 · 0 comments · Fixed by #5499
Labels
component: captions/subtitles The issue involves captions or subtitles component: WebVTT The issue involves WebVTT subtitles specifically priority: P2 Smaller impact or easy workaround status: archived Archived and locked; will not be updated type: bug Something isn't working correctly
Milestone

Comments

@Peterdoo
Copy link

Have you read the FAQ and checked for duplicate open issues?
YES

What version of Shaka Player are you using?
v4.3.4-uncompiled

Can you reproduce the issue with our latest release version?
YES

Can you reproduce the issue with the latest code from main?

Are you using the demo app or your own custom app?
Demo app shaka-player-demo.appspot.com

If custom app, can you reproduce the issue using our demo app?

What browser and OS are you using?
Chrome Version 109.0.5414.120 (Official Build) (64-bit) on Win11

For embedded devices (smart TVs, etc.), what model and firmware version are you using?

What are the manifest and license server URIs?

What configuration are you using? What is the output of player.getConfiguration()?

Demo app shaka-player-demo.appspot.com

What did you do?

Display the following WebVTT cue:

WEBVTT

STYLE
::cue(.red) { color: #FF0000FF; }
::cue(.yellow) { color: #FFFF00FF; }
::cue(.cyan) { color: #00FFFFFF; }
::cue(.white) { color: #FFFFFFFF; }
::cue(.bg_black) { background-color: #40; text-shadow: -2px 0 10px #000000FF, 0 2px 10px #000000FF, 2px 0 10px #000000FF, 0 -2px 10px #000000FF; }
::cue { background-color: #00000000; opacity: 1; }

01:01:20.000 --> 01:01:25.575 line:90%,end align:center position:50%,center
<c.white.bg_black>This subtitle:</c>
<c.white.bg_black>WHITE </c><c.red.bg_black>RED</c>
<c.yellow.bg_black>YELLOW </c><c.cyan.bg_black>CYAN</c>

What did you expect to happen?
Text characters should be surrounded by the black non-transparent shadow. Shadow color: #000000FF (black with alpha=FF). The following picture has been made by putting the above STYLE into a css and displaying the cue as html:
image

What actually happened?

There is no shadow around the text characters.
image

@Peterdoo Peterdoo added the type: bug Something isn't working correctly label Feb 22, 2023
@github-actions github-actions bot added this to the v4.4 milestone Feb 22, 2023
@avelad avelad added component: WebVTT The issue involves WebVTT subtitles specifically component: captions/subtitles The issue involves captions or subtitles labels Mar 22, 2023
@avelad avelad added the priority: P2 Smaller impact or easy workaround label Aug 18, 2023
@shaka-bot shaka-bot added the status: archived Archived and locked; will not be updated label Oct 17, 2023
@shaka-project shaka-project locked as resolved and limited conversation to collaborators Oct 17, 2023
Robloche pushed a commit to Robloche/shaka-player that referenced this issue Nov 30, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
component: captions/subtitles The issue involves captions or subtitles component: WebVTT The issue involves WebVTT subtitles specifically priority: P2 Smaller impact or easy workaround status: archived Archived and locked; will not be updated type: bug Something isn't working correctly
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants