<link rel="import" href="../../../../packages/polymer/polymer.html">
<link rel="import" href="nav_bar.html">
<link rel="import" href="observatory_element.html">
<link rel="import" href="stack_frame.html">

<polymer-element name="stack-trace" extends="observatory-element">
  <template>
    <link rel="stylesheet" href="css/shared.css">
    <nav-bar>
      <top-nav-menu></top-nav-menu>
      <isolate-nav-menu isolate="{{ trace.isolate }}"></isolate-nav-menu>
      <nav-menu link="{{ trace.isolate.relativeLink('stacktrace') }}" anchor="stack trace" last="{{ true }}"></nav-menu>
      <nav-refresh callback="{{ refresh }}"></nav-refresh>
      <nav-control></nav-control>
    </nav-bar>
    <template if="{{ trace['members'].isEmpty }}">
      <div class="content">
        <em>No stack</em>
      </div>
    </template>
    <template if="{{ trace['members'].isNotEmpty }}">
      <ul class="list-group">
        <template repeat="{{ frame in trace['members'] }}">
          <li class="list-group-item">
            <stack-frame frame="{{ frame }}"></stack-frame>
          </li>
        </template>
      </ul>
    </template>
  </template>
</polymer-element>

<script type="application/dart" src="stack_trace.dart"></script>