diff --git a/includes/EmbedService/EmbedHtmlFormatter.php b/includes/EmbedService/EmbedHtmlFormatter.php index 1ba7b03..0c42bb0 100644 --- a/includes/EmbedService/EmbedHtmlFormatter.php +++ b/includes/EmbedService/EmbedHtmlFormatter.php @@ -9,6 +9,7 @@ use JsonException; use MediaWiki\Extension\EmbedVideo\EmbedVideo; use MediaWiki\Extension\EmbedVideo\OEmbed; +use Html; use MediaWiki\MediaWikiServices; use Message; use UnexpectedValueException; @@ -203,7 +204,13 @@ public static function makeTitleHtml( AbstractEmbedService $service ): string { return ''; } - return sprintf( '
%s
', $service->getTitle() ); + $link = Html::element( 'a', [ + 'target' => '_blank', + 'href' => $service->getUrl(), + 'rel' => 'noopener noreferrer nofollow' + ], $service->getTitle() ); + + return sprintf( '
%s
', $link ); } /** diff --git a/resources/ext.embedVideo.consent.less b/resources/ext.embedVideo.consent.less index a095be1..740bf35 100644 --- a/resources/ext.embedVideo.consent.less +++ b/resources/ext.embedVideo.consent.less @@ -63,6 +63,14 @@ text-overflow: ellipsis; overflow: hidden; white-space: nowrap; + + a { + color: #eaecf0; + + &:hover { + color: #fff; + } + } } &__fakeButton { @@ -108,7 +116,7 @@ .embedvideo-loader { &__title, &__footer { - opacity: 0; + //opacity: 0; } &__fakeButton { diff --git a/resources/modules/iframe.js b/resources/modules/iframe.js index 8717854..84cc6de 100644 --- a/resources/modules/iframe.js +++ b/resources/modules/iframe.js @@ -9,7 +9,7 @@ const fetchThumb = async (url, parent, container) => { // Title const overlay = parent.querySelector('.embedvideo-loader'); - overlay.querySelectorAll('.embedvideo-loader__title').forEach(title => { + overlay.querySelectorAll('.embedvideo-loader__title:not(.embedvideo-loader__title--manual)').forEach(title => { overlay.removeChild(title); }); @@ -73,13 +73,21 @@ const fetchThumb = async (url, parent, container) => { picture.append(image); parent.prepend(picture); - if (typeof json.title !== 'undefined' && json.title.length > 0) { + if (typeof json.title !== 'undefined' && json.title.length > 0 && parent.querySelector('.embedvideo-loader__title--manual') === null) { const overlay = parent.querySelector('.embedvideo-loader'), - title = document.createElement('div'); + title = document.createElement('div'), + link = document.createElement('a'); title.classList.add('embedvideo-loader__title'); - title.innerText = json.title; + + link.classList.add('embedvideo-loader__link'); + link.href = JSON.parse(container?.dataset?.iframeconfig ?? '{"src": "#"}').src; + link.target = '_blank'; + link.rel = 'noopener noreferrer nofollow'; + link.innerText = json.title; + + title.append(link); overlay.prepend(title); } @@ -145,6 +153,10 @@ const makeIframe = function(ev) { const togglePrivacyClickListener = function (event) { event.stopPropagation(); + if (event.target.classList.contains('embedvideo-loader__link')) { + return; + } + loader.classList.toggle('hidden'); privacyNotice.classList.toggle('hidden'); };