mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2024-11-14 16:55:42 +00:00
QB form update + incidence modifier
This commit is contained in:
Inga Kirschnick
parent
8a5c94f448
commit
fe7f69d596
@ -1,3 +1,12 @@
|
||||
#corpus-analysis-concordance-query-builder-input-field-container {
|
||||
border-bottom: #9E9E9E 1px solid;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-query-builder-input-field {
|
||||
margin-top: 23px;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
@ -79,40 +88,20 @@
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-ignore-case-checkbox {
|
||||
margin-left: 5px;
|
||||
[data-target="corpus-analysis-concordance-character-incidence-modifiers-dropdown"], [data-target="corpus-analysis-concordance-token-incidence-modifiers-dropdown"] {
|
||||
background-color: #2FBBAB !important;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-incidence-modifiers-dropdown a{
|
||||
background-color: white;
|
||||
#corpus-analysis-concordance-exactly-n-token-modal, #corpus-analysis-concordance-between-nm-token-modal {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
[data-target="corpus-analysis-concordance-incidence-modifiers-dropdown"] {
|
||||
background-color: #2FBBAB;
|
||||
[data-modal-id="corpus-analysis-concordance-exactly-n-token-modal"], [data-modal-id="corpus-analysis-concordance-between-nm-token-modal"] {
|
||||
margin-top: 15px !important;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-or, #corpus-analysis-concordance-and {
|
||||
background-color: #fc0;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-betweenNM {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-query-builder-tutorial-modal {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-query-builder-tutorial-modal ul {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-query-builder-tutorial {
|
||||
padding:15px;
|
||||
}
|
||||
|
||||
#corpus-analysis-concordance-scroll-up-button-query-builder-tutorial {
|
||||
background-color: #28B3D1;
|
||||
[data-options-action="and"], [data-options-action="or"] {
|
||||
background-color: #fc0 !important;
|
||||
}
|
||||
|
||||
[data-type="start-sentence"], [data-type="end-sentence"] {
|
||||
|
||||
@ -10,7 +10,8 @@ class CorpusAnalysisConcordance {
|
||||
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`),
|
||||
expertModeForm: document.querySelector(`#corpus-analysis-concordance-expert-mode-form`),
|
||||
queryBuilderForm: document.querySelector(`#corpus-analysis-concordance-query-builder-form`),
|
||||
progress: document.querySelector(`#corpus-analysis-concordance-progress`),
|
||||
subcorpusInfo: document.querySelector(`#corpus-analysis-concordance-subcorpus-info`),
|
||||
subcorpusActions: document.querySelector(`#corpus-analysis-concordance-subcorpus-actions`),
|
||||
@ -30,12 +31,14 @@ class CorpusAnalysisConcordance {
|
||||
this.app.registerExtension(this);
|
||||
}
|
||||
|
||||
async submitForm() {
|
||||
async submitForm(queryModeId) {
|
||||
this.app.disableActionElements();
|
||||
// let query = this.elements.form.query.value.trim();
|
||||
let query = this.checkQueryInput();
|
||||
console.log(query);
|
||||
let subcorpusName = this.elements.form['subcorpus-name'].value;
|
||||
let queryBuilderQuery = document.querySelector('#corpus-analysis-concordance-query-preview').innerHTML.trim();
|
||||
let expertModeQuery = this.elements.expertModeForm.query.value.trim();
|
||||
let query = queryModeId === 'corpus-analysis-concordance-expert-mode-form' ? expertModeQuery : queryBuilderQuery;
|
||||
let form = queryModeId === 'corpus-analysis-concordance-expert-mode-form' ? this.elements.expertModeForm : this.elements.queryBuilderForm;
|
||||
|
||||
let subcorpusName = form['subcorpus-name'].value;
|
||||
this.elements.error.innerText = '';
|
||||
this.elements.error.classList.add('hide');
|
||||
this.elements.progress.classList.remove('hide');
|
||||
@ -74,9 +77,13 @@ class CorpusAnalysisConcordance {
|
||||
this.data.corpus = this.app.data.corpus;
|
||||
this.data.subcorpora = {};
|
||||
// Add event listeners
|
||||
this.elements.form.addEventListener('submit', (event) => {
|
||||
this.elements.expertModeForm.addEventListener('submit', (event) => {
|
||||
event.preventDefault();
|
||||
this.submitForm();
|
||||
this.submitForm(this.elements.expertModeForm.id);
|
||||
});
|
||||
this.elements.queryBuilderForm.addEventListener('submit', (event) => {
|
||||
event.preventDefault();
|
||||
this.submitForm(this.elements.queryBuilderForm.id);
|
||||
});
|
||||
this.elements.userInterfaceForm.addEventListener('change', (event) => {
|
||||
if (event.target === this.elements.userInterfaceForm['context']) {
|
||||
@ -98,14 +105,6 @@ class CorpusAnalysisConcordance {
|
||||
});
|
||||
}
|
||||
|
||||
checkQueryInput() {
|
||||
if (document.querySelector('#corpus-analysis-concordance-expert-mode-display').classList.contains('hide')) {
|
||||
return document.querySelector('#corpus-analysis-concordance-query-preview').innerHTML.trim();
|
||||
} else {
|
||||
return this.elements.form.query.value.trim();
|
||||
}
|
||||
}
|
||||
|
||||
clearSubcorpusList() {
|
||||
this.elements.subcorpusList.innerHTML = '';
|
||||
this.elements.subcorpusList.classList.add('hide');
|
||||
|
||||
@ -7,51 +7,6 @@ class ConcordanceQueryBuilder {
|
||||
this.tokenAttributeBuilderFunctions = new TokenAttributeBuilderFunctionsQueryBuilder(this.elements);
|
||||
this.structuralAttributeBuilderFunctions = new StructuralAttributeBuilderFunctionsQueryBuilder(this.elements);
|
||||
|
||||
// Event listener for structural attribute modal
|
||||
document.querySelectorAll('[data-structural-attr-modal-action-button]').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
this.structuralAttributeBuilderFunctions.actionButtonInStrucAttrModalHandler(button.dataset.structuralAttrModalActionButton);
|
||||
});
|
||||
});
|
||||
|
||||
// Event listener for token attribute modal
|
||||
this.elements.positionalAttrSelection.addEventListener('change', (event) => {
|
||||
this.generalFunctions.toggleClass(['word', 'lemma', 'english-pos', 'german-pos', 'simple-pos'], 'hide', 'add');
|
||||
if (event.target.value !== 'empty-token') {
|
||||
this.generalFunctions.toggleClass([event.target.value], 'hide', 'remove');
|
||||
this.generalFunctions.toggleClass(['incidence-modifiers', 'or', 'and'], 'disabled', 'add');
|
||||
this.tokenAttributeBuilderFunctions.resetMaterializeSelection([this.elements.englishPosSelection, this.elements.germanPosSelection, this.elements.simplePosSelection]);
|
||||
}
|
||||
if (event.target.value === 'word' || event.target.value === 'lemma') {
|
||||
this.generalFunctions.toggleClass(['input-field-options'], 'hide', 'remove');
|
||||
} else if (event.target.value === 'empty-token'){
|
||||
this.tokenAttributeBuilderFunctions.addTokenToQuery();
|
||||
} else {
|
||||
this.generalFunctions.toggleClass(['input-field-options'], 'hide', 'add');
|
||||
}
|
||||
});
|
||||
// Options for positional attribute selection
|
||||
document.querySelectorAll('.positional-attr-options-action-button[data-options-action]').forEach(button => {
|
||||
button.addEventListener('click', () => {this.tokenAttributeBuilderFunctions.actionButtonInOptionSectionHandler(button.dataset.optionsAction);});
|
||||
});
|
||||
document.querySelectorAll('.incidence-modifier-selection[data-incidence-modifier]').forEach(button => {
|
||||
button.addEventListener('click', () => {this.tokenAttributeBuilderFunctions.incidenceModifierHandler(button);});
|
||||
});
|
||||
document.querySelectorAll('.n-m-submit-button').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
this.tokenAttributeBuilderFunctions.nmSubmitHandler(button.dataset.modalId);
|
||||
});
|
||||
});
|
||||
|
||||
// Initializing and styling the Materialize Chip components
|
||||
M.Chips.init(
|
||||
this.elements.queryInputField,
|
||||
{
|
||||
placeholder: 'Add your query here'
|
||||
}
|
||||
);
|
||||
document.querySelector('#corpus-analysis-concordance-form-query-builder input').style.setProperty('width', '150px', 'important');
|
||||
|
||||
this.elements.positionalAttrModal = M.Modal.init(
|
||||
document.querySelector('#corpus-analysis-concordance-positional-attr-modal'),
|
||||
{
|
||||
|
||||
@ -1,13 +1,11 @@
|
||||
class ElementReferencesQueryBuilder {
|
||||
constructor() {
|
||||
// General Elements
|
||||
this.counter = 0;
|
||||
this.queryInputField = document.querySelector('#corpus-analysis-concordance-form-query-builder');
|
||||
this.queryInputFieldInstance = M.Chips.getInstance(this.queryInputField);
|
||||
this.queryInputFieldContent = [];
|
||||
this.queryInputField = document.querySelector('#corpus-analysis-concordance-query-builder-input-field');
|
||||
this.queryChipElements = [];
|
||||
|
||||
// Structural Attribute Builder Elements
|
||||
this.structuralAttrModalInstance = document.querySelector('#corpus-analysis-concordance-structural-attr-modal');
|
||||
this.structuralAttrModal = M.Modal.getInstance(document.querySelector('#corpus-analysis-concordance-structural-attr-modal'));
|
||||
this.sentenceElement = document.querySelector('[data-structural-attr-modal-action-button="sentence"]');
|
||||
this.entityElement = document.querySelector('[data-structural-attr-modal-action-button="entity"]');
|
||||
this.textAnnotationElement = document.querySelector('[data-structural-attr-modal-action-button="text-annotation"]');
|
||||
|
||||
@ -9,23 +9,29 @@ class GeneralFunctionsQueryBuilder {
|
||||
});
|
||||
}
|
||||
|
||||
updateChipList() {
|
||||
this.elements.queryChipElements = this.elements.queryInputField.querySelectorAll('.chip');
|
||||
}
|
||||
|
||||
queryChipFactory(dataType, prettyQueryText, queryText) {
|
||||
this.elements.counter++;
|
||||
this.elements.queryInputFieldInstance.addChip({
|
||||
tag: prettyQueryText
|
||||
});
|
||||
queryText = Utils.escape(queryText);
|
||||
prettyQueryText = Utils.escape(prettyQueryText);
|
||||
let queryChipElement = Utils.HTMLToElement(
|
||||
`
|
||||
<span class="chip query-component" data-type="${dataType}" data-query="${queryText}" draggable="true">
|
||||
${prettyQueryText}
|
||||
<i class="material-icons close">close</i>
|
||||
</span>
|
||||
`
|
||||
);
|
||||
|
||||
let queryChipElementIndex = this.elements.queryInputFieldInstance.$chips.length - 1;
|
||||
let queryChipElement = this.elements.queryInputFieldInstance.$chips[queryChipElementIndex];
|
||||
queryChipElement.classList.add('query-component');
|
||||
queryChipElement.setAttribute('data-type', dataType);
|
||||
queryChipElement.setAttribute('data-query', queryText);
|
||||
queryChipElement.setAttribute('draggable', 'true');
|
||||
queryChipElement.addEventListener('click', () => this.selectChipElement(queryChipElement));
|
||||
queryChipElement.querySelector('i').addEventListener('click', () => this.deleteChipElement(queryChipElement));
|
||||
|
||||
queryChipElement.addEventListener('click', () => this.deleteAttr(queryChipElement));
|
||||
queryChipElement.addEventListener('dragstart', this.handleDragStart.bind(this, queryChipElement));
|
||||
queryChipElement.addEventListener('dragend', this.handleDragEnd);
|
||||
|
||||
this.elements.queryInputField.appendChild(queryChipElement);
|
||||
this.updateChipList();
|
||||
this.queryPreviewBuilder();
|
||||
}
|
||||
|
||||
@ -65,45 +71,51 @@ class GeneralFunctionsQueryBuilder {
|
||||
targetChipClone.addEventListener('drop', (event) => {
|
||||
let dropzone = event.target;
|
||||
dropzone.parentElement.replaceChild(queryChipElement, dropzone);
|
||||
this.elements.queryInputFieldInstance.$chips = Array.from(this.elements.queryInputField.querySelectorAll('.chip'));
|
||||
this.updateChipList();
|
||||
this.queryPreviewBuilder();
|
||||
});
|
||||
}
|
||||
|
||||
queryPreviewBuilder() {
|
||||
let queryPreview = document.querySelector('#corpus-analysis-concordance-query-preview');
|
||||
let queryChipElements = Array.from(Object.values(this.elements.queryInputFieldInstance.$chips));
|
||||
if (!isNaN(queryChipElements[queryChipElements.length - 1])) {
|
||||
queryChipElements.pop();
|
||||
}
|
||||
this.elements.queryInputFieldContent = [];
|
||||
queryChipElements.forEach(element => {
|
||||
|
||||
let queryInputFieldContent = [];
|
||||
this.elements.queryChipElements.forEach(element => {
|
||||
let queryElement = element.dataset.query;
|
||||
if (queryElement !== undefined) {
|
||||
queryElement = Utils.escape(queryElement);
|
||||
this.elements.queryInputFieldContent.push(queryElement);
|
||||
}
|
||||
queryInputFieldContent.push(queryElement);
|
||||
});
|
||||
|
||||
let queryString = this.elements.queryInputFieldContent.join(' ');
|
||||
let queryString = queryInputFieldContent.join(' ');
|
||||
queryString += ';';
|
||||
|
||||
queryPreview.innerHTML = queryString;
|
||||
queryPreview.parentNode.classList.toggle('hide', queryString === ';');
|
||||
}
|
||||
|
||||
deleteAttr(attr) {
|
||||
deleteChipElement(attr) {
|
||||
if (attr.dataset.type === "start-sentence") {
|
||||
this.elements.sentenceElement.innerHTML = 'Sentence';
|
||||
} else if (attr.dataset.type === "start-entity" || attr.dataset.type === "start-empty-entity") {
|
||||
this.elements.entityElement.innerHTML = 'Entity';
|
||||
}
|
||||
let queryChipElements = Array.from(Object.values(this.elements.queryInputFieldInstance.$chips));
|
||||
queryChipElements.pop();
|
||||
this.elements.counter -= 1;
|
||||
this.elements.queryInputFieldInstance.deleteChip(queryChipElements.indexOf(attr));
|
||||
this.elements.queryInputField.removeChild(attr);
|
||||
this.updateChipList();
|
||||
this.queryPreviewBuilder();
|
||||
}
|
||||
|
||||
selectChipElement(attr) {
|
||||
document.querySelectorAll('.chip.teal').forEach(element => {
|
||||
if (element !== attr) {
|
||||
element.classList.remove('teal', 'lighten-2');
|
||||
this.toggleClass(['token-incidence-modifiers'], 'disabled', 'add');
|
||||
}
|
||||
});
|
||||
|
||||
this.toggleClass(['token-incidence-modifiers'], 'disabled', 'toggle');
|
||||
attr.classList.toggle('teal');
|
||||
attr.classList.toggle('lighten-2');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -2,11 +2,32 @@ class StructuralAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQu
|
||||
constructor(elements) {
|
||||
super(elements);
|
||||
this.elements = elements;
|
||||
|
||||
document.querySelectorAll('[data-structural-attr-modal-action-button]').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
this.actionButtonInStrucAttrModalHandler(button.dataset.structuralAttrModalActionButton);
|
||||
});
|
||||
});
|
||||
document.querySelector('.ent-type-selection-action[data-ent-type="any"]').addEventListener('click', () => {
|
||||
this.queryChipFactory('start-empty-entity', 'Entity Start', '<ent>');
|
||||
this.queryChipFactory('end-entity', 'Entity End', '</ent>');
|
||||
this.elements.structuralAttrModal.close();
|
||||
});
|
||||
document.querySelector('.ent-type-selection-action[data-ent-type="english"]').addEventListener('change', (event) => {
|
||||
this.queryChipFactory('start-entity', `Entity Type=${event.target.value}`, `<ent_type="${event.target.value}">`);
|
||||
this.queryChipFactory('end-entity', 'Entity End', '</ent_type>');
|
||||
this.elements.structuralAttrModal.close();
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
actionButtonInStrucAttrModalHandler(action) {
|
||||
switch (action) {
|
||||
case 'sentence':
|
||||
this.queryChipFactory('start-sentence', 'Sentence Start', '<s>');
|
||||
this.queryChipFactory('end-sentence', 'Sentence End', '</s>');
|
||||
this.elements.structuralAttrModal.close();
|
||||
break;
|
||||
case 'entity':
|
||||
this.toggleClass(['entity-builder'], 'hide', 'toggle');
|
||||
@ -20,4 +41,5 @@ class StructuralAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQu
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -3,6 +3,36 @@ class TokenAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQueryBu
|
||||
super(elements);
|
||||
this.elements = elements;
|
||||
|
||||
this.elements.positionalAttrSelection.addEventListener('change', (event) => {
|
||||
this.toggleClass(['word', 'lemma', 'english-pos', 'german-pos', 'simple-pos'], 'hide', 'add');
|
||||
if (event.target.value !== 'empty-token') {
|
||||
this.toggleClass([event.target.value], 'hide', 'remove');
|
||||
this.toggleClass(['incidence-modifiers', 'or', 'and'], 'disabled', 'add');
|
||||
this.resetMaterializeSelection([this.elements.englishPosSelection, this.elements.germanPosSelection, this.elements.simplePosSelection]);
|
||||
}
|
||||
if (event.target.value === 'word' || event.target.value === 'lemma') {
|
||||
this.toggleClass(['input-field-options'], 'hide', 'remove');
|
||||
} else if (event.target.value === 'empty-token'){
|
||||
this.addTokenToQuery();
|
||||
} else {
|
||||
this.toggleClass(['input-field-options'], 'hide', 'add');
|
||||
}
|
||||
});
|
||||
|
||||
// Options for positional attribute selection
|
||||
document.querySelectorAll('.positional-attr-options-action-button[data-options-action]').forEach(button => {
|
||||
button.addEventListener('click', () => {this.actionButtonInOptionSectionHandler(button.dataset.optionsAction);});
|
||||
});
|
||||
document.querySelectorAll('.incidence-modifier-selection[data-incidence-modifier]').forEach(button => {
|
||||
button.addEventListener('click', () => {this.incidenceModifierHandler(button);});
|
||||
});
|
||||
document.querySelectorAll('.n-m-submit-button').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
this.nmSubmitHandler(button.dataset.modalId);
|
||||
});
|
||||
});
|
||||
|
||||
// Eventlistener for kind of token
|
||||
this.elements.tokenSubmitButton.addEventListener('click', () => {this.addTokenToQuery();});
|
||||
this.elements.wordInput.addEventListener('input', () => {this.optionToggleHandler();});
|
||||
this.elements.lemmaInput.addEventListener('input', () => {this.optionToggleHandler();});
|
||||
@ -119,7 +149,7 @@ class TokenAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQueryBu
|
||||
this.disableTokenSubmit();
|
||||
} else {
|
||||
tokenQueryPrettyText += `simple_pos=${this.elements.simplePosSelection.value}`;
|
||||
tokenQueryCQLText += `simple_pos="${this.elements.simplePosSelection.value}"`;
|
||||
tokenQueryCQLText += `simple_pos='${this.elements.simplePosSelection.value}'`;
|
||||
this.elements.simplePosSelection.value = '';
|
||||
}
|
||||
break;
|
||||
@ -149,7 +179,7 @@ class TokenAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQueryBu
|
||||
input.setSelectionRange(firstIndex, lastIndex);
|
||||
break;
|
||||
case 'wildcard-char':
|
||||
input.value += '.';
|
||||
input.value += '.';
|
||||
break;
|
||||
case 'and':
|
||||
this.conditionHandler('and', " & ");
|
||||
@ -195,7 +225,8 @@ class TokenAttributeBuilderFunctionsQueryBuilder extends GeneralFunctionsQueryBu
|
||||
nmSubmitHandler(modalId) {
|
||||
let modal = document.querySelector(`#${modalId}`);
|
||||
let input_n = modal.querySelector('.n-m-input[data-value-type="n"]').value;
|
||||
let input_m = modalId === 'corpus-analysis-concordance-between-nm-modal' ? ',' + modal.querySelector('.n-m-input[data-value-type="m"]').value : '';
|
||||
let input_m = modal.querySelector('.n-m-input[data-value-type="m"]') || undefined;
|
||||
input_m = input_m !== undefined ? ',' + input_m.value : '';
|
||||
let input = `${input_n}${input_m}`;
|
||||
|
||||
let instance = M.Modal.getInstance(modal);
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{% macro card_content(id_prefix) %}
|
||||
<div class="row">
|
||||
<form id="corpus-analysis-concordance-form">
|
||||
<form id="corpus-analysis-concordance-expert-mode-form">
|
||||
<div class="input-field col s12 m9">
|
||||
<i class="material-icons prefix">search</i>
|
||||
<input class="validate corpus-analysis-action" id="corpus-analysis-concordance-form-query" name="query" type="text" required pattern=".*\S+.*" placeholder="Type in your query or use the Query Builder on the right"></input>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
{% macro card_content(id_prefix) %}
|
||||
<form id="corpus-analysis-concordance-form">
|
||||
<form id="corpus-analysis-concordance-query-builder-form">
|
||||
<div class="row">
|
||||
<div class="col s9">
|
||||
<div class="chips" id="corpus-analysis-concordance-form-query-builder"></div>
|
||||
<div class="col s9" id="corpus-analysis-concordance-query-builder-input-field-container">
|
||||
<div id="corpus-analysis-concordance-query-builder-input-field"></div>
|
||||
</div>
|
||||
<div class="input-field col s3">
|
||||
<i class="material-icons prefix">arrow_forward</i>
|
||||
@ -30,6 +30,7 @@
|
||||
<p></p>
|
||||
<a class="btn waves-effect waves-light tooltipped modal-trigger" href="#corpus-analysis-concordance-positional-attr-modal" data-position="bottom" data-tooltip="Search for any token, for example a word, a lemma or a part-of-speech tag">Add new token to your query</a>
|
||||
<a class="btn waves-effect waves-light tooltipped modal-trigger" href="#corpus-analysis-concordance-structural-attr-modal" data-position="bottom" data-tooltip="Structure your query with structural attributes, for example sentences, entities or annotate the text">Add structural attributes to your query</a>
|
||||
<a class="btn waves-effect waves-light tooltipped dropdown-trigger disabled" data-target="corpus-analysis-concordance-token-incidence-modifiers-dropdown" data-toggle-area="token-incidence-modifiers" data-position="top" data-tooltip="Incidence Modifiers are special characters or patterns, <br>which determine how often a character represented previously should occur.">incidence modifiers</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
@ -42,6 +43,14 @@
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<ul id="corpus-analysis-concordance-token-incidence-modifiers-dropdown" class="dropdown-content">
|
||||
{{ incidence_modifiers_dropdown_content("token") }}
|
||||
</ul>
|
||||
|
||||
{{ exactly_n_modal_content("token") }}
|
||||
{{ exactly_nm_modal_content("token") }}
|
||||
|
||||
{% endmacro %}
|
||||
|
||||
{% macro structural_attribute_modal(id_prefix) %}
|
||||
@ -63,10 +72,10 @@
|
||||
<p></p>
|
||||
<br>
|
||||
<div class="row">
|
||||
<a class="btn waves-effect waves-light col s4" id="corpus-analysis-concordance-empty-entity">Add Entity of any type</a>
|
||||
<a class="btn waves-effect waves-light col ent-type-selection-action" data-ent-type="any">Add Entity of any type</a>
|
||||
<p class="col s1 l1"></p>
|
||||
<div class= "input-field col s3">
|
||||
<select name="englishenttype" id="corpus-analysis-concordance-english-ent-type">
|
||||
<select name="englishenttype" class="ent-type-selection-action" data-ent-type="english">
|
||||
<option value="" disabled selected>English ent_type</option>
|
||||
<option value="CARDINAL">CARDINAL</option>
|
||||
<option value="DATE">DATE</option>
|
||||
@ -90,7 +99,7 @@
|
||||
<label>Entity Type</label>
|
||||
</div>
|
||||
<div class= "input-field col s3">
|
||||
<select name="germanenttype" id="corpus-analysis-concordance-german-ent-type">
|
||||
<select name="germanenttype" class="ent-type-selection-action" data-ent-type="german">
|
||||
<option value="" disabled selected>German ent_type</option>
|
||||
<option value="LOC">LOC</option>
|
||||
<option value="MISC">MISC</option>
|
||||
@ -347,10 +356,10 @@
|
||||
</div>
|
||||
<p></p>
|
||||
<div class="row">
|
||||
<div class="col s6" data-toggle-area="input-field-options">
|
||||
<div class="col s8" data-toggle-area="input-field-options">
|
||||
<a class="btn-small waves-effect waves-light tooltipped positional-attr-options-action-button" data-options-action="wildcard-char" data-position="top" data-tooltip="Look for a variable character (also called wildcard character)">Wildcard character</a>
|
||||
<a class="btn-small waves-effect waves-light tooltipped positional-attr-options-action-button" data-options-action="option-group" data-position="top" data-tooltip="Find character sequences from a list of options">Option Group</a>
|
||||
<a class="dropdown-trigger btn-small waves-effect waves-light disabled" href="#" data-target="corpus-analysis-concordance-incidence-modifiers-dropdown" data-toggle-area="incidence-modifiers" data-position="top" data-tooltip="Incidence Modifiers are special characters or patterns, <br>which determine how often a character represented previously should occur.">incidence modifiers</a>
|
||||
<a class="dropdown-trigger btn-small waves-effect waves-light disabled" href="#" data-target="corpus-analysis-concordance-character-incidence-modifiers-dropdown" data-toggle-area="incidence-modifiers" data-position="top" data-tooltip="Incidence Modifiers are special characters or patterns, <br>which determine how often a character represented previously should occur.">incidence modifiers</a>
|
||||
<span data-toggle-area="ignore-case-checkbox">
|
||||
<label>
|
||||
<input type="checkbox" class="filled-in" id="corpus-analysis-concordance-ignore-case-checkbox"/>
|
||||
@ -363,47 +372,61 @@
|
||||
<a class="btn-small tooltipped waves-effect waves-light disabled positional-attr-options-action-button" data-options-action="and" data-toggle-area="and" data-position="bottom" data-tooltip="You can add another condition to your token. <br>Both must be fulfilled">and</a>
|
||||
</div>
|
||||
|
||||
<ul id="corpus-analysis-concordance-incidence-modifiers-dropdown" class="dropdown-content">
|
||||
<li><a class="tooltipped incidence-modifier-selection" data-token="+" data-incidence-modifier="one-or-more" data-position ="top" data-tooltip="...occurrences of the character/token before">one or more (+)</a></li>
|
||||
<li><a class="tooltipped incidence-modifier-selection" data-token="*" data-incidence-modifier="zero-or-more" data-position ="top" data-tooltip="...occurrences of the character/token before">zero or more (*)</a></li>
|
||||
<li><a class="tooltipped incidence-modifier-selection" data-token="?" data-incidence-modifier="zero-or-one" data-position ="top" data-tooltip="...occurrences of the character/token before">zero or one (?)</a></li>
|
||||
<li><a class="modal-trigger tooltipped" href="#corpus-analysis-concordance-exactly-n-modal" data-position ="top" data-tooltip="...occurrences of the character/token before">exactly n ({n})</a></li>
|
||||
<li><a class="modal-trigger tooltipped" href="#corpus-analysis-concordance-between-nm-modal" data-position ="top" data-tooltip="...occurrences of the character/token before">between n and m ({n,m})</a></li>
|
||||
<ul id="corpus-analysis-concordance-character-incidence-modifiers-dropdown" class="dropdown-content">
|
||||
{{ incidence_modifiers_dropdown_content("character") }}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="corpus-analysis-concordance-exactly-n-modal" class="modal">
|
||||
<div class="row modal-content">
|
||||
<div class="input-field col s10">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="type in a number for 'n'" type="text" data-value-type="n">
|
||||
</div>
|
||||
<div class="col s2">
|
||||
<p class="btn-floating waves-effect waves-light n-m-submit-button" data-modal-id="corpus-analysis-concordance-exactly-n-modal">
|
||||
<i class="material-icons right">send</i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="corpus-analysis-concordance-between-nm-modal" class="modal">
|
||||
<div class="row modal-content">
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="number for 'n'" type="text" data-value-type="n">
|
||||
</div>
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="number for 'm'" type="text" data-value-type="m">
|
||||
</div>
|
||||
<div class="col s2">
|
||||
<p class="btn-floating waves-effect waves-light n-m-submit-button" data-modal-id="corpus-analysis-concordance-between-nm-modal">
|
||||
<i class="material-icons right">send</i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{{ exactly_n_modal_content("character") }}
|
||||
{{ exactly_nm_modal_content("character") }}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro incidence_modifiers_dropdown_content(type) %}
|
||||
<li><a class="incidence-modifier-selection" data-token="+" data-incidence-modifier="one-or-more">one or more (+)</a></li>
|
||||
<li><a class="incidence-modifier-selection" data-token="*" data-incidence-modifier="zero-or-more">zero or more (*)</a></li>
|
||||
<li><a class="incidence-modifier-selection" data-token="?" data-incidence-modifier="zero-or-one">zero or one (?)</a></li>
|
||||
<li><a class="modal-trigger" href="#corpus-analysis-concordance-exactly-n-{{ type }}-modal">exactly n ({n})</a></li>
|
||||
<li><a class="modal-trigger" href="#corpus-analysis-concordance-between-nm-{{ type }}-modal">between n and m ({n,m})</a></li>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro exactly_n_modal_content(type) %}
|
||||
<div id="corpus-analysis-concordance-exactly-n-{{ type }}-modal" class="modal">
|
||||
<div class="row modal-content">
|
||||
<div class="input-field col s10">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="type in a number for 'n'" type="text" data-value-type="n">
|
||||
</div>
|
||||
<div class="col s2">
|
||||
<p class="btn-floating waves-effect waves-light n-m-submit-button" data-modal-id="corpus-analysis-concordance-exactly-n-{{ type }}-modal">
|
||||
<i class="material-icons right">send</i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro exactly_nm_modal_content(type) %}
|
||||
<div id="corpus-analysis-concordance-between-nm-{{ type }}-modal" class="modal">
|
||||
<div class="row modal-content">
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="number for 'n'" type="text" data-value-type="n">
|
||||
</div>
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">mode_edit</i>
|
||||
<input class="n-m-input" placeholder="number for 'm'" type="text" data-value-type="m">
|
||||
</div>
|
||||
<div class="col s2">
|
||||
<p class="btn-floating waves-effect waves-light n-m-submit-button" data-modal-id="corpus-analysis-concordance-between-nm-{{ type }}-modal">
|
||||
<i class="material-icons right">send</i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user