diff --git a/app/static/js/CorpusAnalysis/CorpusAnalysisApp.js b/app/static/js/CorpusAnalysis/CorpusAnalysisApp.js
index 958bd7d2b4795e86c01388535618b9a978fe7e4a..763252720c74a63e82e0f1948dcff21a0a93a02e 100644
--- a/app/static/js/CorpusAnalysis/CorpusAnalysisApp.js
+++ b/app/static/js/CorpusAnalysis/CorpusAnalysisApp.js
@@ -6,10 +6,10 @@ class CorpusAnalysisApp {
// HTML elements
this.elements = {
- container: document.querySelector('#corpus-analysis-app-container'),
- extensionCards: document.querySelector('#corpus-analysis-app-extension-cards'),
- extensionTabs: document.querySelector('#corpus-analysis-app-extension-tabs'),
- initModal: document.querySelector('#corpus-analysis-app-init-modal')
+ container: document.querySelector('#corpus-analysis-container'),
+ extensionCards: document.querySelector('#corpus-analysis-extension-cards'),
+ extensionTabs: document.querySelector('#corpus-analysis-extension-tabs'),
+ initModal: document.querySelector('#corpus-analysis-init-modal')
};
// Materialize elements
this.elements.m = {
diff --git a/app/static/js/CorpusAnalysis/CorpusAnalysisConcordance.js b/app/static/js/CorpusAnalysis/CorpusAnalysisConcordance.js
index b199e3995fdf73bf73139b9349c9c96c5706cff0..2348f7f226b4814e13504f12610d943d5eb79b1b 100644
--- a/app/static/js/CorpusAnalysis/CorpusAnalysisConcordance.js
+++ b/app/static/js/CorpusAnalysis/CorpusAnalysisConcordance.js
@@ -1,22 +1,22 @@
class CorpusAnalysisConcordance {
name = 'Concordance';
- constructor(app, idPrefix) {
+ constructor(app) {
this.app = app;
this.data = {};
this.elements = {
- container: document.querySelector(`#${idPrefix}-container`),
- error: document.querySelector(`#${idPrefix}-error`),
- userInterfaceForm: document.querySelector(`#${idPrefix}-user-interface-form`),
- form: document.querySelector(`#${idPrefix}-form`),
- progress: document.querySelector(`#${idPrefix}-progress`),
- subcorpusInfo: document.querySelector(`#${idPrefix}-subcorpus-info`),
- subcorpusActions: document.querySelector(`#${idPrefix}-subcorpus-actions`),
- subcorpusItems: document.querySelector(`#${idPrefix}-subcorpus-items`),
- subcorpusList: document.querySelector(`#${idPrefix}-subcorpus-list`),
- subcorpusPagination: document.querySelector(`#${idPrefix}-subcorpus-pagination`)
+ container: document.querySelector(`#corpus-analysis-concordance-container`),
+ error: document.querySelector(`#corpus-analysis-concordance-error`),
+ userInterfaceForm: document.querySelector(`#corpus-analysis-concordance-user-interface-form`),
+ form: document.querySelector(`#corpus-analysis-concordance-form`),
+ progress: document.querySelector(`#corpus-analysis-concordance-progress`),
+ subcorpusInfo: document.querySelector(`#corpus-analysis-concordance-subcorpus-info`),
+ subcorpusActions: document.querySelector(`#corpus-analysis-concordance-subcorpus-actions`),
+ subcorpusItems: document.querySelector(`#corpus-analysis-concordance-subcorpus-items`),
+ subcorpusList: document.querySelector(`#corpus-analysis-concordance-subcorpus-list`),
+ subcorpusPagination: document.querySelector(`#corpus-analysis-concordance-subcorpus-pagination`)
};
this.settings = {
diff --git a/app/static/js/CorpusAnalysis/CorpusAnalysisReader.js b/app/static/js/CorpusAnalysis/CorpusAnalysisReader.js
index 4990b91a74eba01d97ca7d474a697b6475d917f2..2a231ce214c46fb6a9724e25efcd7d678af61ee6 100644
--- a/app/static/js/CorpusAnalysis/CorpusAnalysisReader.js
+++ b/app/static/js/CorpusAnalysis/CorpusAnalysisReader.js
@@ -1,18 +1,18 @@
class CorpusAnalysisReader {
name = 'Reader';
- constructor(app, idPrefix) {
+ constructor(app) {
this.app = app;
this.data = {};
this.elements = {
- container: document.querySelector(`#${idPrefix}-container`),
- corpus: document.querySelector(`#${idPrefix}-corpus`),
- corpusPagination: document.querySelector(`#${idPrefix}-corpus-pagination`),
- error: document.querySelector(`#${idPrefix}-error`),
- progress: document.querySelector(`#${idPrefix}-progress`),
- userInterfaceForm: document.querySelector(`#${idPrefix}-user-interface-form`)
+ container: document.querySelector(`#corpus-analysis-reader-container`),
+ corpus: document.querySelector(`#corpus-analysis-reader-corpus`),
+ corpusPagination: document.querySelector(`#corpus-analysis-reader-corpus-pagination`),
+ error: document.querySelector(`#corpus-analysis-reader-error`),
+ progress: document.querySelector(`#corpus-analysis-reader-progress`),
+ userInterfaceForm: document.querySelector(`#corpus-analysis-reader-user-interface-form`)
};
this.settings = {
diff --git a/app/templates/corpora/_analysis/concordance.html.j2 b/app/templates/corpora/_analysis/concordance.html.j2
index 4be026b846334f560e75b25b26121ee693d1d831..96c7ef8dce15ccd3d55cc8e6624f446e5f1e11d6 100644
--- a/app/templates/corpora/_analysis/concordance.html.j2
+++ b/app/templates/corpora/_analysis/concordance.html.j2
@@ -13,7 +13,7 @@
{# The extension container content #}
-{% macro container_content(id_prefix) %}
+{% macro container_content() %}
<div class="card">
<div class="card-content">
<div class="row">
@@ -23,33 +23,33 @@
<div class="col s2">
<div class="switch" style="margin-top:8px; margin-left:0px;">
<label>
- <input type="checkbox" id="{{ id_prefix }}-expert-mode-switch">
+ <input type="checkbox" id="corpus-analysis-concordance-expert-mode-switch">
<span class="lever"></span>
expert mode
</label>
</div>
</div>
</div>
- <div id="{{ id_prefix }}-expert-mode-display" class="hide">
- {{ expert_mode.card_content(id_prefix) }}
+ <div id="corpus-analysis-concordance-expert-mode-display" class="hide">
+ {{ expert_mode.card_content() }}
</div>
- <div id="{{ id_prefix }}-query-builder-display">
- {{ query_builder.card_content(id_prefix) }}
+ <div id="corpus-analysis-concordance-query-builder-display">
+ {{ query_builder.card_content() }}
</div>
</div>
</div>
-<div id="{{ id_prefix }}-subcorpus-list"></div>
+<div id="corpus-analysis-concordance-subcorpus-list"></div>
<div class="card">
<div class="card-content">
<span class="card-title">Results</span>
<p></p>
<br>
- <div class="progress hide" id="{{ id_prefix }}-progress">
+ <div class="progress hide" id="corpus-analysis-concordance-progress">
<div class="indeterminate"></div>
</div>
- <form id="{{ id_prefix }}-user-interface-form">
+ <form id="corpus-analysis-concordance-user-interface-form">
<div class="row">
<div class="col s12 m9 l9">
<div class="row">
@@ -98,8 +98,8 @@
</div>
</form>
<div class="row">
- <div class="col s9"><p class="hide" id="{{ id_prefix }}-subcorpus-info"></p></div>
- <div class="col s3 right-align" id="{{ id_prefix }}-subcorpus-actions"></div>
+ <div class="col s9"><p class="hide" id="corpus-analysis-concordance-subcorpus-info"></p></div>
+ <div class="col s3 right-align" id="corpus-analysis-concordance-subcorpus-actions"></div>
</div>
<table class="highlight">
<thead>
@@ -112,27 +112,27 @@
<th class="left-align" style="width: 5%;"></th>
</tr>
</thead>
- <tbody id="{{ id_prefix }}-subcorpus-items"></tbody>
+ <tbody id="corpus-analysis-concordance-subcorpus-items"></tbody>
</table>
- <ul class="pagination hide" id="{{ id_prefix }}-subcorpus-pagination"></ul>
+ <ul class="pagination hide" id="corpus-analysis-concordance-subcorpus-pagination"></ul>
</div>
</div>
{% endmacro %}
{# The extension modals #}
-{% macro modals(id_prefix) %}
-{{ query_builder.structural_attribute_modal(id_prefix) }}
-{{ query_builder.positional_attribute_modal(id_prefix) }}
+{% macro modals() %}
+{{ query_builder.structural_attribute_modal() }}
+{{ query_builder.positional_attribute_modal() }}
{% endmacro %}
{# The extension scripts #}
-{% macro scripts(id_prefix) %}
+{% macro scripts() %}
<script>
- const corpusAnalysisConcordance = new CorpusAnalysisConcordance(corpusAnalysisApp, "{{ id_prefix }}");
+ const corpusAnalysisConcordance = new CorpusAnalysisConcordance(corpusAnalysisApp);
- let queryBuilderDisplay = document.getElementById("{{ id_prefix }}-query-builder-display");
- let expertModeDisplay = document.getElementById("{{ id_prefix }}-expert-mode-display");
- let expertModeSwitch = document.getElementById("{{ id_prefix }}-expert-mode-switch");
+ let queryBuilderDisplay = document.getElementById("corpus-analysis-concordance-query-builder-display");
+ let expertModeDisplay = document.getElementById("corpus-analysis-concordance-expert-mode-display");
+ let expertModeSwitch = document.getElementById("corpus-analysis-concordance-expert-mode-switch");
expertModeSwitch.addEventListener("change", function() {
if (this.checked) {
diff --git a/app/templates/corpora/_analysis/reader.html.j2 b/app/templates/corpora/_analysis/reader.html.j2
index df12fb6b6bec50d67f3e4420bccf6e261276327e..ebed2daea7aad2dad40b8d1b8bfb204179b7f149 100644
--- a/app/templates/corpora/_analysis/reader.html.j2
+++ b/app/templates/corpora/_analysis/reader.html.j2
@@ -9,10 +9,10 @@
{# The extension container content #}
-{% macro container_content(id_prefix) %}
+{% macro container_content() %}
<div class="card">
<div class="card-content">
- <form id="{{ id_prefix }}-user-interface-form">
+ <form id="corpus-analysis-reader-user-interface-form">
<div class="row">
<div class="col s12 m9 l10">
<div class="row">
@@ -45,13 +45,13 @@
<label>Token representation</label>
</div>
<div class="col s12">
- <span class="error-color-text helper-text hide" id="{{ id_prefix }}-error"></span>
+ <span class="error-color-text helper-text hide" id="corpus-analysis-reader-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="{{ id_prefix }}-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="corpus-analysis-reader-form-submit" type="submit" name="submit">Send <i class="material-icons right">send</i></button>
</div>
</div>
</form>
@@ -60,25 +60,25 @@
<div class="card">
<div class="card-content">
- <div class="progress hide" id="{{ id_prefix }}-progress">
+ <div class="progress hide" id="corpus-analysis-reader-progress">
<div class="indeterminate"></div>
</div>
<table>
<tbody>
- <tr><td id="{{ id_prefix }}-corpus"></td></tr>
+ <tr><td id="corpus-analysis-reader-corpus"></td></tr>
</tbody>
</table>
- <ul class="pagination hide" id="{{ id_prefix }}-corpus-pagination"></ul>
+ <ul class="pagination hide" id="corpus-analysis-reader-corpus-pagination"></ul>
</div>
</div>
{% endmacro %}
{# The extension modals #}
-{% macro modals(id_prefix) %}{% endmacro %}
+{% macro modals() %}{% endmacro %}
{# The extension scripts #}
-{% macro scripts(id_prefix) %}
+{% macro scripts() %}
<script>
- const corpusAnalysisReader = new CorpusAnalysisReader(corpusAnalysisApp, "{{ id_prefix }}");
+ const corpusAnalysisReader = new CorpusAnalysisReader(corpusAnalysisApp);
</script>
{% endmacro %}
diff --git a/app/templates/corpora/analysis.html.j2 b/app/templates/corpora/analysis.html.j2
index 261eb2267c74c3f6e746bbaa7fd15d5c3b56618f..f42825182224dc2aa70824a0266a3401a5cfc580 100644
--- a/app/templates/corpora/analysis.html.j2
+++ b/app/templates/corpora/analysis.html.j2
@@ -4,58 +4,59 @@
{% import 'corpora/_analysis/reader.html.j2' as reader_extension %}
{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
-{% set extensions =
- {
- 'corpus-analysis-app-concordance-extension': concordance_extension,
- 'corpus-analysis-app-reader-extension': reader_extension,
- 'corpus-analysis-app-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 main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-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 id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
+<ul class="row tabs no-autoinit" id="corpus-analysis-extension-tabs">
+ <li class="tab col s3">
+ <a class="active" href="#corpus-analysis-home-container"><i class="nopaque-icons service-icons left" data-service="corpus-analysis"></i>Corpus analysis</a>
+ </li>
<li class="tab col s3">
- <a href="#{{ id }}-container"><i class="material-icons left">{{ extension.icon }}</i>{{ extension.name }}</a>
+ <a href="#corpus-analysis-concordance-container"><i class="material-icons left">{{ concordance_extension.icon }}</i>{{ concordance_extension.name }}</a>
+ </li>
+ <li class="tab col s3">
+ <a href="#corpus-analysis-reader-container"><i class="material-icons left">{{ reader_extension.icon }}</i>{{ reader_extension.name }}</a>
</li>
- {% endfor %}
</ul>
-<div id="corpus-analysis-app-home-container">
+<div id="corpus-analysis-home-container">
<h1>{{ title }}</h1>
- <div class="row" id="corpus-analysis-app-extension-cards">
- {% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
+ <div class="row" id="corpus-analysis-extension-cards">
+ <div class="col s3">
+ <div class="card extension-selector hoverable" data-target="corpus-analysis-concordance-container">
+ <div class="card-content">
+ <span class="card-title">{{ concordance_extension.name }}</span>
+ <p>{{ concordance_extension.description }}</p>
+ </div>
+ </div>
+ </div>
<div class="col s3">
- <div class="card extension-selector hoverable" data-target="{{ id }}-container">
+ <div class="card extension-selector hoverable" data-target="corpus-analysis-reader-container">
<div class="card-content">
- <span class="card-title">{{ extension.name }}</span>
- <p>{{ extension.description }}</p>
+ <span class="card-title">{{ reader_extension.name }}</span>
+ <p>{{ reader_extension.description }}</p>
</div>
</div>
</div>
- {% endfor %}
</div>
- {{ static_visualization_extension.container_content('corpus-analysis-app-static-visualizations-extension') }}
+ {{ static_visualization_extension.container_content() }}
</div>
-{% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
-<div id="{{ id }}-container">
- {{ extension.container_content(id) }}
+{% for extension in extensions if extension.name != 'Static Visualization (beta)' %}
+<div id="corpus-analysis-concordance-container">
+ {{ extension.container_content() }}
</div>
{% endfor %}
{% endblock page_content %}
{% block modals %}
{{ super() }}
-<div class="modal no-autoinit" id="corpus-analysis-app-init-modal">
+<div class="modal no-autoinit" id="corpus-analysis-init-modal">
<div class="modal-content">
<h4>We are preparing your analysis session</h4>
<p>
@@ -70,9 +71,9 @@
</div>
</div>
-{% for id, extension in extensions.items() %}
-{{ extension.modals(id) }}
-{% endfor %}
+{{ concordance_extension.modals() }}
+{{ reader_extension.modals() }}
+{{ static_visualization_extension.modals() }}
{% endblock modals %}
{% block scripts %}
@@ -81,9 +82,9 @@
const corpusAnalysisApp = new CorpusAnalysisApp({{ corpus.hashid|tojson }});
</script>
-{% for id, extension in extensions.items() %}
-{{ extension.scripts(id) }}
-{% endfor %}
+{{ concordance_extension.scripts() }}
+{{ reader_extension.scripts() }}
+{{ static_visualization_extension.scripts() }}
<script>
corpusAnalysisApp.init();