<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">

  <title>{% block title %} {% end %}</title>

  <!-- Custom CSS -->
  <link href="/css/sb-admin-2.css" rel="stylesheet">

  <!-- Custom Fonts -->
  <link href="/css/font-awesome.min.css" rel="stylesheet" type="text/css">

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
    <script src="/js/html5shiv.js"></script>
    <script src="/js/respond.min.js"></script>
  <![endif]-->
  <!-- DataTables CSS -->
  <link href="/js/datatables/datatables.min.css" rel="stylesheet">
  <!-- Multiselect -->
  <link href="/css/bootstrap-multiselect.css" rel="stylesheet">
  <!-- temBoard UI CSS -->
  <link href="/css/temboard.css" rel="stylesheet">
  <!-- Toggle -->
  <link href="/css/bootstrap-toggle.min.css" rel="stylesheet">
</head>
<body>
  <script>
    if (eval(localStorage.getItem('sidebarCollapsed'))) {
      document.body.className += 'sidebar-collapsed';
    }
  </script>
  <div id="modalError" /></div>
  <div>
    <script src="/js/jquery-2.1.4.min.js"></script>
    <script src="/js/popper.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <!-- Custom Theme JavaScript -->
    <script src="/js/sb-admin-2.js"></script>
    {% if nav %}
    <!-- Navigation -->
    <div class="navbar bg-primary navbar-dark navbar-static-top navbar-expand sticky-top">
      <div class="collapse navbar-collapse">
        {% if globals().has_key('instance') %}
        <a class="navbar-brand ml-3 mr-0" href id="menu-collapse">
          <i class="fa fa-bars"></i>
        </a>
        {% end %}
        <a class="navbar-brand mr-auto" href="/home">
          <img id="logo" src="/images/temboard-150x32-w.png" />
        </a>
        {% if globals().has_key('instance') %}
        <div class="navbar-text mr-auto">
          <b>
            {{instance.hostname}}
          </b>
        </div>
        {% end %}
        <ul class="navbar-nav">
          {% try %}
          {% if role.is_admin %}
          <li class="{{'active' if globals().get('request') and 'settings' in request.uri else ''}} nav-item">
            <a href="/settings/instances"
               data-toggle="tooltip"
               data-placement="bottom"
               class="nav-link"
               title="Manage instances and users">
              <i class="fa fa-wrench"></i>
              Settings
            </a>
          </li>
          {% end %}
          <li class="dropdown nav-item">
            <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
              <i class="fa fa-user"></i>
              <span class="caret"></span>
            </a>
            <div class="dropdown-menu dropdown-menu-right">
              <h6 class="dropdown-header">Signed in as <b>{{role.role_name}}</b></h6>
              <span role="separator" class="dropdown-divider"></span>
              <a class="dropdown-item" href="/logout"><i class="fa fa-sign-out"></i> Logout</a>
            </div>
          </li>
          {% except %}
          {% end %}
        </ul>
      </div>
    </div>
    {% end %}

    {% if globals().has_key('instance') %}
    <div class="container-fluid">
      <div class="row">
        <div class="sidebar sidebar-fixed-width col-lg-3 bg-light">
          <div class="sidebar-sticky pt-3 d-flex flex-column">
            <ul class="nav nav-pills flex-column">
              {% set plugin_names = [plugin.plugin_name for plugin in instance.plugins] %}
              {% set plugin = globals().get('plugin', None) %}
              {% if 'dashboard' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/dashboard"
                   class="{{'active' if plugin == 'dashboard' else ''}} nav-link">
                  <i class="fa fa-dashboard fa-fw"></i>
                  <span>Dashboard</span>
                </a>
              </li>
              {% end %}
              {% if 'activity' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/activity/running"
                   class="{{'active' if plugin == 'activity' else ''}} nav-link">
                  <i class="fa fa-bars fa-fw"></i>
                  <span>Activity</span>
                </a>
              </li>
              {% end %}
              {% if 'monitoring' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/monitoring"
                   class="{{'active' if plugin == 'monitoring' else ''}} nav-link">
                  <i class="fa fa-bar-chart-o fa-fw"></i>
                  <span>Monitoring</span>
                </a>
              </li>
              {% end %}
              {% if 'monitoring' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/alerting"
                   class="{{'active' if plugin == 'alerting' else ''}} nav-link">
                  <i class="fa fa-heart fa-fw"></i>
                  <span>Status</span>
                </a>
              </li>
              {% end %}
              {% if 'pgconf' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/pgconf/configuration"
                   class="{{'active' if plugin == 'pgconf' else ''}} nav-link">
                  <i class="fa fa-cog fa-fw"></i>
                  <span>Configuration</span>
                </a>
              </li>
              {% end %}
              {% if 'maintenance' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/maintenance"
                   class="{{'active' if plugin == 'maintenance' else ''}} nav-link">
                  <i class="fa fa-wrench fa-fw"></i>
                  <span>Maintenance</span>
                </a>
              </li>
              {% end %}
              {% if 'statements' in plugin_names %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/statements"
                   class="{{'active' if plugin == 'statements' else ''}} nav-link">
                  <i class="fa fa-tasks fa-fw"></i>
                  <span>Statements</span>
                </a>
              </li>
              {% end %}
              <li class="nav-item">
                <a href="/server/{{instance.agent_address}}/{{instance.agent_port}}/notifications"
                   class="{{'active' if plugin == 'notifications' else ''}} nav-link">
                  <i class="fa fa-envelope fa-fw"></i>
                  <span>Notifications</span>
                </a>
              </li>
            </ul>
            <div class="info mt-auto">
              <b>
                {{instance.hostname}}
              </b>
              <p>
              {% for group in instance.groups %}
              <span class="badge border text-muted">
                {{group.group_name}}
              </span>&nbsp;
              {% end %}
              </p>
              <table class="table table-sm table-no-margin small">
                <tr><td>Host: </td><td class="text-right">{{instance.agent_address}}</td></tr>
                <tr>
                  <td>Data: </td>
                  <td class="text-right auto-width">
                    <div title="{{instance.pg_data}}">
                      {{instance.pg_data}}
                    </div>
                  </td>
                </tr>
                <tr><td>Port: </td><td class="text-right">{{instance.pg_port}}</td></tr>
                <tr>
                  <td>Version: </td>
                  <td class="text-right">{{instance.pg_version_summary or instance.pg_version}}</td>
                </tr>
              </table>
              {% try %}
              {% if agent_username %}
              <small class="text-muted">Logged in as <strong>{{agent_username}}</strong></small>
              {% end %}
              {% except %}
              <small class="text-muted">Not logged in</small>
              {% end %}
            </div>
          </div>
        </div>
        <div class="main ml-auto p-3 position-relative">
          {% block content %} {% end %}
        </div>
      </div>
    </div>
    {% else %}
    <div class="container-fluid pt-3">
      {% block content %} {% end %}
    </div>
    {% end %} {# end if instance #}
  </div>
  <script>
  // Popover activation
  $(document).ready(function() {
    $(function () {
      $('[data-toggle="popover"]').popover()
    })
    $(function () {
      $('[data-toggle="tooltip"]').tooltip()
    })
  });
  </script>
</body>
</html>
