{% extends "base.html.j2" %} {% import "materialize/wtf.html.j2" as wtf %} <style> a {color: #FFFFFF;} </style> {% block main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-app-container"{% endblock main_attribs %} {% block page_content %} <ul class="row tabs no-autoinit" id="corpus-analysis-app-extension-tabs"> <li class="tab col s3"><a href="#corpus-analysis-app-overview"><i class="nopaque-icons service-icon left" data-service="corpus-analysis"></i>Corpus analysis</a></li> <li class="tab col s3"><a class="active" href="#concordance-extension-container"><i class="material-icons left">list_alt</i>Concordance</a></li> <li class="tab col s3"><a href="#reader-extension-container"><i class="material-icons left">chrome_reader_mode</i>Reader</a></li> </ul> {# <div class="row" id="corpus-analysis-app-overview"> <div class="col s12"> <h1>{{ title }}</h1> </div> <div class="col s3"> <div class="card extension-selector hoverable" data-target="concordance-extension-container"> <div class="card-content"> <span class="card-title"><i class="material-icons left">list_alt</i>Concordance</span> <p>Query your corpus with the CQP query language utilizing a KWIC view.</p> </div> </div> </div> <div class="col s3"> <div class="card extension-selector hoverable" data-target="reader-extension-container"> <div class="card-content"> <span class="card-title"><i class="material-icons left">chrome_reader_mode</i>Reader</span> <p>Inspect your corpus in detail with a full text view, including annotations.</p> </div> </div> </div> </div> #} {% include "test/analyse_corpus.concordance.html.j2" %} {% endblock page_content %} {% block modals %} {{ super() }} <div class="modal no-autoinit" id="corpus-analysis-app-init-modal"> <div class="modal-content"> <h4>Initializing session...</h4> <p>If the loading takes to long or an error occured, <a onclick="window.location.reload()" href="#">click here</a> to refresh your session or <a href="">go back</a>! </p> <div class="progress" id="corpus-analysis-app-init-progress"> <div class="indeterminate"></div> </div> <p class="error-color-text hide" id="corpus-analysis-app-init-error"></p> </div> </div> <div class="modal" id="cql-tutorial-modal"> <div class="modal-content"> {% with headline_num=4 %} {% include "main/manual/_08_cqp_query_language.html.j2" %} {% endwith %} </div> </div> <div class="modal" id="tagsets-modal"> <div class="modal-content"> <h4>Tagsets</h4> <ul class="tabs"> <li class="tab"><a class="active" href="#simple_pos-tagset">simple_pos</a></li> <li class="tab"><a href="#english-ent_type-tagset">English ent_type</a></li> <li class="tab"><a href="#english-pos-tagset">English pos</a></li> <li class="tab"><a href="#german-ent_type-tagset">German ent_type</a></li> <li class="tab"><a href="#german-pos-tagset">German pos</a></li> </ul> {% include "main/manual/_10_tagsets.html.j2" %} </div> </div> <div class="modal" id="concordance-query-builder" style="width:70%;"> <div class="modal-content" style="overflow-x:hidden;"> <div > <nav style="background-color:#6B3F89; margin-top:-25px; margin-left:-25px; width:105%;"> <div class="nav-wrapper" style="padding-left:15px;"> <a href="#!" class="brand-logo"><i class="material-icons">build</i>Query Builder</a> <i class="material-icons close right" style="margin-right: 50px; cursor:pointer;" id="close-query-builder">close</i> <a class="modal-trigger" href="#query-builder-tutorial-modal" > <i class="material-icons right tooltipped" id="query-builder-tutorial-info-icon" data-position="bottom" data-tooltip="Click here if you are unsure how to use the Query Builder <br>and want to find out what other options it offers.">help</i> </a> </div> </nav> </div> <p></p> <div id="query-container" class="hide"> <div class="row"> <h6 class="col s2">Your Query: <a class="modal-trigger" href="#query-builder-tutorial-modal"> <i class="material-icons left" id="general-options-query-builder-tutorial-info-icon" style="color:black;">help_outline</i></a> </h6> </div> <div class="row"> <div class="col s10 tooltipped" id="your-query" style="border-bottom-style: solid; border-bottom-width:1px;" data-position="bottom" data-tooltip="You can edit your query by deleting individual elements or moving them via drag and drop."></div> <a class="btn-small waves-effect waves-teal col s1" id="insert-query-button" style="background-color:#00426f; text-align:center"> <i class="material-icons">send</i> </a> </div> <p><i> Preview:</i></p> <p id="query-preview"></p> <br> </div> <h6>Use the following options to build your query. If you need help, click on the question mark in the upper right corner!</h6> <p></p> <a class="btn-large waves-effect waves-light tooltipped" id="positional-attr-button" 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-large waves-effect waves-light tooltipped" id="structural-attr-button" 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> <div id="structural-attr" class="hide"> <p></p> <h6 style="margin-left:15px;">Which structural attribute do you want to add to your query?<a class="modal-trigger" href="#query-builder-tutorial-modal"><i class="material-icons left" id="add-structural-attribute-tutorial-info-icon" style="color:black;">help_outline</i></a></h6> <p></p> <div class="row"> <div class="col s12"> <a class="btn-small waves-effect waves-light" id="sentence" style="background-color:#FD9720">sentence</a> <a class="btn-small waves-effect waves-light" id="entity" style="background-color:#A6E22D">entity</a> <a class="btn-small waves-effect waves-light" id="text-annotation" style="background-color:#2FBBAB">Meta Data</a> </div> </div> <div id="entity-builder" class="hide"> <p></p> <br> <div class="row"> <a class="btn waves-effect waves-light col s4" id="empty-entity">Add Entity of any type</a> <p class="col s1 l1"></p> <div class= "input-field col s3"> <select name="englishenttype" id="english-ent-type"> <option value="" disabled selected>English ent_type</option> <option value="CARDINAL">CARDINAL</option> <option value="DATE">DATE</option> <option value="EVENT">EVENT</option> <option value="FAC">FAC</option> <option value="GPE">GPE</option> <option value="LANGUAGE">LANGUAGE</option> <option value="LAW">LAW</option> <option value="LOC">LOC</option> <option value="MONEY">MONEY</option> <option value="NORP">NORP</option> <option value="ORDINAL">ORDINAL</option> <option value="ORG">ORG</option> <option value="PERCENT">PERCENT</option> <option value="PERSON">PERSON</option> <option value="PRODUCT">PRODUCT</option> <option value="QUANTITY">QUANTITY</option> <option value="TIME">TIME</option> <option value="WORK_OF_ART">WORK_OF_ART</option> </select> <label>Entity Type</label> </div> <div class= "input-field col s3"> <select name="germanenttype" id="german-ent-type"> <option value="" disabled selected>German ent_type</option> <option value="LOC">LOC</option> <option value="MISC">MISC</option> <option value="ORG">ORG</option> <option value="PER">PER</option> </select> </div> </div> </div> <div id="text-annotation-builder" class="hide"> <p></p> <br> <div class="row"> <div class= "input-field col s4 l3"> <select name="text-annotation-options" id="text-annotation-options"> <option class="btn-small waves-effect waves-light" value="address">address</option> <option class="btn-small waves-effect waves-light" value="author">author</option> <option class="btn-small waves-effect waves-light" value="booktitle">booktitle</option> <option class="btn-small waves-effect waves-light" value="chapter">chapter</option> <option class="btn-small waves-effect waves-light" value="editor">editor</option> <option class="btn-small waves-effect waves-light" value="institution">institution</option> <option class="btn-small waves-effect waves-light" value="journal">journal</option> <option class="btn-small waves-effect waves-light" value="pages">pages</option> <option class="btn-small waves-effect waves-light" value="publisher">publisher</option> <option class="btn-small waves-effect waves-light" value="publishing_year">publishing year</option> <option class="btn-small waves-effect waves-light" value="school">school</option> <option class="btn-small waves-effect waves-light" value="title">title</option> </select> <label>Meta data</label> </div> <div class= "input-field col s7 l5"> <i class="material-icons prefix">mode_edit</i> <input placeholder="Type in your text annotation" type="text" id="text-annotation-input"> </div> <div class="col s1 l1 center-align"> <p class="btn-floating waves-effect waves-light" id="text-annotation-submit"> <i class="material-icons right">send</i> </p> </div> <div class="hide" id="no-value-metadata-message" style="padding-top:25px; margin-left:-20px;"><i>No value entered!</i></div> </div> </div> </div> <div id="positional-attr" class="hide"> <p></p> <div class="row" style="background-color:#f2eff7; padding:15px; border-top-style: solid; border-color:#6B3F89"> <div class="col s5" style="margin-top:15px;"> <h6 style="margin-left:15px;">Which kind of token are you looking for? <a class="modal-trigger" href="#query-builder-tutorial-modal"><i class="material-icons left" id="token-tutorial-info-icon" style="color:black;">help_outline</i></a></h6> </div> <div class="input-field col s3"> <select id="token-attr"> <option value="word" selected>word</option> <option value="lemma">lemma</option> <option value="english-pos">english pos</option> <option value="german-pos">german pos</option> <option value="simple-pos-button">simple_pos</option> <option value="empty-token">empty token</option> </select> </div> </div> <p></p> <div id="token-builder-content"> <div class="row" > <div id="token-query"></div> <div id="word-builder"> <div class= "input-field col s3 l4"> <i class="material-icons prefix">mode_edit</i> <input placeholder="Type in your word" type="text" id="word-input"> </div> </div> <div id="lemma-builder" class="hide" > <div class= "input-field col s3 l4"> <i class="material-icons prefix">mode_edit</i> <input placeholder="Type in your lemma" type="text" id="lemma-input"> </div> </div> <div id="english-pos-builder" class="hide"> <div class="col s6 m4 l4"> <div class="row"> <div class= "input-field col s12"> <select name="englishpos" id="english-pos"> <option value="default" disabled selected>English pos tagset</option> <option value="ADD">email</option> <option value="AFX">affix</option> <option value="CC">conjunction, coordinating</option> <option value="CD">cardinal number</option> <option value="DT">determiner</option> <option value="EX">existential there</option> <option value="FW">foreign word</option> <option value="HYPH">punctuation mark, hyphen</option> <option value="IN">conjunction, subordinating or preposition</option> <option value="JJ">adjective</option> <option value="JJR">adjective, comparative</option> <option value="JJS">adjective, superlative</option> </select> <label>Part-of-speech tags</label> </div> </div> </div> </div> <div id="german-pos-builder" class="hide"> <div class="col s6 m4 l4"> <div class="row"> <div class= "input-field col s12"> <select name="germanpos" id="german-pos"> <option value="default" disabled selected>German pos tagset</option> <option value="ADJA">adjective, attributive</option> <option value="ADJD">adjective, adverbial or predicative</option> <option value="ADV">adverb</option> <option value="APPO">postposition</option> <option value="APPR">preposition; circumposition left</option> <option value="APPRART">preposition with article</option> <option value="APZR">circumposition right</option> <option value="ART">definite or indefinite article</option> </select> <label>Part-of-speech tags</label> </div> </div> </div> </div> <div id="simplepos-builder" class="hide"> <div class="col s6 m4 l4"> <div class="row"> <div class= "input-field col s12"> <select name="simplepos" id="simple-pos"> <option value="default" disabled selected>simple_pos tagset</option> <option value="ADJ">adjective</option> <option value="ADP">adposition</option> <option value="ADV">adverb</option> <option value="AUX">auxiliary verb</option> <option value="CONJ">coordinating conjunction</option> <option value="DET">determiner</option> <option value="INTJ">interjection</option> <option value="NOUN">noun</option> <option value="NUM">numeral</option> <option value="PART">particle</option> <option value="PRON">pronoun</option> <option value="PROPN">proper noun</option> <option value="PUNCT">punctuation</option> <option value="SCONJ">subordinating conjunction</option> <option value="SYM">symbol</option> <option value="VERB">verb</option> <option value="X">other</option> </select> <label>Simple part-of-speech tags</label> </div> </div> </div> </div> <div class="col s1 l1 center-align"> <p class="btn-floating waves-effect waves-light" id="token-submit"> <i class="material-icons right">send</i> </p> </div> <div class="hide" id="no-value-message" style="padding-top:25px; margin-left:-20px;"><i>No value entered!</i></div> </div> <div id="token-edit-options"> <div class="row"> <h6 style="margin-left:15px;">Options to edit your token: <a class="modal-trigger" href="#query-builder-tutorial-modal" style="color:black"><i class="material-icons left" id="edit-options-tutorial-info-icon">help_outline</i></a></h6> </div> <p></p> <div class="row"> <div id="input-options" class="col s5 m5 l5 xl4"> <a id="wildcard-char" class="btn-small waves-effect waves-light tooltipped" data-position="top" data-tooltip="Look for a variable character (also called wildcard character)">Wildcard character</a> <a id="option-group" class="btn-small waves-effect waves-light tooltipped" data-position="top" data-tooltip="Find character sequences from a list of options">Option Group</a> </div> <div class="col s3 m3 l3 xl3" id="incidence-modifiers-button"> <a class="dropdown-trigger btn-small waves-effect waves-light" href="#" data-target="incidence-modifiers" style="background-color:#2fbbab" 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> <ul id="incidence-modifiers" class="dropdown-content"> <li><a id="one-or-more" data-token="+" class="tooltipped" data-position ="top" data-tooltip="...occurrences of the character/token before">one or more (+)</a></li> <li><a id="zero-or-more" data-token="*" class="tooltipped" data-position ="top" data-tooltip="...occurrences of the character/token before">zero or more (*)</a></li> <li><a id="zero-or-one" data-token="?" class="tooltipped" data-position ="top" data-tooltip="...occurrences of the character/token before">zero or one (?)</a></li> <li><a id="exactly-n" class="modal-trigger tooltipped" href="#exactlyN" data-token="{n}" class="" data-position ="top" data-tooltip="...occurrences of the character/token before">exactly n ({n})</a></li> <li><a id="between-n-m" class="modal-trigger tooltipped" href="#betweenNM" data-token="{n,m}" class="" data-position ="top" data-tooltip="...occurrences of the character/token before">between n and m ({n,m})</a></li> </ul> <div id="ignore-case-checkbox" class="col s2 m2 l2 xl2"> <p id="ignore-case" style="margin-top:5px;"> <label> <input type="checkbox" class="filled-in" /> <span>Ignore Case</span> </label> </p> </div> <div class="col s2 m2 l2 xl2" id="condition-container"> <a class="btn-small tooltipped waves-effect waves-light" id="or" style="background-color:#fc0" data-position="bottom" data-tooltip="You can add another condition to your token. <br>At least one must be fulfilled">or</a> <a class="btn-small tooltipped waves-effect waves-light" id="and" style="background-color:#fc0" data-position="bottom" data-tooltip="You can add another condition to your token. <br>Both must be fulfilled">and</a> </div> </div> </div> </div> <div id ="exactlyN" class="modal"> <div class="row modal-content"> <div class= "input-field col s10"> <i class="material-icons prefix">mode_edit</i> <input placeholder="type in a number for 'n'" type="text" id="n-input"> </div> <div class="col s2"> <p class="btn-floating waves-effect waves-light" id="n-submit"> <i class="material-icons right">send</i> </p> </div> </div> </div> <div id ="betweenNM" class="modal" style="width:60%;"> <div class="row modal-content"> <div class= "input-field col s5"> <i class="material-icons prefix">mode_edit</i> <input placeholder="number for 'n'" type="text" id="n-m-input"> </div> <div class= "input-field col s5"> <i class="material-icons prefix">mode_edit</i> <input placeholder="number for 'm'" type="text" id="m-input"> </div> <div class="col s2"> <p class="btn-floating waves-effect waves-light" id="n-m-submit"> <i class="material-icons right">send</i> </p> </div> </div> </div> </div> </div> </div> <div class="modal modal-fixed-footer" id="query-builder-tutorial-modal" style="width:60%;"> <div class="modal-content" > <div id="query-builder-tutorial-start"></div> <ul class="tabs" style="margin-top:10px;"> <li class="tab"><a class="active" href="#query-builder-tutorial">Query Builder Tutorial</a></li> {# <li class="tab"><a href="#qb-examples">Examples</a></li> #} <li class="tab"><a href="#cql-cb-tutorial">Corpus Query Language Tutorial</a></li> <li class="tab"><a href="#tagsets-cb-tutorial">Tagsets</a></li> </ul> <div id="query-builder-tutorial" style="padding:15px;"> {% include "main/manual/_09_query_builder.html.j2" %} </div> {# <div id="qb-examples"></div> #} <div id ="cql-cb-tutorial"> {% with headline_num=4 %} {% include "main/manual/_08_cqp_query_language.html.j2" %} {% endwith %} </div> <div id="tagsets-cb-tutorial"> <h4>Tagsets</h4> {% include "main/manual/_10_tagsets.html.j2" %} </div> <div class="fixed-action-btn"> <a class="btn-floating btn-large teal" id="scroll-up-button-query-builder-tutorial" href='#query-builder-tutorial-start' style="background:#28B3D1"> <i class="large material-icons">arrow_upward</i> </a> </div> </div> </div> {% endblock modals %} {% block scripts %} {{ super() }} <script> const concordanceQueryBuilder = new ConcordanceQueryBuilder() </script> {% endblock scripts %}