Add new feature on results preview

This commit is contained in:
kostis30fyllou 2020-06-29 18:19:19 +03:00
parent a871e67caf
commit 99c443a32f
3 changed files with 23 additions and 10 deletions

View File

@ -4,4 +4,5 @@ export class Match {
context: string;
extraprev: string;
extranext: string;
occurences: string;
}

View File

@ -46,8 +46,8 @@
<div id="cm-run-test-section">
<div class="uk-display-inline">
<button id="run-mining-btn" class="uk-button cm-run-test-button" [disabled]="documentsLoaded<1" (click)="runMining()">Run rules test</button>
<span *ngIf="matches_number !== ''" id="results-number" class="cm-coloured-text uk-margin-left uk-text-bottom">{{matches_number}} matche{{matches_number == '1'?'':'s'}} found</span>
<span *ngIf="prev_matches_number !== ''" id="results-number-previous" class="cm-text-muted uk-text-bottom">, {{prev_matches_number}} matche{{prev_matches_number == '1'?'':'s'}} found previously</span>
<span *ngIf="matches_number !== ''" id="results-number" class="cm-coloured-text uk-margin-left uk-text-bottom">{{matches_number}} match{{matches_number == '1'?'':'es'}} found</span>
<span *ngIf="prev_matches_number !== ''" id="results-number-previous" class="cm-text-muted uk-text-bottom">, {{prev_matches_number}} match{{prev_matches_number == '1'?'':'es'}} found previously</span>
</div>
</div>
<div id="results-section" class="cm-results-rows">
@ -55,8 +55,16 @@
<li *ngFor="let result of resultsArray;" class="uk-card uk-card-default uk-card-small uk-card-body uk-open">
<h3 class="uk-accordion-title"><span class="uk-text-meta">document:</span> {{result.docTitle}}</h3>
<div class="uk-accordion-content" aria-hidden="false">
</div>
<div class="uk-accordion-content" aria-hidden="false">
<div *ngFor="let match of result.matches">
<div class="match"><span class="uk-text-meta">match #{{match.matchcounter}}:</span> {{match.match}}</div>
<p class="cm-document-result" style="color:brown">
<b>All possible occurences in original text:</b> </p>
<p [innerHTML]="match.occurences" ></p>
<p class="cm-document-result" style="color:green">
<b>High confidence match after applying the mining rules: </b></p>
<p class="cm-document-result">
{{match.extraprev}} <span class="textwindow" [innerHTML]="match.context"></span> {{match.extranext}}
</p>

View File

@ -98,13 +98,13 @@ export class ResultspreviewComponent implements OnInit {
}
highlightInElement(element: string, text: string): string {
let elementHtml = element;
const tags = [];
const tagLocations = [];
const htmlTagRegEx = /<{1}\/{0,1}\w+>{1}/;
var elementHtml = element;
var tags = [];
var tagLocations = [];
var htmlTagRegEx = /<{1}\/{0,1}\w+>{1}/;
// Strip the tags from the elementHtml and keep track of them
let htmlTag;
var htmlTag;
while (htmlTag = elementHtml.match(htmlTagRegEx)) {
tagLocations[tagLocations.length] = elementHtml.search(htmlTagRegEx);
tags[tags.length] = htmlTag;
@ -112,7 +112,7 @@ export class ResultspreviewComponent implements OnInit {
}
// Search for the text in the stripped html
const textLocation = elementHtml.search(text);
var textLocation = elementHtml.search(text);
if (textLocation) {
// Add the highlight
const highlightHTMLStart = '<span class="highlight">';
@ -120,9 +120,9 @@ export class ResultspreviewComponent implements OnInit {
elementHtml = elementHtml.replace(text, highlightHTMLStart + text + highlightHTMLEnd);
// Plug back in the HTML tags
const textEndLocation = textLocation + text.length;
var textEndLocation = textLocation + text.length;
for (let i = tagLocations.length - 1; i >= 0; i--) {
let location = tagLocations[i];
var location = tagLocations[i];
if (location > textEndLocation) {
location += highlightHTMLStart.length + highlightHTMLEnd.length;
} else if (location > textLocation) {
@ -168,6 +168,9 @@ export class ResultspreviewComponent implements OnInit {
match.match = values.match;
match.extraprev = values.extraprev;
match.extranext = values.extranext;
match.occurences = values.occurences;
let context = values.prev + ' ' + values.middle + ' ' + values.next;
// hightlight positive words
for (const posword in JSON.parse(localStorage.getItem('poswords'))) {
@ -188,6 +191,7 @@ export class ResultspreviewComponent implements OnInit {
return '<span class="negative">' + x + '</span>';
});
}
context = this.highlightInElement(context, values.match);
match.context = context;
match.matchcounter = ++matchcounter;