funky-framadate-front/mocks/old-stuff/pages/answers/answers.component.ts

94 lines
2.2 KiB
TypeScript
Raw Normal View History

import { AfterViewInit, ChangeDetectorRef, Component, Inject, OnChanges, OnInit } from '@angular/core';
import { BaseComponent } from '../example/base-page/base.component';
import { ConfigService } from '../../services/config.service';
2019-08-10 17:41:01 +02:00
import { DOCUMENT } from '@angular/common';
2019-08-10 21:00:05 +02:00
2019-08-10 17:41:01 +02:00
@Component({
2020-04-22 12:56:18 +02:00
selector: 'app-answers',
2020-04-21 10:50:26 +02:00
templateUrl: './answers.component.html',
styleUrls: ['./answers.component.scss'],
2019-08-10 17:41:01 +02:00
})
2020-01-20 15:01:56 +01:00
export class AnswersComponent extends BaseComponent implements OnInit, AfterViewInit, OnChanges {
2020-04-21 10:50:26 +02:00
allAnswersAreValid = false;
2019-08-10 17:41:01 +02:00
2020-04-21 10:50:26 +02:00
answerList = [];
currentHeader: any = '';
display: boolean;
2019-08-10 18:14:00 +02:00
2020-04-21 10:50:26 +02:00
constructor(public config: ConfigService, @Inject(DOCUMENT) private document: any, private cd: ChangeDetectorRef) {
super(config);
this.answerList = this.config.answers;
}
2019-08-10 17:41:01 +02:00
2020-04-21 10:50:26 +02:00
// todo, manage validation of each page in a common way
2020-05-01 19:10:17 +02:00
ngOnInit(): void {}
2019-08-10 17:41:01 +02:00
2020-04-21 10:50:26 +02:00
ngOnChanges() {
this.checkValidAnswers();
}
2020-01-20 15:01:56 +01:00
2020-04-21 10:50:26 +02:00
checkValidAnswers() {
this.allAnswersAreValid = true;
this.config.answers.forEach((answer) => {
if (!answer.text.length) {
this.allAnswersAreValid = false;
return;
}
});
}
2020-01-20 15:01:56 +01:00
2020-04-21 10:50:26 +02:00
ngAfterViewInit() {
this.focusOnAnswer(0);
this.checkValidAnswers();
}
2020-04-21 10:50:26 +02:00
trackFunction(index: number, item: any): number {
return item.id;
}
2020-04-21 10:50:26 +02:00
addAnswer() {
this.config.answers.push({
id: this.config.answers.length + 1,
text: '',
url: '',
file: '',
literal: '',
date_object: null,
timeList: [],
});
this.cd.detectChanges(); // to refresh the view before focusing on the new input
this.focusOnAnswer(this.config.answers.length - 1);
}
2020-04-21 10:50:26 +02:00
focusOnAnswer(i) {
const AnswersDomToFocus = this.document.querySelectorAll('.answers .answer');
const dom = AnswersDomToFocus[i];
if (dom.focus) {
dom.focus();
}
if (dom.select) {
dom.select();
}
}
2019-08-10 18:14:00 +02:00
2020-04-21 10:50:26 +02:00
navigateOrDelete(event: KeyboardEvent, i) {
if (event.ctrlKey && event.key == 'd') {
this.config.answers.splice(i, 1);
}
if (event.key == 'ArrowUp' && i > 0) {
this.focusOnAnswer(i - 1);
}
if (event.key == 'ArrowDown' && i < this.config.answers.length) {
this.focusOnAnswer(i + 1);
}
}
2020-01-16 15:35:11 +01:00
2020-04-21 10:50:26 +02:00
showModalForPictureOfAnswer(answer) {
// TODO
this.currentHeader = answer;
this.display = true;
// this.config.todo();
}
2019-08-10 17:41:01 +02:00
}