Skip to content

Commit 5d1c9be

Browse files
authored
Merge pull request #784 from ableplayer/develop
Merge develop into main.
2 parents c3a8563 + 0f1c037 commit 5d1c9be

150 files changed

Lines changed: 25344 additions & 19537 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/workflows/ci.yml‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
# Continuous integration for Able Player
2+
#
3+
# Runs ESLint and both Jest projects (jsdom + puppeteer) on every push and
4+
# pull request. The puppeteer project runs headless with request
5+
# interception, so no demo server is needed. Build artifacts are compiled
6+
# to confirm Grunt + Rollup succeed, but are never committed (per
7+
# contributing.md).
8+
#
9+
# The accessibility job runs axe-core (WCAG 2.1 A/AA rules) plus keyboard
10+
# operability checks over a representative demo set at four viewports
11+
# (320px -> 4K). Automated checks catch only a fraction of WCAG failures —
12+
# a green run prevents a class of regressions; it is not a conformance claim.
13+
name: CI
14+
15+
on:
16+
push:
17+
branches: [main, develop]
18+
pull_request:
19+
20+
permissions:
21+
contents: read
22+
23+
# Superseded runs on the same ref are cancelled, so a force-push to an open
24+
# pull request does not leave stale jobs occupying the queue.
25+
concurrency:
26+
group: ${{ github.workflow }}-${{ github.ref }}
27+
cancel-in-progress: true
28+
29+
jobs:
30+
lint:
31+
name: ESLint
32+
runs-on: ubuntu-latest
33+
timeout-minutes: 10
34+
steps:
35+
- uses: actions/checkout@v4
36+
- uses: actions/setup-node@v4
37+
with:
38+
node-version: 22
39+
cache: npm
40+
# Only the puppeteer job launches a browser; skip puppeteer's Chromium
41+
# download elsewhere (setup-node's npm cache does not cover it).
42+
- run: npm ci
43+
env:
44+
PUPPETEER_SKIP_DOWNLOAD: "1"
45+
- run: npm run lint
46+
47+
test:
48+
name: Jest (jsdom)
49+
runs-on: ubuntu-latest
50+
timeout-minutes: 15
51+
steps:
52+
- uses: actions/checkout@v4
53+
- uses: actions/setup-node@v4
54+
with:
55+
node-version: 22
56+
cache: npm
57+
- run: npm ci
58+
env:
59+
PUPPETEER_SKIP_DOWNLOAD: "1"
60+
# webvtt.test.cjs loads build/test/webvtt.umd.js, so the suite must run
61+
# against a fresh build rather than the committed bundle — otherwise a
62+
# change to the WebVTT source is never actually exercised.
63+
- run: npm run build
64+
- run: npx jest --selectProjects jsdom
65+
66+
test-browser:
67+
name: Jest (puppeteer, headless)
68+
runs-on: ubuntu-latest
69+
timeout-minutes: 20
70+
steps:
71+
- uses: actions/checkout@v4
72+
- uses: actions/setup-node@v4
73+
with:
74+
node-version: 22
75+
cache: npm
76+
- run: npm ci
77+
# validate.test.cjs loads build/test/validate.umd.js
78+
- run: npm run build
79+
- run: npx jest --selectProjects puppeteer
80+
81+
build:
82+
name: Build (Grunt + Rollup)
83+
runs-on: ubuntu-latest
84+
timeout-minutes: 15
85+
steps:
86+
- uses: actions/checkout@v4
87+
- uses: actions/setup-node@v4
88+
with:
89+
node-version: 22
90+
cache: npm
91+
- run: npm ci
92+
env:
93+
PUPPETEER_SKIP_DOWNLOAD: "1"
94+
- run: npm run build
95+
- name: Confirm build outputs exist
96+
run: |
97+
test -s build/ableplayer.js
98+
test -s build/ableplayer.min.js
99+
test -s build/ableplayer.esm.js
100+
test -s build/ableplayer.min.css
101+
102+
a11y:
103+
name: Accessibility (axe + keyboard, 320px-4K)
104+
runs-on: ubuntu-latest
105+
timeout-minutes: 20
106+
steps:
107+
- uses: actions/checkout@v4
108+
- uses: actions/setup-node@v4
109+
with:
110+
node-version: 22
111+
cache: npm
112+
- run: npm ci
113+
# The demo pages load ../build/ableplayer.dist.js + ableplayer.min.css,
114+
# so the suite always scans a fresh build, never a stale committed one.
115+
- run: npm run build
116+
- run: npx playwright install --with-deps chromium
117+
# e2e/serve.mjs serves the repo root so the demos' relative ../build and
118+
# ../media references resolve; Playwright boots it via playwright.config.js.
119+
- run: npm run test:a11y
120+
- name: Upload Playwright report on failure
121+
if: failure()
122+
uses: actions/upload-artifact@v4
123+
with:
124+
name: a11y-playwright-report
125+
path: playwright-report/
126+
retention-days: 14

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,5 @@ npm-debug.log
66
.htaccess
77
docs
88
jsdoc.json
9-
/test-results
9+
playwright-report/
10+
test-results/

‎README.md‎

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -19,27 +19,28 @@
1919

2020
## Feature List
2121

22-
- Supports both audio and video.
22+
- Both Audio & Video.
2323
- Supports either a single audio track or an entire playlist.
24-
- Includes a full set of player controls that are keyboard-accessible, properly labeled for screen reader users, and controllable by speech recognition users.
25-
- Includes customizable keyboard shortcuts that enable the player to be operated from anywhere on the web page (unless there are multiple instances of the player on a given page; then the player must have focus for keyboard shortcuts to work).
26-
- Features high contrast, scalable controls that remain visible in Windows High Contrast mode, plus an easy-to-see focus indicator so keyboard users can easily tell which control currently has focus.
27-
- Supports closed captions and subtitles in Web Video Timed Text (WebVTT) format, the standard format recommended by the HTML5 specification.
28-
- Supports chapters, also using WebVTT. Chapters are specific landing points in the video, allowing video content to have structure and be more easily navigated.
29-
- Supports text-based audio description, also using WebVTT. At designated times, the description text is read aloud by browsers, or by screen readers for browsers that don't support the Web Speech API. Users can optionally set their player to pause when audio description starts to avoid conflicts between the description and program audio.
30-
- Supports spoken captions, as described in the "Spoken subtitles" requirement to EN 301 549. If enabled by a user, caption timing will be estimated and speed is dynamically adjusted to fit the available time. User can select a default speed, pitch, and volume for captions.
31-
- Supports audio description as a separate video. When two videos are available (one with description and one without), both can be delivered together using the same player and users can toggle between the versions.
32-
- Supports adjustable playback rate. Users who need to slow down the video to better process and understand its content can do so; and users who need to speed up the video to maintain better focus can do so.
33-
- Includes an interactive transcript feature, built from the WebVTT chapter, caption and description files as the page is loaded. Users can click anywhere in the transcript to start playing the video (or audio) at that point. Keyboard users can also choose to keyboard-enable the transcript, so they can tab through its content one caption at a time and press enter to play the media at the desired point.
34-
- Features automatic text highlighting within the transcript as the media plays. This feature is enabled by default but can be turned off if users find it distracting.
35-
- Supports YouTube and Vimeo videos.
36-
- Provides users with the ability to customize the display of captions and subtitles. Users can control the font style, size, and color of caption text; plus background color and transparency; all from the Preferences dialog. They can also choose to position captions *below* the video instead of the default position (an semi-transparent overlay).
24+
- All player controls are keyboard-accessible, properly labeled for screen reader users, and controllable by speech recognition users.
25+
- Customizable keyboard shortcuts that enable the player to be operated from anywhere on the web page (if there are multiple instances of the player on a page, then the player must have focus for keyboard shortcuts to work).
26+
- High contrast, scalable controls supported in Windows High Contrast mode, plus an easy-to-see focus indicator so users can easily tell which control has focus.
27+
- Closed captions and subtitles in Web Video Timed Text (WebVTT) format, the standard format recommended by the HTML5 specification.
28+
- Chapters using WebVTT. Chapters are specific landing points in the video, allowing video content to be more easily navigated.
29+
- Text-based audio description using WebVTT. Description text is read aloud by the Speech Synthesis API. Users can set their experience to pause when audio description starts to avoid conflicts between the description and program audio.
30+
- Media Query support. Able Player will switch to an alternate video `source` with a `media` attribute if it matches the current environment.
31+
- Spoken captions, as described in the "Spoken subtitles" requirement to EN 301 549. If enabled by a user, caption timing will be estimated and speed is dynamically adjusted to fit the available time. User can select a default speed, pitch, and volume for captions.
32+
- Audio description as a separate video. When two videos are available (one with description and one without), both can use the same player and users can toggle between versions.
33+
- Adjustable playback rate. Users can slow down or speed up playback to suit their needs.
34+
- Interactive transcript feature, built from the WebVTT chapter, caption and description files as the page is loaded. Users can click anywhere in the transcript to start playback at that point. Keyboard users can choose to keyboard-enable the transcript, so they can tab through its content one caption at a time and press <code>enter</code> to play the media from that caption.
35+
- Automatic text highlighting in the transcript as the media plays. This feature is enabled by default but can be turned off if users find it distracting.
36+
- YouTube and Vimeo support.
37+
- Customization of caption and subtitle appearance. Users can control font style, size, and color of caption text; plus background color and transparency. They can also choose to position captions *below* the video instead of the default position as a semi-transparent overlay.
3738
- Supports fallback content if the media cannot be played (see section on **Fallback** for details).
38-
- Includes extensive customization options. Many of the features described above are controlled by user preferences. This is based on the belief that every user has different needs and there are no one-size-fits-all solutions. This is the heart of universal design.
39+
- User Customization: Many of the features described above are controlled by user preferences. This is based on the belief that every user has different needs and there are no one-size-fits-all solutions. This is the heart of universal design.
3940

4041
## Supported Languages
4142

42-
Able Player has been translated into the following languages.
43+
Able Player has been translated into the following languages. Able Player's native language is American English.
4344

4445
<ul>
4546
<li><strong lang="id">Bahasa Indonesia</strong> (Indonesian)</li>
@@ -48,7 +49,6 @@ Able Player has been translated into the following languages.
4849
<li><strong>Chinese, Traditional (Taiwan)</strong></li>
4950
<li><strong lang="da">Dansk</strong> (Danish)</li>
5051
<li><strong lang="de">Deutsch</strong> (German)</li>
51-
<li><strong>English</strong></li>
5252
<li><strong lang="en">Español</strong> (Spanish)</li>
5353
<li><strong lang="fr">Français</strong> (French)</li>
5454
<li><strong lang="he">עִברִית</strong> (Hebrew)</li>
@@ -380,6 +380,7 @@ If none of the above attributes are present, the transcript will be displayed in
380380
Additional transcript-related attributes include:
381381
- **data-transcript-title** - optional; override default transcript title (default is "Transcript", or "Lyrics" if the data-lyrics-mode attribute is present)
382382
- **data-lyrics-mode** - optional; forces a line break between and within captions in the transcript
383+
- **data-strict-mode** - set to "true" to prevent parentheses or square brackets from being marked with bold with line brekaks. Default "false".
383384

384385
To manually code the transcript, one simple strategy is to first allow Able Player to *automatically* generate a transcript. Then copy and paste its content as a starting point. To manually code a transcript from scratch, use the following markup (see [Video Demo #7] for an example):
385386

0 commit comments

Comments
 (0)