{% extends "base.html.j2" %}
{% import "materialize/wtf.html.j2" as wtf %}
{% from "contributions/_breadcrumbs.html.j2" import breadcrumbs with context %}

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

      {# Tesseract OCR Models #}
      <div>
        <h3>My Tesseract OCR Pipeline Models</h3>
        <p>Here you can see and edit the models that you have created. You can also create new models.</p>

        <div class="row">
          <div class="col s12">
            <div class="card">
              <div class="card-content">
                <div id="tesseract-ocr-model-list" data-user-id="{{ userId }}">
                  <table>
                    <thead>
                      <tr>
                        <th>Title</th>
                        <th>Description</th>
                        <th>Biblio</th>
                        <th></th>
                      </tr>
                    </thead>
                    <tbody>
                      {% if tesseract_ocr_user_models|length > 0 %}
                        {% for m in tesseract_ocr_user_models %}
                          <tr id="tesseract-ocr-pipeline-model-{{ m.hashid }}">
                            <td>{{ m.title }}</td>
                            {% if m.description == '' %}
                            <td>Description is not available.</td>
                            {% else %}
                            <td>{{ m.description }}</td>
                            {% endif %}
                            <td><a href="{{ m.publisher_url }}">{{ m.publisher }}</a> ({{ m.publishing_year }}), {{ m.title }} {{ m.version}}, <a href="{{ m.publishing_url }}">{{ m.publishing_url }}</a></td>
                            <td class="right-align">
                              <a class="delete-button btn-floating red waves-effect waves-light" data-model-id="{{ m.hashid }}"><i class="material-icons">delete</i></a>
                              <a class="edit-button btn-floating service-color darken waves-effect waves-light" data-model-id="{{ m.hashid }}"><i class="material-icons">edit</i></a>
                            </td>
                          </tr>
                        {% endfor %}
                      {% else %}
                        <tr>
                          <td colspan="4">No models available.</td>
                        </tr>
                      {% endif %}
                    </tbody>
                  </table>
                </div>
              </div>
              <div class="card-action right-align">
                <a href="{{ url_for('contributions.add_tesseract_ocr_pipeline_model') }}" class="btn waves-effect waves-light"><i class="material-icons left">add</i>Add model file</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      
      {# spaCy NLP Models #}
      <div>
        <h3>My spaCy NLP Pipeline Models</h3>
        <p>Here you can see and edit the models that you have created. You can also create new models.</p>

        <div class="row">
          <div class="col s12">
            <div class="card">
              <div class="card-content">
                <div id="spacy-nlp-model-list" data-user-id="{{ userId }}" data-user-models="{{ spacy_nlp_user_models }}">
                  <table>
                    <thead>
                      <tr>
                        <th>Title</th>
                        <th>Description</th>
                        <th>Biblio</th>
                        <th></th>
                      </tr>
                    </thead>
                    <tbody>
                      {% if spacy_nlp_user_models|length > 0 %}
                        {% for m in spacy_nlp_user_models %}
                          <tr id="spacy_nlp-pipeline-model-{{ m.hashid }}">
                            <td>{{ m.title }}</td>
                            {% if m.description == '' %}
                            <td>Description is not available.</td>
                            {% else %}
                            <td>{{ m.description }}</td>
                            {% endif %}
                            <td><a href="{{ m.publisher_url }}">{{ m.publisher }}</a> ({{ m.publishing_year }}), {{ m.title }} {{ m.version}}, <a href="{{ m.publishing_url }}">{{ m.publishing_url }}</a></td>
                            <td class="right-align">
                              <a class="delete-spacy-model-button btn-floating red waves-effect waves-light" data-model-id="{{ m.hashid }}"><i class="material-icons">delete</i></a>
                              <a class="edit-spacy-model-button btn-floating service-color darken waves-effect waves-light" data-model-id="{{ m.hashid }}"><i class="material-icons">edit</i></a>
                            </td>
                          </tr>
                        {% endfor %}
                      {% else %}
                        <tr>
                          <td colspan="4">No models available.</td>
                        </tr>
                      {% endif %}
                    </tbody>
                  </table>
                </div>
              </div>
              <div class="card-action right-align">
                <a href="{{ url_for('contributions.add_spacy_nlp_pipeline_model') }}" class="btn waves-effect waves-light"><i class="material-icons left">add</i>Add model file</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock page_content %}

{% block scripts %}
{{ super() }}
<script>
const tesseractOCRModelList = new TesseractOCRModelList();
tesseractOCRModelList.init();
const spacyNLPModelList = new SpacyNLPModelList();
spacyNLPModelList.init();
</script>
{% endblock scripts %}