Transition data exporting (#18062)

17 files changed, 219 insertions, 23 deletions

diff --git a/plugins/CustomDimensions/tests/UI/expected-screenshots/CustomDimensions_report_action_subtable_transitions.png b/plugins/CustomDimensions/tests/UI/expected-screenshots/CustomDimensions_report_action_subtable_transitions.png
index c00abfcd45..ba82cf5f7a 100644
--- a/plugins/CustomDimensions/tests/UI/expected-screenshots/CustomDimensions_report_action_subtable_transitions.png
+++ b/plugins/CustomDimensions/tests/UI/expected-screenshots/CustomDimensions_report_action_subtable_transitions.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:92dd0c399e1006d7ad7d99fc30292770a203e3afcd6d1fb33c374f2369590952
-size 47518
+oid sha256:340e24cadb96e7599741b76e25a80a0f753b3e7f93938302ab721a9970a80881
+size 48484
diff --git a/plugins/Overlay/tests/UI/expected-screenshots/Overlay_transitions.png b/plugins/Overlay/tests/UI/expected-screenshots/Overlay_transitions.png
index 45e6ad7568..61897b7cd1 100644
--- a/plugins/Overlay/tests/UI/expected-screenshots/Overlay_transitions.png
+++ b/plugins/Overlay/tests/UI/expected-screenshots/Overlay_transitions.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3c0144378fd29bba131acaf0e4bacbc64cc7d6d4ca3c4965e65531096c841eb1
-size 150476
+oid sha256:46cfbc750760c4da95c026de6554680f8b81b7fe5238dd0241d93b8e652cbefd
+size 150664
diff --git a/plugins/Transitions/Transitions.php b/plugins/Transitions/Transitions.php
index b6a70fd81d..67d5be7f25 100644
--- a/plugins/Transitions/Transitions.php
+++ b/plugins/Transitions/Transitions.php
@@ -34,12 +34,14 @@ class Transitions extends \Piwik\Plugin
     public function getStylesheetFiles(&$stylesheets)
     {
         $stylesheets[] = 'plugins/Transitions/stylesheets/transitions.less';
+        $stylesheets[] = 'plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.less';
     }
 
     public function getJsFiles(&$jsFiles)
     {
         $jsFiles[] = 'plugins/Transitions/javascripts/transitions.js';
         $jsFiles[] = 'plugins/Transitions/angularjs/transitionswitcher/transitionswitcher.controller.js';
+        $jsFiles[] = 'plugins/Transitions/angularjs/transitionexporter/transitionexporter.directive.js';
     }
 
     public function getClientSideTranslationKeys(&$translationKeys)
@@ -49,6 +51,7 @@ class Transitions extends \Piwik\Plugin
         $translationKeys[] = 'Actions_PageUrls';
         $translationKeys[] = 'Actions_WidgetPageTitles';
         $translationKeys[] = 'Transitions_NumPageviews';
+        $translationKeys[] = 'Transitions_Transitions';
         $translationKeys[] = 'CoreHome_ThereIsNoDataForThisReport';
         $translationKeys[] = 'General_Others';
     }
diff --git a/plugins/Transitions/angularjs/transitionexporter/transitionexporter.directive.js b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.directive.js
new file mode 100644
index 0000000000..f26a448d13
--- /dev/null
+++ b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.directive.js
@@ -0,0 +1,83 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+(function () {
+
+    angular.module("piwikApp").directive('transitionExporter', transitionExporter);
+    transitionExporter.$inject = ['$document', 'piwik', '$compile', '$timeout', '$location', '$httpParamSerializerJQLike', '$rootScope'];
+
+    function transitionExporter($document, piwik, $compile, $timeout, $location, $httpParamSerializerJQLike, $rootScope) {
+
+        return {
+            restrict: 'A',
+            link: function(scope, element) {
+
+                scope.getExportLink = function() {
+
+                    var exportUrlParams = {
+                        module: 'API'
+                    };
+
+                    exportUrlParams.method = 'Transitions.getTransitionsForAction';
+                    exportUrlParams.actionType = $rootScope.transitionExportParams['actionType'];
+                    exportUrlParams.actionName = $rootScope.transitionExportParams['actionName'];
+
+                    exportUrlParams.idSite = piwik.idSite;
+                    exportUrlParams.period = piwik.period;
+                    exportUrlParams.date = piwik.currentDateString;
+                    exportUrlParams.format = scope.exportFormat;
+                    exportUrlParams.token_auth = piwik.token_auth;
+                    exportUrlParams.force_api_session = 1;
+
+                    var currentUrl = $location.absUrl();
+                    var urlParts = currentUrl.split('/');
+                    urlParts.pop();
+                    var url = urlParts.join('/');
+
+                    return url + '/index.php?' + $httpParamSerializerJQLike(exportUrlParams);
+                }
+
+                $rootScope.$on('Transitions.dataChanged', function (event, params) {
+                    $rootScope.transitionExportParams = params;
+                });
+
+                scope.onExportFormatChange = function (format) {
+                    scope.exportFormat = format;
+                }
+
+                element.on('click', function () {
+
+                    scope.exportFormat = 'JSON';
+                    scope.exportFormatOptions = [
+                        {key: 'JSON', value: 'JSON'},
+                        {key: 'XML', value: 'XML'}
+                    ];
+
+                    if (!$rootScope.transitionExportParams) {
+                        return;
+                    }
+
+                    scope.reportTitle = $rootScope.transitionExportParams['actionName'] + ' ' + _pk_translate('Transitions_Transitions');
+
+                    this.popover = Piwik_Popover.showLoading(_pk_translate('General_Export'), self.actionName, 200);
+
+                    var elem = $document.find('#transitionExport').eq(0);
+                    if (!elem.length) {
+                        elem = angular.element('<span id="transitionExport"></span>');
+                        elem.attr('ng-include', "'plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.html?cb=' + encodeURIComponent(piwik.cacheBuster) + '\'");
+                    }
+
+                    $compile(elem)(scope, function (compiled){
+                        Piwik_Popover.setTitle(_pk_translate('General_Export') + ' ' + piwikHelper.htmlEntities(scope.reportTitle));
+                        Piwik_Popover.setContent(compiled);
+                    });
+
+                });
+            }
+        };
+    }
+})();
diff --git a/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.html b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.html
new file mode 100644
index 0000000000..76f1b74f6f
--- /dev/null
+++ b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.html
@@ -0,0 +1,21 @@
+<div class="transition-export-popover row">
+
+    <div class="col l6">
+        <div class="input-field">
+            <div piwik-field uicontrol="radio" name="exportFormat"
+                 data-title="{{ 'CoreHome_ExportFormat'|translate }}"
+                 ng-change="onExportFormatChange(exportFormat)"
+                 ng-model="exportFormat"
+                 full-width="true"
+                 value="JSON"
+                 options="exportFormatOptions">
+            </div>
+        </div>
+
+    </div>
+
+    <div class="col l12">
+        <a class="btn" ng-attr-href="{{ getExportLink() }}" target="_new" title="{{ 'CoreHome_ExportTooltip'|translate }}">{{ 'General_Export'|translate }}</a>
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.less b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.less
new file mode 100644
index 0000000000..54b15e412c
--- /dev/null
+++ b/plugins/Transitions/angularjs/transitionexporter/transitionexporter.popover.less
@@ -0,0 +1,52 @@
+.transitions-export-popover {
+
+  [name=format] {
+    .form-group label.fieldRadioTitle {
+      display: block;
+    }
+
+    p.radio {
+      width: 50%;
+      float: left;
+      display: block;
+    }
+  }
+
+  textarea {
+    word-break: break-all;
+    padding: 5px;
+    height: 80px;
+  }
+
+  .toggle-export-url {
+    font-size: 14px;
+    margin-left: 20px;
+  }
+
+  .filter_limit {
+    clear: both;
+    float: none;
+
+    [piwik-field] {
+      width: 50%;
+      float: left;
+    }
+  }
+
+  .showoptions > span {
+    color: @color-blue-piwik;
+    cursor: pointer;
+    text-decoration: underline;
+  }
+
+  .tooltip {
+    color: @color-silver;
+    font-size: 13px;
+    padding: 5px;
+  }
+
+  .tooltip > a {
+      color: @color-blue-piwik;
+      text-decoration: underline;
+  }
+}
\ No newline at end of file
diff --git a/plugins/Transitions/javascripts/transitions.js b/plugins/Transitions/javascripts/transitions.js
index 5ac1472e69..19bd467b14 100644
--- a/plugins/Transitions/javascripts/transitions.js
+++ b/plugins/Transitions/javascripts/transitions.js
@@ -289,8 +289,8 @@ Piwik_Transitions.prototype.preparePopover = function () {
     var element = textContainer.add(self.popover.find('p.Transitions_Pageviews'));
 
     element.tooltip({
-        track:        true,
-        content:      function () {
+        track: true,
+        content: function () {
             var totalNbPageviews = self.model.getTotalNbPageviews();
             if (totalNbPageviews > 0) {
 
@@ -347,6 +347,11 @@ Piwik_Transitions.prototype.render = function () {
     this.renderRightSide();
 
     this.renderLoops();
+
+    var $rootScope = piwikHelper.getAngularDependency('$rootScope');
+    if ($rootScope) {
+        $rootScope.$emit('Transitions.dataChanged', {'actionType': this.actionType, 'actionName': this.actionName});
+    }
 };
 
 /** Render left side: referrer groups & direct entries */
@@ -446,7 +451,7 @@ Piwik_Transitions.prototype.renderCenterBox = function () {
     box.find('.Transitions_CenterBoxMetrics').show();
 };
 
-Piwik_Transitions.prototype.addTooltipShowingPercentageOfAllPageviews = function(element, metric) {
+Piwik_Transitions.prototype.addTooltipShowingPercentageOfAllPageviews = function (element, metric) {
     var tip = Piwik_Transitions_Translations.XOfAllPageviews;
     var percentage = this.model.getPercentage(metric, true);
     tip = sprintf(tip, '<strong>' + percentage + '</strong>');
diff --git a/plugins/Transitions/templates/renderPopover.twig b/plugins/Transitions/templates/renderPopover.twig
index f68fc16d9b..37867df326 100644
--- a/plugins/Transitions/templates/renderPopover.twig
+++ b/plugins/Transitions/templates/renderPopover.twig
@@ -48,6 +48,20 @@
     <div id="Transitions_Canvas_Loops" class="Transitions_Canvas_Container"></div>
 </div>
 
+<div class="dataTableWrapper" id="transition-export-actions" style="display:none">
+    <div class="dataTableFeatures">
+        <div class="dataTableFooterNavigation">
+            <div class="dataTableControls">
+                <div class="row">
+                    <a class="dataTableAction" href="javascript:;" transition-exporter>
+                        <span class="icon-export"></span>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
 <script type="text/javascript">
     var Piwik_Transitions_Translations = {
         {% for internalKey, translation in translations %}
@@ -55,4 +69,7 @@
         {% endfor %}
         "": ""
     };
+    var tea = $('#transition-export-actions');
+    if (!tea.parent().hasClass('popoverContainer'))
+        tea.show();
 </script>
\ No newline at end of file
diff --git a/plugins/Transitions/templates/transitions.twig b/plugins/Transitions/templates/transitions.twig
index e08f153012..3cb0a6354e 100644
--- a/plugins/Transitions/templates/transitions.twig
+++ b/plugins/Transitions/templates/transitions.twig
@@ -40,6 +40,20 @@
 
     </div>
 
+    <div class="dataTableWrapper" ng-show="transitionSwitcher.isEnabled">
+        <div class="dataTableFeatures">
+            <div class="dataTableFooterNavigation">
+                <div class="dataTableControls">
+                    <div class="row">
+                        <a class="dataTableAction" href="javascript:;" transition-exporter>
+                            <span class="icon-export"></span>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
     <div class="alert alert-info">
         {{ 'Transitions_AvailableInOtherReports'|translate }}
         {{ 'Actions_PageUrls'|translate }}, {{ 'Actions_SubmenuPageTitles'|translate }},
@@ -51,3 +65,4 @@
 </div>
 
 {% if not isWidget %}</div>{% endif %}
+
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_titles.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_titles.png
index 7a6889f312..b09c60c13b 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_titles.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_titles.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2cff3452a9e684ac44fc8339bfe13ae4a958c118fe8aa898670b0049c616d12d
-size 68986
+oid sha256:8eb1e46648822142aad3a666db0532e3555460de8fc238610520c8c82582cae5
+size 69838
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_urls.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_urls.png
index 73bdf1897e..969d9f1488 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_urls.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_popup_urls.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4aae9a8770b93e45cc82d0b5b34eb048edf1a638f4f8b936032aed97efcec3a4
-size 77649
+oid sha256:666d1e0bc17844d8b9ae45fa3beebb1ab7150578d60c1de531ea34bd56b0c2b5
+size 78767
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_type_title.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_type_title.png
index 92e2784696..cd3e0206b9 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_type_title.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_type_title.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:cb37e59ffb65412f6a9c17a5969f6308477acd8a7bc520a599552214e232c763
-size 181158
+oid sha256:1742ff06f3cdd0f77f64059489fae3a81456523b91e8bf38314d4abbe8dd365f
+size 182448
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_url.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_url.png
index 44ff4e9be5..ed410690e9 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_url.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_switch_url.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2d81e27aeebb6a894ce0e2a5c5f0c38aa731c2646ec627bfa6370bef189797ec
-size 78845
+oid sha256:7549a8453fbbc08412ebe916e36dd92927d97782fcad5807694ac220e9fbbac5
+size 79832
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_report.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_report.png
index 567f6a1769..3355e195f4 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_report.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_report.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:60f2522898f6406774d8f54c6bf11c5777e7473b54dac6c7d9a56378763cda14
-size 111943
+oid sha256:b8ac8fbaec85494049d0346f15ae8c2b7861ad55e9b34a7454ae5e75ad5e37cc
+size 112399
diff --git a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_widget.png b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_widget.png
index da525d534f..c0b9ef1bb0 100644
--- a/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_widget.png
+++ b/plugins/Transitions/tests/UI/expected-screenshots/Transitions_transitions_report_with_data_widget.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:50f3434e0d0641f5231f05e3a769bf2210cd2e8d3ca070237a9172d9413fc05d
-size 105201
+oid sha256:599bf12771cbf0f1c5fd274e111d4fdcdf5d51e992426d6074f7f745e65fa49b
+size 106290
diff --git a/tests/UI/expected-screenshots/Comparison_transitions.png b/tests/UI/expected-screenshots/Comparison_transitions.png
index 7aa0439420..ac46385a50 100644
--- a/tests/UI/expected-screenshots/Comparison_transitions.png
+++ b/tests/UI/expected-screenshots/Comparison_transitions.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:762959c7862aafac1044f0010fda6d70c28247807d1fa9390b7cec7c223120ed
-size 203975
+oid sha256:e3211f2eef2a9fb34395837d285a02cfb8f99bccf617184e220c331943957038
+size 203973
diff --git a/tests/UI/expected-screenshots/UIIntegrationTest_dashboard3.png b/tests/UI/expected-screenshots/UIIntegrationTest_dashboard3.png
index cca0fcfafc..12fe5f6160 100644
--- a/tests/UI/expected-screenshots/UIIntegrationTest_dashboard3.png
+++ b/tests/UI/expected-screenshots/UIIntegrationTest_dashboard3.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:50b4244e726064eb68ae76318e95fd9ac0b4cbe30650700de5bede4f46ab7d77
-size 709410
+oid sha256:6b3747399d2dbaf1bc99a5e35778cd7e9ee3269dc0b113e8b1e45596b06b1dae
+size 710595