<div class="container-fluid">
  <div class="row">
    <div class="col-lg-12">
      <h3 class="page-header"><i class="fa fa-dashboard fa-fw"></i><span data-i18n="main_menu_dashboard_token">Dashboard</span></h3>

      <!-- Infobox -->
      <div id="dash_intro">

        <!-- Instance(s) -->
        <div class="row instances">

          <!-- Config status -->
          <div class="col-md-6 col-xxl-4">
            <div class="panel panel-default">
              <div class="panel-heading panel-system">
                <span id="dash_config_status">Status</span>
              </div>
              <div class="panel-body">
                <table class="table borderless">
                  <thead>
                    <tr>
                      <th colspan="3">
                        <i class="mdi mdi-camera"></i>
                        <span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span>
                      </th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td></td>
                      <td data-i18n="edt_conf_fg_heading_title">Screen-Grabber</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_screen_grabber">disabled</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemGrabber', 'editor_container_screengrabber')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="edt_conf_v4l2_heading_title">Video-Grabber</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_video_grabber">disabled</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemGrabber', 'editor_container_videograbber')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                  </tbody>
                </table>
                <table class="table borderless">
                  <thead>
                    <tr>
                      <th colspan="3">
                        <i class="mdi mdi-lan"></i>
                        <span data-i18n="dashboard_infobox_label_ports">Ports</span>
                      </th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_port_proto">proto</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_pbPort">unknown</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemNetwork', 'editor_container_protoserver')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_port_flat">flat</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_fbPort">unknown</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemNetwork', 'editor_container_fbserver')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_port_json">json</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_jsonPort">unknown</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemNetwork', 'editor_container_jsonserver')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_ports_websocket">websocket</td>
                      <td style="text-align: right; padding-right: 0">
                        <span id="dash_wsPorts">unknown</span>
                        <a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemWeb')" style="text-decoration: none; cursor: pointer"></a>
                      </td>
                    </tr>
                  </tbody>
                </table>
                <table class="table borderless">
                  <thead>
                    <tr>
                      <th colspan="3">
                        <i class="mdi mdi-numeric"></i>
                        <span data-i18n="about_version">Version</span>
                      </th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_currenthyp">Hyperion version:</td>
                      <td id="dash_currv" style="text-align: right">unknown</td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_watchedversionbranch">Watched version branch:</td>
                      <td id="dash_watchedversionbranch" style="text-align: right">unknown</td>
                    </tr>
                    <tr>
                      <td></td>
                      <td data-i18n="dashboard_infobox_label_latesthyp">Latest version:</td>
                      <td id="dash_latev" style="text-align: right">unknown</td>
                    </tr>
                  </tbody>
                </table>
                <hr>
                <span id="versioninforesult"></span>
              </div>
            </div>
          </div>

        </div>
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->
  </div>
  <!-- /.container-fluid -->

  <script src="/js/content_dashboard.js"></script>