<!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="/ui/analysis/analysis_sub_view.html">
<link rel="import" href="/ui/analysis/multi_event_sub_view.html">
<link rel="import" href="/ui/analysis/related_events.html">

<polymer-element name="tr-ui-a-multi-thread-slice-sub-view"
    extends="tr-ui-a-sub-view">
  <template>
    <style>
    :host {
      display: flex;
    }
    #content {
      display: flex;
      flex: 1 1 auto;
    }
    #content > tr-ui-a-related-events {
      margin-left: 8px;
      flex: 0 1 200px;
    }
    </style>
    <div id="content"></div>
  </template>

  <script>
  'use strict';

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

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

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

      // TODO(nduca): This is a gross hack for cc Frame Viewer, but its only
      // the frame viewer that needs this feature, so ~shrug~.
      // We check for its presence so that we do not have a hard dependency
      // on frame viewer.
      if (tr.isExported('tr.ui.e.chrome.cc.RasterTaskSelection')) {
        if (tr.ui.e.chrome.cc.RasterTaskSelection.supports(selection)) {
          var ltvSelection = new tr.ui.e.chrome.cc.RasterTaskSelection(
              selection);

          var ltv = new tr.ui.e.chrome.cc.LayerTreeHostImplSnapshotView();
          ltv.objectSnapshot = ltvSelection.containingSnapshot;
          ltv.selection = ltvSelection;
          ltv.extraHighlightsByLayerId = ltvSelection.extraHighlightsByLayerId;

          this.$.content.textContent = '';
          this.$.content.appendChild(ltv);

          this.requiresTallView_ = true;
          return;
        }
      }

      this.$.content.textContent = '';

      var mesv = document.createElement('tr-ui-a-multi-event-sub-view');
      mesv.selection = selection;
      this.$.content.appendChild(mesv);

      var relatedEvents = document.createElement('tr-ui-a-related-events');
      relatedEvents.setRelatedEvents(selection);

      if (relatedEvents.hasRelatedEvents()) {
        this.$.content.appendChild(relatedEvents);
      }
    },

    get requiresTallView() {
      if (this.$.content.children.length === 0)
        return false;
      var childTagName = this.$.content.children[0].tagName;
      if (childTagName === 'TR-UI-A-MULTI-EVENT-SUB-VIEW')
        return false;

      // Using raster task view.
      return true;
    }
  });
  </script>
</polymer-element>