diff --git a/frontend-tools/video-js/src/components/controls/SeekIndicator.js b/frontend-tools/video-js/src/components/controls/SeekIndicator.js index ac6a7373..6294160e 100644 --- a/frontend-tools/video-js/src/components/controls/SeekIndicator.js +++ b/frontend-tools/video-js/src/components/controls/SeekIndicator.js @@ -204,6 +204,54 @@ class SeekIndicator extends Component { `; textEl.textContent = 'Pause'; + } else if (direction === 'copy-url') { + iconEl.innerHTML = ` +
+
+ + + + +
+
+ `; + textEl.textContent = ''; + } else if (direction === 'copy-embed') { + iconEl.innerHTML = ` +
+
+ + + + +
+
+ `; + textEl.textContent = ''; } // Clear any text content in the text element @@ -239,6 +287,11 @@ class SeekIndicator extends Component { this.showTimeout = setTimeout(() => { this.hide(); }, 500); + } else if (direction === 'copy-url' || direction === 'copy-embed') { + // Copy operations: 500ms (same as play/pause) + this.showTimeout = setTimeout(() => { + this.hide(); + }, 500); } } diff --git a/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js b/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js index 890271a6..bc77b214 100644 --- a/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js +++ b/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js @@ -14,10 +14,19 @@ class EmbedInfoOverlay extends Component { this.authorThumbnail = options.authorThumbnail || ''; this.videoTitle = options.videoTitle || 'Video'; this.videoUrl = options.videoUrl || ''; + this.showTitle = options.showTitle !== undefined ? options.showTitle : true; // Initialize after player is ready this.player().ready(() => { - this.createOverlay(); + if (this.showTitle) { + this.createOverlay(); + } else { + // Hide overlay element if showTitle is false + const overlay = this.el(); + overlay.style.display = 'none'; + overlay.style.opacity = '0'; + overlay.style.visibility = 'hidden'; + } }); } @@ -186,10 +195,16 @@ class EmbedInfoOverlay extends Component { const player = this.player(); const overlay = this.el(); + // If showTitle is false, ensure overlay is hidden + if (!this.showTitle) { + overlay.style.display = 'none'; + overlay.style.opacity = '0'; + overlay.style.visibility = 'hidden'; + return; + } + // Sync overlay visibility with control bar visibility const updateOverlayVisibility = () => { - const controlBar = player.getChild('controlBar'); - if (!player.hasStarted()) { // Show overlay when video hasn't started (poster is showing) - like before overlay.style.opacity = '1'; diff --git a/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx b/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx index 491b935e..63ad7686 100644 --- a/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx +++ b/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx @@ -33,6 +33,7 @@ const VideoJSEmbed = ({ subtitlesInfo, enableAutoplay, inEmbed, + showTitle, hasTheaterMode, hasNextLink, nextLink, @@ -220,7 +221,14 @@ const VideoJSEmbed = ({ return (
- {inEmbed ?
:
} + {inEmbed ? ( +
+ ) : ( +
+ )}
); }; diff --git a/frontend/src/static/js/components/media-actions/MediaShareEmbed.jsx b/frontend/src/static/js/components/media-actions/MediaShareEmbed.jsx index c13eefdf..1cf236fa 100644 --- a/frontend/src/static/js/components/media-actions/MediaShareEmbed.jsx +++ b/frontend/src/static/js/components/media-actions/MediaShareEmbed.jsx @@ -19,6 +19,7 @@ export function MediaShareEmbed(props) { const [maxHeight, setMaxHeight] = useState(window.innerHeight - 144 + 56); const [keepAspectRatio, setKeepAspectRatio] = useState(false); + const [showTitle, setShowTitle] = useState(false); const [aspectRatio, setAspectRatio] = useState('16:9'); const [embedWidthValue, setEmbedWidthValue] = useState(embedVideoDimensions.width); const [embedWidthUnit, setEmbedWidthUnit] = useState(embedVideoDimensions.widthUnit); @@ -92,6 +93,10 @@ export function MediaShareEmbed(props) { ); } + function onShowTitleChange() { + setShowTitle(!showTitle); + } + function onAspectRatioChange() { const newVal = aspectRatioValueRef.current.value; @@ -136,7 +141,10 @@ export function MediaShareEmbed(props) {
- {(site) => } + {(site) => <> + {/* */} + + }
@@ -166,6 +174,7 @@ export function MediaShareEmbed(props) { '" src="' + links.embed + MediaPageStore.get('media-id') + + (showTitle ? (links.embed.includes('?') ? '&showTitle=1' : '?showTitle=1') : '') + '" frameborder="0" allowfullscreen>' } > @@ -180,6 +189,13 @@ export function MediaShareEmbed(props) {
+
+ +
+