Commit 0369d894 authored by Konstantin Schulz's avatar Konstantin Schulz

refactoring for the recent major UI changes

parent 9c34055a
{
"name": "mc_frontend",
"version": "1.3.9",
"version": "1.4.0",
"author": "Ionic Framework",
"homepage": "https://ionicframework.com/",
"scripts": {
......
......@@ -6,51 +6,71 @@
</ion-toolbar>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item>
<ion-button (click)="HelperService.goToHomePage(navCtrl).then(closeMenu.bind(this))">
<ion-grid>
<ion-row>
<ion-col>
<a (click)="HelperService.goToHomePage(navCtrl).then(closeMenu.bind(this))">
{{'HOME' | translate}}
</ion-button>
</ion-item>
<ion-item>
<ion-button (click)="HelperService.goToAuthorPage(navCtrl).then(closeMenu.bind(this))">
{{ 'EXERCISE_GENERATE' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-button (click)="HelperService.goToExerciseListPage(navCtrl).then(closeMenu.bind(this))">
{{ 'EXERCISE_LIST' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-button (click)="HelperService.goToTestPage(navCtrl).then(closeMenu.bind(this))">
{{ 'TEST' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-list>
<ion-label>
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToAuthorPage(navCtrl).then(closeMenu.bind(this))">
{{ 'EXERCISE_GENERATE' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToExerciseListPage(navCtrl).then(closeMenu.bind(this))">
{{ 'EXERCISE_LIST' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToTestPage(navCtrl).then(closeMenu.bind(this))">
{{ 'TEST' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-grid>
<ion-title>
<h2>{{ 'DOCUMENTATION' | translate }}</h2>
</ion-label>
<ion-item>
<ion-button (click)="HelperService.goToInfoPage(navCtrl).then(closeMenu.bind(this))">
{{ 'ABOUT' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-button (click)="HelperService.goToDocSoftwarePage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_SOFTWARE' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-button
(click)="HelperService.goToDocExercisesPage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_EXERCISES' | translate }}</ion-button>
</ion-item>
<ion-item>
<ion-button
(click)="HelperService.goToDocVocUnitPage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_VOC_UNIT' | translate }}</ion-button>
</ion-item>
</ion-list>
</ion-item>
</ion-list>
</ion-title>
<ion-row>
<ion-col>
<a (click)="HelperService.goToInfoPage(navCtrl).then(closeMenu.bind(this))">
{{ 'ABOUT' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToDocSoftwarePage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_SOFTWARE' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToDocExercisesPage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_EXERCISES' | translate }}
</a>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<a (click)="HelperService.goToDocVocUnitPage(navCtrl).then(closeMenu.bind(this))">
{{ 'DOC_VOC_UNIT' | translate }}
</a>
</ion-col>
</ion-row>
</ion-grid>
</ion-row>
</ion-grid>
</ion-content>
</ion-menu>
<ion-router-outlet id="content1"></ion-router-outlet>
......
......@@ -2,15 +2,13 @@
<ion-toolbar>
<ion-buttons slot="start">
<div class="home-logo">
<a href="../home">
<a (click)="HelperService.goToHomePage(navCtrl)">
<img src="assets/imgs/logo.png" width="32px" height="32px" alt="CALLIDUS Logo">
</a>
</div>
<div>
<ion-spinner *ngIf="HelperService.isLoading"></ion-spinner>
<ion-title>{{ corpusService.currentAuthor.name }}</ion-title>
</div>
</ion-buttons>
<ion-spinner *ngIf="HelperService.isLoading"></ion-spinner>
<ion-title>{{ corpusService.currentAuthor?.name }}</ion-title>
<ion-buttons slot="end">
<ion-menu-button autoHide="false"></ion-menu-button>
</ion-buttons>
......@@ -21,11 +19,11 @@
<ion-content padding>
<ion-list>
<ion-item *ngFor="let corpus of corpusService.currentAuthor.corpora">
<ion-item *ngFor="let corpus of corpusService.currentAuthor?.corpora">
<button (click)="showPossibleReferences(corpus)">
<span>{{corpus.title}}</span>
</button>
</ion-item>
</ion-list>
<ion-button (click)="HelperService.goToAuthorPage(navCtrl)">{{ 'BACK' | translate }}</ion-button>
<ion-button (click)="navCtrl.pop()">{{ 'BACK' | translate }}</ion-button>
</ion-content>
button {
color: var(--ion-color-primary-shade);
}
......@@ -2,15 +2,13 @@
<ion-toolbar>
<ion-buttons slot="start">
<div class="home-logo">
<a href="../home">
<a (click)="HelperService.goToHomePage(navCtrl)">
<img src="assets/imgs/logo.png" width="32px" height="32px" alt="CALLIDUS Logo">
</a>
</div>
<div>
</ion-buttons>
<ion-spinner *ngIf="HelperService.isLoading"></ion-spinner>
<ion-title>{{ 'AUTHOR_SELECT' | translate }}</ion-title>
</div>
</ion-buttons>
<ion-buttons slot="end">
<ion-menu-button autoHide="false"></ion-menu-button>
</ion-buttons>
......@@ -36,7 +34,7 @@
<ion-row>
<ion-col>
<label>
<input type="checkbox" [(ngModel)]="showOnlyTreebanks" (change)="toggleTreebankAuthors()" />
<input type="checkbox" [(ngModel)]="showOnlyTreebanks" (change)="toggleTreebankAuthors()"/>
<span class="checkbox">{{ 'AUTHOR_SHOW_ONLY_TREEBANKS' | translate}}</span>
</label>
</ion-col>
......@@ -46,13 +44,11 @@
<label>
<ion-icon name="search" class="search"></ion-icon>
<input type="search" (ngModelChange)="getAuthors($event.toString())"
placeholder="{{ 'AUTHOR_SEARCH' | translate }}" [(ngModel)]="currentSearchValue" />
placeholder="{{ 'AUTHOR_SEARCH' | translate }}" [(ngModel)]="currentSearchValue"/>
</label>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
</ion-col>
<ion-col>
<h2>{{'AUTHOR' | translate}}</h2>
<ion-grid *ngIf="corpusService.availableAuthors.length > 0; else loading" class="author">
......@@ -66,7 +62,6 @@
<ion-spinner></ion-spinner>
</ng-template>
</ion-col>
<ion-col></ion-col>
</ion-row>
</ion-grid>
</ion-content>
.author {
text-align: left;
text-align: center;
font-size: 0.9em;
}
......
......@@ -25,7 +25,8 @@ export class AuthorPage {
public translate: TranslateService,
public corpusService: CorpusService,
public http: HttpClient,
public exerciseService: ExerciseService) {
public exerciseService: ExerciseService,
public helperService: HelperService) {
if (!this.corpusService.availableAuthors) {
this.corpusService.loadCorporaFromLocalStorage();
}
......@@ -70,6 +71,8 @@ export class AuthorPage {
showCorpora(author: Author) {
this.corpusService.currentAuthor = author;
HelperService.mostRecentSetup.currentAuthor = author;
this.helperService.saveMostRecentSetup().then();
this.navCtrl.navigateForward('/author-detail').then();
}
......
......@@ -55,6 +55,7 @@ export class CorpusService {
instructionsTranslation: ''
});
public invalidTextRangeString: string;
public isMostRecentSetupLoaded = false;
public isTextRangeCorrect = false;
public phenomenonMap: PhenomenonMap = new PhenomenonMap({
case: new PhenomenonMapContent({translationObject: CaseTranslations}),
......@@ -69,10 +70,12 @@ export class CorpusService {
public toastCtrl: ToastController,
public helperService: HelperService,
) {
this.isMostRecentSetupLoaded = false;
HelperService.waitForConfig().then(() => {
this.checkForUpdates().then(() => {
this.checkAnnisResponse().then(() => {
this.restoreLastCorpus().then(() => {
this.isMostRecentSetupLoaded = true;
}, () => {
});
}, () => {
......@@ -121,6 +124,7 @@ export class CorpusService {
}
this.helperService.loadMostRecentSetup().then(() => {
this.annisResponse = HelperService.mostRecentSetup.annisResponse;
this.currentAuthor = HelperService.mostRecentSetup.currentAuthor;
this.currentUrn = HelperService.mostRecentSetup.currentUrn;
this.currentCorpus = HelperService.mostRecentSetup.currentCorpus;
return outerResolve();
......
......@@ -2,7 +2,7 @@
<ion-toolbar>
<ion-buttons slot="start">
<div class="home-logo">
<a href="../home">
<a (click)="HelperService.goToHomePage(navCtrl)">
<img src="assets/imgs/logo.png" width="32px" height="32px" alt="CALLIDUS Logo">
</a>
</div>
......@@ -19,7 +19,6 @@
</ion-header>
<ion-content>
<ion-grid>
<ion-row>
<ion-col>
......@@ -49,190 +48,24 @@
</ion-col>
</ion-row>
<!-- Vocabulary unit, first exercise type to appear-->
<ion-row>
<ion-col size="1">
1
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_1' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_1_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_1_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_1_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
2
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_2' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_2_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_2_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_2_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
3
</ion-col>
<ion-row *ngFor="let vud of vocUnitDocs; let i = index">
<ion-col size="1">{{i + 1}}</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_3' | translate}}
{{ vud.name | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_3_TYPE' | translate}}
{{ vud.type | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_3_LEVEL' | translate}}
{{ vud.level | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_3_FUNCTION' | translate}}
{{ vud.function | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
4
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_4' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_4_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_4_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_4_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
5
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_5' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_5_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_5_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_5_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
6
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_6' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_6_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_6_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_6_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
7
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_7' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_7_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_7_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_7_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
8
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_8' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_8_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_8_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_8_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
9
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_9' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_9_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_9_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_9_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row></ion-row>
<ion-row>
<ion-col size="1">
10
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_VOC_UNIT_10' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_10_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_VOC_UNIT_10_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_VOC_UNIT_10_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<br>
<br>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
......@@ -257,55 +90,19 @@
</ion-col>
</ion-row>
<!-- Exercise types of the exercise generator -->
<ion-row>
<ion-col size="1">
1
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_GEN_1' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_1_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_1_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_GEN_1_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row>
<ion-col size="1">
2
</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_GEN_2' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_2_TYPE' | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_2_LEVEL' | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_GEN_2_FUNCTION' | translate}}
</ion-col>
</ion-row>
<ion-row>
<ion-col size="1">
3
</ion-col>
<ion-row *ngFor="let egd of exerciseGenDocs; let i = index">
<ion-col size="1">{{i + 1}}</ion-col>
<ion-col size="3">
{{'DOC_EXERCISES_GEN_3' | translate}}
{{ egd.name | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_3_TYPE' | translate}}
{{ egd.type | translate}}
</ion-col>
<ion-col size="2">
{{'DOC_EXERCISES_GEN_3_LEVEL' | translate}}
{{ egd.level | translate}}
</ion-col>
<ion-col size="4">
{{'DOC_EXERCISES_GEN_3_FUNCTION' | translate}}
{{ egd.function | translate}}
</ion-col>
</ion-row>
<ion-row>
......@@ -338,4 +135,4 @@
</ion-tab-bar>
</ion-tabs>
</ion-toolbar>
</ion-footer>
\ No newline at end of file
</ion-footer>
import { Component, OnInit } from '@angular/core';
import {Component, OnInit} from '@angular/core';
import {HelperService} from 'src/app/helper.service';
import {NavController} from '@ionic/angular';
import {HttpClient} from '@angular/common/http';
import {TranslateService} from '@ngx-translate/core';
import {ExerciseDocumentation} from 'src/app/models/exerciseDocumentation';
@Component({
selector: 'app-doc-exercises',
......@@ -10,15 +11,32 @@ import {TranslateService} from '@ngx-translate/core';
styleUrls: ['./doc-exercises.page.scss'],
})
export class DocExercisesPage {
export class DocExercisesPage implements OnInit {
exerciseGenDocs: ExerciseDocumentation[] = [];
HelperService = HelperService;
vocUnitDocs: ExerciseDocumentation[] = [];
constructor(public navCtrl: NavController,
public http: HttpClient,
public translate: TranslateService) { }
goToHomePage() {
this.navCtrl.navigateForward('/home').then();
public translate: TranslateService) {
}
ngOnInit(): void {
[...Array(10).keys()].forEach((i: number) => {
this.vocUnitDocs.push(new ExerciseDocumentation({
name: `DOC_EXERCISES_VOC_UNIT_${i + 1}`,
function: `DOC_EXERCISES_VOC_UNIT_${i + 1}_FUNCTION`,
level: `DOC_EXERCISES_VOC_UNIT_${i + 1}_LEVEL`,
type: `DOC_EXERCISES_VOC_UNIT_${i + 1}_TYPE`
}));
});
[...Array(3).keys()].forEach((i: number) => {
this.exerciseGenDocs.push(new ExerciseDocumentation({
name: `DOC_EXERCISES_GEN_${i + 1}`,
function: `DOC_EXERCISES_GEN_${i + 1}_FUNCTION`,
level: `DOC_EXERCISES_GEN_${i + 1}_LEVEL`,
type: `DOC_EXERCISES_GEN_${i + 1}_TYPE`
}));
});
}
}
......@@ -2,16 +2,13 @@
<ion-toolbar>
<ion-buttons slot="start">
<div class="home-logo">
<a href="../home">
<a (click)="HelperService.goToHomePage(navCtrl)">
<img src="assets/imgs/logo.png" width="32px" height="32px" alt="CALLIDUS Logo">
</a>
</div>
<div>
<ion-spinner *ngIf="HelperService.isLoading"></ion-spinner>
<ion-title>{{ 'DOC_SOFTWARE' | translate }}
</ion-title>