Add Facebook Video Media Provider
authorTim Düsterhus <duesterhus@woltlab.com>
Fri, 29 May 2020 14:49:44 +0000 (16:49 +0200)
committerTim Düsterhus <duesterhus@woltlab.com>
Fri, 29 May 2020 14:49:44 +0000 (16:49 +0200)
The resulting HTML intentionally does not use an `<a>` element for the
fallback link, because it will prevent the SDK from embedding the video.

The SDK generally acts as a blackbox with regard to video embeds, the only
thing we can do is asking it nicely to re-parse the DOM for new stuff to
embed and hope for the best. Specifically embedding doesn't work for newly
posted contents that are loaded via Ajax. Not even if the re-scan is
scheduled for the next run of the event loop by using `setTimeout` with a
delay of `0`. For whatever reason there might be.

Resolves #3242

com.woltlab.wcf/mediaProvider.xml
wcfsetup/install/files/js/WoltLabSuite/Core/Wrapper/FacebookSdk.js [new file with mode: 0644]

index 53e5404597936cc90868ef49a479c60ccc409199..cb70bfdd3eb3a4917fb169dc7c99deea851f3877 100644 (file)
@@ -81,6 +81,13 @@ https?://www.twitch.tv/[a-zA-Z0-9]+/v/(?<ID>[0-9]+)]]></regex>
                        <html><![CDATA[<div data-wsc-twitter-tweet="{$ID}"><a href="https://twitter.com/{$USERNAME}/status/{$ID}/" class="externalURL" rel="nofollow ugc">https://twitter.com/{$USERNAME}/status/{$ID}/</a></div>
 <script>require(["WoltLabSuite/Core/Ui/Message/TwitterEmbed"],function(t){t.embedAll()});</script>]]></html>
                </provider>
+               <provider name="facebook-video">
+                       <title>Facebook Video</title>
+                       <regex><![CDATA[(?<HREF>https?://(www\.)?facebook\.com/watch/\?v=(?<ID>[0-9]+))
+(?<HREF>https?://(www\.)?facebook\.com/[a-zA-Z0-9_-]+/videos/(?<ID>[0-9]+)/)]]></regex>
+                       <html><![CDATA[<div class="fb-video" data-href="{$HREF}" data-allowfullscreen="true">{$HREF}</div>
+<script>require(['WoltLabSuite/Core/Wrapper/FacebookSdk'],function(FB){FB.XFBML.parse()})</script>]]></html>
+               </provider>
        </import>
        
        <delete>
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Wrapper/FacebookSdk.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Wrapper/FacebookSdk.js
new file mode 100644 (file)
index 0000000..4c389b7
--- /dev/null
@@ -0,0 +1,18 @@
+/**
+ * Handles loading and initialization of Facebook's JavaScript SDK.
+ * 
+ * @author     Tim Duesterhus
+ * @copyright  2001-2020 WoltLab GmbH
+ * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module     WoltLabSuite/Core/Wrapper/FacebookSdk
+ */
+define(['https://connect.facebook.net/en_US/sdk.js'], function(_dummy) {
+       "use strict";
+       
+       // see: https://developers.facebook.com/docs/javascript/reference/FB.init/v7.0
+       FB.init({
+               version: 'v7.0'
+       });
+       
+       return FB;
+});