- The following buttons are registered: play_pause, mute, fullscreen,
rewind, fast_forward, picture_in_picture, remote, loop, skip_next,
skip_previous
- SmallPlayButton and BigPlayButton are removed
- The following buttons are used by default on mobile: skip_previous,
play_pause, skip_next
## How to register a custom icon?
**Icons need to be registered before initializing the player.**
Register a custom icon from Material Symbols:
```js
shaka.ui.IconRegistry.register('<PATH_VALUE>');
```
Register a custom Icon from any icon set:
```js
shaka.ui.IconRegistry.register('<NAME>', {
path: '<PATH_VALUE>',
viewBox: '<VIEW_BOX>',
size: 24, // optional
});
```
Register a custom Icon (that contains multiple paths) from any icon set:
```js
shaka.ui.IconRegistry.register('<NAME>', {
path: ['<PATH_VALUE_1>', '<PATH_VALUE_2>'],
viewBox: '<VIEW_BOX>',
size: 24, // optional
});
```
Register a custom Icon using URL of the icon:
```js
shaka.ui.IconRegistry.register('<NAME>', {
url: '<URL>',
size: 24, // optional
});
```
Closes: #9045
---------
Co-authored-by: Álvaro Velad Galván <ladvan91@hotmail.com>
* Update all UI components to use SVG icons instead of icon fonts
* Adjust some icon sizes to 32px
Replacing icon fonts with inline SVGs removes the loading delay caused
by font fetching. Icons now appear immediately with zero delay.
Close https://github.com/shaka-project/shaka-player/issues/2467
Changes:
- The look has been changed to make it more similar to YouTube:
- The main background color is now black, and the font is white.
- Presentation time has been moved to the bottom.
- Cast and airplay buttons are now more accessible.
- Tooltips have been enabled except on mobile platforms.
- The ad information has been moved to appear in the same position as
the presentation time when the ad is present.
- A mark indicating the current quality has been added (e.g.: HD, 2K,
4K, 8K)
- The spinner has been replaced with one that works well on Smart TVs
and is very similar to the current one. The animation is included in the
SVG element itself rather than through CSS.
- More LESS variables have been added to make customization easier in
forks.
- The maximum size of the menus is dynamically calculated so that they
never extend outside the video container.
- The size of the subtitle container when the UI appears is now
calculated dynamically.
- The Demo has been updated to show the seekbar when trickplays are
enabled.
- UI performance on Smart TVs has been improved (Tested on Tizen 5.0)
- Many offsets that were hardcoded have been removed, but not all (in
CSS).
Close https://github.com/shaka-project/shaka-player/issues/8406
This fixes all the license headers in the main library, which corrects
the appearance of the main license in the compiled output.
It seems that the `!` in the header forces the compiler to keep it in
the output. I believe older compiler releases did this purely based
on `@license`.
Issue #2638
Change-Id: I7f0e918caad10c9af689c9d07672b7fe9be7b2f3
When we changed the font for the icons without changing the class
name, we lost upstream styles from the font server. This was not
obvious in our demo, but was more obvious in other apps where the font
size was different.
By using the same class name as used by the font server, we get those
upstream styles applied correctly.
Issue #2633
Change-Id: I615c1dfd86e5b9802d03050c5db0154ac196c2ef
The compiler is very picky about the use of the "disabled" property on
HTMLElement, since it is only defined on certain subclasses of that.
This adds a method to create a button with the correct type to satisfy
the compiler.
Issue #2528
Change-Id: I31cacd62a35acc87b245ab362dbab55d791cf34d
Please note that this CL doesn't add the new control
to the default layout, so it won't show up in our
demo page.
Issue #2362
Change-Id: Ibecf6a7174de7d8eca9049f0b46ae179a03b9c01
Álvaro Velad Galván
Phyo Wai Lin
Wojciech Tyczyński
Álvaro Velad Galván
Nico
Theodore Abshire
Joey Parrish
Sandra Lokshina