<head>
  <link rel="import" href="class_ref.html">
  <link rel="import" href="observatory_element.html">
</head>
<polymer-element name="heap-profile" extends="observatory-element">
<template>
  <div>
  <button type="button" on-click="{{refreshData}}">Refresh</button>
  </div>
  <div class="row">
    <div id="newPieChart" class="col-md-4" style="height: 400px">
    </div>
    <div id="newStatus" class="col-md-2">
      <table class="table">
        <tbody>
          <tr>
            <td>Collections</td>
            <td>{{ formattedCollections(true) }}</td>
          </tr>
          <tr>
            <td>Average Collection Time</td>
            <td>{{ formattedAverage(true) }}</td>
          </tr>
          <tr>
            <td>Cumulative Collection Time</td>
            <td>{{ formattedTotalCollectionTime(true) }}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div id="oldPieChart" class="col-md-4" style="height: 400px">
    </div>
    <div id="oldStatus" class="col-md-2">
      <table class="table">
        <tbody>
          <tr>
            <td>Collections</td>
            <td>{{ formattedCollections(true) }}</td>
          </tr>
          <tr>
            <td>Average Collection Time</td>
            <td>{{ formattedAverage(true) }}</td>
          </tr>
          <tr>
            <td>Cumulative Collection Time</td>
            <td>{{ formattedTotalCollectionTime(true) }}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
  <div class="row">
    <div id="table" class="col-md-12" style="height: 800px"></div>
  </div>
</template>
<script type="application/dart" src="heap_profile.dart"></script>
</polymer-element>