Merge branch 'development' of gitlab.ub.uni-bielefeld.de:sfb1288inf/opaque into development

app/main/forms.py

+from flask_wtf import FlaskForm
+from wtforms import DecimalField, StringField, SubmitField, TextAreaField
+from wtforms.validators import DataRequired, Email, Length, NumberRange
+
+
+class FeedbackForm(FlaskForm):
+    email = StringField('Email', validators=[DataRequired(), Email()])
+    feedback = TextAreaField('Feedback', validators=[Length(0, 255)])
+    like_range = DecimalField('How would you rate nopaque?',
+                              validators=[DataRequired(),
+                                          NumberRange(min=1, max=10)])
+    submit = SubmitField('Send feedback')

app/main/views.py

+from app import logger
 from app.auth.forms import LoginForm
 from app.models import User
 from flask import flash, redirect, render_template, url_for
 from flask_login import login_required, login_user
 from . import main
+from .forms import FeedbackForm
 
 
 @main.route('/', methods=['GET', 'POST'])
@@ -26,6 +28,18 @@ def dashboard():
     return render_template('main/dashboard.html.j2', title='Dashboard')
 
 
+@main.route('/feedback', methods=['GET', 'POST'])
+@login_required
+def feedback():
+    feedback_form = FeedbackForm(prefix='feedback-form')
+    if feedback_form.validate_on_submit():
+        logger.warning(feedback_form.email)
+        logger.warning(feedback_form.feedback)
+        logger.warning(feedback_form.like_range)
+    return render_template('main/feedback.html.j2',
+                           feedback_form=feedback_form, title='Feedback')
+
+
 @main.route('/poster', methods=['GET', 'POST'])
 def poster():
     login_form = LoginForm(prefix='login-form')

app/templates/auth/login.html.j2

@@ -26,8 +26,8 @@
 <div class="col s12 m8">
   <div class="card medium">
     <form method="POST">
+      {{ login_form.hidden_tag() }}
       <div class="card-content">
-        {{ login_form.hidden_tag() }}
         <div class="input-field">
           <i class="material-icons prefix">person</i>
           {{ login_form.user(class='validate') }}

app/templates/auth/register.html.j2

@@ -24,8 +24,8 @@
 <div class="col s12 m8">
   <div class="card medium">
     <form method="POST">
+      {{ registration_form.hidden_tag() }}
       <div class="card-content">
-        {{ registration_form.hidden_tag() }}
         <div class="input-field">
           <i class="material-icons prefix">person</i>
           {{ registration_form.username(class='validate', data_length='64') }}
@@ -50,7 +50,7 @@
             <span class="helper-text red-text">{{ error }}</span>
           {% endfor %}
         </div>
-        <div class="input-field ">
+        <div class="input-field">
           <i class="material-icons prefix">email</i>
           {{ registration_form.email(class='validate', type='email') }}
           {{ registration_form.email.label }}

app/templates/auth/reset_password.html.j2

@@ -9,8 +9,8 @@
 <div class="col s12 m8">
   <div class="card">
     <form method="POST">
+      {{ reset_password_form.hidden_tag() }}
       <div class="card-content">
-        {{ reset_password_form.hidden_tag() }}
         <div class="input-field">
           {{ reset_password_form.password(class='validate') }}
           {{ reset_password_form.password.label }}

app/templates/auth/reset_password_request.html.j2

@@ -8,8 +8,8 @@
 <div class="col s12 m8">
   <div class="card">
     <form method="POST">
+      {{ reset_password_request_form.hidden_tag() }}
       <div class="card-content">
-        {{ reset_password_request_form.hidden_tag() }}
         <div class="input-field">
           {{ reset_password_request_form.email(class='validate', type='email') }}
           {{ reset_password_request_form.email.label }}

app/templates/corpora/add_corpus.html.j2

@@ -9,8 +9,8 @@
 <div class="col s12 m8">
   <div class="card">
     <form method="POST">
+      {{ add_corpus_form.hidden_tag() }}
       <div class="card-content">
-        {{ add_corpus_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 m4">
             <div class="input-field">

app/templates/corpora/add_corpus_file.html.j2

@@ -9,10 +9,10 @@
 
 <div class="col s12 m8">
   <form method="POST" enctype="multipart/form-data">
-  <div class="card">
+    {{ add_corpus_file_form.hidden_tag() }}
+    <div class="card">
       <div class="card-content">
         <span class="card-title">Required metadata</span>
-        {{ add_corpus_file_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 m4">
             <div class="input-field">

app/templates/corpora/edit_corpus_file.html.j2

@@ -9,9 +9,9 @@
 
 <div class="col s12 m8">
   <form method="POST">
-  <div class="card">
+    {{ edit_corpus_file_form.hidden_tag() }}
+    <div class="card">
       <div class="card-content">
-        {{ edit_corpus_file_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 m4">
             <div class="input-field">

app/templates/main/feedback.html.j2

+{% extends "nopaque.html.j2" %}
+
+{% block page_content %}
+
+<div class="col s12">
+  <div class="card">
+    <form method="POST">
+      {{ feedback_form.hidden_tag() }}
+      <div class="card-content">
+        <p class="range-field">
+          {{ feedback_form.like_range.label }}
+          {{ feedback_form.like_range(class='validate', type='range', min=1, max=10) }}
+        </p>
+        <div class="input-field">
+          <i class="material-icons prefix">email</i>
+          {{ feedback_form.email(class='validate', type='email') }}
+          {{ feedback_form.email.label }}
+          {% for error in feedback_form.email.errors %}
+            <span class="helper-text red-text">{{ error }}</span>
+          {% endfor %}
+        </div>
+        <div class="input-field">
+          <i class="material-icons prefix">mode_edit</i>
+          {{ feedback_form.feedback(class='materialize-textarea', data_length=255) }}
+          {{ feedback_form.feedback.label }}
+        </div>
+      </div>
+      <div class="card-action right-align">
+        {{ macros.submit_button(feedback_form.submit) }}
+      </div>
+    </form>
+  </div>
+</div>
+
+{% endblock %}

app/templates/main/poster.html.j2

@@ -163,9 +163,9 @@
           <div class="col s12">
             <div class="card">
               <form method="POST">
+                {{ login_form.hidden_tag() }}
                 <div class="card-content">
                   <span class="card-title">Registration and Log in</span>
-                  {{ login_form.hidden_tag() }}
                   <div class="input-field">
                     <i class="material-icons prefix">person</i>
                     {{ login_form.user(class='validate') }}

app/templates/main/poster2.html.j2

-{% extends "nopaque.html.j2" %}
-
-{% block page_content %}
-<style>
-  input::placeholder {
-    color: black;
-    font-style: italic;
-  }
-</style>
-
-<div class="col s9">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title"><i class="material-icons left">burst_mode</i>File Setup</span>
-      <p>
-        Häufig liegen Digitalisate textueller Foschungsdaten (Bücher, Briefe etc.) in mehreren Dateien und Formaten vor. Nopaque ermöglicht die Konvertierung und Zusammenfassung in ein einheitliches Datenformat, was eine vereinfachte Weiterverarbeitung mit weiteren Services ermöglicht.
-      </p>
-      <div class="row">
-        <div class="col s9">
-          <div class="file-field input-field">
-            <div class="btn">
-              <span>File</span>
-              <input type="file" multiple>
-            </div>
-            <div class="file-path-wrapper">
-              <input class="file-path validate" type="text" placeholder="Bilder, Fotos, Scans&hellip;">
-            </div>
-          </div>
-        </div>
-        <div class="col s3 right-align">
-          <p>&nbsp;</p>
-          <button class="btn waves-effect waves-light"type="submit">Submit<i class="material-icons right">send</i></button>
-        </div>
-      </div>
-    </div>
-  </div>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s3">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title">Ausgabe</span>
-      <p>Nach Eingabeateinamen sortierte Multipage-TIFF-Dateien.</p>
-    </div>
-  </div>
-  <p>
-    <blockquote>
-      Umgesetzt mit <i>ImageMagick</i><br>
-      als Docker Swarm Service
-    </blockquote>
-  </p>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s12"></div>
-
-<div class="col s9">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title"><i class="material-icons left">find_in_page</i>Optical Character Recognition</span>
-      <p>
-        Durch optische Analysemethoden werden aus Bilddaten, wie Fotos oder
-        Scans, Textdateien erzeugt. Erst dieser Vorverarbeitungsschritt
-        ermöglicht eine weitere computergestützte Verarbeitung von Dokumenten.
-      </p>
-      <div class="row">
-        <div class="col s9">
-          <div class="file-field input-field">
-            <div class="btn">
-              <span>File</span>
-              <input type="file" multiple>
-            </div>
-            <div class="file-path-wrapper">
-              <input class="file-path validate" type="text" placeholder="Multipage-TIFF- oder PDF-Dateien">
-            </div>
-          </div>
-        </div>
-        <div class="col s3 right-align">
-          <p>&nbsp;</p>
-          <button class="btn waves-effect waves-light"type="submit">Submit<i class="material-icons right">send</i></button>
-        </div>
-      </div>
-    </div>
-  </div>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s3">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title">Ausgabe</span>
-      <p>
-        Textdateien, PDF-Dateien und TEI P5 konforme XML-Dateien.
-      </p>
-    </div>
-  </div>
-  <p>
-    <blockquote>
-      Pipelineumsetzung mit <i>Tesseract OCR</i><br>
-      als Docker Swarm Service
-    </blockquote>
-  </p>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s12"></div>
-
-<div class="col s9">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title"><i class="material-icons left">format_textdirection_l_to_r</i>Natural Language Processing</span>
-      <p>
-        Mit Hilfe computergestützter linguistischer Datenverarbeitungsmethoden
-        (Tokenisierung, Lemmatisierung, Part-of-speech-Tagging und
-        Eigennamenerkennung) werden Textdateien mit weiteren Informationen ausgezeichnet.
-      </p>
-      <div class="row">
-        <div class="col s9">
-          <div class="file-field input-field">
-            <div class="btn">
-              <span>File</span>
-              <input type="file" multiple>
-            </div>
-            <div class="file-path-wrapper">
-              <input class="file-path validate" type="text" placeholder="Textdateien">
-            </div>
-          </div>
-        </div>
-        <div class="col s3 right-align">
-          <p>&nbsp;</p>
-          <button class="btn waves-effect waves-light"type="submit">Submit<i class="material-icons right">send</i></button>
-        </div>
-      </div>
-    </div>
-  </div>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s3">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title">Ausgabe</span>
-      <p>Korpusdateien im <i>verticalized text</i>-Format (XML-Dialekt, Ähnelt CoNLL).</p>
-    </div>
-  </div>
-  <p>
-    <blockquote>
-      Pipelineumsetzung mit <i>spaCy</i><br>
-      als Docker Swarm Service
-    </blockquote>
-  </p>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s12"></div>
-
-<div class="col s9">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title"><i class="material-icons left">search</i>Corpus Analysis</span>
-      <p>
-        Mittels CQP Query Language können komplexe Suchanfragen unter
-        Zuhilfenahme von Metadaten und NLP-Auszeichnungen an eigens erstellte
-        Korpora gestellt werden. Ergebnisse können als Text oder in abstrakter Darstellung ausgewertet werden.
-      </p>
-      <div class="input-field">
-        <i class="material-icons prefix">search</i>
-        <input class="search" placeholder='"fox" "jumps" "over" []* "dog"' type="search"></input>
-      </div>
-      <i class="material-icons left" style="padding-left: 10px;">subdirectory_arrow_right</i>
-      <p>
-        <span class="chip">The | DET</span>
-        <span class="chip">quick | ADJ</span>
-        <span class="chip">brown | ADJ</span>
-        <span class="chip light-green">fox | PROPN</span>
-        <span class="chip light-green">jumps | VERB</span>
-        <span class="chip light-green">over | ADP</span>
-        <span class="chip light-green">the | DET</span>
-        <span class="chip light-green">lazy | ADJ</span>
-        <span style="padding-left:48px;">
-          <span class="chip light-green" id="tooltipped">dog | NOUN</span>
-        </span>
-        <span class="chip">. | PUNCT</span>
-      </p>
-    </div>
-  </div>
-  <br>
-  <br>
-  <br>
-</div>
-
-<div class="col s3">
-  <div class="card">
-    <div class="card-content">
-      <span class="card-title">Ausgabe</span>
-      <p>
-        Export der Ergebnisse in JSON. (Zunkünftig angedacht: CSV, Excel und
-        HTML)
-      </p>
-    </div>
-  </div>
-  <p>
-    <blockquote>
-      Umgesetzt mit <i>IMS Open Corpus Workbench</i><br>
-      als lokaler Docker-Container
-    </blockquote>
-  </p>
-</div>
-
-<div class="col s12">
-  <p>&nbsp;</p>
-  <p>&nbsp;</p>
-  <p>&nbsp;</p>
-  <p>&nbsp;</p>
-</div>
-
-<script>
-  // document.addEventListener("DOMContentLoaded", function() {
-  //   tooltippedElement = document.getElementById("tooltipped");
-  //   tooltip = M.Tooltip.init(
-  //     tooltippedElement,
-  //     {"html": `<table>
-  //                 <tr>
-  //                   <th>Token information</th>
-  //                   <th>Source information</th>
-  //                 </tr>
-  //                 <tr>
-  //                   <td class="left-align">
-  //                     Word: dog<br>
-  //                     Lemma: dog<br>
-  //                     POS: NN<br>
-  //                     Simple POS: NOUN<br>
-  //                     NER: NULL
-  //                   </td>
-  //                   <td class="left-align">
-  //                     Title: Current Notes<br>
-  //                     Author: Unknown<br>
-  //                     Publishing year: 1885
-  //                   </td>
-  //                 </tr>
-  //               </table>`,
-  //      "inDuration": 1500,
-  //      "margin": 15,
-  //      "position": "bottom",
-  //      "transitionMovement": 0}
-  //   );
-  //   tooltip.open();
-  // });
-  //DarkReader.enable({"brightness": 100, "contrast": 100, "sepia": 0});
-</script>
-{% endblock %}

app/templates/nopaque.html.j2

@@ -59,7 +59,7 @@
             <a href="#" data-target="sidenav-main" class="sidenav-trigger"><i class="material-icons">menu</i></a>
             {% endif %}
             <ul class="right">
-              <li><a id="nav-notifications" class="dropdown-trigger no-autoinit" href="#!" data-target="nav-notifications-dropdown"><i class="material-icons">notifications</i></a></li>
+              <!--<li><a id="nav-notifications" class="dropdown-trigger no-autoinit" href="#!" data-target="nav-notifications-dropdown"><i class="material-icons">notifications</i></a></li>-->
               <li>
                 <a id="nav-account" class="dropdown-trigger no-autoinit" href="#!" data-target="nav-account-dropdown">
                   {% if current_user.is_authenticated %}

app/templates/profile/settings.html.j2

@@ -7,9 +7,9 @@
 <div class="col s12 m8">
   <br class="hide-on-small-only">
   <div class="card">
-    <div class="card-content">
-      <form method="POST">
-        {{ edit_general_settings_form.hidden_tag() }}
+    <form method="POST">
+      {{ edit_general_settings_form.hidden_tag() }}
+      <div class="card-content">
         <div class="row">
           <div class="col s9">
             <p><i class="material-icons left">brightness_3</i>{{ edit_general_settings_form.dark_mode.label.text }}</p>
@@ -48,8 +48,8 @@
   <br class="hide-on-small-only">
   <div class="card">
     <form method="POST">
+      {{ edit_password_form.hidden_tag() }}
       <div class="card-content">
-        {{ edit_password_form.hidden_tag() }}
         <div class="input-field ">
           <i class="material-icons prefix">vpn_key</i>
           {{ edit_password_form.current_password() }}
@@ -93,8 +93,8 @@
   <br class="hide-on-small-only">
   <div class="card">
     <form method="POST">
+      {{ edit_email_form.hidden_tag() }}
       <div class="card-content">
-        {{ edit_email_form.hidden_tag() }}
         <div class="input-field">
           <i class="material-icons prefix">mail</i>
           {{ edit_email_form.email() }}

app/templates/services/nlp.html.j2

@@ -44,8 +44,8 @@
   <h3>Submit a job</h3>
   <div class="card">
     <form class="nopaque-job-form" data-progress-modal="progress-modal">
+      {{ add_job_form.hidden_tag() }}
       <div class="card-content">
-        {{ add_job_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 l4">
             <div class="input-field">

app/templates/services/ocr.html.j2

@@ -26,8 +26,8 @@
   <h3>Submit a job</h3>
   <div class="card">
     <form class="nopaque-job-form" data-progress-modal="progress-modal">
+      {{ add_job_form.hidden_tag() }}
       <div class="card-content">
-        {{ add_job_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 l4">
             <div class="input-field">

app/templates/services/setup_files.html.j2

@@ -26,8 +26,8 @@
   <h3>Submit a job</h3>
   <div class="card">
     <form class="nopaque-job-form" data-progress-modal="progress-modal">
+      {{ add_job_form.hidden_tag() }}
       <div class="card-content">
-        {{ add_job_form.hidden_tag() }}
         <div class="row">
           <div class="col s12 l4">
             <div class="input-field">