{{!
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
}}


<div class="clearfix">
  <div class="column-left col-md-6">
    {{#bs-panel heading="Summary" class="panel-summary"}}
      <table class="table no-borders table-condensed">
        <tbody>
        <tr>
          <td style="width: 25%;">{{t common.status}}</td>
          <td>{{controller.model.displayStatus}}</td>
        </tr>
        <tr>
          <td>{{t common.type}}</td>
          <td>{{controller.appType}}</td>
        </tr>
        <tr>
          <td>{{t common.yarn.app.id}}</td>
          <td>{{controller.model.yarnId}}</td>
        </tr>
        <tr>
          <td>{{t common.started}}</td>
          <td>{{formatWordBreak controller.model.startedToLocalTime}}</td>
        </tr>
        <tr>
          <td>{{t common.finished}}</td>
          <td>{{formatWordBreak controller.model.endedToLocalTime}}</td>
        </tr>
        <tr>
          <td>{{t common.diagnostics}}</td>
          <td>{{formatWordBreak controller.model.diagnostics devider="."}}</td>
        </tr>
          {{#each controller.model.jmx}}
          <tr>
            <td>{{humanize key}}</td>
            <td>{{formatWordBreak value}}</td>
          </tr>
          {{/each}}
        </tbody>
      </table>
    {{/bs-panel}}
  </div>
  <div class="column-right col-md-6">
    <div class="panel panel-default panel-alerts">
      <div class="panel-heading">
        {{t common.status}}
        <div class="btn-group pull-right panel-link">
        </div>
      </div>
      <div class="app-alerts">
        <ul>
          {{#if controller.model.doNotShowComponentsAndAlerts}}
            <li>
              <div class="container-fluid">{{t sliderApp.alerts.no.status}}</div>
            </li>
          {{else}}
            {{#each controller.model.alerts}}
              {{#view view.AlertView contentBinding="this"}}
                <div class="container-fluid">
                  <div class="row">
                    <div class="col-md-1 status-icon">
                      <i {{bind-attr class="iconClass :icon-small"}}></i>
                    </div>
                    <div class="col-md-11">
                      <div class="row">
                        <div class="col-md-7 title">{{title}}</div>
                        <div class="message">{{message}}</div>
                      </div>
                    </div>
                  </div>
                </div>
              {{/view}}
            {{/each}}
          {{/if}}
        </ul>
      </div>
    </div>
    {{#bs-panel heading="Components" class="panel-components"}}
      <table class="table no-borders table-condensed">
        <tbody>
          {{#if controller.model.doNotShowComponentsAndAlerts}}
          <tr>
            <td>{{t sliderApp.summary.no.components}}</td>
          </tr>
          {{else}}
            {{#each controller.model.components}}
            <tr>
              <td><span {{bind-attr class="isRunning:icon-ok-sign:icon-warning-sign :status"}}></span> {{componentName}}
              </td>
              <td>
                {{#if url}}
                  <a {{bind-attr href="url"}} target="_blank">{{host}}</a>
                {{else}}
                  {{host}}
                {{/if}}
              </td>
            </tr>
            {{/each}}
          {{/if}}
        </tbody>
      </table>
    {{/bs-panel}}
  </div>
</div>

{{#if controller.model.showMetrics}}
  <div {{bind-attr class="view.graphsNotEmpty:visible:hidden :panel :panel-default"}}>
    <div class="panel-heading">
      {{t common.metrics}}
    </div>
    <div class="panel-body">
      <div class="row">
        {{#each graph in view.graphs}}
          <div class="col-md-3">{{view graph.view}}</div>
        {{/each}}
      </div>
    </div>
  </div>
{{/if}}
