From 3ffe6e3f171f31950bfd03adb284005413ac5ff9 Mon Sep 17 00:00:00 2001
From: Alexander Ebert <ebert@woltlab.com>
Date: Fri, 12 Jun 2020 20:14:39 +0200
Subject: [PATCH] Prompt the user for their approval before displaying external
 media

---
 com.woltlab.wcf/option.xml                    |  5 ++
 .../templates/messageUserConsent.tpl          | 11 ++++
 com.woltlab.wcf/userOption.xml                |  7 ++
 constants.php                                 |  1 +
 .../js/WoltLabSuite/Core/BootstrapFrontend.js |  8 ++-
 .../Core/Ui/Message/UserConsent.js            | 65 +++++++++++++++++++
 .../lib/acp/form/FirstTimeSetupForm.class.php |  1 +
 .../provider/BBCodeMediaProvider.class.php    | 31 ++++++++-
 .../files/lib/data/user/UserAction.class.php  | 15 +++++
 .../files/style/ui/messageUserConsent.scss    | 34 ++++++++++
 wcfsetup/install/lang/de.xml                  |  6 ++
 wcfsetup/install/lang/en.xml                  |  6 ++
 12 files changed, 185 insertions(+), 5 deletions(-)
 create mode 100644 com.woltlab.wcf/templates/messageUserConsent.tpl
 create mode 100644 wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
 create mode 100644 wcfsetup/install/files/style/ui/messageUserConsent.scss

diff --git a/com.woltlab.wcf/option.xml b/com.woltlab.wcf/option.xml
index 7e5bea9e46..e12cbd2b80 100644
--- a/com.woltlab.wcf/option.xml
+++ b/com.woltlab.wcf/option.xml
@@ -1544,6 +1544,11 @@ ruby
 rust
 go</defaultvalue>
 			</option>
+			<option name="message_enable_user_consent">
+				<categoryname>message.general</categoryname>
+				<optiontype>boolean</optiontype>
+				<defaultvalue>1</defaultvalue>
+			</option>
 			<!-- /message.general -->
 			<option name="search_results_per_page">
 				<categoryname>message.search</categoryname>
diff --git a/com.woltlab.wcf/templates/messageUserConsent.tpl b/com.woltlab.wcf/templates/messageUserConsent.tpl
new file mode 100644
index 0000000000..0cd19d9315
--- /dev/null
+++ b/com.woltlab.wcf/templates/messageUserConsent.tpl
@@ -0,0 +1,11 @@
+<div class="messageUserConsent" data-payload="{$payload}">
+	<div class="messageUserConsentHeader">
+		<span class="messageUserConsentTitle">{lang}wcf.message.user.consent.title{/lang}</span>
+		<a href="{$url}" class="messageUserConsentHost externalURL">{$host}</a>
+	</div>
+	<div class="messageUserConsentDescription">{lang}wcf.message.user.consent.description{/lang}</div>
+	<div class="messageUserConsentButtonContainer">
+		<button class="small jsButtonMessageUserConsentEnable">{lang}wcf.message.user.consent.button.enable{/lang}</button>
+	</div>
+	<div class="messageUserConsentNotice">{lang}wcf.message.user.consent.notice{/lang}</div>
+</div>
diff --git a/com.woltlab.wcf/userOption.xml b/com.woltlab.wcf/userOption.xml
index 769aade42c..4decf051fa 100644
--- a/com.woltlab.wcf/userOption.xml
+++ b/com.woltlab.wcf/userOption.xml
@@ -206,6 +206,13 @@
 3:wcf.user.access.nobody</selectoptions>
 				<editable>3</editable>
 			</option>
+			<option name="enableEmbeddedMedia">
+				<categoryname>settings.privacy.content</categoryname>
+				<optiontype>boolean</optiontype>
+				<defaultvalue>0</defaultvalue>
+				<editable>3</editable>
+				<options>message_enable_user_consent</options>
+			</option>
 			<!-- settings.privacy.messaging -->
 			<option name="canViewEmailAddress">
 				<categoryname>settings.privacy.messaging</categoryname>
diff --git a/constants.php b/constants.php
index 61605901e2..a960771b6a 100644
--- a/constants.php
+++ b/constants.php
@@ -263,3 +263,4 @@ define('BLACKLIST_SFS_EMAIL_ADDRESS', 'moreThanOnce');
 define('BLACKLIST_SFS_IP_ADDRESS', '90percentile');
 define('BLACKLIST_SFS_ACTION', 'disable');
 define('ENABLE_ENTERPRISE_MODE', 0);
+define('MESSAGE_ENABLE_USER_CONSENT', 1);
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/BootstrapFrontend.js b/wcfsetup/install/files/js/WoltLabSuite/Core/BootstrapFrontend.js
index 0742b7b676..6a0b64e4d6 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/BootstrapFrontend.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/BootstrapFrontend.js
@@ -9,11 +9,13 @@
 define(
 	[
 	 	'WoltLabSuite/Core/BackgroundQueue', 'WoltLabSuite/Core/Bootstrap', 'WoltLabSuite/Core/Controller/Style/Changer',
-	 	'WoltLabSuite/Core/Controller/Popover', 'WoltLabSuite/Core/Ui/User/Ignore', 'WoltLabSuite/Core/Ui/Page/Header/Menu'
+	 	'WoltLabSuite/Core/Controller/Popover', 'WoltLabSuite/Core/Ui/User/Ignore', 'WoltLabSuite/Core/Ui/Page/Header/Menu',
+		'WoltLabSuite/Core/Ui/Message/UserConsent'
 	],
 	function(
 		BackgroundQueue, Bootstrap, ControllerStyleChanger,
-		ControllerPopover, UiUserIgnore, UiPageHeaderMenu
+		ControllerPopover, UiUserIgnore, UiPageHeaderMenu,
+		UiMessageUserConsent
 	)
 {
 	"use strict";
@@ -52,6 +54,8 @@ define(
 			if (COMPILER_TARGET_DEFAULT) {
 				UiUserIgnore.init();
 			}
+			
+			UiMessageUserConsent.init();
 		},
 		
 		/**
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
new file mode 100644
index 0000000000..348e99dd1e
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
@@ -0,0 +1,65 @@
+define(['Ajax', 'Core', 'User', 'Dom/ChangeListener', 'Dom/Util'], function (Ajax, Core, User, DomChangeListener, DomUtil) {
+	var _enableAll = false;
+	var _knownButtons = (typeof window.WeakSet === 'function') ? new window.WeakSet() : new window.Set();
+	
+	return {
+		init: function () {
+			if (window.sessionStorage.getItem(Core.getStoragePrefix() + 'user-consent') === 'all') {
+				_enableAll = true;
+			}
+			
+			this._registerEventListeners();
+			
+			DomChangeListener.add(
+				'WoltLabSuite/Core/Ui/Message/UserConsent',
+				this._registerEventListeners.bind(this)
+			);
+		},
+		
+		_registerEventListeners: function () {
+			if (_enableAll) {
+				this._enableAll();
+			}
+			else {
+				elBySelAll('.jsButtonMessageUserConsentEnable', undefined, (function (button) {
+					if (!_knownButtons.has(button)) {
+						button.addEventListener('click', this._click.bind(this));
+						_knownButtons.add(button);
+					}
+				}).bind(this));
+			}
+		},
+		
+		_click: function (event) {
+			event.preventDefault();
+			
+			_enableAll = true;
+			
+			this._enableAll();
+			
+			if (User.userId) {
+				Ajax.apiOnce({
+					data: {
+						actionName: 'saveUserConsent',
+						className: 'wcf\\data\\user\\UserAction'
+					},
+					silent: true
+				});
+			}
+			else {
+				window.sessionStorage.setItem(Core.getStoragePrefix() + 'user-consent', 'all');
+			}
+		},
+		
+		_enableExternalMedia: function (container) {
+			var payload = atob(elData(container, 'payload'));
+			
+			DomUtil.insertHtml(payload, container, 'before');
+			elRemove(container);
+		},
+		
+		_enableAll: function () {
+			elBySelAll('.messageUserConsent', undefined, this._enableExternalMedia.bind(this));
+		}
+	};
+});
diff --git a/wcfsetup/install/files/lib/acp/form/FirstTimeSetupForm.class.php b/wcfsetup/install/files/lib/acp/form/FirstTimeSetupForm.class.php
index 28b23f667e..fe23827af2 100644
--- a/wcfsetup/install/files/lib/acp/form/FirstTimeSetupForm.class.php
+++ b/wcfsetup/install/files/lib/acp/form/FirstTimeSetupForm.class.php
@@ -41,6 +41,7 @@ class FirstTimeSetupForm extends AbstractOptionListForm {
 		'mail_from_address',
 		'mail_admin_address',
 		'image_allow_external_source',
+		'message_enable_user_consent',
 		'module_contact_form',
 		'log_ip_address',
 		'package_server_auth_code',
diff --git a/wcfsetup/install/files/lib/data/bbcode/media/provider/BBCodeMediaProvider.class.php b/wcfsetup/install/files/lib/data/bbcode/media/provider/BBCodeMediaProvider.class.php
index f920be955b..b3e9d91d3b 100644
--- a/wcfsetup/install/files/lib/data/bbcode/media/provider/BBCodeMediaProvider.class.php
+++ b/wcfsetup/install/files/lib/data/bbcode/media/provider/BBCodeMediaProvider.class.php
@@ -5,13 +5,15 @@ use wcf\system\bbcode\media\provider\IBBCodeMediaProvider;
 use wcf\system\cache\builder\BBCodeMediaProviderCacheBuilder;
 use wcf\system\request\IRouteController;
 use wcf\system\Regex;
+use wcf\system\WCF;
 use wcf\util\StringUtil;
+use wcf\util\Url;
 
 /**
  * Represents a BBCode media provider.
  * 
  * @author	Tim Duesterhus
- * @copyright	2001-2019 WoltLab GmbH
+ * @copyright	2001-2020 WoltLab GmbH
  * @license	GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @package	WoltLabSuite\Core\Data\Bbcode\Media\Provider
  *
@@ -98,14 +100,14 @@ class BBCodeMediaProvider extends DatabaseObject implements IRouteController {
 			if (!$regex->match($url)) continue;
 			
 			if ($this->getCallback() !== null) {
-				return $this->getCallback()->parse($url, $regex->getMatches());
+				return $this->getOutputForUserConsent($url, $this->getCallback()->parse($url, $regex->getMatches()) );
 			}
 			else {
 				$output = $this->html;
 				foreach ($regex->getMatches() as $name => $value) {
 					$output = str_replace('{$' . $name . '}', $value, $output);
 				}
-				return $output;
+				return $this->getOutputForUserConsent($url, $output);
 			}
 		}
 		
@@ -133,4 +135,27 @@ class BBCodeMediaProvider extends DatabaseObject implements IRouteController {
 		
 		return $this->callback;
 	}
+	
+	/**
+	 * Replaces embedded media with an approval dialog.
+	 * 
+	 * @param string $url
+	 * @param string $html
+	 * @return string
+	 */
+	protected function getOutputForUserConsent($url, $html) {
+		if (!MESSAGE_ENABLE_USER_CONSENT) {
+			return $html;
+		}
+		
+		if (WCF::getUser()->userID && WCF::getUser()->getUserOption('enableEmbeddedMedia')) {
+			return $html;
+		}
+		
+		return WCF::getTPL()->fetch('messageUserConsent', 'wcf', [
+			'host' => Url::parse($url)['host'],
+			'payload' => base64_encode($html),
+			'url' => $url,
+		]);
+	}
 }
diff --git a/wcfsetup/install/files/lib/data/user/UserAction.class.php b/wcfsetup/install/files/lib/data/user/UserAction.class.php
index f8cea74a7f..cb6d86fb98 100644
--- a/wcfsetup/install/files/lib/data/user/UserAction.class.php
+++ b/wcfsetup/install/files/lib/data/user/UserAction.class.php
@@ -989,6 +989,21 @@ class UserAction extends AbstractDatabaseObjectAction implements IClipboardActio
 		// does nothing
 	}
 	
+	/**
+	 * @since 5.3
+	 */
+	public function validateSaveUserConsent() {}
+	
+	/**
+	 * @since 5.3
+	 */
+	public function saveUserConsent() {
+		$userEditor = new UserEditor(WCF::getUser());
+		$userEditor->updateUserOptions([
+			User::getUserOptionID('enableEmbeddedMedia') => 1,
+		]);
+	}
+	
 	/**
 	 * Validates the 'resendActivationMail' action.
 	 * 
diff --git a/wcfsetup/install/files/style/ui/messageUserConsent.scss b/wcfsetup/install/files/style/ui/messageUserConsent.scss
new file mode 100644
index 0000000000..a51d26645c
--- /dev/null
+++ b/wcfsetup/install/files/style/ui/messageUserConsent.scss
@@ -0,0 +1,34 @@
+.messageUserConsent {
+	background-color: $wcfContentBackground;
+	border-radius: 2px;
+	box-shadow: 0 0 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
+	margin: 10px 0;
+	max-width: 600px;
+	padding: 20px;
+	
+	@include screen-sm-down {
+		padding: 10px;
+	}
+}
+
+.messageUserConsentHeader {
+	display:flex;
+	justify-content: space-between;
+}
+
+.messageUserConsentTitle {
+	font-size: 18px;
+	font-weight: 600;
+	line-height: 1.05;
+	margin-bottom: 10px;
+}
+
+.messageUserConsentButtonContainer {
+	margin: 10px 0;
+	text-align: center;
+}
+
+.messageUserConsentNotice {
+	color: $wcfContentDimmedText;
+	font-size: 12px;
+}
diff --git a/wcfsetup/install/lang/de.xml b/wcfsetup/install/lang/de.xml
index 714e010d03..cfe0d5edaa 100644
--- a/wcfsetup/install/lang/de.xml
+++ b/wcfsetup/install/lang/de.xml
@@ -1762,6 +1762,7 @@ Die Datenbestände werden sorgfältig gepflegt, aber es ist nicht ausgeschlossen
 		<item name="wcf.acp.option.blacklist_sfs_action.description"><![CDATA[Es besteht immer das Risiko eines fehlerhaften Eintrages, daher wird die Einstellung <strong>Deaktivierung, erfordert manuelle Freischaltung</strong> ausdrücklich empfohlen.]]></item>
 		<item name="wcf.acp.option.blacklist_sfs_action.disable"><![CDATA[Deaktivierung, erfordert manuelle Freischaltung]]></item>
 		<item name="wcf.acp.option.module_amp"><![CDATA[<abbr title="Accelerated Mobile Pages">AMP</abbr>]]></item>
+		<item name="wcf.acp.option.message_enable_user_consent"><![CDATA[Inhalte von externen Anbietern erst nach Zustimmung anzuzeigen]]></item>
 	</category>
 	<category name="wcf.acp.customOption">
 		<item name="wcf.acp.customOption.list"><![CDATA[Eingabefelder]]></item>
@@ -4144,6 +4145,10 @@ Dateianhänge:
 		<item name="wcf.message.toc"><![CDATA[Inhaltsverzeichnis]]></item>
 		<item name="wcf.message.toc.hide"><![CDATA[Verbergen]]></item>
 		<item name="wcf.message.toc.show"><![CDATA[Anzeigen]]></item>
+		<item name="wcf.message.user.consent.button.enable"><![CDATA[Alle externen Inhalte anzeigen]]></item>
+		<item name="wcf.message.user.consent.description"><![CDATA[Inhalte von externen Seiten werden ohne {if LANGUAGE_USE_INFORMAL_VARIANT}deine{else}Ihre{/if} Zustimmung nicht automatisch geladen und angezeigt.]]></item>
+		<item name="wcf.message.user.consent.notice"><![CDATA[Durch die Aktivierung der externen Inhalte {if LANGUAGE_USE_INFORMAL_VARIANT}erklärst du dich{else}erklären Sie sich{/if} damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.]]></item>
+		<item name="wcf.message.user.consent.title"><![CDATA[Externer Inhalt]]></item>
 	</category>
 	<category name="wcf.menu">
 		<!-- category for menus and menu items -->
@@ -5231,6 +5236,7 @@ Benachrichtigungen auf <a href="{link isHtmlEmail=true}{/link}">{PAGE_TITLE|lang
 		<item name="wcf.user.option.searchRadioButtonOption"><![CDATA[Auswahl des Benutzers bei „{$option->getTitle()}“:]]></item>
 		<item name="wcf.user.option.searchTextOption"><![CDATA[„{$option->getTitle()}“ enthält:]]></item>
 		<item name="wcf.user.option.searchBooleanOption"><![CDATA[Auswahl des Benutzers bei „{$option->getTitle()}“:]]></item>
+		<item name="wcf.user.option.enableEmbeddedMedia"><![CDATA[Alle externen Inhalte anzeigen]]></item>
 	</category>
 	<category name="wcf.user.mail">
 		<item name="wcf.user.mail.mail.plaintext"><![CDATA[Hallo {@$mailbox->getUser()->username},
diff --git a/wcfsetup/install/lang/en.xml b/wcfsetup/install/lang/en.xml
index 9c7e207d20..abc2804f20 100644
--- a/wcfsetup/install/lang/en.xml
+++ b/wcfsetup/install/lang/en.xml
@@ -1746,6 +1746,7 @@ The database is carefully maintained, but there will be always be a margin of er
 		<item name="wcf.acp.option.blacklist_sfs_action.description"><![CDATA[There is always the risk of a false-positive match, therefore it is highly recommended to set it to <strong>Disable and require manual approval</strong>.]]></item>
 		<item name="wcf.acp.option.blacklist_sfs_action.disable"><![CDATA[Disable and require manual approval]]></item>
 		<item name="wcf.acp.option.module_amp"><![CDATA[<abbr title="Accelerated Mobile Pages">AMP</abbr>]]></item>
+		<item name="wcf.acp.option.message_enable_user_consent"><![CDATA[Prompt users before displaying content from external sources]]></item>
 	</category>
 	<category name="wcf.acp.customOption">
 		<item name="wcf.acp.customOption.list"><![CDATA[Option Fields]]></item>
@@ -4089,6 +4090,10 @@ Attachments:
 		<item name="wcf.message.toc"><![CDATA[Contents]]></item>
 		<item name="wcf.message.toc.hide"><![CDATA[hide]]></item>
 		<item name="wcf.message.toc.show"><![CDATA[show]]></item>
+		<item name="wcf.message.user.consent.button.enable"><![CDATA[Display all external content]]></item>
+		<item name="wcf.message.user.consent.description"><![CDATA[Content embedded from external sources will not be displayed without your consent.]]></item>
+		<item name="wcf.message.user.consent.notice"><![CDATA[Through the activation of external content, you agree that personal data may be transferred to third party platforms. We have provided more information on this in our privacy policy.]]></item>
+		<item name="wcf.message.user.consent.title"><![CDATA[External Content]]></item>
 	</category>
 	<category name="wcf.menu">
 		<!-- category for menus and menu items -->
@@ -5229,6 +5234,7 @@ your notifications on <a href="{link isHtmlEmail=true}{/link}">{PAGE_TITLE|langu
 		<item name="wcf.user.option.searchRadioButtonOption"><![CDATA[User’s selection for “{$option->getTitle()}”:]]></item>
 		<item name="wcf.user.option.searchTextOption"><![CDATA[“{$option->getTitle()}” contains:]]></item>
 		<item name="wcf.user.option.searchBooleanOption"><![CDATA[User’s selection for “{$option->getTitle()}”:]]></item>
+		<item name="wcf.user.option.enableEmbeddedMedia"><![CDATA[Display all external content]]></item>
 	</category>
 	<category name="wcf.user.mail">
 		<item name="wcf.user.mail.mail.plaintext"><![CDATA[Dear {@$mailbox->getUser()->username},
-- 
2.20.1