{% extends "base.html.j2" %}
{% from "services/_breadcrumbs.html.j2" import breadcrumbs with context %}

{% block main_attribs %} class="nopaque-service-scheme" data-service="corpus-analysis"{% endblock main_attribs %}

{% block page_content %}
<div class="container">
  <div class="row">
    <div class="col s12">
      <h1 id="title">{{ title }}</h1>
    </div>

    <div class="col s12 m3 push-m9">
      <div class="center-align">
        <a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light" style="transform: scale(2);">
          <i class="nopaque-icon nopaque-service-color darken nopaque-service-icon" data-service="corpus-analysis"></i>
        </a>
      </div>
    </div>

    <div class="col s12 m9 pull-m3">
      <p>Nopaque lets you create and upload as many text corpora as you want. It makes use of CQP Query Language, which allows for complex search requests with the aid of metadata and NLP tags. The results can either be displayed as text or abstract visualizations.</p>
    </div>

    <div class="col s12 nopaque-ressource-list" data-ressource-type="Corpus" data-user-id="{{ current_user.hashid }}" id="corpora">
      <h2>My Corpora</h2>
      <div class="card">
        <div class="card-content">
          <div class="input-field">
            <i class="material-icons prefix">search</i>
            <input id="search-corpus" class="search" type="search"></input>
            <label for="search-corpus">Search corpus</label>
          </div>
          <table class="highlight">
            <thead>
              <tr>
                <th></th>
                <th>Title and Description</th>
                <th>Status</th>
                <th></th>
              </tr>
            </thead>
            <tbody class="list"></tbody>
          </table>
          <ul class="pagination"></ul>
        </div>
        <div class="card-action right-align">
          <a class="waves-effect waves-light btn" href="{{ url_for('corpora.import_corpus') }}"><i class="material-icons right">import_export</i>Import Corpus</a>
          <a class="btn waves-effect waves-light" href="{{ url_for('corpora.add_corpus') }}">New corpus<i class="material-icons right">add</i></a>
        </div>
      </div>
    </div>

    <div class="col s12 nopaque-ressource-list" data-ressource-type="QueryResult" data-user-id="{{ current_user.hashid }}" id="query-results">
      <h2>My query results</h2>
      <div class="card">
        <div class="card-content">
          <div class="input-field">
            <i class="material-icons prefix">search</i>
            <input id="search-query-results" class="search" type="search"></input>
            <label for="search-query-results">Search query result</label>
          </div>
          <table class="highlight">
            <thead>
              <tr>
                <th>Title and Description</th>
                <th>Corpus and Query</th>
                <th></th>
              </tr>
            </thead>
            <tbody class="list"></tbody>
          </table>
          <ul class="pagination"></ul>
        </div>
        <div class="card-action right-align">
          <a class="btn waves-effect waves-light disabled">Add query result<i class="material-icons right">file_upload</i></a>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock page_content %}