1<!DOCTYPE html>
2<!--
3Copyright 2015 The Chromium Authors. All rights reserved.
4Use of this source code is governed by a BSD-style license that can be
5found in the LICENSE file.
6-->
7
8<link rel="import" href="/tracing/ui/analysis/analysis_sub_view.html">
9<link rel="import" href="/tracing/ui/analysis/frame_power_usage_chart.html">
10<link rel="import" href="/tracing/ui/analysis/power_sample_summary_table.html">
11<link rel="import" href="/tracing/ui/analysis/power_sample_table.html">
12
13<polymer-element name="tr-ui-a-multi-power-sample-sub-view"
14    extends="tr-ui-a-sub-view">
15  <template>
16    <style>
17    :host {
18      display: flex;
19      flex-direction: row;
20    }
21    #tables {
22      display: flex;
23      flex-direction: column;
24      width: 50%;
25    }
26    #chart {
27      width: 50%;
28    }
29    </style>
30    <div id="tables">
31      <tr-ui-a-power-sample-summary-table id="summaryTable">
32      </tr-ui-a-power-sample-summary-table>
33      <tr-ui-a-power-sample-table id="samplesTable">
34      </tr-ui-a-power-sample-table>
35    </div>
36    <tr-ui-a-frame-power-usage-chart id="chart">
37    </tr-ui-a-frame-power-usage-chart>
38  </template>
39</polymer-element>
40
41<script>
42'use strict';
43
44// TODO(charliea): Add a dropdown that allows the user to select which type of
45// power sample analysis view they want (e.g. table of samples, graph).
46Polymer('tr-ui-a-multi-power-sample-sub-view', {
47  ready: function() {
48    this.currentSelection_ = undefined;
49  },
50
51  get selection() {
52    return this.currentSelection_;
53  },
54
55  set selection(selection) {
56    this.currentSelection_ = selection;
57    this.updateContents_();
58  },
59
60  updateContents_: function() {
61    var samples = this.selection;
62    var vSyncTimestamps = (this.selection === undefined) ?
63        [] : this.selection[0].series.device.vSyncTimestamps;
64
65    this.$.summaryTable.samples = samples;
66    this.$.samplesTable.samples = samples;
67    this.$.chart.setData(this.selection, vSyncTimestamps);
68  }
69});
70</script>
71