Commit 13d4fc82 authored by Konstantin Schulz's avatar Konstantin Schulz
Browse files

ShowTextPage now offers texts for download as PDF or DOCX

parent 069db711
This diff is collapsed.
{
"name": "mc_frontend",
"version": "0.8.7",
"version": "0.8.9",
"author": "Ionic Framework",
"homepage": "https://ionicframework.com/",
"scripts": {
......@@ -26,6 +26,7 @@
"@ionic/angular": "^4.3.1",
"@ionic/core": "^4.4.0",
"@ionic/storage": "^2.2.0",
"@ngtools/webpack": "^7.3.9",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"cordova-browser": "5.0.4",
......
......@@ -25,7 +25,7 @@ export class AppComponent {
this.splashScreen.hide();
});
this.initTranslate();
this.helperService.initConfig();
this.helperService.initConfig().then();
}
initTranslate() {
......
......@@ -62,9 +62,11 @@ export class CorpusService {
});
this.initPhenomenonMap();
this.getTranslations();
if (HelperService.mostRecentSetup) {
this.restoreLastCorpus().then();
}
this.checkAnnisResponse().then(() => {
if (HelperService.mostRecentSetup) {
this.restoreLastCorpus().then();
}
});
}
adjustQueryValue(query: QueryMC) {
......@@ -93,6 +95,19 @@ export class CorpusService {
}
}
checkAnnisResponse() {
return new Promise((resolve) => {
if (this.annisResponse) {
resolve();
}
this.helperService.loadMostRecentSetup().then(() => {
this.annisResponse = HelperService.mostRecentSetup.annisResponse;
this.currentUrn = HelperService.mostRecentSetup.currentUrn;
resolve();
});
});
}
checkForUpdates() {
// check local storage for necessary updates
const updateInfoJSON: object = JSON.parse(window.localStorage.getItem(HelperService.config['localStorageKeyUpdateInfo']));
......@@ -148,7 +163,7 @@ export class CorpusService {
});
}
getText() {
getText(saveToCache: boolean = true) {
return new Promise((resolve, reject) => {
this.currentText = '';
if (HelperService.isVocabularyCheck) {
......@@ -158,7 +173,7 @@ export class CorpusService {
HelperService.isLoading = true;
this.getCTStextPassage(this.currentUrn).subscribe((ar: AnnisResponse) => {
HelperService.isLoading = false;
this.processAnnisResponse(ar);
this.processAnnisResponse(ar, saveToCache);
resolve();
}, async (error: HttpErrorResponse) => {
HelperService.isLoading = false;
......@@ -316,13 +331,13 @@ export class CorpusService {
this.currentTextRange = HelperService.mostRecentSetup.currentTextRange;
this.isTextRangeCorrect = true;
if (Object.keys(this.annisResponse.graph).length) {
this.processAnnisResponse(this.annisResponse);
this.processAnnisResponse(this.annisResponse, false);
}
// check if the data is already present
if (this.currentText) {
return resolve();
}
this.getText().then(() => {
this.getText(false).then(() => {
return resolve();
}, () => {
return reject();
......
......@@ -104,7 +104,7 @@ export class ExerciseParametersPage {
this.http.post(url, formData).subscribe((ar: AnnisResponse) => {
HelperService.isLoading = false;
HelperService.mostRecentSetup.annisResponse = ar;
this.helperService.saveMostRecentSetup();
this.helperService.saveMostRecentSetup().then();
this.corpusService.annisResponse.exercise_id = ar.exercise_id;
this.corpusService.annisResponse.uri = ar.uri;
this.corpusService.annisResponse.solutions = ar.solutions;
......
......@@ -172,9 +172,15 @@ export class HelperService {
const part1: string = location.protocol.concat('//').concat(window.location.host);
HelperService.config['backendBaseUrl'] = part1.concat(HelperService.config['backendBaseApiPath']).concat('/');
}
this.storage.get(HelperService.config['localStorageKeyMostRecentSetup']).then((mrs: string) => {
HelperService.mostRecentSetup = JSON.parse(mrs);
});
resolve();
});
});
}
loadMostRecentSetup() {
return new Promise((resolve) => {
this.storage.get(HelperService.config['localStorageKeyMostRecentSetup']).then((mrs: string) => {
HelperService.mostRecentSetup = JSON.parse(mrs);
resolve();
});
});
......
......@@ -15,7 +15,7 @@
<ion-content padding>
<div *ngIf="corpusService.annisResponse.solutions; else loading">
<div *ngIf="corpusService.annisResponse?.solutions; else loading">
<ion-grid>
<ion-row *ngIf="HelperService.isVocabularyCheck">
<ion-col>
......@@ -52,7 +52,7 @@ beginning that it is going to be a download (instead of an ordinary link or clic
<a href="{{HelperService.config['developerMailTo']}}">{{ 'EMAIL_ERROR' | translate }}</a>
</ion-col>
</ion-row>
<ion-row>
<ion-row *ngIf="corpusService.exercise.type !== ExerciseType.markWords">
<ion-col>
<h4 (click)="showInstructions = !showInstructions" class="pointer">
<button *ngIf="showInstructions; else dropright">
......
......@@ -32,13 +32,16 @@ export class PreviewPage implements OnDestroy {
public http: HttpClient,
public exerciseService: ExerciseService,
public translateService: TranslateService,
public corpusService: CorpusService) {
public corpusService: CorpusService,
public helperService: HelperService) {
this.currentSolutions = [];
if (!HelperService.isVocabularyCheck) {
this.exerciseService.excludeOOV = false;
}
this.processAnnisResponse(this.corpusService.annisResponse);
this.initH5P();
this.corpusService.checkAnnisResponse().then(() => {
this.processAnnisResponse(this.corpusService.annisResponse);
this.initH5P();
});
}
initH5P() {
......@@ -95,10 +98,9 @@ export class PreviewPage implements OnDestroy {
}
updateFileUrl() {
const uriParts: string[] = this.corpusService.annisResponse.uri.split('/');
const fileId: string = uriParts[uriParts.length - 1];
const fileTypeBase = '?type=';
this.urlBase = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'] + '/' + fileId + fileTypeBase;
const fileId: string = this.corpusService.annisResponse.exercise_id;
const fileTypeBase = '&type=';
this.urlBase = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'] + '?id=' + fileId + fileTypeBase;
this.solutionIndicesString = this.exerciseService.excludeOOV ? '&solution_indices=' +
JSON.stringify(this.currentSolutions.map(x => this.corpusService.annisResponse.solutions.indexOf(x))) : '';
}
......
......@@ -2,8 +2,8 @@
<ion-toolbar>
<div class="toolbar-left">
<ion-back-button icon="arrow-round-back" defaultHref="home"></ion-back-button>
<ion-title>{{corpusService.currentCorpus.title}}
{{corpusService.currentUrn.split(":")[corpusService.currentUrn.split(":").length - 1]}}
<ion-title>{{corpusService.currentCorpus?.title}}
{{corpusService.currentUrn?.split(":")[corpusService.currentUrn?.split(":").length - 1]}}
</ion-title>
</div>
<div class="toolbar-right">
......@@ -37,15 +37,39 @@
<br>
</ion-col>
</ion-row>
<ion-row>
<ion-col><br></ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-button (click)="generateDownloadLink(FileType[FileType.pdf])">
{{ 'GENERATE_FILE_PDF' | translate }}
</ion-button>
</ion-col>
<ion-col>
<ion-button (click)="generateDownloadLink(FileType[FileType.docx])">
{{ 'GENERATE_FILE_DOCX' | translate }}
</ion-button>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-spinner *ngIf="isDownloading"></ion-spinner>
<!-- hidden download link, do not delete this!
This is preferable compared to a button click event, because the browser knows from the beginning that
it is going to be a download (instead of an ordinary link or click). -->
<a style="display: none" id="download" href="" download>Download</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="text">
<div *ngIf="highlightOOV; else noOOV">
<!-- do not add whitespace/newline etc. between the span elements! -->
<span *ngFor="let node of corpusService.annisResponse.graph.nodes; index as i"><span
[class.oov]="node.is_oov">{{node.annis_tok}}</span>{{ getWhiteSpace(i) }}</span>
<span *ngFor="let node of corpusService.annisResponse.graph.nodes; index as i"><span class="tok"
[class.oov]="node.is_oov">{{node.annis_tok}}</span>{{ getWhiteSpace(i) }}</span>
</div>
<ng-template #noOOV>
<span>{{corpusService.currentText}}</span>
<span class="tok">{{corpusService.currentText}}</span>
</ng-template>
</ion-col>
</ion-row>
......
/* tslint:disable:no-string-literal */
import {Component} from '@angular/core';
import {NavController, ToastController} from '@ionic/angular';
import {CorpusService} from 'src/app/corpus.service';
......@@ -5,6 +6,9 @@ import {VocabularyService} from 'src/app/vocabulary.service';
import {ExerciseService} from 'src/app/exercise.service';
import {HelperService} from 'src/app/helper.service';
import {TranslateService} from '@ngx-translate/core';
import {FileType} from '../models/enum';
import {AnnisResponse} from 'src/app/models/annisResponse';
import {HttpClient, HttpHeaders} from '@angular/common/http';
@Component({
selector: 'app-show-text',
......@@ -12,17 +16,56 @@ import {TranslateService} from '@ngx-translate/core';
styleUrls: ['./show-text.page.scss'],
})
export class ShowTextPage {
FileType = FileType;
HelperService = HelperService;
ObjectKeys = Object.keys;
public highlightOOV = false;
public htmlContentString: string;
public text: string;
public urlBase: string;
public isDownloading: boolean = false;
constructor(public navCtrl: NavController,
public corpusService: CorpusService,
public exerciseService: ExerciseService,
public toastCtrl: ToastController,
public translateService: TranslateService,
public vocService: VocabularyService) {
public vocService: VocabularyService,
public http: HttpClient) {
this.updateFileUrl();
}
generateDownloadLink(fileType: string) {
const formData = new FormData();
let content = document.querySelector('.text').outerHTML;
// add underline elements so we do not need to specify CSS options in the backend's PDF generator
content = content.replace(/(?<=oov">)(.+?)(?=<\/span>)/g, '<u>$1</u>');
const authorTitle: string = this.corpusService.currentCorpus.author + ', ' + this.corpusService.currentCorpus.title;
const textRange: string = [this.corpusService.currentTextRange.start.join('.'),
this.corpusService.currentTextRange.end.join('.')].join('-');
content = `<p>${authorTitle} ${textRange}</p>` + content;
formData.append('html_content', content); // '<p>test</p>'
formData.append('file_type', fileType);
formData.append('urn', this.corpusService.currentUrn);
this.isDownloading = true;
this.http.post(this.urlBase, formData).subscribe((response: string) => {
this.isDownloading = false;
console.log(response);
const responseParts: string[] = response.split('.');
const link: HTMLLinkElement = document.querySelector('#download');
link.href = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'] + '?id='
+ responseParts[0] + '&type=' + responseParts[1];
link.style.display = 'block';
}, async (error: any) => {
this.isDownloading = false;
HelperService.currentError = error;
const toast = await this.toastCtrl.create({
message: HelperService.generalErrorAlertMessage,
duration: 3000,
position: 'top'
});
toast.present().then();
});
}
goToExerciseParametersPage() {
......@@ -38,4 +81,12 @@ export class ShowTextPage {
}
return '';
}
updateFileUrl() {
const fileId: string = this.corpusService.currentUrn;
const fileTypeBase = '&type=';
this.urlBase = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'];
// + '?id=' + fileId + fileTypeBase;
// this.urlBase += '?html_content=';
}
}
......@@ -200,7 +200,7 @@
<ion-toolbar>
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tab-button (click)="sendData()">
<ion-tab-button (click)="sendData().then()">
<ion-icon name="send"></ion-icon>
<ion-label>{{ 'TEST_MODULE_SEND_DATA' | translate }}</ion-label>
</ion-tab-button>
......
......@@ -328,13 +328,13 @@ export class TestPage implements OnDestroy, OnInit {
toast.present().then();
return;
}
const learnerId: string = this.vocService.currentTestResults[Object.keys(this.vocService.currentTestResults)[0]]
.statement.actor.account.name;
const fileUrl: string = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'] + '/' + learnerId;
const fileUrl: string = HelperService.config['backendBaseUrl'] + HelperService.config['backendApiFilePath'];
HelperService.currentError = null;
HelperService.isLoading = true;
this.http.post(fileUrl, JSON.stringify(Object.keys(this.vocService.currentTestResults).map(
i => this.vocService.currentTestResults[i].statement))).subscribe(async () => {
const formData = new FormData();
formData.append('learning_result', JSON.stringify(Object.keys(this.vocService.currentTestResults).map(
i => this.vocService.currentTestResults[i].statement)));
this.http.post(fileUrl, formData).subscribe(async () => {
HelperService.isLoading = false;
this.wasDataSent = true;
const toast = await this.toastCtrl.create({
......
......@@ -79,6 +79,8 @@
"FILE_TYPE_DOCX": "DOCX",
"FILE_TYPE_PDF": "PDF",
"FILE_TYPE_XML": "XML",
"GENERATE_FILE_DOCX": "Word-Datei generieren",
"GENERATE_FILE_PDF": "PDF generieren",
"GIVEN": "Gegeben",
"HEAD_WORD": "Basiswort",
"HELP": "Hilfe",
......
......@@ -79,6 +79,8 @@
"FILE_TYPE_DOCX": "DOCX",
"FILE_TYPE_PDF": "PDF",
"FILE_TYPE_XML": "XML",
"GENERATE_FILE_DOCX": "Generate Word file",
"GENERATE_FILE_PDF": "Generate PDF",
"GIVEN": "Given",
"HEAD_WORD": "Head word",
"HELP": "Help",
......
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