Add option to display time in UI #299
Conversation
|
Finally implement the visibility based on ytlr-watch-default hybridnavfocusable attribute, more effective and simpler. |
| }); | ||
| } | ||
|
|
||
| destroy() { |
There was a problem hiding this comment.
Use explicit resource management instead of a destroy function.
There was a problem hiding this comment.
But as I can see, this executes Dispose, when the class has a certain life cycle, if events are running inside you have to finish it manually anyway
src/watch.js
Outdated
| for (const mutation of mutations) { | ||
| const value = mutation.target.getAttribute('hybridnavfocusable'); | ||
| // Hide watch when player is focused | ||
| this.#watch.style.display = value === 'true' ? 'none' : 'block'; |
There was a problem hiding this comment.
This can most likely be done in pure CSS using a sibling combinator. Have you investigated that?
There was a problem hiding this comment.
But it is not a child or sibling element, and it cannot be if we want to use it before the video element appears
There was a problem hiding this comment.
Since we can't use :has due to performance issues with the polyfill, you're correct. But fyi, in modern browsers, you can do this:
.webOs-watch {
display: block;
}
:has(.ytlr-watch-default[hybridnavfocusable="true"]) ~ .webOs-watch {
display: none;
}
src/watch.js
Outdated
| startClock() { | ||
| const nextSeg = (60 - new Date().getSeconds()) * 1000; | ||
|
|
||
| const formater = new Intl.DateTimeFormat(navigator.language, { |
It displays the time in the top right corner of the screen, disappears when playback starts, and returns when the video is paused.