<!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="/core/analysis/single_event_sub_view.html">
<link rel="import" href="/core/analysis/related_flows.html">

<polymer-element name="tv-c-a-single-thread-slice-sub-view"
    extends="tracing-analysis-sub-view">
  <template>
    <style>
    :host {
      display: flex;
      flex-direction: row;
    }
    #flows {
      display: flex;
      flex-direction: column;
    }

    </style>
    <tv-c-a-single-event-sub-view id="content"></tv-c-a-single-event-sub-view>
    <div id="flows">
      <tv-c-a-related-flows id="rflows">
      </tv-c-a-related-flows>
    </div>
  </template>

  <script>
  'use strict';

  Polymer({
    get selection() {
      return this.$.content.selection;
    },

    set selection(selection) {
      this.$.content.selection = selection;
      var hasFlows = false;
      var slice;
      if (selection) {
        slice = selection[0];
        hasFlows = slice.inFlowEvents.length !== 0 ||
            slice.outFlowEvents.length !== 0;
      }
      if (hasFlows) {
        this.$.rflows.style.display = '';
        this.$.rflows.setFlows(
          new tv.c.Selection(slice.inFlowEvents),
          new tv.c.Selection(slice.outFlowEvents));
      } else {
        this.$.rflows.style.display = 'none';
        this.$.rflows.clearFlows();
      }
    }
  });
  </script>
</polymer-element>