## Description
In the specific case of using an old chrome version this minor changes
will allow the captions to be shown.
## Specific Changes proposed
Small fix when using videojs in an old browser that does not support the
css 'inset' property.
## Requirements Checklist
- [x] Feature implemented / Bug fixed
- [ ] If necessary, more likely in a feature request than a bug fix
- [ ] Change has been verified in an actual browser (Chrome, Firefox,
IE)
- [ ] Unit Tests updated or fixed
- [ ] Docs/guides updated
- [ ] Example created ([starter template on
JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0))
- [ ] Has no DOM changes which impact accessiblilty or trigger warnings
(e.g. Chrome issues tab)
- [ ] Has no changes to JSDoc which cause `npm run docs:api` to error
- [ ] Reviewed by Two Core Contributors
---------
Co-authored-by: Walter Seymour <walterseymour15@gmail.com>
Co-authored-by: Gary Katsevman <git@gkatsev.com>
## Description
Removes an old unmaintained dependency that isn't needed any more.
## Specific Changes proposed
Replace safe-json-parse with `JSON.parse`
## Requirements Checklist
- [x] Feature implemented / Bug fixed
- [ ] If necessary, more likely in a feature request than a bug fix
- [x] Change has been verified in an actual browser (Chrome, Firefox,
IE)
- [ ] Unit Tests updated or fixed
- [ ] Docs/guides updated
- [ ] Example created ([starter template on
JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0))
- [x] Has no DOM changes which impact accessiblilty or trigger warnings
(e.g. Chrome issues tab)
- [x] Has no changes to JSDoc which cause `npm run docs:api` to error
- [ ] Reviewed by Two Core Contributors
## Description
Prevents a duplicate id in text track settings.
Fixes#8754
## Specific Changes proposed
The text edge settings were erroneously duplicating the id generated for
the background colour. Changes to a unique name.
Adds a general test for duplicate ids.
## Requirements Checklist
- [x] Feature implemented / Bug fixed
- [ ] If necessary, more likely in a feature request than a bug fix
- [x] Change has been verified in an actual browser (Chrome, Firefox,
IE)
- [x] Unit Tests updated or fixed
- [ ] Docs/guides updated
- [ ] Example created ([starter template on
JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0))
- [x] Has no DOM changes which impact accessiblilty or trigger warnings
(e.g. Chrome issues tab)
- [x] Has no changes to JSDoc which cause `npm run docs:api` to error
- [ ] Reviewed by Two Core Contributors
* feat(player): add spatialNavigation feature
Adds spatialNavigation feature to enhance user experience
- Implemented spatial navigation in slider component
- Enhanced player functionality for improved navigation
* feat(player): add spatialNavigation class
Adds spatialNavigation class to manage spatial-navigation-polyfill
- Set class SpatialNavigation on its own file
- Imported SpatialNavigation class on component class
* feat(player): update spatialNavigation class
Adds 3 methods to spatialNavigation class to manage spatial-navigation-polyfill
- Added start() to: Start listen of keydown events
- Added stop() to: Stop listen key down events
- Added getComponents() to: Get current focusable components
* feat(player): modify spatialNavigation class & modify component class
Modify spatialNavigation class:
-Remove unrequired version of function ‘getComponents’
Modify component class:
-Add function ‘getIsFocusable’
* Added methods getPositions, handleFocus and handleBLur for spatial navigation needs
* feat(player): modify Component class, BigPlayButton class & ClickableComponent class
Modify Component class:
-Add method getIsAvailableToBeFocused
-Modify method getIsFocusable to only focus on finding focusable candidates
Modify spatialNavigation class:
-Remove unrequired method ‘getIsFocusable’
Modify component class:
-Remove unrequired method ‘getIsFocusable’
* Added import in player.js, Created base methods inside spatial-navigation.js
* feat(player): modify Component class & SpatialNavigation class
Modify Component class:
-Modify method getIsAvailableToBeFocused to be more strict on candidates
Modify spatialNavigation class:
-Modify method getComponents to get all focusable components
* feat(player): modify Component class
Modify Component class:
-Add documentation to ‘isVisible’ function
* added keydown event logic for spatial-navigation
* feat(player): modify SpatialNavigation class
Modify SpatialNavigation class:
-Modify documentation of functions
* feat(player): modify SpatialNavigation class
Modify SpatialNavigation class:
-Add ‘clear’ & ‘remove’ methods
* feat(player): modify SpatialNavigation class
Modify SpatialNavigation class:
-Add documentation of functions
* feat(player): modify SpatialNavigation class
Modify SpatialNavigation class:
-Add function ‘getCurretComponent’‘’
* feat(player): modify SpatialNavigation class
Modify SpatialNavigation class:
-Add documentation for ‘findBestCandidate’ method
* Added logic for moving focus to the best candidate
* Implemented move, findBestCandidate, isInDirection, and calculateDistance methods for spatial navigation logic
* Added a new player option enableKeydownListener, Added gap: 1px to control-bar for spatial-navigation-polyfill needs
* feat(player): modify SpatialNavigation class & Component class
Modify SpatialNavigation class:
-Add function ‘handlePlayerBlur’
-Add function ‘handlePlayerFocus’
Modify Component class:
-Modify ‘handleBlur’
-Modify ‘handleFocus’
* Removed enableKeydownListener flag, as user should start the SpatialNavigation manually
* Added functionality to track changes in the focusableComponents list (custom event focusableComponentsChanged)
* feat(player): modify SpatialNavigation class, ModalDialog & Component class
Modify SpatialNavigation class:
-Add ‘lastFocusedComponent’
-Add function ‘refocusComponent’
Modify ModalDialog class:
-Add condition on ‘close’ function
Modify Component class:
-Modify ‘handleBlur’ to store blurred component
* feat(player): modify ModalDialog
Modify ModalDialog:
-Add condition to close Modal on Backspace
* Refactor SpatialNavigation to use player.spatialNavigation
* Added a new custom event endOfFocusableComponents
* Added new styles for focused elements in case spatial navigation is enabled
* feat(player): modify SpatialNavigation class:
-Add condition so getComponents can get as candidates the UI elements from the playlist-ui
* Changed to window.SpatialNabigation to this.player_.spatialNavigation
* feat(player): modify text-track-settings, created test-track-settings-colors.js, text-track-settings-font.js,text-track-fieldset.js & text-track-select.js:
Modify text-track-settings class:
- Add changes so newly created components can work as content of the modal.
- Create new components as a refactor of the contents of text-track-settings
* changed handleKeyDown inside component.js, getComponents method is now iterating player.children
* feat(player): create TrackSettingsControls Component & Modify TextTrackSettings
Create TrackSettingsControls Component:
-Create Component to show buttons reset & done as components.
Modify TextTrackSettings:
-Add Component TrackSettingsControls in TextTrackSettings
* feat(player): Modify ModalDialog
Modify ModalDialog:
-Add condition for stop propagation of event inside of ModalDialog when spatialNavigation is enabled
* getIsFocusable and getIsAvailableToBeFocused methods are now accepting el as a parameter, added a new methods findSuitableDOMChild and focus for spatialNavigation class
* feat(player): Modify TextTrackSettings:
Modify TextTrackSettings:
-Remove unrequired methods to create DOM elements since now those are created by Components.
* feat(player): Modify CaptionSettingsMenuItem:
Modify CaptionSettingsMenuItem:
-Add condition to focus component of TextTrackSelect when modal is open
* feat(player): Modify TextTrackSelect & TextTrackFieldset:
Modify TextTrackSelect :
Modify TextTrackFieldset:
-Add comments to certain functions to explain the code
* feat(player): Modify TrackSettingsControls:
Modify TrackSettingsControls:
-Remove unrequired comments & add comments to certain functions to explain the code
* feat(player): Modify SpatialNavigation, Component & ModalDialog:
Modify SpatialNavigation:
Modify Component:
Modify ModalDialog:
-Add & update comments of documentation.
* Handle ENTER keydown in Modals when spatial navigation is enabled
* feat(player): Modify ModalDialog, spatialNavigation, TrackSettingsControls, TextTrackFieldset, TextTrackSelect, TrackSettingsColors, TrackSettingsFont:
Modify ModalDialog:
Modify spatialNavigation:
Modify TrackSettingsControls:
Modify TextTrackFieldset:
Modify TextTrackSelect:
Modify TrackSettingsColors:
Modify TrackSettingsFont:
-Add & update comments of documentation.
* Implement additional RCU controls
* feat(player): Modify Component class:
Modify Component :
-Remove unrequired condition inside of handleFocus method.
* feat(player): Modify ModalDialog & CaptionSettingsMenuItem
Modify ModalDialog:
Modify CaptionSettingsMenuItem:
-Modify spatialNavigation condition to be more specific regarding spatialNavigation implementation.
* feat(player): Modify SpatialNavigation class:
Modify SpatialNavigation :
-Fix bug where ‘enter’ press was not working properly on select component inside of the ‘vjs-text-track-settings’ modal.
* feat(player): Modify SpatialNavigation class:
Modify SpatialNavigation :
-Minor improvements on the loops of certain functions to stop when they have found the element they are looking for.
-Implement minor spacing formatting on switch statement.
* Update src/js/component.js
More understandable documentation.
Co-authored-by: Dzianis Dashkevich <98566601+dzianis-dashkevich@users.noreply.github.com>
* Update src/js/component.js
More understandable documentation.
Co-authored-by: Dzianis Dashkevich <98566601+dzianis-dashkevich@users.noreply.github.com>
* feat(player): Modify SpatialNavigation & Component class:
Modify Component class :
Modify SpatialNavigation class :
-Modify ‘getIsFocusable’ function to use ‘this.el_’ instead of ‘el’ parameter
* feat(player): Modify SpatialNavigation class:
Modify SpatialNavigation class :
-Refactor onKeyDown function to use static data & return when pause is true.
* feat(player): Modify SpatialNavigation class:
Modify SpatialNavigation class :
-Refactor to use ‘.el()’ instead of ‘.el_’
* Update src/js/spatial-navigation.js
Co-authored-by: Walter Seymour <walterseymour15@gmail.com>
* feat(player): Modify ModalDialog class & MenuItem class:
Modify ModalDialog class :
Modify MenuItem class :
-Correct typo of ‘isSpatialNavlistening’ to ‘isSpatialNavListening’.
* removed unused property, remove this.focus, which was added for testing purposes
* Changed parameters to private, removed redundant code, removed initialFocusedComponent parameter, change STEP_SECONDS to static
* feat(player): solve remaining conflict:
Modify Spatial Navigation class :
- Solve conflict
* feat(player): Rename TrackSettingsColors & TrackSettingsFont
* feat(player): Remove unrequired functions calls from components TextTrackSettingsColors & TextTrackSettingsFont.
* feat(player): Update spatial-navigation.js's keypress return keyword.
* bind focus and blur just if spatial navigation is enabled, add 1px gap if spatial navigation is enabled
* feat(player): Modify calls on 'isListening' & 'isPaused' for ModalDialog & TextTrackMenuItem
* feat(player): remove unrequired object on component 'TrackSettingsControls'
* Removed 1px gap
* feat(player): Rename function ‘getComponents’ to ‘updateFocusableComponents’
* Changed SpatialNavigation class to extend EventTarget, removed redundant methods for events
* fix(player): fix call of 'getIsAvailableToBeFocused' that was throwing an error.
* removed Static maps for key presses and extended keycode with the missing keys
* refactor(player): Modify functions of 'getIsDisabled', 'getIsExpresslyInert' & 'getIsFocusable' to be more in pair when stablished code of the player.
* Conditional assignment for keycode.codes.back based on platform, changed Backspace to Back key for Modal closing
* Extend the object for reverse lookup, prenet Up/down keys to open a menu if spatial navigation is anabled
* refactor(player): Refactor 'SpatialNavKeycodes' file to not patch 'keycode' dependency
* fix(pllayer): fix issue related to 'back' not being used properly in function 'isEventKey'
* feat(player): Rename imports of 'spatial-navigation-keycode' to have their extension
* feat(player): Add example of use of 'Client app uses a global spatial-navigation solution'
* feat(player): rename 'spatial-navigation-keycode.js' filename
* Fix on src chnage issue, ESC button closing modal, expand vjs-modal-dialog
* change file name and object name
* fix: Update ids of labels to use 'guid' so unit test works properly
* fix: update localized text in text-track-settings-font & text-track-settings
* Mark some methods as private
* fix: modify content of modal 'text-track-settings' to change language properly
* fix: add missing '.' in jsdoc of text-track components
* feature: add unit test for 'text-track-select' component
* Add test for Spatial Navigation
* test(player): Add minor test related to 'handleBlur' & 'handleFocus'
* feat(player): Remove unrequired files from 'react-video-nav-app'
* test(player): Add small test to check if 'getPositions' returns required properties
* test(player): add test to verify 'getPositions()' properties are not empty
* Add missing tests for performMediaAction_ and move
* test(player): add test to for 'component.js' related to 'handleBlur'
* test(player): add minor test in component related to test keypress propagation event
* test(player): add test for component related to 'getIsAvailableToBeFocused' function
* test(player): add test for Modal Dialog related to call function of spatial navigation
* test(player): add tests for 'spatial-navigation-key-codes'
* test(player): add tests for keycodes related to 'should return event name if keyCode is not available'
* test(player): add minor test for case when not required parametters are passed
* test(player): add test for 'caption-settings-menu-item'
* feat(player): remove 'react-video-nav-app'
* Move handleFocus and handleBlur from components.js to spatial-navigation.js
* refactor(player): refactor 'searchForTrackSelect' to be handled in the spatial navigation
* remove unrequired code in function 'searchForTrackSelect'
* update documentation comment to be in pair to its current use
* remove spatial navigation keydown from modal dialog and move it to spatial navigation class, modify the modal-dialog test accordingly
* remove useless tests
* Remove caption-settings-menu-item.test.js
* Add minor test to 'searchForTrackSelect' in spatial-navigation.test.js
* Add unit test for back key and listening to events
---------
Co-authored-by: CarlosVillasenor <carlosdeveloper9@gmail.com>
Co-authored-by: Dzianis Dashkevich <98566601+dzianis-dashkevich@users.noreply.github.com>
Co-authored-by: Walter Seymour <walterseymour15@gmail.com>
Co-authored-by: Carlos Villasenor Castillo <cvillasenor@Carloss-MacBook-Pro.local>
Use the timeupdate event as well as the rvfc and raf callbacks to check cues. This is a bit overkill for "usual" playback but avoids edge cases. If the more preceise callback trigger first the cue will update but the timeupdate event should catch any that were missed, notwithstanding that timeupdate was always somewhat unpredictable.
Fixes#7910 (audio in video els and Samsung being weird) and fixes#7902 (no updates off screen).
When preloadTextTracks option is set to false, it still preloads the default text track. This leads to duplicate tracks once the mode changes to showing and the track is loaded a second time. This includes the default text track in the behavior defined by the preloadTextTracks option.
Fixes#7019
Allows the editing of a track's label after its creation. Menu buttons will listen for the labelchange event and update their content accordingly.
This is technically divergent from the spec, which says it's readonly, but it can be useful for Video.js users.
Co-authored-by: Claudia Hinkle <chinkle@chinkle-mn1.linkedin.biz>
It seems we have never triggered change events on remoteTextTrack when we were using native text tracks. This was a problem for VHS, which exclusively uses text tracks.
This makes it so we do trigger the event. Main issue with this change is that it creates a potential for a false positive where a change event was triggered from a non-remote text track but the remoteTextTrack list still received a change event. This issue is mitigated by best practices of looping through the list looking for the modes that you care about.
Co-authored-by: Kevin Kipp <kevin.kipp@gmail.com>
Co-authored-by: Kyle Boutette <kyleveB@gmail.com>
1. We were not always able to clean up `resize` on the `ResizeManager`, as the iframe
contentWindow can disappear before dispose
2. Native Tracks on Safari do not have an `off` so we have to deal with
event listeners manually
Fixes#5878
This is a follow-up to this fix in VHS, after which default in-manifest subtitles were still not being correctly enabled. The reason is because Video.js's text track preselection logic was running before the media groups were set up in VHS.
Text track preselection should happen on `loadedmetadata` instead of `loadstart`. According to the HTML spec, text track data is available on `loadedmetadata`, so we should be waiting until then to make preselection decisions.
When preselecting a new track based on user preference, make sure that the language is actually set and that the track we're testing is either a captions or a subtitles track.
Fixes#5553
Trigger the change event on the next tick. This means that multiple changes to a track's mode will only result in a single change event on its associated TextTrackList rather than 3 events as it may be currently.
Fixes#5159
When providing the TextTrackDisplay component with track settings overrides, currently colour codes with only three digits are supported. This updates it so that 6 digit hex codes are also accepted.
Use ResizeObserver when available for better and more performant resizing information, otherwise, fall back to a throttled resize event on an iframe that's the size of the player.
Allows a video.js user to disable this by setting resizeManager: false as an option since the component will not be initialized.
Add a debounce util.
This reverts #4800 (e0ed0b5) because we end up getting two playerresize events with the dimension methods now.
A we retained a lot of references to DOM elements in various components. Here we clear it up. Also, make sure that we remove unused listeners as they can retain objects as well.
Update evented mixin to null out the eventBusEl_ after the component is disposed.
Add a feature for components, to tell it not to auto-initialize the evented mixin.
Re-enable the tests that were removed in #4640.
We added a feature so that remote text tracks can auto-removed when a source changes. However, in 6.x we changed the source behavior to be asynchronous meaning that some text tracks were accidentally being removed when they weren't supposed to be.
For example:
```js
var player = videojs('my-player');
player.src({src: 'video.mp4', type: 'video/mp4'});
// set second arg to false so that they get auto-removed on source change
player.addRemoteTextTrack({kind: 'captions', src: 'text.vtt', srclang: 'en'}, false);
```
Now when the player loads, this captions track is actually missing because it was removed.
Instead of adding auto-removal tracks immediately to the list, wait until we've selected a source before adding them in.
Fixes#4403 and #4315.
