Add support for container-bound share button url
authorMatthias Schmidt <gravatronics@live.com>
Thu, 7 Feb 2019 18:13:24 +0000 (19:13 +0100)
committerMatthias Schmidt <gravatronics@live.com>
Thu, 7 Feb 2019 18:13:24 +0000 (19:13 +0100)
… to support share buttons for different objects on the same page.

See #2845

wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Share.js

index f8d17012c2ae4aa790a0d36ec01f1702069af3c1..5ba74cd51077623d6aa19c99fd36cfe73d811368 100644 (file)
@@ -6,7 +6,7 @@
  * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module     WoltLabSuite/Core/Ui/Message/Share
  */
-define(['EventHandler'], function(EventHandler) {
+define(['EventHandler', 'StringUtil'], function(EventHandler, StringUtil) {
        "use strict";
        
        /**
@@ -25,39 +25,44 @@ define(['EventHandler'], function(EventHandler) {
                        elBySelAll('.jsMessageShareButtons', null, (function(container) {
                                container.classList.remove('jsMessageShareButtons');
                                
+                               var pageUrl = encodeURIComponent(StringUtil.unescapeHTML(elData(container, 'url') || ''));
+                               if (!pageUrl) {
+                                       pageUrl = this._pageUrl;
+                               }
+                               
                                var providers = {
                                        facebook: {
                                                link: elBySel('.jsShareFacebook', container),
-                                               share: (function() { this._share('facebook', 'https://www.facebook.com/sharer.php?u={pageURL}&t={text}', true); }).bind(this)
+                                               share: (function(event) { this._share('facebook', 'https://www.facebook.com/sharer.php?u={pageURL}&t={text}', true, pageUrl); }).bind(this)
                                        },
                                        google: {
                                                link: elBySel('.jsShareGoogle', container),
-                                               share: (function() { this._share('google', 'https://plus.google.com/share?url={pageURL}', false); }).bind(this)
+                                               share: (function(event) { this._share('google', 'https://plus.google.com/share?url={pageURL}', false, pageUrl); }).bind(this)
                                        },
                                        reddit: {
                                                link: elBySel('.jsShareReddit', container),
-                                               share: (function() { this._share('reddit', 'https://ssl.reddit.com/submit?url={pageURL}', false); }).bind(this)
+                                               share: (function(event) { this._share('reddit', 'https://ssl.reddit.com/submit?url={pageURL}', false, pageUrl); }).bind(this)
                                        },
                                        twitter: {
                                                link: elBySel('.jsShareTwitter', container),
-                                               share: (function() { this._share('twitter', 'https://twitter.com/share?url={pageURL}&text={text}', false); }).bind(this)
+                                               share: (function(event) { this._share('twitter', 'https://twitter.com/share?url={pageURL}&text={text}', false, pageUrl); }).bind(this)
                                        },
                                        linkedIn: {
                                                link: elBySel('.jsShareLinkedIn', container),
-                                               share: (function() { this._share('linkedIn', 'https://www.linkedin.com/cws/share?url={pageURL}', false); }).bind(this)
+                                               share: (function(event) { this._share('linkedIn', 'https://www.linkedin.com/cws/share?url={pageURL}', false, pageUrl); }).bind(this)
                                        },
                                        pinterest: {
                                                link: elBySel('.jsSharePinterest', container),
-                                               share: (function() { this._share('pinterest', 'https://www.pinterest.com/pin/create/link/?url={pageURL}&description={text}', false); }).bind(this)
+                                               share: (function(event) { this._share('pinterest', 'https://www.pinterest.com/pin/create/link/?url={pageURL}&description={text}', false, pageUrl); }).bind(this)
                                        },
                                        xing: {
                                                link: elBySel('.jsShareXing', container),
-                                               share: (function() { this._share('xing', 'https://www.xing.com/social_plugins/share?url={pageURL}', false); }).bind(this)
+                                               share: (function(event) { this._share('xing', 'https://www.xing.com/social_plugins/share?url={pageURL}', false, pageUrl); }).bind(this)
                                        },
                                        whatsApp: {
                                                link: elBySel('.jsShareWhatsApp', container),
                                                share: (function() {
-                                                       window.location.href = 'whatsapp://send?text=' + this._pageDescription + '%20' + this._pageUrl;
+                                                       window.location.href = 'whatsapp://send?text=' + this._pageDescription + '%20' + pageUrl;
                                                }).bind(this)
                                        }
                                };
@@ -79,8 +84,17 @@ define(['EventHandler'], function(EventHandler) {
                        }).bind(this));
                },
                
-               _share: function(objectName, url, appendURL) {
-                       window.open(url.replace(/\{pageURL}/, this._pageUrl).replace(/\{text}/, this._pageDescription + (appendURL ? "%20" + this._pageUrl : "")), objectName, 'height=600,width=600');
+               _share: function(objectName, url, appendUrl, pageUrl) {
+                       // fallback for plugins
+                       if (!pageUrl) {
+                               pageUrl = this._pageUrl;
+                       }
+                       
+                       window.open(
+                               url.replace(/\{pageURL}/, pageUrl).replace(/\{text}/, this._pageDescription + (appendUrl ? "%20" + pageUrl : "")),
+                               objectName,
+                               'height=600,width=600'
+                       );
                }
        };
 });