111 lines
3.2 KiB
TypeScript
111 lines
3.2 KiB
TypeScript
import { Component, Inject, Input, OnInit } from '@angular/core';
|
|
import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
|
|
import { DateChoice } from '../../../../../../../../mocks/old-stuff/config/defaultConfigs';
|
|
import { DOCUMENT } from '@angular/common';
|
|
|
|
@Component({
|
|
selector: 'app-day-list',
|
|
templateUrl: './day-list.component.html',
|
|
styleUrls: ['./day-list.component.scss'],
|
|
})
|
|
export class DayListComponent implements OnInit {
|
|
@Input()
|
|
public dateList: DateChoice[] = [];
|
|
@Input()
|
|
public hasSeveralHours: boolean;
|
|
timeList: any;
|
|
|
|
constructor(@Inject(DOCUMENT) private document: any) {}
|
|
|
|
ngOnInit(): void {}
|
|
|
|
dropTimeItem(event: any): void {
|
|
// moveItemInArray(this.timeSlices, event.previousIndex, event.currentIndex);
|
|
if (event.previousContainer === event.container) {
|
|
moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
|
|
} else {
|
|
transferArrayItem(
|
|
event.previousContainer.data,
|
|
event.container.data,
|
|
event.previousIndex,
|
|
event.currentIndex
|
|
);
|
|
}
|
|
}
|
|
|
|
dropDayItem(event: any): void {
|
|
// moveItemInArray(this.timeSlices, event.previousIndex, event.currentIndex);
|
|
if (event.previousContainer === event.container) {
|
|
moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
|
|
} else {
|
|
transferArrayItem(
|
|
event.previousContainer.data,
|
|
event.container.data,
|
|
event.previousIndex,
|
|
event.currentIndex
|
|
);
|
|
}
|
|
}
|
|
/**
|
|
* add a time period to a specific date choice,
|
|
* focus on the new input
|
|
* @param config
|
|
* @param id
|
|
*/
|
|
addTimeToDate(config: any, id: number) {
|
|
this.timeList.push({
|
|
literal: '',
|
|
});
|
|
const selector = '[ng-reflect-choice_label="dateTime_' + id + '_Choices_' + (this.timeList.length - 1) + '"]';
|
|
// this.cd.detectChanges();
|
|
const elem = this.document.querySelector(selector);
|
|
if (elem) {
|
|
elem.focus();
|
|
}
|
|
}
|
|
/**
|
|
* handle keyboard shortcuts
|
|
* @param $event
|
|
* @param choice_number
|
|
*/
|
|
keyOnChoice($event: KeyboardEvent, choice_number: number): void {
|
|
$event.preventDefault();
|
|
|
|
console.log('this.choices.length', this.choices.length);
|
|
console.log('choice_number', choice_number);
|
|
const lastChoice = this.choices.length - 1 === choice_number;
|
|
// TODO handle shortcuts
|
|
// reset field with Ctrl + D
|
|
// add a field with Ctrl + N
|
|
// go to previous choice with arrow up
|
|
// go to next choice with arrow down
|
|
console.log('$event', $event);
|
|
|
|
if ($event.key == 'ArrowUp' && choice_number > 0) {
|
|
this.focusOnChoice(choice_number - 1);
|
|
}
|
|
if ($event.key == 'ArrowDown') {
|
|
// add a field if we are on the last choice
|
|
if (lastChoice) {
|
|
this.addChoice();
|
|
this.toastService.display('choix ajouté par raccourci "flèche bas"');
|
|
} else {
|
|
this.focusOnChoice(choice_number + 1);
|
|
}
|
|
}
|
|
if ($event.ctrlKey && $event.key == 'Backspace') {
|
|
this.deleteChoiceField(choice_number);
|
|
this.toastService.display('choix supprimé par raccourci "Ctrl + retour"');
|
|
// this.cd.detectChanges();
|
|
this.focusOnChoice(Math.min(choice_number - 1, 0));
|
|
}
|
|
if ($event.ctrlKey && $event.key == 'Enter') {
|
|
// go to other fields
|
|
const elem = this.document.querySelector('#creatorEmail');
|
|
if (elem) {
|
|
elem.focus();
|
|
}
|
|
}
|
|
}
|
|
}
|