<!DOCTYPE html>
<!--
Copyright (c) 2013 The Chromium Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.
-->

<link rel="import" href="/core/analysis/analysis_sub_view.html">
<link rel="import" href="/base/ui/table.html">
<link rel="import" href="/core/analysis/stack_frame.html">
<link rel="import" href="/base/units/time_stamp_span.html">

<polymer-element name="tr-c-a-single-sample-sub-view"
    extends="tr-c-a-sub-view">
  <template>
    <style>
    :host {
      display: flex;
    }
    </style>
    <tr-b-ui-table id="content"></tr-b-ui-table>
  </template>
  <script>
  'use strict';

  Polymer({
    created: function() {
      this.currentSelection_ = undefined;
    },

    ready: function() {
      this.$.content.tableColumns = [
        {
          title: 'FirstColumn',
          value: function(row) { return row.title; },
          width: '250px'
        },
        {
          title: 'SecondColumn',
          value: function(row) { return row.value; },
          width: '100%'
        }
      ];
      this.$.content.showHeader = false;
    },

    get selection() {
      return this.currentSelection_;
    },

    set selection(selection) {
      this.currentSelection_ = selection;

      if (this.currentSelection_ === undefined) {
        this.$.content.tableRows = [];
        return;
      }

      var sample = this.currentSelection_[0];
      var table = this.$.content;

      var rows = [];

      rows.push({
        title: 'Title',
        value: sample.title
      });

      rows.push({
          title: 'Sample time',
          value: tr.b.units.createTimeStampSpan(sample.start)
      });

      var sfEl = document.createElement('tr-c-a-stack-frame');
      sfEl.stackFrame = sample.leafStackFrame;
      rows.push({
        title: 'Stack trace',
        value: sfEl
      });
      table.tableRows = rows;
      table.rebuild();
    }
  });
  </script>
</polymer-element>