Send tracking code JS by email (#14569)

* Button to email standard install instructions on installation page 7 and no data tracked yet page

* Send tracking code email from the tracking code generator page

* Escape HTML tags

* Send email in plain text

* Move email button next to header

* Fix width of header div

* Update reference screenshots

* PR fixes

* Expand tracking code email template

* Fix double escaping of message

* Hide links to Matomo for whitelabel, fix missing space

* ignore event in documentation

* Update reference screenshots

* Changes to email template

* fix missing translation key

* Add idsite and tracking url to email template

* Fix extra slash in URL

* Update UI test

7 files changed, 108 insertions, 11 deletions

diff --git a/plugins/SitesManager/Controller.php b/plugins/SitesManager/Controller.php
index f30a53eb01..2d6c4a7824 100644
--- a/plugins/SitesManager/Controller.php
+++ b/plugins/SitesManager/Controller.php
@@ -138,11 +138,33 @@ class Controller extends \Piwik\Plugin\ControllerAdmin
             Piwik::checkUserHasViewAccess($this->idSite);
         }
 
+        $jsTag = Request::processRequest('SitesManager.getJavascriptTag', array('idSite' => $this->idSite, 'piwikUrl' => $piwikUrl));
+
+        // Strip off open and close <script> tag and comments so that JS will be displayed in ALL mail clients
+        $rawJsTag = TrackerCodeGenerator::stripTags($jsTag);
+
+        $showMatomoLinks = true;
+        /**
+         * @ignore
+         */
+        Piwik::postEvent('SitesManager.showMatomoLinksInTrackingCodeEmail', array(&$showMatomoLinks));
+
+        $trackerCodeGenerator = new TrackerCodeGenerator();
+        $trackingUrl = trim(SettingsPiwik::getPiwikUrl(), '/') . '/' . $trackerCodeGenerator->getPhpTrackerEndpoint();
+
+        $emailContent = $this->renderTemplateAs('@SitesManager/_trackingCodeEmail', array(
+            'jsTag' => $rawJsTag,
+            'showMatomoLinks' => $showMatomoLinks,
+            'trackingUrl' => $trackingUrl,
+            'idSite' => $this->idSite
+        ), $viewType = 'basic');
+
         return $this->renderTemplateAs('siteWithoutData', array(
-            'siteName'     => $this->site->getName(),
-            'idSite' => $this->idSite,
-            'jsTag'           => Request::processRequest('SitesManager.getJavascriptTag', array('idSite' => $this->idSite, 'piwikUrl' => $piwikUrl)),
-            'piwikUrl'        => $piwikUrl,
+            'siteName'      => $this->site->getName(),
+            'idSite'        => $this->idSite,
+            'jsTag'         => $jsTag,
+            'piwikUrl'      => $piwikUrl,
+            'emailBody'     => $emailContent
         ), $viewType = 'basic');
     }
 }
diff --git a/plugins/SitesManager/SitesManager.php b/plugins/SitesManager/SitesManager.php
index fca307d5df..751c599f3a 100644
--- a/plugins/SitesManager/SitesManager.php
+++ b/plugins/SitesManager/SitesManager.php
@@ -409,5 +409,8 @@ class SitesManager extends \Piwik\Plugin
         $translationKeys[] = "Goals_Ecommerce";
         $translationKeys[] = "SitesManager_NotFound";
         $translationKeys[] = "SitesManager_DeleteSiteExplanation";
+        $translationKeys[] = "SitesManager_EmailInstructionsButton";
+        $translationKeys[] = "SitesManager_EmailInstructionsSubject";
+        $translationKeys[] = "SitesManager_JsTrackingTagHelp";
     }
 }
diff --git a/plugins/SitesManager/lang/en.json b/plugins/SitesManager/lang/en.json
index 310b63d89c..53a13acb33 100644
--- a/plugins/SitesManager/lang/en.json
+++ b/plugins/SitesManager/lang/en.json
@@ -93,6 +93,14 @@
         "ChooseMeasurableTypeHeadline": "What would you like to measure?",
         "YouCurrentlyHaveAccessToNWebsites": "You currently have access to %s websites.",
         "YourCurrentIpAddressIs": "Your current IP address is %s",
-        "DeleteSiteExplanation": "Deleting a website will delete all log data that has been collected for it. This action is permanent and cannot be undone."
+        "DeleteSiteExplanation": "Deleting a website will delete all log data that has been collected for it. This action is permanent and cannot be undone.",
+        "EmailInstructionsButton": "Email these instructions",
+        "EmailInstructionsSubject": "Matomo Analytics Tracking Code",
+        "EmailInstructionsDocsPlainText": "If you want to do more than track page views, please check out the Matomo documentation at %1$s.",
+        "EmailInstructionsGenerateTrackingCode": "You can also generate a customized tracking code at %1$s.",
+        "EmailInstructionsSiteDetailsHeading": "Your Site Details",
+        "EmailInstructionsSiteDetails": "You will need these details to use the API or SDKs to track Matomo visits.",
+        "EmailInstructionsYourSiteId": "Your site ID: %1$s",
+        "EmailInstructionsYourTrackingUrl": "Your tracking URL: %1$s"
     }
 }
diff --git a/plugins/SitesManager/stylesheets/SitesManager.less b/plugins/SitesManager/stylesheets/SitesManager.less
index 65290e38f7..898f801755 100644
--- a/plugins/SitesManager/stylesheets/SitesManager.less
+++ b/plugins/SitesManager/stylesheets/SitesManager.less
@@ -14,6 +14,24 @@
     }
 }
 
+.trackingHelpHeader {
+    margin-top: 32px;
+    margin-bottom: 16px;
+    width: 100%;
+    &.matchWidth {
+        max-width: 995px;
+    }
+    h3 {
+        margin-top: 0;
+    }
+    p {
+        margin-right: 20px !important;
+    }
+    .btn {
+        margin-left: auto;
+    }
+}
+
 .SitesManager {
 
     .sitesManagerList {
diff --git a/plugins/SitesManager/templates/_displayJavascriptCode.twig b/plugins/SitesManager/templates/_displayJavascriptCode.twig
index 030dcf9bcd..52cced16af 100644
--- a/plugins/SitesManager/templates/_displayJavascriptCode.twig
+++ b/plugins/SitesManager/templates/_displayJavascriptCode.twig
@@ -1,9 +1,15 @@
-<h2>{{ 'SitesManager_TrackingTags'|translate(displaySiteName) }}</h2>
+<div class="trackingHelpHeader">
+    <h2>{{ 'SitesManager_TrackingTags'|translate(displaySiteName) }}</h2>
+    <a class="btn" 
+        href="mailto:?subject={{ 'SitesManager_EmailInstructionsSubject'|translate|url_encode|e('html_attr') }}&body={{ emailBody|url_encode|e('html_attr') }}">
+        {{ 'SitesManager_EmailInstructionsButton'|translate }}
+    </a>
+</div>
 
 <div class='trackingHelp'>
     <p>{{ 'Installation_JSTracking_Intro'|translate }}</p>
 
-    <p>{{ 'CoreAdminHome_JSTrackingIntro3b'|translate('<a href="https://matomo.org/integrate/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
+    <p>{{ 'CoreAdminHome_JSTrackingIntro3a'|translate('<a href="https://matomo.org/integrate/" rel="noreferrer noopener" target="_blank">','</a>')|raw }} {{ 'CoreAdminHome_JSTrackingIntro3b'|translate|raw }}</p>
 
     <h3>{{ 'General_JsTrackingTag'|translate }}</h3>
 
@@ -32,5 +38,4 @@
     <p></p>
 
     {{ postEvent('Template.endTrackingHelpPage') }}
-
 </div>
diff --git a/plugins/SitesManager/templates/_trackingCodeEmail.twig b/plugins/SitesManager/templates/_trackingCodeEmail.twig
new file mode 100644
index 0000000000..fa746daab5
--- /dev/null
+++ b/plugins/SitesManager/templates/_trackingCodeEmail.twig
@@ -0,0 +1,32 @@
+{% if showMatomoLinks %}** {{ 'General_JsTrackingTag'|translate }}{% endif %}
+
+{{ 'CoreAdminHome_JSTracking_CodeNoteBeforeClosingHeadEmail'|translate("'head'") }}
+
+{{ jsTag|raw }}
+
+{% if showMatomoLinks %}{{ 'SitesManager_EmailInstructionsDocsPlainText'|translate('https://developer.matomo.org/guides/tracking-javascript-guide')|raw }}{% endif %}
+
+{{ 'SitesManager_EmailInstructionsGenerateTrackingCode'|translate(piwikUrl ~ linkTo({'module': 'CoreAdminHome', 'action': 'trackingCodeGenerator'}))|raw }}
+
+{% if showMatomoLinks %}
+** Integrations
+{{ 'CoreAdminHome_JSTrackingIntro3a'|translate('', '') }}
+https://matomo.org/integrate/
+
+** {{ 'SitesManager_LogAnalytics'|translate }}
+{{ 'SitesManager_LogAnalyticsDescription'|translate('', '') }}
+https://matomo.org/log-analytics/
+
+** {{ 'SitesManager_MobileAppsAndSDKs'|translate }}
+{{ 'SitesManager_MobileAppsAndSDKsDescription'|translate('', '') }}
+https://matomo.org/integrate/#programming-language-platforms-and-frameworks
+
+** {{ 'CoreAdminHome_HttpTrackingApi'|translate }}
+{{ 'CoreAdminHome_HttpTrackingApiDescription'|translate('', '') }}
+https://developer.matomo.org/api-reference/tracking-api
+    
+** {{ 'SitesManager_EmailInstructionsSiteDetailsHeading'|translate }}
+{{ 'SitesManager_EmailInstructionsSiteDetails'|translate }}
+* {{ 'SitesManager_EmailInstructionsYourSiteId'|translate(idSite) }}
+* {{ 'SitesManager_EmailInstructionsYourTrackingUrl'|translate(trackingUrl) }}
+{% endif %}
\ No newline at end of file
diff --git a/plugins/SitesManager/templates/siteWithoutData.twig b/plugins/SitesManager/templates/siteWithoutData.twig
index dc7ac2b408..a6d7d1dede 100644
--- a/plugins/SitesManager/templates/siteWithoutData.twig
+++ b/plugins/SitesManager/templates/siteWithoutData.twig
@@ -52,11 +52,20 @@
                 <h3>Integrations</h3>
                 <p>{{ 'Installation_JSTracking_Intro'|translate }}</p>
 
-                <p>{{ 'CoreAdminHome_JSTrackingIntro3b'|translate('<a href="https://matomo.org/integrate/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
+                <p>{{ 'CoreAdminHome_JSTrackingIntro3a'|translate('<a href="https://matomo.org/integrate/" rel="noreferrer noopener" target="_blank">','</a>')|raw }} {{ 'CoreAdminHome_JSTrackingIntro3b'|translate|raw }}</p>
 
-                <h3>{{ 'General_JsTrackingTag'|translate }}</h3>
+                <div class="valign-wrapper trackingHelpHeader">
+                    <div>
 
-                <p>{{ 'CoreAdminHome_JSTracking_CodeNoteBeforeClosingHead'|translate("&lt;/head&gt;")|raw }}</p>
+                        <h3>{{ 'General_JsTrackingTag'|translate }}</h3>
+
+                        <p>{{ 'CoreAdminHome_JSTracking_CodeNoteBeforeClosingHead'|translate("&lt;/head&gt;")|raw }}</p>
+                    </div>
+                    <a class="btn" id="emailTrackingCodeBtn"
+                       href="mailto:?subject={{ 'SitesManager_EmailInstructionsSubject'|translate|url_encode|e('html_attr') }}&body={{ emailBody|url_encode|e('html_attr') }}">
+                        {{ 'SitesManager_EmailInstructionsButton'|translate }}
+                    </a>
+                </div>
 
                 <pre piwik-select-on-focus>{{ jsTag|raw }}</pre>