{% extends 'dashboard_base.html' %}

{% block header %}
  <h1>{% block title %}Configurations{% endblock %}</h1>
{% endblock %}

{% block content %}

   <form class="form-horizontal" action="/action_page.php">
      <div class="panel">
         <div class="panel-body">
         <div class="col-sm-1">
            <button type="button" class="btn btn-default"><span class="fas fa-save"></span> Save</button>
         </div>
         <div class="col-sm-1">
            <button type="button" class="btn btn-default"><span class="fas fa-paper-plane"></span> Run</button>
         </div>
         <div class="col-sm-1">
            <button type="button" class="btn btn-default"><span class="fas fa-times"></span> Stop</button>
         </div>
         </div>
      </div>

      <div class="panel panel-default">
         <div class="panel-heading" data-toggle="collapse" data-target="#general_conf">
         <span style="font-weight: bold;">General Configurations</span>
         </div>
         <div id="general_conf" class="well collapse panel-body">
         <div class="form-group">
            <label class="control-label col-sm-2">Programming Language:</label>
            <div class="col-sm-10">
               <select class="form-control" id="programmingLang">
               <option>--select programming language --</option>
               <option>c</option>
               <option>c++</option>
               <option>c/c++</option>
               <option>java</option>
               <option>javascript</option>
               <option>python</option>
               </select>
            </div>
         </div>
         <div class="form-group">
            <label class="control-label col-sm-2">Output Folder Location:</label>
            <div class="col-sm-8">
               <input class="form-control" id="inputdefault" type="text" placeholder="path to output folder on server">
               <!--<p class="form-control-static">/path/to/repodir/on/server</p>-->
            </div>
            <div></div>
            <div class="col-sm-1">
               <button type="button" class="btn btn-default">Browse</button>
            </div>
         </div>
         </div>
      </div>
      <div class="panel panel-default">
         <div class="panel-heading" data-toggle="collapse" data-target="#controller_conf">
         <span style="font-weight: bold;">Controller Configurations</span>
         </div>
         <div id="controller_conf" class="well collapse panel-body">
         <h4>Dashboard</h4>
         <p>Some text..</p>
         </div>
      </div>
      <div class="panel panel-default">
         <div class="panel-heading" data-toggle="collapse" data-target="#repository_conf">
         <span style="font-weight: bold;">Repository Configurations</span>
         </div>
         <div id="repository_conf" class="well collapse panel-body">
         <div class="form-group">
            <label class="control-label col-sm-2">Repository Location:</label>
            <div class="col-sm-8">
               <input class="form-control" id="inputdefault" type="text" placeholder="path to repository directory on server">
               <!--<p class="form-control-static">/path/to/repodir/on/server</p>-->
            </div>
            <div></div>
            <div class="col-sm-1">
               <button type="button" class="btn btn-default">Upload Zip</button>
            </div>
            <div class="col-sm-1">
               <button type="button" class="btn btn-default">Browse</button>
            </div>
         </div>
         </div>
      </div>
      <div class="panel panel-default">
         <div class="panel-heading" data-toggle="collapse" data-target="#tools_conf">
         <span style="font-weight: bold;">Tools Configurations</span>
         </div>
         <div id="tools_conf" class="well collapse panel-body">
         <h4>Dashboard</h4>
         <p>Some text..</p>
         </div>
      </div>
      <div class="panel panel-default">
         <div class="panel-heading" data-toggle="collapse" data-target="#reporting_conf">
         <span style="font-weight: bold;">Reporting Configurations</span>
         </div>
         <div id="reporting_conf" class="well collapse panel-body">
         <h4>Dashboard</h4>
         <p>Some text..</p>
         </div>
      </div>
      <!--
      <div class="row">
         <div class="col-sm-3">
         <div class="well">
            <h4>Users</h4>
            <p>1 Million</p> 
         </div>
         </div>
         <div class="col-sm-3">
         <div class="well">
            <h4>Pages</h4>
            <p>100 Million</p> 
         </div>
         </div>
         <div class="col-sm-3">
         <div class="well">
            <h4>Sessions</h4>
            <p>10 Million</p> 
         </div>
         </div>
         <div class="col-sm-3">
         <div class="well">
            <h4>Bounce</h4>
            <p>30%</p> 
         </div>
         </div>
      </div>
      <div class="row">
         <div class="col-sm-4">
         <div class="well">
            <p>Text</p> 
            <p>Text</p> 
            <p>Text</p> 
         </div>
         </div>
         <div class="col-sm-4">
         <div class="well">
            <p>Text</p> 
            <p>Text</p> 
            <p>Text</p> 
         </div>
         </div>
         <div class="col-sm-4">
         <div class="well">
            <p>Text</p> 
            <p>Text</p> 
            <p>Text</p> 
         </div>
         </div>
      </div>
      <div class="row">
         <div class="col-sm-8">
         <div class="well">
            <p>Text</p> 
         </div>
         </div>
         <div class="col-sm-4">
         <div class="well">
            <p>Text</p> 
         </div>
         </div>
      </div>
      -->
   </form>

{% endblock %}