Skip to content

Commit 2409444

Browse files
iranimijiranimij
committed
Improve code, DEV-1111
Signed-off-by: Iman Aboheydary <[email protected]>
1 parent 06035f5 commit 2409444

File tree

7 files changed

+98
-91
lines changed

7 files changed

+98
-91
lines changed

‎Model/ExternalVideoReplacer.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ public function replaceIframeSources(string $content): string
1818
];
1919

2020
foreach ($iframePatterns as $pattern) {
21-
$content = preg_replace_callback($pattern, function ($matches) {
21+
$content = preg_replace_callback($pattern, function (array $matches) {
2222
$beforeSrc = $matches[1];
2323
$iframeUrl = $matches[2];
2424
$afterSrc = $matches[3];

‎etc/di.xml‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
<?xml version="1.0"?>
22
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
33
<type name="Magento\PageBuilder\Model\Filter\Template">
4-
<plugin name="customgento_cookiebot_pagebuilder_template_filter_plugin" type="CustomGento\Cookiebot\Plugin\PageBuilder\Model\Filter\TemplatePlugin" sortOrder="10"/>
4+
<plugin name="customgento_cookiebot_pagebuilder_template_video_blocker_plugin" type="CustomGento\Cookiebot\Plugin\PageBuilder\Model\Filter\TemplatePlugin" sortOrder="10"/>
55
</type>
6-
</config>
6+
<type name="Magento\Cms\Model\Template\Filter">
7+
<plugin name="customgento_cookiebot_cms_template_video_blocker_plugin" type="CustomGento\Cookiebot\Plugin\Cms\Model\Template\FilterPlugin" sortOrder="10"/>
8+
</type>
9+
</config>

‎i18n/de_DE.csv‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,5 @@
22
"Enable Cookiebot Integration","Cookiebot-Integration aktivieren"
33
"Cookiebot ID","Cookiebot ID"
44
"Data Culture","Data Culture"
5+
"accept %1 cookies","akzeptiere %1 Cookies"
6+
"Please %1 to view this %2 content.","Bitte %1 um diesen %2 Inhalt zu sehen."

‎i18n/en_US.csv‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,5 @@
22
"Enable Cookiebot Integration","Enable Cookiebot Integration"
33
"Cookiebot ID","Cookiebot ID"
44
"Data Culture","Data Culture"
5+
"accept %1 cookies","accept %1 cookies"
6+
"Please %1 to view this %2 content.","Please %1 to view this %2 content."

‎view/frontend/templates/config.phtml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
<?php
2+
3+
declare(strict_types=1);
4+
25
/**
36
* Template to pass configuration to JavaScript
47
*/

‎view/frontend/templates/iframe-handler.phtml‎

Lines changed: 61 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,72 @@
11
<?php
22

3+
declare(strict_types=1);
4+
35
use CustomGento\Cookiebot\ViewModel\Script;
46
use Magento\Framework\View\Helper\SecureHtmlRenderer;
57

68
/** @var SecureHtmlRenderer $secureRenderer */
79
/** @var Script $viewModel */
810
$viewModel = $block->getData('view_model');
911

10-
// Only add scripts if video blocking is enabled
11-
if ($viewModel && $viewModel->isBlockVideosUntilConsentEnabled()) {
12-
$placeholderScript = '
13-
document.addEventListener("DOMContentLoaded", function() {
14-
((document, selector, consentType) => {
15-
const createTextNode = text => document.createTextNode(text);
16-
const createElement = element => document.createElement(element);
17-
18-
document.querySelectorAll(selector).forEach(iframe => {
19-
const linkElement = createElement("a");
20-
const divElement = createElement("div");
21-
const paragraphElement = createElement("p");
22-
const iframeSrc = iframe.dataset.cookieblockSrc;
23-
24-
// Detect service provider type
25-
const serviceProvider =
26-
/google\.com\/maps\/embed/.test(iframeSrc) ? "Google Maps" :
27-
/player\.vimeo\.com\/video\//.test(iframeSrc) ? "Vimeo" :
28-
/youtube(-nocookie)?\.com\/embed\//.test(iframeSrc) ? "YouTube" :
29-
undefined;
30-
31-
if (!serviceProvider) {
32-
return;
33-
}
34-
35-
const iframeHeight = iframe.getBoundingClientRect().height;
36-
const iframeWidth = iframe.getBoundingClientRect().width;
37-
38-
// Create placeholder content
39-
divElement.innerHTML = `
40-
<div style="background-color:#CCC;display:inline-block;height:${iframeHeight}px;position:relative;width:${iframeWidth}px;">
41-
<div style="background-color:#848484;border-radius:15px;height:50%;position:absolute;transform:translate(50%,50%);width:50%;">
42-
<p style="color:#FFF;font-size:7.5em;position:relative;top:50%;left:50%;margin:0;text-align:center;transform:translate(-50%,-50%);">&ctdot;</p>
43-
</div>
44-
</div>
45-
`;
46-
47-
// Setup consent message and button
48-
divElement.classList.add(`cookieconsent-optout-${consentType}`);
49-
linkElement.textContent = `accept ${consentType} cookies`;
50-
linkElement.href = "javascript:Cookiebot.renew()";
51-
paragraphElement.append(
52-
createTextNode("Please "),
53-
linkElement,
54-
createTextNode(` to view this ${serviceProvider} content.`)
55-
);
56-
57-
divElement.style.fontSize = "1.4rem";
58-
divElement.append(paragraphElement);
59-
iframe.parentNode.insertBefore(divElement, iframe);
60-
});
61-
})(document, "iframe[data-cookieblock-src]", "marketing");
62-
});
63-
';
12+
// Prepare translations
13+
$acceptText = __('accept %1 cookies', 'marketing');
14+
$consentMessage = __('Please %1 to view this %2 content.');
6415

65-
echo $secureRenderer->renderTag(
66-
'script',
67-
['type' => 'text/javascript', 'data-cookieconsent' => 'ignore'],
68-
$placeholderScript,
69-
false
70-
);
71-
}
16+
$jsTranslations = [
17+
'acceptText' => $acceptText,
18+
'consentMessage' => $consentMessage,
19+
];
7220
?>
21+
22+
<script type="text/javascript" data-cookieconsent="ignore">
23+
document.addEventListener("DOMContentLoaded", function() {
24+
((document, selector, consentType, translations) => {
25+
const createTextNode = text => document.createTextNode(text);
26+
const createElement = element => document.createElement(element);
27+
28+
document.querySelectorAll(selector).forEach(iframe => {
29+
const linkElement = createElement("a");
30+
const divElement = createElement("div");
31+
const paragraphElement = createElement("p");
32+
const iframeSrc = iframe.dataset.cookieblockSrc;
33+
34+
// Detect service provider type
35+
const serviceProvider =
36+
/google\.com\/maps\/embed/.test(iframeSrc) ? "Google Maps" :
37+
/player\.vimeo\.com\/video\//.test(iframeSrc) ? "Vimeo" :
38+
/youtube(-nocookie)?\.com\/embed\//.test(iframeSrc) ? "YouTube" :
39+
undefined;
40+
41+
if (!serviceProvider) {
42+
return;
43+
}
44+
45+
const iframeHeight = iframe.getBoundingClientRect().height;
46+
const iframeWidth = iframe.getBoundingClientRect().width;
47+
48+
// Create placeholder content
49+
divElement.innerHTML = `
50+
<div style="background-color:#CCC;display:inline-block;height:${iframeHeight}px;position:relative;width:${iframeWidth}px;">
51+
<div style="background-color:#848484;border-radius:15px;height:50%;position:absolute;transform:translate(50%,50%);width:50%;">
52+
<p style="color:#FFF;font-size:7.5em;position:relative;top:50%;left:50%;margin:0;text-align:center;transform:translate(-50%,-50%);">&ctdot;</p>
53+
</div>
54+
</div>
55+
`;
56+
57+
// Setup consent message and button
58+
divElement.classList.add(`cookieconsent-optout-${consentType}`);
59+
linkElement.textContent = translations.acceptText.replace('%1', consentType);
60+
linkElement.href = "javascript:Cookiebot.renew()";
61+
const message = translations.consentMessage
62+
.replace('%1', linkElement.outerHTML)
63+
.replace('%2', serviceProvider);
64+
paragraphElement.innerHTML = message;
65+
66+
divElement.style.fontSize = "1.4rem";
67+
divElement.append(paragraphElement);
68+
iframe.parentNode.insertBefore(divElement, iframe);
69+
});
70+
})(document, "iframe[data-cookieblock-src]", "marketing", <?php echo json_encode($jsTranslations); ?>);
71+
});
72+
</script>

‎view/frontend/web/js/fotorama-video-events-mixin.js‎

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -11,44 +11,41 @@ define([
1111

1212
if (!Cookiebot?.consent?.marketing && blockVideoConsentConfig) {
1313
const videoElement = event.target.querySelector('.product-video');
14-
if (!Cookiebot?.consent?.marketing) {
15-
if (Cookiebot?.consent?.marketing) {
16-
return;
17-
}
18-
const linkElement = document.createElement("a");
19-
const divElement = document.createElement("div");
20-
const paragraphElement = document.createElement("p");
2114

22-
const iframeHeight = videoElement.getBoundingClientRect().height || 300;
23-
const iframeWidth = videoElement.getBoundingClientRect().width || 400;
15+
if (Cookiebot?.consent?.marketing) {
16+
return;
17+
}
18+
19+
const linkElement = document.createElement("a");
20+
const divElement = document.createElement("div");
21+
const paragraphElement = document.createElement("p");
22+
const iframeHeight = videoElement.getBoundingClientRect().height || 300;
23+
const iframeWidth = videoElement.getBoundingClientRect().width || 400;
2424

2525

26-
divElement.innerHTML = `
26+
divElement.innerHTML = `
2727
<div style="background-color:#CCC;display:inline-block;height:${iframeHeight}px;position:relative;width:${iframeWidth}px; z-index: 1000;">
2828
<div style="background-color:#848484;border-radius:15px;height:50%;position:absolute;transform:translate(50%,50%);width:50%;">
2929
<p style="color:#FFF;font-size:7.5em;position:relative;top:50%;left:50%;margin:0;text-align:center;transform:translate(-50%,-50%);">&ctdot;</p>
3030
</div>
3131
</div>
3232
`;
3333

34-
divElement.classList.add('cookieconsent-optout-marketing');
35-
linkElement.textContent = 'accept marketing cookies';
36-
linkElement.href = "javascript:Cookiebot.renew()";
37-
paragraphElement.append(
38-
document.createTextNode("Please "),
39-
linkElement,
40-
document.createTextNode(' to view this content.')
41-
);
42-
43-
divElement.style.fontSize = "1.4rem";
44-
divElement.append(paragraphElement);
45-
paragraphElement.style.zIndex = "1000";
46-
paragraphElement.style.position = "relative";
47-
videoElement.parentNode.insertBefore(divElement, videoElement);
48-
return;
49-
} else {
34+
divElement.classList.add('cookieconsent-optout-marketing');
35+
linkElement.textContent = 'accept marketing cookies';
36+
linkElement.href = "javascript:Cookiebot.renew()";
37+
paragraphElement.append(
38+
document.createTextNode("Please "),
39+
linkElement,
40+
document.createTextNode(' to view this content.')
41+
);
42+
43+
divElement.style.fontSize = "1.4rem";
44+
divElement.append(paragraphElement);
45+
paragraphElement.style.zIndex = "1000";
46+
paragraphElement.style.position = "relative";
47+
videoElement.parentNode.insertBefore(divElement, videoElement);
5048

51-
}
5249
return;
5350
}
5451
this._super(e);

0 commit comments

Comments
 (0)