Skip to content
Snippets Groups Projects
Commit fa2af2d8 authored by Patrick Jentsch's avatar Patrick Jentsch
Browse files

new poster

parent 18163400
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/main/views.py
+ 11
− 1
View file @ fa2af2d8
...@@ -28,4 +28,14 @@ def dashboard(): ...@@ -28,4 +28,14 @@ def dashboard():
@main.route('/poster') @main.route('/poster')
def poster(): def poster():
return render_template('main/poster.html.j2', title='nopaque: Dienste und Prozesse') login_form = LoginForm(prefix='login-form')
if login_form.validate_on_submit():
user = User.query.filter_by(username=login_form.user.data).first()
if user is None:
user = User.query.filter_by(email=login_form.user.data).first()
if user is not None and user.verify_password(login_form.password.data):
login_user(user, login_form.remember_me.data)
return redirect(url_for('main.dashboard'))
flash('Invalid email/username or password.')
return render_template('main/poster.html.j2', login_form=login_form,
title='nopaque: Dienste und Prozesse')
app/templates/main/poster.html.j2
+ 131
− 219
View file @ fa2af2d8
{% extends "nopaque.html.j2" %} {% extends "nopaque.html.j2" %}
{% block page_content %} {% set parallax = True %}
<style>
input::placeholder {
color: black;
font-style: italic;
}
</style>
<div class="col s9"> {% block page_content %}
<div class="card"> <div class="section">
<div class="card-content"> <div class="row container">
<span class="card-title"><i class="material-icons left">burst_mode</i>File Setup</span> <div class="col s12">
<p> <h2>nopaque</h2>
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>Patrick Jentsch, Stephan Porada und Helene Schlicht</p>
</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>
</div> </div>
<br>
<br>
<br>
</div> </div>
<div class="col s3"> <div class="parallax-container" style="height: 260px;">
<div class="card"> <div class="parallax">
<div class="card-content"> <img src="{{ url_for('static', filename='images/bible_text.jpg') }}" alt="">
<span class="card-title">Ausgabe</span>
<p>Nach Eingabeateinamen sortierte Multipage-TIFF-Dateien.</p>
</div>
</div> </div>
<p>
<blockquote>
Umgesetzt mit <i>ImageMagick</i><br>
als Docker Swarm Service
</blockquote>
</p>
<br>
<br>
<br>
</div> </div>
<div class="col s12"></div> <div class="section white scrollspy" id="information">
<div class="row container">
<div class="col s9"> <div class="col s12">
<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="row">
<div class="col s9"> <div class="col s12">
<div class="file-field input-field"> <h3>Why you should use nopaque</h3>
<div class="btn"> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
<span>File</span> </div>
<input type="file" multiple>
<div class="col s12">
<div class="row">
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">flash_on</i>
<p>Speeds up your work</p>
<p class="light">All tools provided by nopaque are carefully selected to provide a complete tool suite without delaying compatibility issues.</p>
</div>
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">cloud</i>
<p>Cloud infrastructure</p>
<p class="light">All computational work is processed within nopaques cloud infrastructure. You don't need to install any software, great right?</p>
</div> </div>
<div class="file-path-wrapper"> <div class="col s12 m6 l3 center-align">
<input class="file-path validate" type="text" placeholder="Multipage-TIFF- oder PDF-Dateien"> <i class="large material-icons" style="color: #ee6e73;">group</i>
<p>User friendly</p>
<p class="light">By utilizing elements and principles of Material Design, we were able to create a framework that focuses on User Experience.</p>
</div>
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">settings</i>
<p>Passt gut zum Prozess</p>
<p class="light">We have provided detailed documentation as well as specific code examples to help new users get started.</p>
</div> </div>
</div> </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> </div>
</div> </div>
<br>
<br>
<br>
</div> </div>
<div class="col s3"> <div class="parallax-container" style="height: 260px;">
<div class="card"> <div class="parallax">
<div class="card-content"> <img src="{{ url_for('static', filename='images/chapter_book_text_tale.jpg') }}" alt="">
<span class="card-title">Ausgabe</span>
<p>
Textdateien, PDF-Dateien und TEI P5 konforme XML-Dateien.
</p>
</div>
</div> </div>
<p>
<blockquote>
Pipelineumsetzung mit <i>Tesseract OCR</i><br>
als Docker Swarm Service
</blockquote>
</p>
<br>
<br>
<br>
</div> </div>
<div class="col s12"></div> <div class="section white scrollspy" id="services">
<div class="row container">
<div class="col s9"> <div class="col s12">
<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="row">
<div class="col s9"> <div class="col s12">
<div class="file-field input-field"> <h3>What can nopaque do for you</h3>
<div class="btn"> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
<span>File</span> </div>
<input type="file" multiple>
<div class="col s12">
<br class="hide-on-small-only">
<div class="row">
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">burst_mode</i>
<p>File setup</p>
<p class="light">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div> </div>
<div class="file-path-wrapper"> <div class="col s12 m6 l3 center-align">
<input class="file-path validate" type="text" placeholder="Textdateien"> <i class="large material-icons" style="color: #ee6e73;">find_in_page</i>
<p>Optical Character Recognition</p>
<p class="light">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">format_textdirection_l_to_r</i>
<p>Natural Language Processing</p>
<p class="light">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<div class="col s12 m6 l3 center-align">
<i class="large material-icons" style="color: #ee6e73;">search</i>
<p>Corpus analysis</p>
<p class="light">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div> </div>
</div> </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> </div>
</div> </div>
<br>
<br>
<br>
</div> </div>
<div class="col s3"> {% if current_user.is_anonymous %}
<div class="card"> <div class="parallax-container" style="height: 260px;">
<div class="card-content"> <div class="parallax">
<span class="card-title">Ausgabe</span> <img src="{{ url_for('static', filename='images/german_text_book_paper.jpg') }}" alt="">
<p>Korpusdateien im <i>verticalized text</i>-Format (XML-Dialekt, Ähnelt CoNLL).</p>
</div>
</div> </div>
<p>
<blockquote>
Pipelineumsetzung mit <i>spaCy</i><br>
als Docker Swarm Service
</blockquote>
</p>
<br>
<br>
<br>
</div> </div>
<div class="col s12"></div> <div class="section white scrollspy" id="registration-and-log-in">
<div class="row container">
<div class="col s12">
<div class="row">
<div class="col s12 m4">
<h3>Registration and log in</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
<a class="btn waves-effect waves-light" href="{{ url_for('auth.register') }}"><i class="material-icons left">person_add</i>Register</a>
</div>
<div class="col s9"> <div class="col s12 m8">
<div class="card"> <br class="hide-on-small-only">
<div class="card-content"> <div class="card">
<span class="card-title"><i class="material-icons left">search</i>Corpus Analysis</span> <form method="POST">
<p> <div class="card-content">
Mittels CQP Query Language können komplexe Suchanfragen unter <span class="card-title">Log in</span>
Zuhilfenahme von Metadaten und NLP-Auszeichnungen an eigens erstellte {{ login_form.hidden_tag() }}
Korpora gestellt werden. Ergebnisse können als Text oder in abstrakter Darstellung ausgewertet werden. <div class="input-field">
</p> <i class="material-icons prefix">person</i>
<div class="input-field"> {{ login_form.user(class='validate') }}
<i class="material-icons prefix">search</i> {{ login_form.user.label }}
<input class="search" placeholder='"fox" "jumps" "over" []* "dog"' type="search"></input> {% for error in login_form.user.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<div class="input-field">
<i class="material-icons prefix">vpn_key</i>
{{ login_form.password(class='validate') }}
{{ login_form.password.label }}
{% for error in login_form.password.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<div class="row" style="margin-bottom: 0;">
<div class="col s6 left-align">
<a href="{{ url_for('auth.reset_password_request') }}">Forgot your password?</a>
</div>
<div class="col s6 right-align">
<div class="switch">
<label>
Remember me
{{ login_form.remember_me() }}
<span class="lever"></span>
</label>
</div>
</div>
</div>
</div>
<div class="card-action right-align">
{{ macros.submit_button(login_form.submit) }}
</div>
</form>
</div>
</div>
</div> </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>
</div> </div>
<br>
<br>
<br>
</div> </div>
<div class="col s3"> <div class="parallax-container" style="height: 260px;">
<div class="card"> <div class="parallax">
<div class="card-content"> <img src="{{ url_for('static', filename='images/german_text_book_paper.jpg') }}" alt="">
<span class="card-title">Ausgabe</span>
<p>
Export der Ergebnisse in JSON. (Zunkünftig angedacht: CSV, Excel und
HTML)
</p>
</div>
</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> </div>
{% endif %}
<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 %} {% endblock %}
app/templates/main/poster2.html.j2 0 → 100644
+ 264
− 0
View file @ fa2af2d8
{% 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 %}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment