<!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="/tracing/base/unit.html">
<link rel="import" href="/tracing/model/event_set.html">
<link rel="import" href="/tracing/ui/analysis/analysis_link.html">
<link rel="import" href="/tracing/ui/analysis/analysis_sub_view.html">
<link rel="import" href="/tracing/ui/base/dom_helpers.html">
<link rel="import" href="/tracing/ui/base/table.html">
<link rel="import" href="/tracing/value/ui/scalar_span.html">

<dom-module id='tr-ui-a-multi-object-sub-view'>
  <template>
    <style>
    :host {
      display: flex;
    }
    </style>
    <tr-ui-b-table id="content"></tr-ui-b-table>
  </template>
</dom-module>
<script>
'use strict';

Polymer({
  is: 'tr-ui-a-multi-object-sub-view',
  behaviors: [tr.ui.analysis.AnalysisSubView],

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

  ready: function() {
    this.$.content.showHeader = false;
  },

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

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

    var objectEvents = tr.b.asArray(selection).sort(
        tr.b.Range.compareByMinTimes);

    var timeSpanConfig = {
      unit: tr.b.Unit.byName.timeStampInMs,
      ownerDocument: this.ownerDocument
    };
    var table = this.$.content;
    table.tableColumns = [
      {
        title: 'First',
        value: function(event) {
          if (event instanceof tr.model.ObjectSnapshot)
            return tr.v.ui.createScalarSpan(event.ts, timeSpanConfig);

          var spanEl = document.createElement('span');
          Polymer.dom(spanEl).appendChild(tr.v.ui.createScalarSpan(
              event.creationTs, timeSpanConfig));
          Polymer.dom(spanEl).appendChild(tr.ui.b.createSpan({
              textContent: '-',
              marginLeft: '4px',
              marginRight: '4px'
          }));
          if (event.deletionTs != Number.MAX_VALUE) {
            Polymer.dom(spanEl).appendChild(tr.v.ui.createScalarSpan(
                event.deletionTs, timeSpanConfig));
          }
          return spanEl;
        },
        width: '200px'
      },
      {
        title: 'Second',
        value: function(event) {
          var linkEl = document.createElement('tr-ui-a-analysis-link');
          linkEl.setSelectionAndContent(function() {
              return new tr.model.EventSet(event);
          }, event.userFriendlyName);
          return linkEl;
        },
        width: '100%'
      }
    ];
    table.tableRows = objectEvents;
    table.rebuild();
  }
});

tr.ui.analysis.AnalysisSubView.register(
    'tr-ui-a-multi-object-sub-view',
    tr.model.ObjectInstance,
    {
      multi: true,
      title: 'Object Instances',
    });
tr.ui.analysis.AnalysisSubView.register(
    'tr-ui-a-multi-object-sub-view',
    tr.model.ObjectSnapshot,
    {
      multi: true,
      title: 'Object Snapshots',
    });
</script>