[Accessibility] Adding caption display customization options to the embedded video player

Open
#6,459 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
52/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Active
Tech stack
angular, typescript

Research direction

Start by locating the embedded media player and its caption controls in the Angular interface; the issue does not name a file or test. Review how the player currently enables WebVTT captions and identify where users can adjust caption appearance. Done means users can customize caption characteristics such as colors, font, size, background opacity, and font outline or border.

Written by the indexing model from the issue text.

Description

accessibility bug component: viewer help wanted

Describe the bug

According to 301 559, Section 7.1.4: Where DSpace displays captions, "it shall provide a way for the user to adapt the displayed characteristics of captions to their individual requirements, except where the captions are displayed as unmodifiable characters." This can be done by allowing users to define the background or foreground color of subtitles, font type, size opacity of the background box of subtitles, and the contour or border of the fonts.

To Reproduce

Upload a video (mp4) to DSpace. Add a .vtt caption file (instructions on how to do this can be found on the wiki). Check the media player. Captions can now be turned on, but there are no customization options. See screenshot below.

Image

Expected behavior

A user should be able to customize captions.

Dominant language
TypeScript
Stars
180
Forks
577
Avg merge
2d 1h
Merged PRs (30d)
100

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from DSpace/dspace-angular

All issues in DSpace/dspace-angular

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.