Commit d656da50 authored by Gabriel Gutu-Robu's avatar Gabriel Gutu-Robu

Textual Complexity now shows which texts each index refers to

parent 15369aee
.displayed-text {
color: #555;
padding: 6px 12px;
font-size: 12px;
background: #f5f5f5;
}
:host ::ng-deep ul.level1 {
list-style-type: none;
padding-left: 6px;
}
:host ::ng-deep ul.level2 {
list-style-type: none;
padding-left: 12px;
}
span.complexity-value {
float: right;
}
p.status > a {
cursor: pointer;
}
div.body > div {
display: inline;
margin: 0 0 20px;
color: #a8afb0;
font-size: 14px;
font-weight: 400;
line-height: 1.35em;
letter-spacing: 0.04em;
}
......@@ -31,7 +31,8 @@
</div>
</div>
<app-demo-common-fields [formData]="formData" [language]="language" [languages]="languages"
(advancedEmitter)="advancedEmitter($event)" (languageEmitter)="languageEmitter($event)"></app-demo-common-fields>
(advancedEmitter)="advancedEmitter($event)" (languageEmitter)="languageEmitter($event)">
</app-demo-common-fields>
<div class="row top-buffer" *ngIf="!loading">
<div class="col-xs-12 col-md-12">
<div class="bottom-buttons" *ngIf="!loading">
......@@ -55,7 +56,7 @@
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12 col-lg-12">
<div class="col-xs-12 col-md-12 col-lg-6">
<ul class="course-description-list">
<li class="lesson" *ngFor="let indicesCategory of response.data.complexityIndices">
<div class="heading">
......@@ -65,16 +66,35 @@
<ul class="lesson-description">
<li *ngFor="let complexityIndex of indicesCategory.valences">
<div class="heading">
<span class="lesson-nr no-select">{{complexityIndex.value | number : '1.3-3' }}</span>
<span
class="lesson-nr no-select complexity-value">{{complexityIndex.value | number : '1.3-3' }}</span>
</div>
<div class="body">
<p>{{complexityIndex.index}}</p>
<p class="status">
<a (click)="showText(complexityIndex.paragraph_index, complexityIndex.sentence_index)" title="Show Text">
Show Text
</a>
</p>
<div>
<span>{{complexityIndex.index}}</span> ({{complexityIndex.type}} level)
<ng-container *ngIf="complexityIndex.paragraph_index != -1">
<br />Paragraph ID: {{complexityIndex.paragraph_index}}
</ng-container>
<ng-container *ngIf="complexityIndex.sentence_index != -1">
<br />Sentence ID: {{complexityIndex.sentence_index}}
</ng-container>
</div>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="col-xs-12 col-md-12 col-lg-6">
<div *ngIf="displayedText != null" class="displayed-text">
{{displayedText}}
</div>
</div>
</div>
</div>
</div>
......@@ -83,4 +103,4 @@
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
......@@ -23,6 +23,7 @@ export class TextualComplexityComponent implements OnInit {
showResults: boolean;
languages: any;
language: any;
displayedText: string;
response: any;
......@@ -34,6 +35,7 @@ export class TextualComplexityComponent implements OnInit {
this.componentTitle = TextualComplexityData.componentTitle;
this.languages = TextualComplexityData.languages;
this.language = TextualComplexityData.defaultLanguage;
this.displayedText = 'Selected text will be displayed in here.';
this.formData = {
'text': DefaultInputData.text,
......@@ -102,4 +104,75 @@ export class TextualComplexityComponent implements OnInit {
});
}
documentToStr(encapsulatorDepth = 1, decoratorTag = 'div', encapsulatorTag = 'ul') {
let sb = '';
sb += '<' + decoratorTag + '>';
sb += '<b>Document:</b> ';
sb += '<' + encapsulatorTag + ' class="level' + encapsulatorDepth + '">';
if (this.response.data.texts.length > 0) {
this.response.data.texts.forEach((paragraph, pIndex) => {
sb += this.paragraphToStr(pIndex, encapsulatorDepth + 1);
});
}
sb += '</' + encapsulatorTag + '>';
sb += '</' + decoratorTag + '>';
return sb;
}
paragraphToStr(paragraph_index = -1, encapsulatorDepth = 2, decoratorTag = 'li', encapsulatorTag = 'ul') {
if (paragraph_index === -1) {
return null;
}
let sb = '';
sb += '<' + decoratorTag + '>';
sb += '<b>Paragraph ' + paragraph_index + ':</b> ';
sb += '<' + encapsulatorTag + ' class="level' + encapsulatorDepth + '">';
if (this.response.data.texts[paragraph_index].length > 0) {
this.response.data.texts[paragraph_index].forEach((sentence, sIndex) => {
sb += this.sentenceToStr(paragraph_index, sIndex);
});
}
sb += '</' + encapsulatorTag + '>';
sb += '</' + decoratorTag + '>';
return sb;
}
sentenceToStr(paragraph_index = -1, sentence_index = -1, decoratorTag = 'li') {
if (paragraph_index === -1 || sentence_index === -1) {
return null;
}
let sb = '';
sb += '<' + decoratorTag + '>';
sb += '<b>Sentence ' + paragraph_index + '.' + sentence_index + '</b>: ';
sb += this.response.data.texts[paragraph_index][sentence_index];
sb += '</' + decoratorTag + '>';
return sb;
}
textToStr(paragraph_index = -1, sentence_index = -1) {
let sb = '';
if (sentence_index === -1) {
if (paragraph_index === -1) { // document level
sb += this.documentToStr();
} else { // pararaph level
sb += this.paragraphToStr(paragraph_index, 1, 'div');
}
} else { // sentence level
if (paragraph_index === -1) { // impossible
return null;
} else {
sb += this.sentenceToStr(paragraph_index, sentence_index, 'div');
}
}
return sb;
}
showText(paragraph_index = -1, sentence_index = -1) {
const sb = this.textToStr(paragraph_index, sentence_index);
jQuery('.displayed-text').html(sb);
jQuery('html, body').animate({
scrollTop: $('.displayed-text').offset().top - 70
}, 1000);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment