{% extends "base.html" %}

{% block title %}
  Select Data Set to Audit
{% endblock %}

{% block description %}
  Try out the toolkit using your own data containg predictions and protected attributes to audit bias and fairness. Or audit out one of our sample data sets.
{% endblock %}

{% block flow %}
      <img src="/static/images/flow-1.png" width="60%" class="img-fluid center-block">
{% endblock %}


{% block content %}


      <div class='alerts'>
        <ul class="list-unstyled">
          {% for (category, message) in get_flashed_messages(True) %}
            <li class="alert-{{ category }}">{{ message }}</li>
          {% endfor %}
        </ul>
      </div>


      <div class='row'>
        <div class='col-sm-6' >
        <h3 style="color:#b37d4e">Try auditing a sample data set </h3>
        <div class="jumbotron" >
              <a class='big-font' href="{{ url_for('audit_sample', name='sample1') }}">COMPAS Recidivism Risk Assessment Data</a>
              <br>
              <a class='about-data' href="https://www.propublica.org/datastore/dataset/compas-recidivism-risk-score-data-and-analysis"> [About the Data]</a>
              <br>
              <br>
              <a class='big-font' href="{{ url_for('audit_sample', name='sample2') }}">US Adult Income Data</a>
              <br>
              <a class='about-data' href="https://archive.ics.uci.edu/ml/datasets/adult"> [About the Data]</a>
              <br>
              <br>
              <br>
        </div>
        </div>

        <div class='col-sm-6'>
          <h3 style="color:#b37d4e"> Or audit your own data</h3>
          <div style="background:#B37D4E" class="jumbotron">
            <form align="center" method=post enctype=multipart/form-data action="{{ url_for('upload_file') }}">
                <input type=file name=file>
                <input class="btn btn-primary" type=submit value=Upload>
            </form>
            <br>
            <div class='big-font'> See below for information on how to format input data. </div>
            <div class='about-data'>
            Data you upload is used to generate the audit report. While the data is deleted, we host the audit report in perpitutity.
            If your data is private and sensitive, we encourage you to use the <a href="https://dssg.github.io/aequitas/30_seconds_webapp.html"> desktop version </a> of the
            audit tool</div>.
            </p>
          </div>
        </div>
      </div>
  <div class='row'>

      <div class='col-sm-4'>
        <h3 style=" color:#b37d4e"> Example input data</h3>
      <p> The data file is a CSV with the following columns: </p>
      <ul>
        <li>
            "score" column - binary assessments (0 or 1 for each row) made by the predictive model (1
            denotes the individuals selected for the intervention)
        </li>
        <li>
            "label_value" column - true binary outcomes for each individual (0 or 1 for each row) if
            you want to audit bias based on disparate errors
        </li>
        <li>
          attribute columns - contain attributes you want to audit for bias (column names are user defined, e.g. age, race, citizenship_status)
        </li>
     </ul>

     Extraneous columns will interfer with the bias report. For further clarification, please <a href="https://dssg.github.io/aequitas/input_data.html"> see
      the documentation</a>
    </div>
    <div class='col-sm-8'>
      <img src= {{ url_for('static', filename = 'images/webapp_input.png') }} alt="webapp input" title="example_input_data" border="0">
    </div>
</div>

{% endblock %}
