From 0c9c30b731ccbacf47e154b9f7a590af49e3d799 Mon Sep 17 00:00:00 2001 From: Thomas Steur Date: Mon, 29 Aug 2016 13:30:52 +1200 Subject: 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 --- .../CoreVisualizations/Visualizations/Cloud.php | 2 +- .../Visualizations/HtmlTable.php | 2 +- .../Visualizations/HtmlTable/AllColumns.php | 2 +- .../Visualizations/JqplotGraph/Bar.php | 2 +- .../Visualizations/JqplotGraph/Pie.php | 2 +- .../Visualizations/Sparklines.php | 7 +++ plugins/CoreVisualizations/javascripts/jqplot.js | 10 ++-- .../stylesheets/dataTableVisualizations.less | 26 +++++---- plugins/CoreVisualizations/stylesheets/jqplot.css | 8 ++- .../templates/_dataTableViz_sparklines.twig | 61 ++++++++++++---------- 10 files changed, 71 insertions(+), 51 deletions(-) (limited to 'plugins/CoreVisualizations') diff --git a/plugins/CoreVisualizations/Visualizations/Cloud.php b/plugins/CoreVisualizations/Visualizations/Cloud.php index 502411e74c..ff9888c9eb 100644 --- a/plugins/CoreVisualizations/Visualizations/Cloud.php +++ b/plugins/CoreVisualizations/Visualizations/Cloud.php @@ -26,7 +26,7 @@ class Cloud extends Visualization { const ID = 'cloud'; const TEMPLATE_FILE = "@CoreVisualizations/_dataTableViz_tagCloud.twig"; - const FOOTER_ICON = 'plugins/Morpheus/images/tagcloud.png'; + const FOOTER_ICON = 'icon-tag-cloud'; const FOOTER_ICON_TITLE = 'General_TagCloud'; /** Used by system tests to make sure output is consistent. */ diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable.php b/plugins/CoreVisualizations/Visualizations/HtmlTable.php index dff8aa3e7a..65866c8edf 100644 --- a/plugins/CoreVisualizations/Visualizations/HtmlTable.php +++ b/plugins/CoreVisualizations/Visualizations/HtmlTable.php @@ -23,7 +23,7 @@ class HtmlTable extends Visualization { const ID = 'table'; const TEMPLATE_FILE = "@CoreVisualizations/_dataTableViz_htmlTable.twig"; - const FOOTER_ICON = 'plugins/Morpheus/images/table.png'; + const FOOTER_ICON = 'icon-table'; const FOOTER_ICON_TITLE = 'General_DisplaySimpleTable'; public static function getDefaultConfig() diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php b/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php index 959aa0d57b..4065fd10f7 100644 --- a/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php +++ b/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php @@ -20,7 +20,7 @@ use Piwik\View; class AllColumns extends HtmlTable { const ID = 'tableAllColumns'; - const FOOTER_ICON = 'plugins/Morpheus/images/table_more.png'; + const FOOTER_ICON = 'icon-table-more'; const FOOTER_ICON_TITLE = 'General_DisplayTableWithMoreMetrics'; public function beforeRender() diff --git a/plugins/CoreVisualizations/Visualizations/JqplotGraph/Bar.php b/plugins/CoreVisualizations/Visualizations/JqplotGraph/Bar.php index 121cfdc315..94cfa60050 100644 --- a/plugins/CoreVisualizations/Visualizations/JqplotGraph/Bar.php +++ b/plugins/CoreVisualizations/Visualizations/JqplotGraph/Bar.php @@ -18,7 +18,7 @@ use Piwik\Plugins\CoreVisualizations\Visualizations\JqplotGraph; class Bar extends JqplotGraph { const ID = 'graphVerticalBar'; - const FOOTER_ICON = 'plugins/Morpheus/images/chart_bar.png'; + const FOOTER_ICON = 'icon-chart-bar'; const FOOTER_ICON_TITLE = 'General_VBarGraph'; public function beforeRender() diff --git a/plugins/CoreVisualizations/Visualizations/JqplotGraph/Pie.php b/plugins/CoreVisualizations/Visualizations/JqplotGraph/Pie.php index bd2d033fae..3c43bb31a1 100644 --- a/plugins/CoreVisualizations/Visualizations/JqplotGraph/Pie.php +++ b/plugins/CoreVisualizations/Visualizations/JqplotGraph/Pie.php @@ -18,7 +18,7 @@ use Piwik\Plugins\CoreVisualizations\Visualizations\JqplotGraph; class Pie extends JqplotGraph { const ID = 'graphPie'; - const FOOTER_ICON = 'plugins/Morpheus/images/chart_pie.png'; + const FOOTER_ICON = 'icon-chart-pie'; const FOOTER_ICON_TITLE = 'General_Piechart'; public static function getDefaultConfig() diff --git a/plugins/CoreVisualizations/Visualizations/Sparklines.php b/plugins/CoreVisualizations/Visualizations/Sparklines.php index 3b576c885e..fa081d55d5 100644 --- a/plugins/CoreVisualizations/Visualizations/Sparklines.php +++ b/plugins/CoreVisualizations/Visualizations/Sparklines.php @@ -8,6 +8,7 @@ */ namespace Piwik\Plugins\CoreVisualizations\Visualizations; +use Piwik\Common; use Piwik\DataTable; use Piwik\Metrics; use Piwik\Plugin\ViewDataTable; @@ -70,6 +71,12 @@ class Sparklines extends ViewDataTable } $view->sparklines = $this->config->getSortedSparklines(); + $view->isWidget = Common::getRequestVar('widget', 0, 'int'); + + $view->title = ''; + if ($_GET['showtitle'] === '1') { + $view->title = $this->config->title; + } return $view->render(); } diff --git a/plugins/CoreVisualizations/javascripts/jqplot.js b/plugins/CoreVisualizations/javascripts/jqplot.js index 6e5d2135d1..5f51e7e341 100644 --- a/plugins/CoreVisualizations/javascripts/jqplot.js +++ b/plugins/CoreVisualizations/javascripts/jqplot.js @@ -178,7 +178,9 @@ // manage resources target.on('piwikDestroyPlot', function () { - $(window).off('resize', this._resizeListener); + if (this._resizeListener) { + $(window).off('resize', this._resizeListener); + } self._plot.destroy(); for (var i = 0; i < $.jqplot.visiblePlots.length; i++) { if ($.jqplot.visiblePlots[i] == self._plot) { @@ -385,7 +387,9 @@ // TODO: this code destroys plots when a page is switched. there must be a better way of managing memory. if (typeof $.jqplot.visiblePlots == 'undefined') { $.jqplot.visiblePlots = []; - $('#secondNavBar').on('piwikSwitchPage', function () { + var $rootScope = piwikHelper.getAngularDependency('$rootScope'); + + $rootScope.$on('piwikPageChange', function () { for (var i = 0; i < $.jqplot.visiblePlots.length; i++) { if ($.jqplot.visiblePlots[i] == null) { continue; @@ -949,7 +953,7 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () { // legend will be put there if (this.plugins.canvasLegend.show) { options.gridPadding = { - top: 21 + top: 21, right: 0 }; } diff --git a/plugins/CoreVisualizations/stylesheets/dataTableVisualizations.less b/plugins/CoreVisualizations/stylesheets/dataTableVisualizations.less index 589278a6f4..ff2118b952 100644 --- a/plugins/CoreVisualizations/stylesheets/dataTableVisualizations.less +++ b/plugins/CoreVisualizations/stylesheets/dataTableVisualizations.less @@ -1,17 +1,3 @@ -/* container of each table */ -.dataTableVizHtmlTable > .dataTableWrapper { - width: 450px; - /* not more than 450px to make sure 2 tables can fit horizontally on a 1024 screen */ -} - -.dataTableVizAllColumns > .dataTableWrapper { - width: 535px; -} - -.dataTableVizPie > .dataTableWrapper, .dataTableVizBar > .dataTableWrapper { - width: 500px; - min-height: 1px; -} .piwik-graph { height: 250px; @@ -25,4 +11,16 @@ .piwik-graph { height: 170px; } +} + +.widget .dataTableVizEvolution { + padding-left: 10px; + padding-right: 10px; +} + +.widget .tagCloud { + padding: 10px; +} +.widget .dataTableVizBar .jqplot-graph { + padding: 0 10px 10px 10px; } \ No newline at end of file diff --git a/plugins/CoreVisualizations/stylesheets/jqplot.css b/plugins/CoreVisualizations/stylesheets/jqplot.css index f074320c43..025c179847 100644 --- a/plugins/CoreVisualizations/stylesheets/jqplot.css +++ b/plugins/CoreVisualizations/stylesheets/jqplot.css @@ -76,12 +76,11 @@ .rowevolution { position: relative; - overflow: hidden; text-align: left; } #Piwik_Popover .rowevolution .alert-info { - margin-left: 0px; + margin-left: 0; } a.rowevolution-startmulti { @@ -118,6 +117,11 @@ a.rowevolution-startmulti { -khtml-user-select: none; /* Webkit (Safari, Chrome) */ } +.rowevolution table.metrics td.sparkline, +.multirowevolution table.metrics td.sparkline { + float:none; +} + .rowevolution table.metrics tr { margin: 0; padding: 0; diff --git a/plugins/CoreVisualizations/templates/_dataTableViz_sparklines.twig b/plugins/CoreVisualizations/templates/_dataTableViz_sparklines.twig index 38a0b9d97e..4ed2dbc655 100644 --- a/plugins/CoreVisualizations/templates/_dataTableViz_sparklines.twig +++ b/plugins/CoreVisualizations/templates/_dataTableViz_sparklines.twig @@ -1,34 +1,41 @@ {% import '@CoreVisualizations/macros.twig' as macros %} {% if not isWidget %} -
-
+
{% endif %} - - {% for key, sparkline in sparklines %} - {% if key is even %} - {{ macros.singleSparkline(sparkline) }} - {% endif %} - {% endfor %} - -{% if not isWidget %} -
+ {% if title is not empty %}

{{ title }}

{% endif %} + + {% if not isWidget %} +
+
+ {% endif %} + + {% for key, sparkline in sparklines %} + {% if key is even %} + {{ macros.singleSparkline(sparkline) }} + {% endif %} + {% endfor %} + + {% if not isWidget %} +
+
+
+ {% endif %} + + {% for key, sparkline in sparklines %} + {% if key is odd %} + {{ macros.singleSparkline(sparkline) }} + {% endif %} + {% endfor %} + +
+ + {% if not isWidget %} +
-
-{% endif %} - - {% for key, sparkline in sparklines %} - {% if key is odd %} - {{ macros.singleSparkline(sparkline) }} - {% endif %} - {% endfor %} - -
+ {% endif %} + {% include "_sparklineFooter.twig" %} {% if not isWidget %} -
-
-{% endif %} - -{% include "_sparklineFooter.twig" %} - +
+{% endif %} \ No newline at end of file -- cgit v1.2.3