4 files changed, 41 insertions, 4 deletions

diff --git a/plugins/CoreHome/javascripts/corehome.js b/plugins/CoreHome/javascripts/corehome.js
index 35ef55c555..90e74d7de4 100644
--- a/plugins/CoreHome/javascripts/corehome.js
+++ b/plugins/CoreHome/javascripts/corehome.js
@@ -85,7 +85,7 @@ $( document ).ready(function() {
         $(window).scrollTo($('a[name="main"]'));
     });
 
-    $("nav .activateTopMenu").sideNav({
+    $("#mobile-top-menu").sideNav({
         closeOnClick: true,
         edge: 'right'
     });
diff --git a/plugins/CoreHome/javascripts/dataTable.js b/plugins/CoreHome/javascripts/dataTable.js
index 137c832402..d6bd212afe 100644
--- a/plugins/CoreHome/javascripts/dataTable.js
+++ b/plugins/CoreHome/javascripts/dataTable.js
@@ -1974,6 +1974,24 @@ $.extend(DataTable.prototype, UIControl.prototype, {
                     items: 'a',
                     content: '<h3>'+action.dataTableIconTooltip[0]+'</h3>'+action.dataTableIconTooltip[1],
                     tooltipClass: 'rowActionTooltip',
+                    // ensure the tooltips of parent elements are hidden when the action tooltip is shown
+                    // otherwise it can happen that tooltips for subtable rows are shown as well.
+                    open: function() {
+                        var tooltip = $(this).parents().filter(function() {
+                            return jQuery.hasData(this) && $(this).data('ui-tooltip');
+                        }).tooltip('instance');
+                        if (tooltip) {
+                            tooltip.disable();
+                        }
+                    },
+                    close: function() {
+                        var tooltip = $(this).parents().filter(function() {
+                            return jQuery.hasData(this) && $(this).data('ui-tooltip');
+                        }).tooltip('instance');
+                        if (tooltip) {
+                            tooltip.enable();
+                        }
+                    },
                     show: false,
                     hide: false
                 });
diff --git a/plugins/CoreHome/javascripts/materialize-bc.js b/plugins/CoreHome/javascripts/materialize-bc.js
new file mode 100644
index 0000000000..0bcede9018
--- /dev/null
+++ b/plugins/CoreHome/javascripts/materialize-bc.js
@@ -0,0 +1,18 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link http://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+(function () {
+    $(document).ready(function () {
+        window.Materialize = window.M;
+        $.fn.sideNav = $.fn.sidenav;
+        $.fn.material_select = $.fn.formSelect;
+
+        // we load jquery-ui after materialize so we can use the jquery-ui datepicker, but
+        // some controls in materialize get overwritten too. so we undo that here.
+        M.initializeJqueryWrapper(M.Tabs, 'tabs', 'M_Tabs');
+        M.initializeJqueryWrapper(M.Modal, 'modal', 'M_Modal');
+    });
+})();
\ No newline at end of file
diff --git a/plugins/CoreHome/javascripts/popover.js b/plugins/CoreHome/javascripts/popover.js
index 2ff4457e06..44efe54e74 100644
--- a/plugins/CoreHome/javascripts/popover.js
+++ b/plugins/CoreHome/javascripts/popover.js
@@ -26,7 +26,6 @@ var Piwik_Popover = (function () {
             title: title,
             modal: true,
             width: '1050px',
-            position: ['center', 'center'],
             resizable: false,
             autoOpen: true,
             open: function (event, ui) {
@@ -85,7 +84,7 @@ var Piwik_Popover = (function () {
 
     var centerPopover = function () {
         if (container !== false) {
-            container.dialog({position: ['center', 'center']});
+            container.dialog("option", "position", {my: 'center', at: 'center', of: '.ui-widget-overlay', collision: 'fit'});
         }
     };
 
@@ -186,7 +185,8 @@ var Piwik_Popover = (function () {
             
             container.children().each(function (i, childNode) {
                 piwikHelper.compileAngularComponents(childNode);
-            })
+            });
+
             centerPopover();
         },
 
@@ -263,6 +263,7 @@ var Piwik_Popover = (function () {
             // make sure the minimum top position of the popover is 15px
             var ensureMinimumTop = function () {
                 var popoverContainer = $('#Piwik_Popover').parent();
+                popoverContainer.css('top', (window.scrollY + 15) + 'px');
                 if (popoverContainer.position().top < 106) {
                     popoverContainer.css('top', '15px');
                 }