mirror of
				https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
				synced 2025-11-04 04:12:45 +00:00 
			
		
		
		
	Merge branch 'query-builder' of gitlab.ub.uni-bielefeld.de:sfb1288inf/nopaque into query-builder
This commit is contained in:
		@@ -1,31 +1,30 @@
 | 
				
			|||||||
class CorpusAnalysisConcordance {
 | 
					class CorpusAnalysisConcordance {
 | 
				
			||||||
  name = 'Concordance';
 | 
					  name = 'Concordance';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  constructor(app) {
 | 
					  constructor(app, idPrefix) {
 | 
				
			||||||
    this.app = app;
 | 
					    this.app = app;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.data = {};
 | 
					    this.data = {};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.elements = {
 | 
					    this.elements = {
 | 
				
			||||||
      // TODO: Prefix elements with "corpus-analysis-app-"
 | 
					      container: document.querySelector(`#${idPrefix}-container`),
 | 
				
			||||||
      container: document.querySelector('#concordance-extension-container'),
 | 
					      error: document.querySelector(`#${idPrefix}-error`),
 | 
				
			||||||
      error: document.querySelector('#concordance-extension-error'),
 | 
					      userInterfaceForm: document.querySelector(`#${idPrefix}-user-interface-form`),
 | 
				
			||||||
      UIForm: document.querySelector('#concordance-extension-ui-form'),
 | 
					      form: document.querySelector(`#${idPrefix}-form`),
 | 
				
			||||||
      form: document.querySelector('#concordance-extension-form'),
 | 
					      progress: document.querySelector(`#${idPrefix}-progress`),
 | 
				
			||||||
      progress: document.querySelector('#concordance-extension-progress'),
 | 
					      subcorpusInfo: document.querySelector(`#${idPrefix}-subcorpus-info`),
 | 
				
			||||||
      subcorpusInfo: document.querySelector('#concordance-extension-subcorpus-info'),
 | 
					      subcorpusActions: document.querySelector(`#${idPrefix}-subcorpus-actions`),
 | 
				
			||||||
      subcorpusActions: document.querySelector('#concordance-extension-subcorpus-actions'),
 | 
					      subcorpusItems: document.querySelector(`#${idPrefix}-subcorpus-items`),
 | 
				
			||||||
      subcorpusItems: document.querySelector('#concordance-extension-subcorpus-items'),
 | 
					      subcorpusList: document.querySelector(`#${idPrefix}-subcorpus-list`),
 | 
				
			||||||
      subcorpusList: document.querySelector('#concordance-extension-subcorpus-list'),
 | 
					      subcorpusPagination: document.querySelector(`#${idPrefix}-subcorpus-pagination`)
 | 
				
			||||||
      subcorpusPagination: document.querySelector('#concordance-extension-subcorpus-pagination')
 | 
					 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.settings = {
 | 
					    this.settings = {
 | 
				
			||||||
      context: parseInt(this.elements.UIForm['context'].value),
 | 
					      context: parseInt(this.elements.userInterfaceForm['context'].value),
 | 
				
			||||||
      perPage: parseInt(this.elements.UIForm['per-page'].value),
 | 
					      perPage: parseInt(this.elements.userInterfaceForm['per-page'].value),
 | 
				
			||||||
      selectedSubcorpus: undefined,
 | 
					      selectedSubcorpus: undefined,
 | 
				
			||||||
      textStyle: parseInt(this.elements.UIForm['text-style'].value),
 | 
					      textStyle: parseInt(this.elements.userInterfaceForm['text-style'].value),
 | 
				
			||||||
      tokenRepresentation: this.elements.UIForm['token-representation'].value
 | 
					      tokenRepresentation: this.elements.userInterfaceForm['token-representation'].value
 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.app.registerExtension(this);
 | 
					    this.app.registerExtension(this);
 | 
				
			||||||
@@ -77,21 +76,24 @@ class CorpusAnalysisConcordance {
 | 
				
			|||||||
      event.preventDefault();
 | 
					      event.preventDefault();
 | 
				
			||||||
      this.submitForm();
 | 
					      this.submitForm();
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
    this.elements.UIForm.addEventListener('change', (event) => {
 | 
					    this.elements.userInterfaceForm.addEventListener('change', (event) => {
 | 
				
			||||||
      if (event.target === this.elements.UIForm['context']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['context']) {
 | 
				
			||||||
        this.settings.context = parseInt(this.elements.UIForm['context'].value);
 | 
					        console.log(this.settings.context);
 | 
				
			||||||
 | 
					        console.log(parseInt(this.elements.userInterfaceForm['context'].value));
 | 
				
			||||||
 | 
					        this.settings.context = parseInt(this.elements.userInterfaceForm['context'].value);
 | 
				
			||||||
 | 
					        console.log(this.settings.context);
 | 
				
			||||||
        this.submitForm();
 | 
					        this.submitForm();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      if (event.target === this.elements.UIForm['per-page']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['per-page']) {
 | 
				
			||||||
        this.settings.perPage = parseInt(this.elements.UIForm['per-page'].value);
 | 
					        this.settings.perPage = parseInt(this.elements.userInterfaceForm['per-page'].value);
 | 
				
			||||||
        this.submitForm();
 | 
					        this.submitForm();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      if (event.target === this.elements.UIForm['text-style']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['text-style']) {
 | 
				
			||||||
        this.settings.textStyle = parseInt(this.elements.UIForm['text-style'].value);
 | 
					        this.settings.textStyle = parseInt(this.elements.userInterfaceForm['text-style'].value);
 | 
				
			||||||
        this.setTextStyle();
 | 
					        this.setTextStyle();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      if (event.target === this.elements.UIForm['token-representation']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['token-representation']) {
 | 
				
			||||||
        this.settings.tokenRepresentation = this.elements.UIForm['token-representation'].value;
 | 
					        this.settings.tokenRepresentation = this.elements.userInterfaceForm['token-representation'].value;
 | 
				
			||||||
        this.setTokenRepresentation();
 | 
					        this.setTokenRepresentation();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
@@ -379,7 +381,9 @@ class CorpusAnalysisConcordance {
 | 
				
			|||||||
          document.getSelection().removeAllRanges();
 | 
					          document.getSelection().removeAllRanges();
 | 
				
			||||||
          document.getSelection().addRange(range);
 | 
					          document.getSelection().addRange(range);
 | 
				
			||||||
        });
 | 
					        });
 | 
				
			||||||
        this.app.elements.m.extensionTabs.select('reader-extension-container');
 | 
					        this.app.elements.m.extensionTabs.select(
 | 
				
			||||||
 | 
					          this.app.extensions.Reader.elements.container.id
 | 
				
			||||||
 | 
					        );
 | 
				
			||||||
      });
 | 
					      });
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
    for (let selectTriggerElement of this.elements.subcorpusItems.querySelectorAll('.select-trigger')) {
 | 
					    for (let selectTriggerElement of this.elements.subcorpusItems.querySelectorAll('.select-trigger')) {
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,25 +1,24 @@
 | 
				
			|||||||
class CorpusAnalysisReader {
 | 
					class CorpusAnalysisReader {
 | 
				
			||||||
  name = 'Reader';
 | 
					  name = 'Reader';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  constructor(app) {
 | 
					  constructor(app, idPrefix) {
 | 
				
			||||||
    this.app = app;
 | 
					    this.app = app;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.data = {};
 | 
					    this.data = {};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.elements = {
 | 
					    this.elements = {
 | 
				
			||||||
      // TODO: Prefix elements with "corpus-analysis-app-"
 | 
					      container: document.querySelector(`#${idPrefix}-container`),
 | 
				
			||||||
      container: document.querySelector('#reader-extension-container'),
 | 
					      corpus: document.querySelector(`#${idPrefix}-corpus`),
 | 
				
			||||||
      error: document.querySelector('#reader-extension-error'),
 | 
					      corpusPagination: document.querySelector(`#${idPrefix}-corpus-pagination`),
 | 
				
			||||||
      form: document.querySelector('#reader-extension-form'),
 | 
					      error: document.querySelector(`#${idPrefix}-error`),
 | 
				
			||||||
      progress: document.querySelector('#reader-extension-progress'),
 | 
					      progress: document.querySelector(`#${idPrefix}-progress`),
 | 
				
			||||||
      corpus: document.querySelector('#reader-extension-corpus'),
 | 
					      userInterfaceForm: document.querySelector(`#${idPrefix}-user-interface-form`)
 | 
				
			||||||
      corpusPagination: document.querySelector('#reader-extension-corpus-pagination')
 | 
					 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.settings = {
 | 
					    this.settings = {
 | 
				
			||||||
      perPage: parseInt(this.elements.form['per-page'].value),
 | 
					      perPage: parseInt(this.elements.userInterfaceForm['per-page'].value),
 | 
				
			||||||
      textStyle: parseInt(this.elements.form['text-style'].value),
 | 
					      textStyle: parseInt(this.elements.userInterfaceForm['text-style'].value),
 | 
				
			||||||
      tokenRepresentation: this.elements.form['token-representation'].value,
 | 
					      tokenRepresentation: this.elements.userInterfaceForm['token-representation'].value,
 | 
				
			||||||
      pagination: {
 | 
					      pagination: {
 | 
				
			||||||
        innerWindow: 5,
 | 
					        innerWindow: 5,
 | 
				
			||||||
        outerWindow: 1
 | 
					        outerWindow: 1
 | 
				
			||||||
@@ -57,21 +56,21 @@ class CorpusAnalysisReader {
 | 
				
			|||||||
    // Init data
 | 
					    // Init data
 | 
				
			||||||
    this.data.corpus = this.app.data.corpus;
 | 
					    this.data.corpus = this.app.data.corpus;
 | 
				
			||||||
    // Add event listeners
 | 
					    // Add event listeners
 | 
				
			||||||
    this.elements.form.addEventListener('submit', (event) => {
 | 
					    this.elements.userInterfaceForm.addEventListener('submit', (event) => {
 | 
				
			||||||
      event.preventDefault();
 | 
					      event.preventDefault();
 | 
				
			||||||
      this.submitForm();
 | 
					      this.submitForm();
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
    this.elements.form.addEventListener('change', (event) => {
 | 
					    this.elements.userInterfaceForm.addEventListener('change', (event) => {
 | 
				
			||||||
      if (event.target === this.elements.form['per-page']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['per-page']) {
 | 
				
			||||||
        this.settings.perPage = parseInt(this.elements.form['per-page'].value);
 | 
					        this.settings.perPage = parseInt(this.elements.userInterfaceForm['per-page'].value);
 | 
				
			||||||
        this.submitForm();
 | 
					        this.submitForm();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      if (event.target === this.elements.form['text-style']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['text-style']) {
 | 
				
			||||||
        this.settings.textStyle = parseInt(this.elements.form['text-style'].value);
 | 
					        this.settings.textStyle = parseInt(this.elements.userInterfaceForm['text-style'].value);
 | 
				
			||||||
        this.setTextStyle();
 | 
					        this.setTextStyle();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      if (event.target === this.elements.form['token-representation']) {
 | 
					      if (event.target === this.elements.userInterfaceForm['token-representation']) {
 | 
				
			||||||
        this.settings.tokenRepresentation = this.elements.form['token-representation'].value;
 | 
					        this.settings.tokenRepresentation = this.elements.userInterfaceForm['token-representation'].value;
 | 
				
			||||||
        this.setTokenRepresentation();
 | 
					        this.setTokenRepresentation();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -2,11 +2,10 @@
 | 
				
			|||||||
{% import 'corpora/_analysis/query_builder/_query_builder.html.j2' as query_builder with context %}
 | 
					{% import 'corpora/_analysis/query_builder/_query_builder.html.j2' as query_builder with context %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					{% set icon = 'list_alt' %}
 | 
				
			||||||
{% set name = 'Concordance' %}
 | 
					{% 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 id_prefix = name.lower().replace(' ', '-') + '-extension' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -43,95 +42,93 @@ Query your corpus with the CQP query language utilizing a KWIC view.
 | 
				
			|||||||
    </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">
 | 
					  <div class="card-content">
 | 
				
			||||||
        <span class="card-title">Results</span>
 | 
					    <span class="card-title">Results</span>
 | 
				
			||||||
        <p></p>
 | 
					    <p></p>
 | 
				
			||||||
        <br>
 | 
					    <br>
 | 
				
			||||||
        <div class="progress hide" id="{{ id_prefix }}-progress">
 | 
					    <div class="progress hide" id="{{ id_prefix }}-progress">
 | 
				
			||||||
          <div class="indeterminate"></div>
 | 
					      <div class="indeterminate"></div>
 | 
				
			||||||
        </div>
 | 
					    </div>
 | 
				
			||||||
        <form id="{{ id_prefix }}-ui-form">
 | 
					    <form id="{{ id_prefix }}-user-interface-form">
 | 
				
			||||||
 | 
					      <div class="row">
 | 
				
			||||||
 | 
					        <div class="col s12 m9 l9">
 | 
				
			||||||
          <div class="row">
 | 
					          <div class="row">
 | 
				
			||||||
            <div class="col s12 m9 l9">
 | 
					            <div class="input-field col s4 l3">
 | 
				
			||||||
              <div class="row">
 | 
					              <i class="material-icons prefix">short_text</i>
 | 
				
			||||||
                <div class="input-field col s4 l3">
 | 
					              <select class="corpus-analysis-action" name="context">
 | 
				
			||||||
                  <i class="material-icons prefix">short_text</i>
 | 
					                <option value="10" selected>10</option>
 | 
				
			||||||
                  <select class="corpus-analysis-action" name="context">
 | 
					                <option value="15">15</option>
 | 
				
			||||||
                    <option value="10" selected>10</option>
 | 
					                <option value="20">20</option>
 | 
				
			||||||
                    <option value="15">15</option>
 | 
					                <option value="25">25</option>
 | 
				
			||||||
                    <option value="20">20</option>
 | 
					                <option value="30">30</option>
 | 
				
			||||||
                    <option value="25">25</option>
 | 
					              </select>
 | 
				
			||||||
                    <option value="30">30</option>
 | 
					              <label>Context</label>
 | 
				
			||||||
                  </select>
 | 
					            </div>
 | 
				
			||||||
                  <label>Context</label>
 | 
					            <div class="input-field col s4 l3">
 | 
				
			||||||
                </div>
 | 
					              <i class="material-icons prefix">format_list_numbered</i>
 | 
				
			||||||
                <div class="input-field col s4 l3">
 | 
					              <select class="corpus-analysis-action" name="per-page">
 | 
				
			||||||
                  <i class="material-icons prefix">format_list_numbered</i>
 | 
					                <option value="10" selected>10</option>
 | 
				
			||||||
                  <select class="corpus-analysis-action" name="per-page">
 | 
					                <option value="15">15</option>
 | 
				
			||||||
                    <option value="10" selected>10</option>
 | 
					                <option value="20">20</option>
 | 
				
			||||||
                    <option value="15">15</option>
 | 
					                <option value="25">25</option>
 | 
				
			||||||
                    <option value="20">20</option>
 | 
					              </select>
 | 
				
			||||||
                    <option value="25">25</option>
 | 
					              <label>Matches per page</label>
 | 
				
			||||||
                  </select>
 | 
					            </div>
 | 
				
			||||||
                  <label>Matches per page</label>
 | 
					            <div class="input-field col s4 l3">
 | 
				
			||||||
                </div>
 | 
					              <i class="material-icons prefix">format_shapes</i>
 | 
				
			||||||
                <div class="input-field col s4 l3">
 | 
					              <select name="text-style">
 | 
				
			||||||
                  <i class="material-icons prefix">format_shapes</i>
 | 
					                <option value="0">Plain text</option>
 | 
				
			||||||
                  <select name="text-style">
 | 
					                <option value="1" selected>Highlight entities</option>
 | 
				
			||||||
                    <option value="0">Plain text</option>
 | 
					                <option value="2">Token text</option>
 | 
				
			||||||
                    <option value="1" selected>Highlight entities</option>
 | 
					              </select>
 | 
				
			||||||
                    <option value="2">Token text</option>
 | 
					              <label>Text style</label>
 | 
				
			||||||
                  </select>
 | 
					            </div>
 | 
				
			||||||
                  <label>Text style</label>
 | 
					            <div class="input-field col s4 l3">
 | 
				
			||||||
                </div>
 | 
					              <i class="material-icons prefix">format_quote</i>
 | 
				
			||||||
                <div class="input-field col s4 l3">
 | 
					              <select name="token-representation">
 | 
				
			||||||
                  <i class="material-icons prefix">format_quote</i>
 | 
					                <option value="lemma">lemma</option>
 | 
				
			||||||
                  <select name="token-representation">
 | 
					                <option value="pos">pos</option>
 | 
				
			||||||
                    <option value="lemma">lemma</option>
 | 
					                <option value="simple_pos">simple_pos</option>
 | 
				
			||||||
                    <option value="pos">pos</option>
 | 
					                <option value="word" selected>word</option>
 | 
				
			||||||
                    <option value="simple_pos">simple_pos</option>
 | 
					              </select>
 | 
				
			||||||
                    <option value="word" selected>word</option>
 | 
					              <label>Token representation</label>
 | 
				
			||||||
                  </select>
 | 
					 | 
				
			||||||
                  <label>Token representation</label>
 | 
					 | 
				
			||||||
                </div>
 | 
					 | 
				
			||||||
              </div>
 | 
					 | 
				
			||||||
            </div>
 | 
					            </div>
 | 
				
			||||||
          </div>
 | 
					          </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>
 | 
					        </div>
 | 
				
			||||||
        <table class="highlight">
 | 
					 | 
				
			||||||
          <thead>
 | 
					 | 
				
			||||||
            <tr>
 | 
					 | 
				
			||||||
              <th style="width: 2%;"></th>
 | 
					 | 
				
			||||||
              <th style="width: 8%;">Source</th>
 | 
					 | 
				
			||||||
              <th class="right-align" style="width: 22.5%;">Left context</th>
 | 
					 | 
				
			||||||
              <th class="center-align" style="width: 40%;">KWIC</th>
 | 
					 | 
				
			||||||
              <th class="left-align" style="width: 22.5%;">Right Context</th>
 | 
					 | 
				
			||||||
              <th class="left-align" style="width: 5%;"></th>
 | 
					 | 
				
			||||||
            </tr>
 | 
					 | 
				
			||||||
          </thead>
 | 
					 | 
				
			||||||
          <tbody id="{{ id_prefix }}-subcorpus-items"></tbody>
 | 
					 | 
				
			||||||
        </table>
 | 
					 | 
				
			||||||
        <ul class="pagination hide" id="{{ id_prefix }}-subcorpus-pagination"></ul>
 | 
					 | 
				
			||||||
      </div>
 | 
					      </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>
 | 
					    </div>
 | 
				
			||||||
 | 
					    <table class="highlight">
 | 
				
			||||||
 | 
					      <thead>
 | 
				
			||||||
 | 
					        <tr>
 | 
				
			||||||
 | 
					          <th style="width: 2%;"></th>
 | 
				
			||||||
 | 
					          <th style="width: 8%;">Source</th>
 | 
				
			||||||
 | 
					          <th class="right-align" style="width: 22.5%;">Left context</th>
 | 
				
			||||||
 | 
					          <th class="center-align" style="width: 40%;">KWIC</th>
 | 
				
			||||||
 | 
					          <th class="left-align" style="width: 22.5%;">Right Context</th>
 | 
				
			||||||
 | 
					          <th class="left-align" style="width: 5%;"></th>
 | 
				
			||||||
 | 
					        </tr>
 | 
				
			||||||
 | 
					      </thead>
 | 
				
			||||||
 | 
					      <tbody id="{{ id_prefix }}-subcorpus-items"></tbody>
 | 
				
			||||||
 | 
					    </table>
 | 
				
			||||||
 | 
					    <ul class="pagination hide" id="{{ id_prefix }}-subcorpus-pagination"></ul>
 | 
				
			||||||
  </div>
 | 
					  </div>
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
{% endset %}
 | 
					{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set modals %}
 | 
					{% set modals %}
 | 
				
			||||||
{{ query_builder.structural_attribute_modal() }}
 | 
					{{ query_builder.structural_attribute_modal() }}
 | 
				
			||||||
{{ query_builder.positional_attribute_modal() }}
 | 
					{{ query_builder.positional_attribute_modal() }}
 | 
				
			||||||
{% endset %}
 | 
					{% endset %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set scripts %}
 | 
					{# The extension scripts #}
 | 
				
			||||||
 | 
					{% macro scripts(id_prefix) %}
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
  const corpusAnalysisConcordance = new CorpusAnalysisConcordance(corpusAnalysisApp);
 | 
					  const corpusAnalysisConcordance = new CorpusAnalysisConcordance(corpusAnalysisApp);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,89 +1,84 @@
 | 
				
			|||||||
 | 
					{# The extension icon #}
 | 
				
			||||||
 | 
					{% set icon = 'chrome_reader_mode' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					{# The extension name #}
 | 
				
			||||||
{% set name = 'Reader' %}
 | 
					{% set name = 'Reader' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set description %}
 | 
					{# The extension description #}
 | 
				
			||||||
Inspect your corpus in detail with a full text view, including annotations.
 | 
					{% set description = 'Inspect your corpus in detail with a full text view, including annotations.' %}
 | 
				
			||||||
{% endset %}
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set id_prefix = name.lower().replace(' ', '-') + '-extension' %}
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set tab_content %}
 | 
					{# The extension container content #}
 | 
				
			||||||
<i class="material-icons left">chrome_reader_mode</i>{{ name }}</a>
 | 
					{% macro container_content(id_prefix) %}
 | 
				
			||||||
{% endset %}
 | 
					<div class="card">
 | 
				
			||||||
 | 
					  <div class="card-content">
 | 
				
			||||||
{% set container_content %}
 | 
					    <form id="{{ id_prefix }}-user-interface-form">
 | 
				
			||||||
<div class="row">
 | 
					      <div class="row">
 | 
				
			||||||
  <div class="col s12">
 | 
					        <div class="col s12 m9 l10">
 | 
				
			||||||
    <div class="card">
 | 
					 | 
				
			||||||
      <div class="card-content">
 | 
					 | 
				
			||||||
        <form id="reader-extension-form">
 | 
					 | 
				
			||||||
          <div class="row">
 | 
					          <div class="row">
 | 
				
			||||||
            <div class="col s12 m9 l10">
 | 
					            <div class="input-field col s4 m3">
 | 
				
			||||||
              <div class="row">
 | 
					              <i class="material-icons prefix">format_list_numbered</i>
 | 
				
			||||||
                <div class="input-field col s4 m3">
 | 
					              <select class="corpus-analysis-action" name="per-page">
 | 
				
			||||||
                  <i class="material-icons prefix">format_list_numbered</i>
 | 
					                <option value="500" selected>500</option>
 | 
				
			||||||
                  <select class="corpus-analysis-action" name="per-page">
 | 
					                <option value="1000">1000</option>
 | 
				
			||||||
                    <option value="500" selected>500</option>
 | 
					                <option value="1500">1500</option>
 | 
				
			||||||
                    <option value="1000">1000</option>
 | 
					              </select>
 | 
				
			||||||
                    <option value="1500">1500</option>
 | 
					              <label>Tokens per page</label>
 | 
				
			||||||
                  </select>
 | 
					 | 
				
			||||||
                  <label>Tokens per page</label>
 | 
					 | 
				
			||||||
                </div>
 | 
					 | 
				
			||||||
                <div class="input-field col s4 m3">
 | 
					 | 
				
			||||||
                  <i class="material-icons prefix">format_shapes</i>
 | 
					 | 
				
			||||||
                  <select name="text-style">
 | 
					 | 
				
			||||||
                    <option value="0">Plain text</option>
 | 
					 | 
				
			||||||
                    <option value="1" selected>Highlight entities</option>
 | 
					 | 
				
			||||||
                    <option value="2">Token text</option>
 | 
					 | 
				
			||||||
                  </select>
 | 
					 | 
				
			||||||
                  <label>Text style</label>
 | 
					 | 
				
			||||||
                </div>
 | 
					 | 
				
			||||||
                <div class="input-field col s4 m3">
 | 
					 | 
				
			||||||
                  <i class="material-icons prefix">format_quote</i>
 | 
					 | 
				
			||||||
                  <select name="token-representation">
 | 
					 | 
				
			||||||
                    <option value="lemma">lemma</option>
 | 
					 | 
				
			||||||
                    <option value="pos">pos</option>
 | 
					 | 
				
			||||||
                    <option value="simple_pos">simple_pos</option>
 | 
					 | 
				
			||||||
                    <option value="word" selected>word</option>
 | 
					 | 
				
			||||||
                  </select>
 | 
					 | 
				
			||||||
                  <label>Token representation</label>
 | 
					 | 
				
			||||||
                </div>
 | 
					 | 
				
			||||||
                <div class="col s12">
 | 
					 | 
				
			||||||
                  <span class="error-color-text helper-text hide" id="reader-extension-error"></span>
 | 
					 | 
				
			||||||
                </div>
 | 
					 | 
				
			||||||
              </div>
 | 
					 | 
				
			||||||
            </div>
 | 
					            </div>
 | 
				
			||||||
            <div class="col s12 m3 l2 right-align">
 | 
					            <div class="input-field col s4 m3">
 | 
				
			||||||
              <p class="hide-on-small-only"> </p>
 | 
					              <i class="material-icons prefix">format_shapes</i>
 | 
				
			||||||
              <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>
 | 
					              <select name="text-style">
 | 
				
			||||||
 | 
					                <option value="0">Plain text</option>
 | 
				
			||||||
 | 
					                <option value="1" selected>Highlight entities</option>
 | 
				
			||||||
 | 
					                <option value="2">Token text</option>
 | 
				
			||||||
 | 
					              </select>
 | 
				
			||||||
 | 
					              <label>Text style</label>
 | 
				
			||||||
 | 
					            </div>
 | 
				
			||||||
 | 
					            <div class="input-field col s4 m3">
 | 
				
			||||||
 | 
					              <i class="material-icons prefix">format_quote</i>
 | 
				
			||||||
 | 
					              <select name="token-representation">
 | 
				
			||||||
 | 
					                <option value="lemma">lemma</option>
 | 
				
			||||||
 | 
					                <option value="pos">pos</option>
 | 
				
			||||||
 | 
					                <option value="simple_pos">simple_pos</option>
 | 
				
			||||||
 | 
					                <option value="word" selected>word</option>
 | 
				
			||||||
 | 
					              </select>
 | 
				
			||||||
 | 
					              <label>Token representation</label>
 | 
				
			||||||
 | 
					            </div>
 | 
				
			||||||
 | 
					            <div class="col s12">
 | 
				
			||||||
 | 
					              <span class="error-color-text helper-text hide" id="{{ id_prefix }}-error"></span>
 | 
				
			||||||
            </div>
 | 
					            </div>
 | 
				
			||||||
          </div>
 | 
					          </div>
 | 
				
			||||||
        </form>
 | 
					 | 
				
			||||||
      </div>
 | 
					 | 
				
			||||||
    </div>
 | 
					 | 
				
			||||||
  </div>
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  <div class="col s12">
 | 
					 | 
				
			||||||
    <div class="card">
 | 
					 | 
				
			||||||
      <div class="card-content">
 | 
					 | 
				
			||||||
        <div class="progress hide" id="reader-extension-progress">
 | 
					 | 
				
			||||||
          <div class="indeterminate"></div>
 | 
					 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
        <table>
 | 
					        <div class="col s12 m3 l2 right-align">
 | 
				
			||||||
          <tbody>
 | 
					          <p class="hide-on-small-only"> </p>
 | 
				
			||||||
            <tr><td id="reader-extension-corpus"></td></tr>
 | 
					          <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>
 | 
				
			||||||
          </tbody>
 | 
					        </div>
 | 
				
			||||||
        </table>
 | 
					 | 
				
			||||||
        <ul class="pagination hide" id="reader-extension-corpus-pagination"></ul>
 | 
					 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
    </div>
 | 
					    </form>
 | 
				
			||||||
  </div>
 | 
					  </div>
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
{% endset %}
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set modals = '' %}
 | 
					<div class="card">
 | 
				
			||||||
 | 
					  <div class="card-content">
 | 
				
			||||||
 | 
					    <div class="progress hide" id="{{ id_prefix }}-progress">
 | 
				
			||||||
 | 
					      <div class="indeterminate"></div>
 | 
				
			||||||
 | 
					    </div>
 | 
				
			||||||
 | 
					    <table>
 | 
				
			||||||
 | 
					      <tbody>
 | 
				
			||||||
 | 
					        <tr><td id="{{ id_prefix }}-corpus"></td></tr>
 | 
				
			||||||
 | 
					      </tbody>
 | 
				
			||||||
 | 
					    </table>
 | 
				
			||||||
 | 
					    <ul class="pagination hide" id="{{ id_prefix }}-corpus-pagination"></ul>
 | 
				
			||||||
 | 
					  </div>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 | 
					{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set scripts %}
 | 
					{# The extension modals #}
 | 
				
			||||||
 | 
					{% macro modals(id_prefix) %}{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					{# The extension scripts #}
 | 
				
			||||||
 | 
					{% macro scripts(id_prefix) %}
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
  const corpusAnalysisReader = new CorpusAnalysisReader(corpusAnalysisApp);
 | 
					  const corpusAnalysisReader = new CorpusAnalysisReader(corpusAnalysisApp, "{{ id_prefix }}");
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
{% endset %}
 | 
					{% endmacro %}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,12 +1,15 @@
 | 
				
			|||||||
 | 
					{# The extension icon #}
 | 
				
			||||||
 | 
					{% set icon = '' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					{# The extension name #}
 | 
				
			||||||
{% set name = 'Static Visualization (beta)' %}
 | 
					{% set name = 'Static Visualization (beta)' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					{# The extension description #}
 | 
				
			||||||
{% set description = '' %}
 | 
					{% set description = '' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set id_prefix = name.lower().replace(' ', '-') + '-extension' %}
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set tab_content = '' %}
 | 
					{# The extension container content #}
 | 
				
			||||||
 | 
					{% macro container_content(id_prefix) %}
 | 
				
			||||||
{% set container_content %}
 | 
					 | 
				
			||||||
<div class="row">
 | 
					<div class="row">
 | 
				
			||||||
    <div class="col s12">
 | 
					    <div class="col s12">
 | 
				
			||||||
      <h4><i class="material-icons left">query_stats</i>{{ name }}</h4>
 | 
					      <h4><i class="material-icons left">query_stats</i>{{ name }}</h4>
 | 
				
			||||||
@@ -119,9 +122,9 @@
 | 
				
			|||||||
<div class="row">
 | 
					<div class="row">
 | 
				
			||||||
 | 
					
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
{% endset %}
 | 
					{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set modals %}
 | 
					{% macro modals(id_prefix) %}
 | 
				
			||||||
<div class="modal modal-fixed-footer" id="frequencies-stopwords-setting-modal">
 | 
					<div class="modal modal-fixed-footer" id="frequencies-stopwords-setting-modal">
 | 
				
			||||||
  <div class="modal-content">
 | 
					  <div class="modal-content">
 | 
				
			||||||
    <h4>Settings</h4>
 | 
					    <h4>Settings</h4>
 | 
				
			||||||
@@ -151,11 +154,11 @@
 | 
				
			|||||||
    <a class="modal-close waves-effect waves-green btn frequencies-stopword-setting-modal-action-buttons" data-action="cancel">Cancel</a>
 | 
					    <a class="modal-close waves-effect waves-green btn frequencies-stopword-setting-modal-action-buttons" data-action="cancel">Cancel</a>
 | 
				
			||||||
    <a class="modal-close waves-effect waves-green btn frequencies-stopword-setting-modal-action-buttons" data-action="submit">Submit</a>
 | 
					    <a class="modal-close waves-effect waves-green btn frequencies-stopword-setting-modal-action-buttons" data-action="submit">Submit</a>
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
{% endset %}
 | 
					{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set scripts %}
 | 
					{% macro scripts(id_prefix) %}
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
  const corpusAnalysisStaticVisualization = new CorpusAnalysisStaticVisualization(corpusAnalysisApp);
 | 
					  const corpusAnalysisStaticVisualization = new CorpusAnalysisStaticVisualization(corpusAnalysisApp, "{{ id_prefix }}");
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
{% endset %}
 | 
					{% endmacro %}
 | 
				
			||||||
 
 | 
					 
 | 
				
			||||||
@@ -1,3 +1,5 @@
 | 
				
			|||||||
 | 
					{# The extension icon #}
 | 
				
			||||||
 | 
					{% set icon = '' %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{# The extension name #}
 | 
					{# The extension name #}
 | 
				
			||||||
{% set name = '' %}
 | 
					{% set name = '' %}
 | 
				
			||||||
@@ -5,22 +7,12 @@
 | 
				
			|||||||
{# The extension description #}
 | 
					{# The extension description #}
 | 
				
			||||||
{% set 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 #}
 | 
					{# The extension container content #}
 | 
				
			||||||
{% set container_content = '' %}
 | 
					{% macro container_content(id_prefix) %}{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{# The extension modals #}
 | 
					{# The extension modals #}
 | 
				
			||||||
{% set modals = '' %}
 | 
					{% macro modals(id_prefix) %}{% endmacro %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{# The extension scripts #}
 | 
					{# 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/reader.html.j2' as reader_extension %}
 | 
				
			||||||
{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
 | 
					{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% set extensions = [concordance_extension, reader_extension, static_visualization_extension] %}
 | 
					{% set extensions =
 | 
				
			||||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-app-container"{% endblock main_attribs %}
 | 
					  {
 | 
				
			||||||
 | 
					    '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 page_content %}
 | 
					{% block page_content %}
 | 
				
			||||||
<ul class="row tabs no-autoinit" id="corpus-analysis-app-extension-tabs">
 | 
					<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>
 | 
					  <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)' %}
 | 
					  {% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
 | 
				
			||||||
  <li class="tab col s3"><a href="#{{ extension.id_prefix }}-container">{{ extension.tab_content }}</a></li>
 | 
					  <li class="tab col s3">
 | 
				
			||||||
 | 
					    <a href="#{{ id }}-container"><i class="material-icons left">{{ extension.icon }}</i>{{ extension.name }}</a>
 | 
				
			||||||
 | 
					  </li>
 | 
				
			||||||
  {% endfor %}
 | 
					  {% endfor %}
 | 
				
			||||||
</ul>
 | 
					</ul>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -21,9 +30,9 @@
 | 
				
			|||||||
  <h1>{{ title }}</h1>
 | 
					  <h1>{{ title }}</h1>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  <div class="row" id="corpus-analysis-app-extension-cards">
 | 
					  <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="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">
 | 
					        <div class="card-content">
 | 
				
			||||||
          <span class="card-title">{{ extension.name }}</span>
 | 
					          <span class="card-title">{{ extension.name }}</span>
 | 
				
			||||||
          <p>{{ extension.description }}</p>
 | 
					          <p>{{ extension.description }}</p>
 | 
				
			||||||
@@ -33,13 +42,13 @@
 | 
				
			|||||||
    {% endfor %}
 | 
					    {% endfor %}
 | 
				
			||||||
  </div>
 | 
					  </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  {{ static_visualization_extension.container_content }}
 | 
					  {{ static_visualization_extension.container_content('corpus-analysis-app-static-visualizations-extension') }}
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% for extension in extensions if extension.name != 'Static Visualization (beta)' %}
 | 
					{% for id, extension in extensions.items() if extension.name != 'Static Visualization (beta)' %}
 | 
				
			||||||
<div id="{{ extension.id_prefix }}-container">
 | 
					<div id="{{ id }}-container">
 | 
				
			||||||
  {{ extension.container_content }}
 | 
					  {{ extension.container_content(id) }}
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
{% endfor %}
 | 
					{% endfor %}
 | 
				
			||||||
{% endblock page_content %}
 | 
					{% endblock page_content %}
 | 
				
			||||||
@@ -61,10 +70,9 @@
 | 
				
			|||||||
  </div>
 | 
					  </div>
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% for extension in extensions %}
 | 
					{% for id, extension in extensions.items() %}
 | 
				
			||||||
{{ extension.modals }}
 | 
					{{ extension.modals(id) }}
 | 
				
			||||||
{% endfor %}
 | 
					{% endfor %}
 | 
				
			||||||
 | 
					 | 
				
			||||||
{% endblock modals %}
 | 
					{% endblock modals %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% block scripts %}
 | 
					{% block scripts %}
 | 
				
			||||||
@@ -73,8 +81,8 @@
 | 
				
			|||||||
  const corpusAnalysisApp = new CorpusAnalysisApp({{ corpus.hashid|tojson }});
 | 
					  const corpusAnalysisApp = new CorpusAnalysisApp({{ corpus.hashid|tojson }});
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
{% for extension in extensions %}
 | 
					{% for id, extension in extensions.items() %}
 | 
				
			||||||
{{ extension.scripts }}
 | 
					{{ extension.scripts(id) }}
 | 
				
			||||||
{% endfor %}
 | 
					{% endfor %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user