Better UI for Piwik 3, more responsive, faster, lots of other fixes (#10397)

* improved ui and responsiveness

* improve rss widget

* commit changes for ui again, got lost after the last commit

* fix more tests

* restoring files

* fix fonts

* fix more tests

* more test fixes

* fix some system tests

* fix tests

* fix system and ui tests

* fix updater tests

* make a page as loaded once the callback is called

* enable verbose

* more verbose output

* enable phantomjs debug flag

* debug should be a phantomjs option

* trying to fix installation tests

* fixes #10173 to not compile css files as less

* trying to minimize js/css requests to hopefully prevent random ui test fails

* disable verbose mode

* fix updater and installation

* lots of bugfixes and ui tweaks

* fix reset dashboard

* various bugfixes

* fix integration tests

* fix text color

* hoping to fix installation tests this way

* cache css/js resources for an hour, should speed up tests and prevent some random issues

* we need to avoid installing plugins multiple times at the same time when requesting resources

* finally getting the colors right again

* fix most tests, more tests for theme

* use an h2 element for titles for better accessibility

* fix headline color

* use actual theme text color (piwik-black)

* fix small font size was applied on all p elements

* fix tests

* now improving all the datatables

* trying to ignore images for visitor log

* Revert "trying to ignore images for visitor log"

This reverts commit ad1ff7267aae14ad905bef130e956c8593c4fb22.

* fix tests

* fix we had always ignored a max label width

* trying to fix file permissions

* fix more file permissions

* Improved plugins update API (#10028)

* refs #7983 let plugins add or remove fields to websites and better settings api

* * Hide CorePluginsAdmin API methods
* More documentation
* Added some more tests

* improved updates API for plugins

* better error code as duplicate column cannot really happen when not actually renaming a colum

Conflicts:
	core/Updates/3.0.0-b1.php
	plugins/CoreUpdater/Commands/Update/CliUpdateObserver.php

* fix DB field piwik_log_visit.location_provider too small (#10003)

* fixes #9564 fix DB field piwik_log_visit.location_provider too small

* use new plugins updater API

* DB field piwik_log_visit.visit_total_actions too small (#10002)

* fixes #9565 DB field piwik_log_visit.visit_total_actions too small

* change type of some db columns that are too small

* fix tests (#10040)
Conflicts:
	plugins/CoreAdminHome/Menu.php
	plugins/Goals/Menu.php
	plugins/MobileMessaging/Menu.php
	plugins/SitesManager/Menu.php
	plugins/UsersManager/Menu.php
	tests/PHPUnit/System/expected/test_apiGetReportMetadata__API.getWidgetMetadata.xml

* fix more file permissions

* repair more file permissions

* repair more file permissions

* trying to make ui tests work again, the table was missing

* fix some encoding issues

* cross browser fixes and usability improvement

* move back the config icon, need to find a better solution later

* more cross browser fixes

* bugfixes

* fix ui tests

* fix encoding issue

* fix various issues with the ui tests when a test gets aborted

* also skip this visitor log test when aborted

* there were 3 css files that were loaded separately, merge them instead into one css

* forgot to add the actual manifest

* do not add manifest if custom logo is specified

* load font css files first as it was before merging them into big css

* fix link icon was not aligned anymore

* minor fixes

* setting it back to 4px

* in popovers the font variable was always ignored and a different font loaded

* forgot to update screenshots

* fix remaining tests

* this should fix an update error

* added 3 new widgets system check, system summary and plugin updates

* tweak new widgets content

* no page reload when changing date or segment

* in admin home show only enabled widgets

* refs #10295 use getMockBuilder instead of deprecated getMock

* fix some ui tests

* fix various bugs

* fix more tests

* fix ui tests

* add a space between loading image and loading message

* fix docs so they appear on developer.piwik.org

* improved documentation

* introduce new Widget::renderTemplate method for consistency with controllers

* remove no longer needed files

* testing system fonts

* fix strong was not really bold

* more useful system summary

* remove ubuntu font

* fix most tests and removed most em elements

* fix tests

* fix headline was very thin

* update submodule

* update submodules

* update submodule

* fix failing ui tests

* update submodules

1 files changed, 56 insertions, 88 deletions

diff --git a/plugins/DBStats/templates/index.twig b/plugins/DBStats/templates/index.twig
index a28a2a3944..486e4c8528 100755
--- a/plugins/DBStats/templates/index.twig
+++ b/plugins/DBStats/templates/index.twig
@@ -3,29 +3,32 @@
 {% set title %}{{ 'DBStats_DatabaseUsage'|translate }}{% endset %}
 
 {% block content %}
+<div piwik-content-intro>
+    <h2 piwik-enriched-headline>
+        {{ title }}
+    </h2>
+    <p>
+        {{ 'DBStats_MainDescription'|translate(totalSpaceUsed) }}<br/>
+        {{ 'DBStats_LearnMore'|translate("<a href='?module=Proxy&action=redirect&url=http://piwik.org/docs/setup-auto-archiving/' target='_blank'>Piwik Auto Archiving</a>")|raw }}
+    </p>
+</div>
 
-<h2 id="databaseUsageSummary">{{ title }}</h2>
-<p>
-    {{ 'DBStats_MainDescription'|translate(totalSpaceUsed) }}<br/>
-    {{ 'DBStats_LearnMore'|translate("<a href='?module=Proxy&action=redirect&url=http://piwik.org/docs/setup-auto-archiving/' target='_blank'>Piwik Auto Archiving</a>")|raw }}
-    <br/>
-    <br/>
-</p>
-<table class="adminTable dbstatsTable">
-    <tbody>
-    <tr>
-        <td>{{ databaseUsageSummary|raw }}</td>
-        <td>
-            <h3 style="margin-top:0;">{{ 'General_GeneralInformation'|translate }}</h3><br/>
+<div class="row">
+    <div class="col s12 m6">
+        {{ databaseUsageSummary|raw }}
 
+        {{ trackerDataSummary|raw }}
+    </div>
+    <div class="col s12 m6">
+        <div piwik-content-block content-title="{{ 'General_GeneralInformation'|translate|e('html_attr') }}">
             <p style="font-size:1.4em;padding-left:21px;line-height:1.8em;">
-                <strong><em>{{ userCount }}</em></strong>&nbsp;{% if userCount == 1 %}{{ 'UsersManager_User'|translate }}{% else %}{{ 'UsersManager_MenuUsers'|translate }}{% endif %}
+                <strong>{{ userCount }}</strong>&nbsp;{% if userCount == 1 %}{{ 'UsersManager_User'|translate }}{% else %}{{ 'UsersManager_MenuUsers'|translate }}{% endif %}
                 <br/>
-                <strong><em>{{ siteCount }}</em></strong>&nbsp;{% if siteCount == 1 %}{{ 'General_Website'|translate }}{% else %}{{ 'Referrers_Websites'|translate }}{% endif %}
-            </p><br/>
+                <strong>{{ siteCount }}</strong>&nbsp;{% if siteCount == 1 %}{{ 'General_Website'|translate }}{% else %}{{ 'Referrers_Websites'|translate }}{% endif %}
+            </p>
+        </div>
+        <div piwik-content-block content-title="{{ 'PrivacyManager_DeleteDataSettings'|translate|e('html_attr') }}">
             {% set clickDeleteLogSettings %}{{ 'PrivacyManager_DeleteDataSettings'|translate }}{% endset %}
-            <h3 style="margin-top:0;">{{ 'PrivacyManager_DeleteDataSettings'|translate }}</h3><br/>
-
             <p>
                 {{ 'PrivacyManager_DeleteDataDescription'|translate }}
                 <br/>
@@ -33,72 +36,37 @@
                     {{ 'PrivacyManager_ClickHereSettings'|translate("'"~clickDeleteLogSettings~"'") }}
                 </a>
             </p>
-        </td>
-    </tr>
-    </tbody>
-</table>
-
-<br/>
-
-<table class="adminTable dbstatsTable" id="trackerDataSummary">
-    <tbody>
-    <tr>
-        <td>
-            <h2 class="secondary">{{ 'DBStats_TrackerTables'|translate }}</h2>
-            {{ trackerDataSummary|raw }}
-        </td>
-        <td>&nbsp;</td>
-    </tr>
-    </tbody>
-</table>
-
-<table class="adminTable dbstatsTable" id="reportDataSummary">
-    <tbody>
-    <tr>
-        <td>
-            <h2 class="secondary">{{ 'DBStats_ReportTables'|translate }}</h2>
-            {{ reportDataSummary|raw }}
-        </td>
-        <td>
-            <h2 class="secondary">{{ 'General_Reports'|translate }}</h2>
-
-            <div class="ajaxLoad" action="getIndividualReportsSummary">
-                <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/>{{ 'General_LoadingData'|translate }}</span>
-            </div>
-        </td>
-    </tr>
-    </tbody>
-</table>
+        </div>
+    </div>
+</div>
 
-<table class="adminTable dbstatsTable" id="metricDataSummary">
-    <tbody>
-    <tr>
-        <td>
-            <h2 class="secondary">{{ 'DBStats_MetricTables'|translate }}</h2>
-            {{ metricDataSummary|raw }}
-        </td>
-        <td>
-            <h2 class="secondary">{{ 'General_Metrics'|translate }}</h2>
+<div class="row">
+    <div class="col s12 m6">
+        {{ reportDataSummary|raw }}
+    </div>
+    <div class="col s12 m6">
+        <div class="ajaxLoad" action="getIndividualReportsSummary">
+            <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/>{{ 'General_LoadingData'|translate }}</span>
+        </div>
+    </div>
+</div>
 
-            <div class="ajaxLoad" action="getIndividualMetricsSummary">
-                <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/>{{ 'General_LoadingData'|translate }}</span>
-            </div>
-        </td>
-    </tr>
-    </tbody>
-</table>
+<div class="row">
+    <div class="col s12 m6">
+        {{ metricDataSummary|raw }}
+    </div>
+    <div class="col s12 m6">
+        <div class="ajaxLoad" action="getIndividualMetricsSummary">
+            <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/>{{ 'General_LoadingData'|translate }}</span>
+        </div>
+    </div>
+</div>
 
-<table class="adminTable dbstatsTable" id="adminDataSummary">
-    <tbody>
-    <tr>
-        <td>
-            <h2 class="secondary">{{ 'DBStats_OtherTables'|translate }}</h2>
-            {{ adminDataSummary|raw }}
-        </td>
-        <td>&nbsp;</td>
-    </tr>
-    </tbody>
-</table>
+<div class="row">
+    <div class="col s12 m6">
+        {{ adminDataSummary|raw }}
+    </div>
+</div>
 
 <script type="text/javascript">
     (function ($) {
@@ -112,14 +80,14 @@
                 ajaxRequest.addParams({
                     module: 'DBStats',
                     action: action,
-                    viewDataTable: 'table'
+                    viewDataTable: 'table',
+                    showtitle: '1'
                 }, 'get');
-                ajaxRequest.setCallback(
-                        function (data) {
-                            $('.loadingPiwik', self).remove();
-                            $(self).html(data);
-                        }
-                );
+                ajaxRequest.setCallback(function (data) {
+                    $('.loadingPiwik', self).remove();
+                    $(self).html(data);
+                    piwikHelper.compileAngularComponents(self);
+                });
                 ajaxRequest.setFormat('html');
                 ajaxRequest.send(false);
             });