CopyBot/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2025-11-10 17:38:54 -05:00
Code Issues Packages Projects Releases Wiki Activity

Skip empty tooltips

Browse Source
This commit is contained in:
Yiannis Christodoulou 2025-10-10 10:30:29 +03:00
parent 4bec15fad5
commit 816135266c
3 changed files with 31 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
frontend-tools/video-js/src/components/controls/ButtonTooltips.css
View File

@ -6,8 +6,8 @@
position: relative;
}
/* Universal tooltip styling for all buttons */
.video-js .vjs-control-bar .vjs-control::after {
/* Universal tooltip styling for all buttons - only show when title is not empty */
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
position: absolute;
bottom: 100%;
@ -40,8 +40,8 @@
/* Show tooltip on hover and focus for desktop */
@media (hover: hover) and (pointer: fine) {
.video-js .vjs-control-bar .vjs-control:hover::after,
.video-js .vjs-control-bar .vjs-control:focus::after {
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "]):hover::after,
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "]):focus::after {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(-2px);
@ -49,47 +49,50 @@
}
/* Specific button tooltips - override content when needed */
.video-js .vjs-play-control::after {
.video-js .vjs-play-control[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-mute-control::after {
.video-js .vjs-mute-control[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-fullscreen-control::after {
.video-js .vjs-fullscreen-control[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-picture-in-picture-toggle::after {
.video-js .vjs-picture-in-picture-toggle[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-subtitles-button::after {
.video-js .vjs-subtitles-button[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-subs-caps-button[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-chapters-button::after {
.video-js .vjs-chapters-button[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
/* Custom button tooltips */
.video-js .vjs-autoplay-toggle::after {
.video-js .vjs-autoplay-toggle[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-next-video-button::after {
.video-js .vjs-next-video-button[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
.video-js .vjs-settings-button::after {
.video-js .vjs-settings-button[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
left: auto !important;
right: 0 !important;
transform: translateX(-10px) !important;
}
.video-js .vjs-remaining-time::after {
.video-js .vjs-remaining-time[title]:not([title=""]):not([title=" "])::after {
content: attr(title);
}
@ -101,7 +104,7 @@
}
/* Show tooltip when touch-active class is added */
.video-js .vjs-control-bar .vjs-control.touch-tooltip-active::after {
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "]).touch-tooltip-active::after {
display: block;
opacity: 1;
visibility: visible;
@ -111,7 +114,7 @@
/* Tablet-specific adjustments */
@media (min-width: 768px) and (max-width: 1024px) and (hover: none) {
.video-js .vjs-control-bar .vjs-control.touch-tooltip-active::after {
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "]).touch-tooltip-active::after {
font-size: 14px;
padding: 10px 14px;
}
@ -119,7 +122,7 @@
/* Mobile-specific adjustments */
@media (max-width: 767px) {
.video-js .vjs-control-bar .vjs-control.touch-tooltip-active::after {
.video-js .vjs-control-bar .vjs-control[title]:not([title=""]):not([title=" "]).touch-tooltip-active::after {
font-size: 12px;
padding: 6px 10px;
margin-bottom: 8px;

2
frontend-tools/video-js/src/components/overlays/EndScreenOverlay.js
View File

@ -19,7 +19,6 @@ class EndScreenOverlay extends Component {
// Method to update related videos after initialization
setRelatedVideos(videos) {
this.relatedVideos = videos || [];
console.log('Updated relatedVideos:', this.relatedVideos);
}
createEl() {
@ -62,7 +61,6 @@ class EndScreenOverlay extends Component {
// Get videos to show - access directly from options during createEl
const relatedVideos = this.options_?.relatedVideos || this.relatedVideos || [];
console.log('createGrid relatedVideos:', relatedVideos);
const videosToShow =
relatedVideos.length > 0

14
frontend-tools/video-js/src/components/video-player/VideoJSPlayer.jsx
View File

@ -43,6 +43,8 @@ const enableStandardButtonTooltips = (player) => {
fullscreenToggle: () => (player.isFullscreen() ? 'Exit fullscreen' : 'Fullscreen'),
pictureInPictureToggle: 'Picture-in-picture',
subtitlesButton: 'Subtitles/CC',
captionsButton: 'Captions',
subsCapsButton: 'Subtitles/CC',
chaptersButton: 'Chapters',
audioTrackButton: 'Audio tracks',
playbackRateMenuButton: 'Playback speed',
@ -60,6 +62,12 @@ const enableStandardButtonTooltips = (player) => {
? buttonTooltips[buttonName]()
: buttonTooltips[buttonName];
// Skip empty tooltips
if (!tooltipText || tooltipText.trim() === '') {
console.log('Empty tooltip for button:', buttonName, tooltipText);
return;
}
buttonEl.setAttribute('title', tooltipText);
buttonEl.setAttribute('aria-label', tooltipText);
@ -2061,11 +2069,11 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
descriptionsButton: false,
// Subtitles (CC) button should be visible
subtitlesButton: hasSubtitles && !isTouchDevice ? true : false,
subtitlesButton: false, // hasSubtitles && !isTouchDevice ? true : false,
// Captions button (keep disabled to avoid duplicate with subtitles)
captionsButton: false,
subsCapsButton: false,
captionsButton: hasSubtitles ? true : false,
subsCapsButton: hasSubtitles ? true : false,
// Audio track button
audioTrackButton: true,