134 lines
3.6 KiB
TypeScript
134 lines
3.6 KiB
TypeScript
import {Component, EventEmitter, Input, Output} from '@angular/core';
|
|
import {FormsModule} from '@angular/forms';
|
|
import {NgClass} from '@angular/common';
|
|
import {Store} from '@ngrx/store';
|
|
import {StateInterface} from './../../redux/reducers';
|
|
|
|
@Component({
|
|
selector: 'sae-translate-texts',
|
|
imports: [FormsModule, NgClass],
|
|
templateUrl: './translate-texts.html',
|
|
styleUrl: './translate-texts.scss'
|
|
})
|
|
export class TranslateTexts {
|
|
public fromText: string = ''
|
|
public toText: string = 'résumé ici'
|
|
public loadingResume: boolean = false;
|
|
public mode: string = 'demo';
|
|
public debounceEnabled: boolean = true;
|
|
public textFocused: boolean = false;
|
|
|
|
public fileIsUploaded: boolean = false;
|
|
public filePath: string = '';
|
|
public fileWeight: string = '';
|
|
|
|
// testing display of file selector
|
|
// public fileIsUploaded: boolean = true;
|
|
// public filePath: string = 'abcd.csv';
|
|
// public fileWeight: string = '12 kb';
|
|
|
|
public fromTimeout: any;
|
|
public debounceDuration: number = 1000;
|
|
@Input() appState: any = {};
|
|
@Output() updateFilters: EventEmitter<any> = new EventEmitter();
|
|
|
|
constructor(private store: Store<StateInterface>) {
|
|
// Subscribe to the app state to get the loading state
|
|
this.store.select(state => state.app.loading).subscribe(loading => {
|
|
this.loadingResume = loading;
|
|
});
|
|
this.store.select(state => state.app).subscribe(appState => {
|
|
this.appState = appState;
|
|
});
|
|
|
|
}
|
|
|
|
onToTextChanged(e: any): void {
|
|
console.log('text changed toText', e)
|
|
// launch request
|
|
// in demo mode, fill some filters
|
|
if (this.mode !== 'production') {
|
|
|
|
// Clear any existing timeout to reset the debounce
|
|
if (this.fromTimeout) {
|
|
clearTimeout(this.fromTimeout);
|
|
}
|
|
|
|
// Set a new timeout
|
|
this.fromTimeout = setTimeout(() => {
|
|
// in demo mode, load demo filters
|
|
console.log('demo mode')
|
|
|
|
const newFilters = [
|
|
['filter demo 1', 'filter demo 2'],
|
|
['filter demo 3'],
|
|
['filter demo 4', 'filter demo ABCD'],
|
|
['filter demo 5'],
|
|
]
|
|
this.updateFilters.emit(newFilters);
|
|
this.loadingResume = false;
|
|
}, this.debounceDuration);
|
|
}
|
|
}
|
|
|
|
onFromTextChanged(e?: any): void {
|
|
|
|
console.log('text changed fromText', e)
|
|
|
|
// this.store.dispatch({})
|
|
// run research after a delay
|
|
if (this.mode !== 'production') {
|
|
this.loadingResume = true;
|
|
|
|
// Clear any existing timeout to reset the debounce
|
|
if (this.fromTimeout) {
|
|
clearTimeout(this.fromTimeout);
|
|
}
|
|
|
|
// Set a new timeout
|
|
this.fromTimeout = setTimeout(() => {
|
|
// in demo mode, make a fake resume
|
|
console.log('demo mode')
|
|
this.toText = "Résumé de démo à titre d'exemple"
|
|
this.loadingResume = false;
|
|
},
|
|
this.debounceDuration);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
emptyText(someText: 'fromText' | 'toText') {
|
|
this[someText] = '';
|
|
}
|
|
|
|
onFileSelected($event: any) {
|
|
console.log('file selected', $event, $event.target.value)
|
|
if ($event.target.value) {
|
|
this.fileIsUploaded = true;
|
|
this.filePath = $event.target.value;
|
|
this.fileWeight = $event.target.value;
|
|
}
|
|
}
|
|
|
|
onRemoveFileSelected() {
|
|
this.fileIsUploaded = false;
|
|
this.filePath = '';
|
|
this.fileWeight = '';
|
|
|
|
// document.getElementById('fromText')?.focus();
|
|
}
|
|
|
|
clickFileUpload(fileUpload: HTMLInputElement) {
|
|
fileUpload.click();
|
|
console.log('click file upload', fileUpload)
|
|
}
|
|
|
|
focusFromText(e?: any) {
|
|
console.log('focus from text', e)
|
|
console.log('focus from text')
|
|
this.onRemoveFileSelected()
|
|
// this.fromText = ' '
|
|
this.textFocused = true
|
|
}
|
|
}
|