mirror of
				https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
				synced 2025-11-04 04:12:45 +00:00 
			
		
		
		
	Fix some bugs in corpus analysis and simplify code
This commit is contained in:
		@@ -70,6 +70,27 @@ $color: (
 | 
			
		||||
      "COMPLETED": #4caf50,
 | 
			
		||||
      "FAILED": #f44336
 | 
			
		||||
    )
 | 
			
		||||
  ),
 | 
			
		||||
  "s-attr": (
 | 
			
		||||
    "PERSON": #a6e22d,
 | 
			
		||||
    "PER": #a6e22d,
 | 
			
		||||
    "NORP": #ef60b4,
 | 
			
		||||
    "FACILITY": #43c6fc,
 | 
			
		||||
    "ORG": #43c6fc,
 | 
			
		||||
    "GPE": #fd9720,
 | 
			
		||||
    "LOC": #fd9720,
 | 
			
		||||
    "PRODUCT": #a99dfb,
 | 
			
		||||
    "MISC": #a99dfb,
 | 
			
		||||
    "EVENT": #fc0,
 | 
			
		||||
    "WORK_OF_ART": #fc0,
 | 
			
		||||
    "LANGUAGE": #fc0,
 | 
			
		||||
    "DATE": #2fbbab,
 | 
			
		||||
    "TIME": #2fbbab,
 | 
			
		||||
    "PERCENT": #bbb,
 | 
			
		||||
    "MONEY": #bbb,
 | 
			
		||||
    "QUANTITY": #bbb,
 | 
			
		||||
    "ORDINAL": #bbb,
 | 
			
		||||
    "CARDINAL": #bbb
 | 
			
		||||
  )
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
@@ -195,6 +216,13 @@ $color: (
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@each $key, $color-code in map-get($color, "s-attr") {
 | 
			
		||||
  .chip.s-attr[data-s-attr-type="ent"][data-s-attr-ent-type="#{$key}"] {
 | 
			
		||||
    background-color: $color-code !important;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
main {
 | 
			
		||||
  .btn, .btn-small, .btn-large, .btn-floating {
 | 
			
		||||
    background-color: map-deep-get($color, "baseline", "secondary");
 | 
			
		||||
 
 | 
			
		||||
@@ -1,26 +1,4 @@
 | 
			
		||||
class CorpusAnalysisApp {
 | 
			
		||||
  static entitiyColors = {
 | 
			
		||||
     PERSON: '#a6e22d',
 | 
			
		||||
     PER: '#a6e22d',
 | 
			
		||||
     NORP: '#ef60b4',
 | 
			
		||||
     FACILITY: '#43c6fc',
 | 
			
		||||
     ORG: '#43c6fc',
 | 
			
		||||
     GPE: '#fd9720',
 | 
			
		||||
     LOC: '#fd9720',
 | 
			
		||||
     PRODUCT: '#a99dfb',
 | 
			
		||||
     MISC: '#a99dfb',
 | 
			
		||||
     EVENT: ':#fc0',
 | 
			
		||||
     WORK_OF_ART: '#fc0',
 | 
			
		||||
     LANGUAGE: '#fc0',
 | 
			
		||||
     DATE: '#2fbbab',
 | 
			
		||||
     TIME: '#2fbbab',
 | 
			
		||||
     PERCENT: '#bbb',
 | 
			
		||||
     MONEY: '#bbb',
 | 
			
		||||
     QUANTITY: '#bbb',
 | 
			
		||||
     ORDINAL: '#bbb',
 | 
			
		||||
     CARDINAL: '#bbb'
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  constructor(corpusId) {
 | 
			
		||||
    this.data = {};
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -331,26 +331,24 @@ class CorpusAnalysisConcordance {
 | 
			
		||||
 | 
			
		||||
  cposRange2HTML(firstCpos, lastCpos) {
 | 
			
		||||
    let subcorpus = this.data.subcorpora[this.settings.selectedSubcorpus];
 | 
			
		||||
    let prevPAttr, pAttr, nextPAttr;
 | 
			
		||||
    let isEntityStart, isEntityEnd;
 | 
			
		||||
    let html = '';
 | 
			
		||||
    for (let cpos = firstCpos; cpos <= lastCpos; cpos++) {
 | 
			
		||||
      prevPAttr = cpos > firstCpos ? subcorpus.p.lookups.cpos_lookup[cpos - 1] : null;
 | 
			
		||||
      pAttr = subcorpus.p.lookups.cpos_lookup[cpos];
 | 
			
		||||
      nextPAttr = cpos < lastCpos ? subcorpus.p.lookups.cpos_lookup[cpos + 1] : null;
 | 
			
		||||
      isEntityStart = 'ent' in pAttr && pAttr.ent !== prevPAttr?.ent;
 | 
			
		||||
      isEntityEnd = 'ent' in pAttr && pAttr.ent !== nextPAttr?.ent;
 | 
			
		||||
      let prevPAttr = cpos > firstCpos ? subcorpus.p.lookups.cpos_lookup[cpos - 1] : null;
 | 
			
		||||
      let pAttr = subcorpus.p.lookups.cpos_lookup[cpos];
 | 
			
		||||
      let nextPAttr = cpos < lastCpos ? subcorpus.p.lookups.cpos_lookup[cpos + 1] : null;
 | 
			
		||||
      let isEntityStart = 'ent' in pAttr && pAttr.ent !== prevPAttr?.ent;
 | 
			
		||||
      let isEntityEnd = 'ent' in pAttr && pAttr.ent !== nextPAttr?.ent;
 | 
			
		||||
      // Add a space before pAttr
 | 
			
		||||
      if (cpos !== firstCpos || pAttr.simple_pos !== 'PUNCT') {html += ' ';}
 | 
			
		||||
      // Add entity start
 | 
			
		||||
      if (isEntityStart) {
 | 
			
		||||
        html += `<span class="s-attr" data-cpos="${cpos}" data-id="${pAttr.ent}" data-type="ent">`;
 | 
			
		||||
        html += `<span class="s-attr" data-cpos="${cpos}" data-id="${pAttr.ent}" data-s-attr-type="ent" data-s-attr-ent-type="${subcorpus.p.lookups.ent_lookup[pAttr.ent].type}">`;
 | 
			
		||||
      }
 | 
			
		||||
      // Add pAttr
 | 
			
		||||
      html += `<span class="p-attr" data-cpos="${cpos}"></span>`;
 | 
			
		||||
      // Add entity end
 | 
			
		||||
      if (isEntityEnd) {
 | 
			
		||||
        html += ` <span class="badge black-text hide new s-attr white" cpos="${cpos}" data-type="ent_type" data-badge-caption="">${subcorpus.p.lookups.ent_lookup[pAttr.ent].type}</span>`;
 | 
			
		||||
        html += ` <span class="black-text hide new white ent-indicator" data-badge-caption="">${subcorpus.p.lookups.ent_lookup[pAttr.ent].type}</span>`;
 | 
			
		||||
        html += '</span>';
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
@@ -369,19 +367,17 @@ class CorpusAnalysisConcordance {
 | 
			
		||||
        pAttrElement.setAttribute('class', 'p-attr');
 | 
			
		||||
      }
 | 
			
		||||
      // Set basic styling on .s-attr[data-type="ent"] elements
 | 
			
		||||
      for (let entElement of this.elements.subcorpusItems.querySelectorAll('.s-attr[data-type="ent"]')) {
 | 
			
		||||
        entElement.querySelector('.s-attr[data-type="ent_type"]').classList.add('hide');
 | 
			
		||||
      for (let entElement of this.elements.subcorpusItems.querySelectorAll('.s-attr[data-s-attr-type="ent"]')) {
 | 
			
		||||
        entElement.querySelector('.ent-indicator').classList.add('hide');
 | 
			
		||||
        entElement.removeAttribute('style');
 | 
			
		||||
        entElement.setAttribute('class', 's-attr');
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    if (this.settings.textStyle >= 1) {
 | 
			
		||||
      // Set advanced styling on .s-attr[data-type="ent"] elements
 | 
			
		||||
      for (let entElement of this.elements.subcorpusItems.querySelectorAll('.s-attr[data-type="ent"]')) {
 | 
			
		||||
        let ent = subcorpus.p.lookups.ent_lookup[entElement.dataset.id];
 | 
			
		||||
      for (let entElement of this.elements.subcorpusItems.querySelectorAll('.s-attr[data-s-attr-type="ent"]')) {
 | 
			
		||||
        entElement.classList.add('chip');
 | 
			
		||||
        entElement.style.backgroundColor = CorpusAnalysisApp.entitiyColors[ent.type];
 | 
			
		||||
        entElement.querySelector('.s-attr[data-type="ent_type"]').classList.remove('hide');
 | 
			
		||||
        entElement.querySelector('.ent-indicator').classList.remove('hide');
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    if (this.settings.textStyle >= 2) {
 | 
			
		||||
 
 | 
			
		||||
@@ -75,12 +75,9 @@ class CorpusAnalysisReader {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  clearCorpus() {
 | 
			
		||||
    let pAttrElement;
 | 
			
		||||
    let pAttrElements;
 | 
			
		||||
 | 
			
		||||
    // Destroy with .p-attr elements associated Materialize tooltips
 | 
			
		||||
    pAttrElements = this.elements.corpus.querySelectorAll('.p-attr.tooltipped');
 | 
			
		||||
    for (pAttrElement of pAttrElements) {
 | 
			
		||||
    let pAttrElements = this.elements.corpus.querySelectorAll('.p-attr.tooltipped');
 | 
			
		||||
    for (let pAttrElement of pAttrElements) {
 | 
			
		||||
      M.Tooltip.getInstance(pAttrElement)?.destroy();
 | 
			
		||||
    }
 | 
			
		||||
    this.elements.corpus.innerHTML = `
 | 
			
		||||
@@ -92,10 +89,8 @@ class CorpusAnalysisReader {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  renderCorpus() {
 | 
			
		||||
    let item;
 | 
			
		||||
 | 
			
		||||
    this.clearCorpus();
 | 
			
		||||
    item = this.data.corpus.p.items[0];
 | 
			
		||||
    let item = this.data.corpus.p.items[0];
 | 
			
		||||
    this.elements.corpus.innerHTML += `
 | 
			
		||||
        <p>${this.cposRange2HTML(item[0], item[item.length - 1])}</p>
 | 
			
		||||
    `.trim();
 | 
			
		||||
@@ -109,10 +104,6 @@ class CorpusAnalysisReader {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  renderCorpusPagination() {
 | 
			
		||||
    let i;
 | 
			
		||||
    let page;
 | 
			
		||||
    let paginateTriggerElement;
 | 
			
		||||
 | 
			
		||||
    this.clearCorpusPagination();
 | 
			
		||||
    if (this.data.corpus.p.pages === 0) {return;}
 | 
			
		||||
    this.elements.corpusPagination.innerHTML += `
 | 
			
		||||
@@ -129,7 +120,7 @@ class CorpusAnalysisReader {
 | 
			
		||||
        </a>
 | 
			
		||||
      </li>
 | 
			
		||||
    `.trim();
 | 
			
		||||
    for (i = 1; i <= this.data.corpus.p.pages; i++) {
 | 
			
		||||
    for (let i = 1; i <= this.data.corpus.p.pages; i++) {
 | 
			
		||||
      this.elements.corpusPagination.innerHTML += `
 | 
			
		||||
        <li class="${i === this.data.corpus.p.page ? 'active' : 'waves-effect'}">
 | 
			
		||||
          <a class="corpus-analysis-action pagination-trigger" ${i === this.data.corpus.p.page ? '' : 'data-target="' + i + '"'}>${i}</a>
 | 
			
		||||
@@ -150,10 +141,10 @@ class CorpusAnalysisReader {
 | 
			
		||||
        </a>
 | 
			
		||||
      </li>
 | 
			
		||||
    `.trim();
 | 
			
		||||
    for (paginateTriggerElement of this.elements.corpusPagination.querySelectorAll('.pagination-trigger[data-target]')) {
 | 
			
		||||
    for (let paginateTriggerElement of this.elements.corpusPagination.querySelectorAll('.pagination-trigger[data-target]')) {
 | 
			
		||||
      paginateTriggerElement.addEventListener('click', event => {
 | 
			
		||||
        event.preventDefault();
 | 
			
		||||
        page = parseInt(paginateTriggerElement.dataset.target);
 | 
			
		||||
        let page = parseInt(paginateTriggerElement.dataset.target);
 | 
			
		||||
        this.page(page);
 | 
			
		||||
      });
 | 
			
		||||
    }
 | 
			
		||||
@@ -161,27 +152,24 @@ class CorpusAnalysisReader {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  cposRange2HTML(firstCpos, lastCpos) {
 | 
			
		||||
    let cpos;
 | 
			
		||||
    let prevPAttr, pAttr, nextPAttr;
 | 
			
		||||
    let isEntityStart, isEntityEnd;
 | 
			
		||||
    let html = '';
 | 
			
		||||
    for (cpos = firstCpos; cpos <= lastCpos; cpos++) {
 | 
			
		||||
      prevPAttr = cpos > firstCpos ? this.data.corpus.p.lookups.cpos_lookup[cpos - 1] : null;
 | 
			
		||||
      pAttr = this.data.corpus.p.lookups.cpos_lookup[cpos];
 | 
			
		||||
      nextPAttr = cpos < lastCpos ? this.data.corpus.p.lookups.cpos_lookup[cpos + 1] : null;
 | 
			
		||||
      isEntityStart = 'ent' in pAttr && pAttr.ent !== prevPAttr?.ent;
 | 
			
		||||
      isEntityEnd = 'ent' in pAttr && pAttr.ent !== nextPAttr?.ent;
 | 
			
		||||
    for (let cpos = firstCpos; cpos <= lastCpos; cpos++) {
 | 
			
		||||
      let prevPAttr = cpos > firstCpos ? this.data.corpus.p.lookups.cpos_lookup[cpos - 1] : null;
 | 
			
		||||
      let pAttr = this.data.corpus.p.lookups.cpos_lookup[cpos];
 | 
			
		||||
      let nextPAttr = cpos < lastCpos ? this.data.corpus.p.lookups.cpos_lookup[cpos + 1] : null;
 | 
			
		||||
      let isEntityStart = 'ent' in pAttr && pAttr.ent !== prevPAttr?.ent;
 | 
			
		||||
      let isEntityEnd = 'ent' in pAttr && pAttr.ent !== nextPAttr?.ent;
 | 
			
		||||
      // Add a space before pAttr
 | 
			
		||||
      if (cpos !== firstCpos || pAttr.simple_pos !== 'PUNCT') {html += ' ';}
 | 
			
		||||
      // Add entity start
 | 
			
		||||
      if (isEntityStart) {
 | 
			
		||||
        html += `<span class="s-attr" data-cpos="${cpos}" data-id="${pAttr.ent}" data-type="ent">`;
 | 
			
		||||
        html += `<span class="s-attr" data-cpos="${cpos}" data-id="${pAttr.ent}" data-s-attr-type="ent" data-s-attr-ent-type="${this.data.corpus.p.lookups.ent_lookup[pAttr.ent].type}">`;
 | 
			
		||||
      }
 | 
			
		||||
      // Add pAttr
 | 
			
		||||
      html += `<span class="p-attr" data-cpos="${cpos}"></span>`;
 | 
			
		||||
      // Add entity end
 | 
			
		||||
      if (isEntityEnd) {
 | 
			
		||||
        html += ` <span class="badge black-text hide new s-attr white" cpos="${cpos}" data-type="ent_type" data-badge-caption="">${this.data.corpus.p.lookups.ent_lookup[pAttr.ent].type}</span>`;
 | 
			
		||||
        html += ` <span class="badge black-text hide new white ent-indicator" data-badge-caption="">${this.data.corpus.p.lookups.ent_lookup[pAttr.ent].type}</span>`;
 | 
			
		||||
        html += '</span>';
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
@@ -219,19 +207,17 @@ class CorpusAnalysisReader {
 | 
			
		||||
        pAttrElement.setAttribute('class', 'p-attr');
 | 
			
		||||
      }
 | 
			
		||||
      // Set basic styling on .s-attr[data-type="ent"] elements
 | 
			
		||||
      for (let entElement of this.elements.corpus.querySelectorAll('.s-attr[data-type="ent"]')) {
 | 
			
		||||
        entElement.querySelector('.s-attr[data-type="ent_type"]').classList.add('hide');
 | 
			
		||||
      for (let entElement of this.elements.corpus.querySelectorAll('.s-attr[data-s-attr-type="ent"]')) {
 | 
			
		||||
        entElement.querySelector('.ent-indicator').classList.add('hide');
 | 
			
		||||
        entElement.removeAttribute('style');
 | 
			
		||||
        entElement.setAttribute('class', 's-attr');
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    if (this.settings.textStyle >= 1) {
 | 
			
		||||
      // Set advanced styling on .s-attr[data-type="ent"] elements
 | 
			
		||||
      for (let entElement of this.elements.corpus.querySelectorAll('.s-attr[data-type="ent"]')) {
 | 
			
		||||
        let ent = this.data.corpus.p.lookups.ent_lookup[entElement.dataset.id];
 | 
			
		||||
      for (let entElement of this.elements.corpus.querySelectorAll('.s-attr[data-s-attr-type="ent"]')) {
 | 
			
		||||
        entElement.classList.add('chip');
 | 
			
		||||
        entElement.style.backgroundColor = CorpusAnalysisApp.entitiyColors[ent.type];
 | 
			
		||||
        entElement.querySelector('.s-attr[data-type="ent_type"]').classList.remove('hide');
 | 
			
		||||
        entElement.querySelector('.ent-indicator').classList.remove('hide');
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    if (this.settings.textStyle >= 2) {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user