<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>GCPDS | OpenBCI</title>


        <link rel="stylesheet" href="{{static_url("bootstrap-4.3.1-dist/css/bootstrap.min.css")}}">
        <link rel="stylesheet" href="{{static_url("styles/stylesheet.css")}}">

        <script src="{{static_url("jquery/jquery-3.4.1.slim.min.js")}}"></script>
        <script src="{{static_url("popper.js-1.16.0-dist/umd/popper.min.js")}}"></script>
        <script src="{{static_url("bootstrap-4.3.1-dist/js/bootstrap.min.js")}}"></script>

        <!--Bryhton-->
        <script src="{{static_url("Brython-3.8.6/brython.js")}}"></script>
        <script src="{{static_url("Brython-3.8.6/brython_stdlib.js")}}"></script>



        <script type="text/javascript">
          // Generated by CoffeeScript 2.0.0
          (function() {
            $(document).ready(function() {
              return brython(0);
            });

          }).call(this);
        </script>




      <script type="text/python">
      import sys

      sys.path.append("{{static_url("")}}")
      sys.path.append("{{static_url("Brython-3.8.6/Lib/")}}")

      import brython_app
      brython_app.OpenBCI_API()
      </script>


    </head>
    <body>

    <!--<h1>OpenBCI Raspberry AP</h1>-->


<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
  <a class="navbar-brand" href="#">OpenBCI API</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav ml-auto">
      <li class="nav-item">
        <a class="nav-link" href="https://openbci.com/">OpenBCI</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="https://openbci.readthedocs.io/en/latest/_notebooks/api.html">Documentation</a>
      </li>

    </ul>

  </div>
  </div>
</nav>



<div class="container openbciapi-container">

<!--<h1 class="bd-title" id="content">API Configuration</h1>-->




<div class="container">
  <div class="row">
    <div class="col-sm-8">


      <form>

        <div class="form-group row">
          <label class="col-sm-4 col-form-label">Raspberry IP address:</label>
          <div class="col-sm-8">
          <input type="text" class="form-control" id="input-ip_rasp" required pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$" value='192.168.1.1'>
          </div>
        </div>

        <div class="form-group row">
          <label class="col-sm-4 col-form-label">OpenBCI WiFi module IP:</label>
          <div class="col-sm-8">
          <input type="text" class="form-control" id="input-ip_wifi" required pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$" value='192.168.1.113'>
          </div>
        </div>

        <div class="form-group row">
          <label class="col-sm-4 col-form-label">Latency (in milliseconds):</label>
          <div class="col-sm-8">
          <input type="number" class="form-control" id="input-latency" required pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$" value='1000'>
          </div>
        </div>


      </form>


<!--<button class="btn btn-primary" id="btn-connect">Connect</button>-->
<!--<button class="btn btn-danger" id="btn-stop" style='display:none'>Stop</button>-->
<button type="button" class="btn btn-primary btn-block" id="btn-connect">Connect</button>
<button type="button" class="btn btn-danger btn-block" id="btn-stop" style='display:none'>Stop</button>
<!--<button type="button" class="btn btn-secondary btn-lg btn-block">Block level button</button>-->


    </div>
    <div class="col-sm-4">



      <ul class="list-group">
        <li class="list-group-item d-flex justify-content-between align-items-center">
          Current ID package
          <span class="badge badge-primary badge-pill" id='stream-id'>-5</span>
        </li>
        <!--<li class="list-group-item d-flex justify-content-between align-items-center">-->
          <!--Serial buffer-->
          <!--<span class="badge badge-primary badge-pill" id='stream-serial_buffer'>2</span>-->
        <!--</li>-->
        <li class="list-group-item d-flex justify-content-between align-items-center">
          EEG buffer
          <span class="badge badge-primary badge-pill" id='stream-eeg_buffer'>1</span>
        </li>
        <li class="list-group-item d-flex justify-content-between align-items-center">
          Pack buffer
          <span class="badge badge-primary badge-pill" id='stream-eeg_pack'>0</span>
        </li>
      </ul>


    </div>
  </div>

</div>






</div>


    </body>
</html>
