mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2024-11-14 16:55:42 +00:00
Use macros for html generation instead of variables
This commit is contained in:
Patrick Jentsch
parent
ae8e383085
commit
3b390858ff
@ -2,22 +2,13 @@
|
||||
{% import 'corpora/_analysis/query_builder/_query_builder.html.j2' as query_builder with context %}
|
||||
|
||||
|
||||
{% set icon = 'list_alt' %}
|
||||
{% set name = 'Concordance' %}
|
||||
{% set description = 'Query your corpus with the CQP query language utilizing a KWIC view.' %}
|
||||
|
||||
{% set description %}
|
||||
Query your corpus with the CQP query language utilizing a KWIC view.
|
||||
{% endset %}
|
||||
|
||||
{% set id_prefix = name.lower().replace(' ', '-') + '-extension' %}
|
||||
|
||||
{% set tab_content %}
|
||||
<i class="material-icons left">list_alt</i>{{ name }}</a>
|
||||
{% endset %}
|
||||
|
||||
{% set container_content %}
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card">
|
||||
{% macro container_element(id_prefix) %}
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s1">
|
||||
@ -77,13 +68,11 @@ Query your corpus with the CQP query language utilizing a KWIC view.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12">
|
||||
<div id="{{ id_prefix }}-subcorpus-list"></div>
|
||||
<div id="{{ id_prefix }}-subcorpus-list"></div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<span class="card-title">Results</span>
|
||||
<p></p>
|
||||
@ -158,12 +147,11 @@ Query your corpus with the CQP query language utilizing a KWIC view.
|
||||
</table>
|
||||
<ul class="pagination hide" id="{{ id_prefix }}-subcorpus-pagination"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endset %}
|
||||
{% endmacro %}
|
||||
|
||||
{% set modals %}
|
||||
{# The extension modals #}
|
||||
{% macro modals(id_prefix) %}
|
||||
<div id="structural-attr-modal" class="modal">
|
||||
<div class="modal-content">
|
||||
<h6>Which structural attribute do you want to add to your query?<a class="modal-trigger" data-manual-modal-chapter="manual-modal-query-builder" href="#manual-modal"><i class="material-icons left" id="add-structural-attribute-tutorial-info-icon">help_outline</i></a></h6>
|
||||
@ -177,9 +165,10 @@ Query your corpus with the CQP query language utilizing a KWIC view.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endset %}
|
||||
{% endmacro %}
|
||||
|
||||
{% set scripts %}
|
||||
{# The extension scripts #}
|
||||
{% macro scripts(id_prefix) %}
|
||||
<script>
|
||||
const corpusAnalysisConcordance = new CorpusAnalysisConcordance(corpusAnalysisApp);
|
||||
{# const concordanceQueryBuilder = new ConcordanceQueryBuilder(); #}
|
||||
|
||||
@ -1,21 +1,18 @@
|
||||
{# The extension icon #}
|
||||
{% set icon = 'chrome_reader_mode' %}
|
||||
|
||||
{# The extension name #}
|
||||
{% set name = 'Reader' %}
|
||||
|
||||
{% set description %}
|
||||
Inspect your corpus in detail with a full text view, including annotations.
|
||||
{% endset %}
|
||||
{# The extension description #}
|
||||
{% set description = 'Inspect your corpus in detail with a full text view, including annotations.' %}
|
||||
|
||||
{% set id_prefix = name.lower().replace(' ', '-') + '-extension' %}
|
||||
|
||||
{% set tab_content %}
|
||||
<i class="material-icons left">chrome_reader_mode</i>{{ name }}</a>
|
||||
{% endset %}
|
||||
|
||||
{% set container_content %}
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card">
|
||||
{# The extension container content #}
|
||||
{% macro container_content(id_prefix) %}
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<form id="reader-extension-form">
|
||||
<form id="{{ id_prefix }}-form">
|
||||
<div class="row">
|
||||
<div class="col s12 m9 l10">
|
||||
<div class="row">
|
||||
@ -48,42 +45,40 @@ Inspect your corpus in detail with a full text view, including annotations.
|
||||
<label>Token representation</label>
|
||||
</div>
|
||||
<div class="col s12">
|
||||
<span class="error-color-text helper-text hide" id="reader-extension-error"></span>
|
||||
<span class="error-color-text helper-text hide" id="{{ id_prefix }}-error"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m3 l2 right-align">
|
||||
<p class="hide-on-small-only"> </p>
|
||||
<button class="btn hide waves-effect waves-light corpus-analysis-action" id="reader-extension-form-submit" type="submit" name="submit">Send <i class="material-icons right">send</i></button>
|
||||
<button class="btn hide waves-effect waves-light corpus-analysis-action" id="{{ id_prefix }}-form-submit" type="submit" name="submit">Send <i class="material-icons right">send</i></button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12">
|
||||
<div class="card">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="progress hide" id="reader-extension-progress">
|
||||
<div class="progress hide" id="{{ id_prefix }}-progress">
|
||||
<div class="indeterminate"></div>
|
||||
</div>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr><td id="reader-extension-corpus"></td></tr>
|
||||
<tr><td id="{{ id_prefix }}-corpus"></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<ul class="pagination hide" id="reader-extension-corpus-pagination"></ul>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="pagination hide" id="{{ id_prefix }}-corpus-pagination"></ul>
|
||||
</div>
|
||||
</div>
|
||||
{% endset %}
|
||||
{% endmacro %}
|
||||
|
||||
{% set modals = '' %}
|
||||
{# The extension modals #}
|
||||
{% macro modals(id_prefix) %}{% endmacro %}
|
||||
|
||||
{% set scripts %}
|
||||
{# The extension scripts #}
|
||||
{% macro scripts(id_prefix) %}
|
||||
<script>
|
||||
const corpusAnalysisReader = new CorpusAnalysisReader(corpusAnalysisApp);
|
||||
</script>
|
||||
{% endset %}
|
||||
{% endmacro %}
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
{# The extension icon #}
|
||||
{% set icon = '' %}
|
||||
|
||||
{# The extension name #}
|
||||
{% set name = '' %}
|
||||
@ -5,22 +7,12 @@
|
||||
{# The extension description #}
|
||||
{% set description = '' %}
|
||||
|
||||
{#
|
||||
The extension id prefix, used for related HTML elements with an id.
|
||||
The prefix is used to avoid id conflicts with other extensions.
|
||||
Reserved ids (do not use):
|
||||
- <id_prefix>-extension-container
|
||||
#}
|
||||
{% set id_prefix = name.lower().replace(' ', '-') + '-extension' %}
|
||||
|
||||
{# The extension tab content #}
|
||||
{% set tab_content = name %}
|
||||
|
||||
{# The extension container content #}
|
||||
{% set container_content = '' %}
|
||||
{% macro container_content(id_prefix) %}{% endmacro %}
|
||||
|
||||
{# The extension modals #}
|
||||
{% set modals = '' %}
|
||||
{% macro modals(id_prefix) %}{% endmacro %}
|
||||
|
||||
{# The extension scripts #}
|
||||
{% set scripts = '' %}
|
||||
{% macro scripts(id_prefix) %}{% endmacro %}
|
||||
|
||||
@ -4,16 +4,25 @@
|
||||
{% import 'corpora/_analysis/reader.html.j2' as reader_extension %}
|
||||
{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
|
||||
|
||||
{% set extensions = [concordance_extension, reader_extension, static_visualization_extension] %}
|
||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-app-container"{% endblock main_attribs %}
|
||||
{% set extensions =
|
||||
{
|
||||
'concordance-extension': concordance_extension,
|
||||
'reader-extension': reader_extension,
|
||||
'static-visualizations-extension': static_visualization_extension
|
||||
}
|
||||
%}
|
||||
|
||||
|
||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-app-container"{% endblock main_attribs %}
|
||||
|
||||
|
||||
{% block page_content %}
|
||||
<ul class="row tabs no-autoinit" id="corpus-analysis-app-extension-tabs">
|
||||
<li class="tab col s3"><a class="active" href="#corpus-analysis-app-home-container"><i class="nopaque-icons service-icons left" data-service="corpus-analysis"></i>Corpus analysis</a></li>
|
||||
{% for extension in extensions if extension.name != 'Static Visualization (beta)' %}
|
||||
<li class="tab col s3"><a href="#{{ extension.id_prefix }}-container">{{ extension.tab_content }}</a></li>
|
||||
{% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
|
||||
<li class="tab col s3">
|
||||
<a href="#{{ id }}-container"><i class="material-icons left">extension.icon</i>{{ extension.name }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
@ -21,9 +30,9 @@
|
||||
<h1>{{ title }}</h1>
|
||||
|
||||
<div class="row" id="corpus-analysis-app-extension-cards">
|
||||
{% for extension in extensions if extension.name != 'Static Visualization (beta)' %}
|
||||
{% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
|
||||
<div class="col s3">
|
||||
<div class="card extension-selector hoverable" data-target="{{ extension.id_prefix }}-container">
|
||||
<div class="card extension-selector hoverable" data-target="{{ id }}-container">
|
||||
<div class="card-content">
|
||||
<span class="card-title">{{ extension.name }}</span>
|
||||
<p>{{ extension.description }}</p>
|
||||
@ -37,9 +46,9 @@
|
||||
</div>
|
||||
|
||||
|
||||
{% for extension in extensions if extension.name != 'Static Visualization (beta)' %}
|
||||
<div id="{{ extension.id_prefix }}-container">
|
||||
{{ extension.container_content }}
|
||||
{% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
|
||||
<div id="{{ id }}-container">
|
||||
{{ extension.container_content(id) }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endblock page_content %}
|
||||
@ -61,10 +70,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% for extension in extensions %}
|
||||
{{ extension.modals }}
|
||||
{% for id, extension in extensions.items() %}
|
||||
{{ extension.modals(id) }}
|
||||
{% endfor %}
|
||||
|
||||
{% endblock modals %}
|
||||
|
||||
{% block scripts %}
|
||||
@ -73,8 +81,8 @@
|
||||
const corpusAnalysisApp = new CorpusAnalysisApp({{ corpus.hashid|tojson }});
|
||||
</script>
|
||||
|
||||
{% for extension in extensions %}
|
||||
{{ extension.scripts }}
|
||||
{% for id, extension in extensions.items() %}
|
||||
{{ extension.scripts(id) }}
|
||||
{% endfor %}
|
||||
|
||||
<script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user