v3 UI doesn't preserve the time range when charts page is opened from a dashboard
authorrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 6 Jan 2016 19:09:43 +0000 (19:09 +0000)
committerrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 6 Jan 2016 19:09:43 +0000 (19:09 +0000)
https://bugs.webkit.org/show_bug.cgi?id=152776

Reviewed by Chris Dumez.

Fixed the bug by moving the construction of charts URL from DashboardPage.prototype.open to
DashboardPage.prototype.render and re-rendering the entire page upon an URL state transition.

* public/v3/pages/charts-page.js:
(ChartsPage.createStateForDashboardItem): Takes the start time for the charts page.

* public/v3/pages/dashboard-page.js:
(DashboardPage.prototype.updateFromSerializedState): Merged _numberOfDaysDidChange and
_updateChartsDomainFromToolbar into this function since they're not used elsewhere. Also re-render
the entire page when transition between different number of days to show.
(DashboardPage.prototype._numberOfDaysDidChange): Deleted.
(DashboardPage.prototype._updateChartsDomainFromToolbar): Deleted.
(DashboardPage.prototype.render): Construct URL for each charts here.
(DashboardPage.prototype._createChartForCell): Don't construct URL here since this function is
called once when the dashboard page is opened, and not when the time range is changed.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@194647 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Websites/perf.webkit.org/ChangeLog
Websites/perf.webkit.org/public/v3/pages/charts-page.js
Websites/perf.webkit.org/public/v3/pages/dashboard-page.js

index d9f3d54..b08ea94 100644 (file)
@@ -1,3 +1,26 @@
+2016-01-06  Ryosuke Niwa  <rniwa@webkit.org>
+
+        v3 UI doesn't preserve the time range when charts page is opened from a dashboard
+        https://bugs.webkit.org/show_bug.cgi?id=152776
+
+        Reviewed by Chris Dumez.
+
+        Fixed the bug by moving the construction of charts URL from DashboardPage.prototype.open to
+        DashboardPage.prototype.render and re-rendering the entire page upon an URL state transition.
+
+        * public/v3/pages/charts-page.js:
+        (ChartsPage.createStateForDashboardItem): Takes the start time for the charts page.
+
+        * public/v3/pages/dashboard-page.js:
+        (DashboardPage.prototype.updateFromSerializedState): Merged _numberOfDaysDidChange and
+        _updateChartsDomainFromToolbar into this function since they're not used elsewhere. Also re-render
+        the entire page when transition between different number of days to show.
+        (DashboardPage.prototype._numberOfDaysDidChange): Deleted.
+        (DashboardPage.prototype._updateChartsDomainFromToolbar): Deleted.
+        (DashboardPage.prototype.render): Construct URL for each charts here.
+        (DashboardPage.prototype._createChartForCell): Don't construct URL here since this function is
+        called once when the dashboard page is opened, and not when the time range is changed.
+
 2016-01-05  Ryosuke Niwa  <rniwa@webkit.org>
 
         Build fix for an old version of PHP after r194618.
index 85f3d70..89cf48c 100644 (file)
@@ -13,9 +13,9 @@ class ChartsPage extends PageWithCharts {
 
     routeName() { return 'charts'; }
 
-    static createStateForDashboardItem(platformId, metricId)
+    static createStateForDashboardItem(platformId, metricId, startTime)
     {
-        var state = {paneList: [[platformId, metricId]]};
+        var state = {paneList: [[platformId, metricId]], since: startTime};
         return state;
     }
 
index 5f69aa1..27eba95 100644 (file)
@@ -24,28 +24,17 @@ class DashboardPage extends PageWithCharts {
 
     updateFromSerializedState(state, isOpen)
     {
-        if (!isOpen || state.numberOfDays) {
+        if (!isOpen || state.numberOfDays)
             this.toolbar().setNumberOfDays(state.numberOfDays);
-            this._numberOfDaysDidChange(isOpen);
-        }
-        this._updateChartsDomainFromToolbar();
-    }
-
-    _numberOfDaysDidChange(isOpen)
-    {
-        if (isOpen)
-            return;
 
-        this.toolbar().render();
-        this.heading().render(); // Update links for other dashboards.
-    }
-
-    _updateChartsDomainFromToolbar()
-    {
         var startTime = this.toolbar().startTime();
         var endTime = this.toolbar().endTime();
         for (var chart of this._charts)
             chart.setDomain(startTime, endTime);
+
+        this._needsTableConstruction = true;
+        if (!isOpen)
+            this.render();
     }
 
     open(state)
@@ -90,6 +79,8 @@ class DashboardPage extends PageWithCharts {
 
         if (this._needsTableConstruction) {
             var tree = [];
+            var router = this.router();
+            var startTime = this.toolbar().startTime();
             for (var group of this._tableGroups) {
                 tree.push(element('thead', element('tr',
                     group[0].map(function (cell, cellIndex) {
@@ -106,7 +97,9 @@ class DashboardPage extends PageWithCharts {
                         if (!cell.chart)
                             return element('td', cell);
 
-                        return element('td', [cell.statusView, link(cell.chart.element(), cell.label, cell.url)]);
+                        var url = router.url('charts', 
+                            ChartsPage.createStateForDashboardItem(cell.platform.id(), cell.metric.id(), startTime));
+                        return element('td', [cell.statusView, link(cell.chart.element(), cell.label, url)]);
                     }));
                 })));
             }
@@ -146,9 +139,10 @@ class DashboardPage extends PageWithCharts {
         return {
             chart: chart,
             statusView: statusView,
+            platform: result.platform,
             metric: result.metric,
-            label: result.metric.fullName() + ' on ' + result.platform.label(),
-            url: this.router().url('charts', ChartsPage.createStateForDashboardItem(platformId, metricId))};
+            label: result.metric.fullName() + ' on ' + result.platform.label()
+        };
     }
 
     _fetchedData()