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

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

{% block page_content %}
<div class="container">
  <div class="row">
    <div class="col s12" data-corpus-id="{{ corpus.hashid }}" data-user-id="{{ corpus.user.hashid }}" id="corpus-display">
      <div class="row">
        <div class="col s8 m9 l10">
          <h1 id="title"><span class="corpus-title"></span></h1>
        </div>
        <div class="col s4 m3 l2 right-align">
          <p>&nbsp;</p>
          <p>&nbsp;</p>
          <span class="chip corpus-status corpus-status-color corpus-status-text white-text"></span>
          <div class="active preloader-wrapper small corpus-status-spinner">
            <div class="spinner-layer spinner-blue-only">
              <div class="circle-clipper left">
                <div class="circle"></div>
              </div>
              <div class="gap-patch">
                <div class="circle"></div>
              </div>
              <div class="circle-clipper right">
                <div class="circle"></div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="card service-color-border border-darken" data-service="corpus-analysis" style="border-top: 10px solid">
        <div class="card-content">
          <div class="row">
            <div class="col s12">
              <div class="input-field">
                <input class="corpus-description" disabled id="corpus-description" type="text">
                <label for="corpus-description">Description</label>
              </div>
            </div>

            <div class="col s12 m6">
              <div class="input-field">
                <input class="corpus-creation-date validate" disabled id="corpus-creation-date" type="text">
                <label for="corpus-creation-date">Creation date</label>
              </div>
            </div>

            <div class="col s12 m6">
              <div class="input-field">
                <input class="corpus-token-ratio validate" disabled id="corpus-token-ratio" type="text">
                <label for="corpus-token-ratio">Nr. of tokens used <sup><i class="material-icons tooltipped tiny" data-position="bottom" data-tooltip="Current number of tokens in this corpus. Updates after every analyze session.">help</i></sup></label>
              </div>
            </div>
          </div>
        </div>
        <div class="card-action right-align">
          <a class="btn corpus-analyse-trigger disabled waves-effect waves-light" href="{{ url_for('corpora.analyse_corpus', corpus_id=corpus.id) }}"><i class="material-icons left">search</i>Analyze</a>
          <a class="action-button btn disabled waves-effect waves-light" data-action="build-request"><i class="nopaque-icons left">K</i>Build</a>
          <a class="btn disabled export-corpus-trigger waves-effect waves-light" href="{{ url_for('corpora.export_corpus', corpus_id=corpus.id) }}"><i class="material-icons left">import_export</i>Export</a>
          <a class="action-button btn red waves-effect waves-light" data-action="delete-request"><i class="material-icons left">delete</i>Delete</a>
        </div>
      </div>
    </div>

    <div class="col s12">
      <div class="card">
        <div class="card-content">
          <span class="card-title" id="files">Corpus files</span>
          <div class="corpus-file-list" data-user-id="{{ corpus.user.hashid }}" data-corpus-id="{{ corpus.hashid }}"></div>
        </div>
        <div class="card-action right-align">
          <a href="{{ url_for('corpora.create_corpus_file', corpus_id=corpus.id) }}" class="btn waves-effect waves-light"><i class="material-icons left">add</i>Add corpus file</a>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock page_content %}

{% block scripts %}
{{ super() }}
<script>
  let corpusDisplay = new CorpusDisplay(document.querySelector('#corpus-display'));
</script>
{% endblock scripts %}
