You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
536 lines
17 KiB
536 lines
17 KiB
import { Inject, Injectable } from '@angular/core'; |
|
import { ActivatedRoute, ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from '@angular/router'; |
|
import { BehaviorSubject, Observable, Subscription } from 'rxjs'; |
|
|
|
import { Answer } from '../enums/answer.enum'; |
|
import { Choice } from '../models/choice.model'; |
|
import { Poll } from '../models/poll.model'; |
|
import { User } from '../models/user.model'; |
|
import { ApiService } from './api.service'; |
|
import { ToastService } from './toast.service'; |
|
import { UserService } from './user.service'; |
|
import { UuidService } from './uuid.service'; |
|
import { HttpClient } from '@angular/common/http'; |
|
import { environment } from '../../../environments/environment'; |
|
import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms'; |
|
import { DateChoice, defaultTimeOfDay, otherDefaultDates } from '../../features/old-stuff/config/defaultConfigs'; |
|
import { DateUtilities } from '../../features/old-stuff/config/DateUtilities'; |
|
import { DOCUMENT } from '@angular/common'; |
|
|
|
@Injectable({ |
|
providedIn: 'root', |
|
}) |
|
export class PollService implements Resolve<Poll> { |
|
private _poll: BehaviorSubject<Poll | undefined> = new BehaviorSubject<Poll | undefined>(undefined); |
|
public readonly poll: Observable<Poll | undefined> = this._poll.asObservable(); |
|
public form: FormGroup; |
|
public startDateInterval: string; |
|
public endDateInterval: string; |
|
public intervalDays: any; |
|
public intervalDaysDefault = 7; |
|
public dateList: DateChoice[] = otherDefaultDates; // sets of days as strings, config to set identical time for days in a special days poll |
|
public timeList: any = defaultTimeOfDay; // ranges of time expressed as strings |
|
public previousRouteName: string = '/administration'; |
|
public nextRouteName: string = '/administration/step/2'; |
|
public step_current: number = 1; |
|
public step_max: number = 5; |
|
public round: Function; |
|
public urlPrefix: string = window.location.origin + '/participation/'; |
|
public advancedDisplayEnabled = false; |
|
public showDateInterval = false; |
|
public allowSeveralHours = false; |
|
public richTextMode = false; |
|
public calendar: any; |
|
|
|
constructor( |
|
private http: HttpClient, |
|
private router: Router, |
|
private apiService: ApiService, |
|
private userService: UserService, |
|
private uuidService: UuidService, |
|
private toastService: ToastService, |
|
public dateUtilities: DateUtilities, |
|
public route: ActivatedRoute, |
|
@Inject(DOCUMENT) private document: any, |
|
private fb: FormBuilder |
|
) { |
|
this.createFormGroup(); |
|
if (environment.poll.autoFillDemo) { |
|
this.setDemoValues(); |
|
} else { |
|
this.calendar = [new Date()]; |
|
} |
|
} |
|
|
|
/** |
|
* add example values to the form |
|
*/ |
|
setDemoValues(): void { |
|
this.addChoice('orange'); |
|
this.addChoice('raisin'); |
|
this.addChoice('abricot'); |
|
|
|
this.calendar = [ |
|
this.dateUtilities.addDaysToDate(1, new Date()), |
|
this.dateUtilities.addDaysToDate(2, new Date()), |
|
this.dateUtilities.addDaysToDate(3, new Date()), |
|
]; |
|
this.form.patchValue({ |
|
title: 'mon titre', |
|
description: 'répondez SVP <3 ! *-* ', |
|
custom_url: this.uuidService.getUUID(), |
|
creatorPseudo: 'Chuck Norris', |
|
creatorEmail: 'chucknorris@example.com', |
|
isAboutDate: true, |
|
whoModifiesAnswers: 'everybody', |
|
whoCanChangeAnswers: 'everybody', |
|
isProtectedByPassword: false, |
|
isOwnerNotifiedByEmailOnNewVote: false, |
|
isOwnerNotifiedByEmailOnNewComment: false, |
|
isMaybeAnswerAvailable: false, |
|
richTextMode: false, |
|
areResultsPublic: true, |
|
expiracyNumberOfDays: 60, |
|
}); |
|
this.automaticSlug(); |
|
} |
|
|
|
/** |
|
* set the poll slug from other data of the poll |
|
*/ |
|
automaticSlug() { |
|
this.form.patchValue({ custom_url: this.makeSlug(this.form) }); |
|
} |
|
|
|
public createFormGroup() { |
|
let form = this.fb.group({ |
|
title: ['', [Validators.required, Validators.minLength(12)]], |
|
creatorPseudo: ['', [Validators.required]], |
|
created_at: [new Date(), [Validators.required]], |
|
creatorEmail: ['', [Validators.required]], |
|
custom_url: [this.uuidService.getUUID(), [Validators.required]], |
|
description: ['', [Validators.required]], |
|
choices: new FormArray([]), |
|
whoModifiesAnswers: ['', [Validators.required]], |
|
whoCanChangeAnswers: ['', [Validators.required]], |
|
isAboutDate: [true, [Validators.required]], |
|
startDateInterval: ['', [Validators.required]], |
|
endDateInterval: ['', [Validators.required]], |
|
isProtectedByPassword: [false, [Validators.required]], |
|
isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]], |
|
isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]], |
|
isMaybeAnswerAvailable: [false, [Validators.required]], |
|
areResultsPublic: [true, [Validators.required]], |
|
richTextMode: [false, [Validators.required]], |
|
expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]], |
|
}); |
|
this.form = form; |
|
return form; |
|
} |
|
|
|
public updateSlug(): void { |
|
console.log('this.form.value', this.form.value); |
|
this.form.patchValue({ custom_url: this.makeSlug(this.form) }); |
|
} |
|
|
|
/** |
|
* auto fetch a poll when route is looking for one in the administration pattern |
|
* @param route |
|
* @param state |
|
*/ |
|
public async resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<Poll> { |
|
const segments: string[] = state.url.split('/'); |
|
const wantedSlug: string = segments.includes('poll') ? segments[segments.indexOf('poll') + 1] : ''; |
|
if (!wantedSlug && state.url.includes('administration')) { |
|
// creation of new poll |
|
const poll = new Poll(this.userService.getCurrentUser(), this.uuidService.getUUID(), ''); |
|
this._poll.next(poll); |
|
this.router.navigate(['poll/' + poll.slug + '/administration']); |
|
} |
|
if (!this._poll.getValue() || !this._poll.getValue().slug || this._poll.getValue().slug !== wantedSlug) { |
|
await this.loadPollBySlug(wantedSlug); |
|
} |
|
if (this._poll.getValue()) { |
|
return this._poll.getValue(); |
|
} else { |
|
this.router.navigate(['page-not-found']); |
|
return; |
|
} |
|
} |
|
|
|
getAllAvailablePolls() { |
|
const baseHref = environment.api.version.apiV1.baseHref; |
|
console.log('getAllAvailablePolls baseHref', baseHref); |
|
const headers = ApiService.makeHeaders(); |
|
console.log('getAllAvailablePolls headers', headers); |
|
try { |
|
this.http.get(`${baseHref}/poll`, headers).subscribe((res: Observable<any>) => { |
|
console.log('getAllAvailablePolls res', res); |
|
}); |
|
} catch (e) { |
|
console.log('getAllAvailablePolls e', e); |
|
} |
|
} |
|
|
|
public async loadPollBySlug(slug: string): Promise<void> { |
|
if (slug) { |
|
const poll: Poll | undefined = await this.apiService.getPollBySlug(slug); |
|
console.log({ loadPollBySlugResponse: poll }); |
|
this.updateCurrentPoll(poll); |
|
} |
|
} |
|
|
|
public updateCurrentPoll(poll: Poll): void { |
|
this._poll.next(poll); |
|
} |
|
|
|
/** |
|
* add all the dates between the start and end dates in the interval section |
|
*/ |
|
addIntervalOfDates(): void { |
|
const newIntervalArray = this.dateUtilities.getDatesInRange( |
|
this.dateUtilities.parseInputDateToDateObject(this.startDateInterval), |
|
this.dateUtilities.parseInputDateToDateObject(this.endDateInterval), |
|
1 |
|
); |
|
|
|
const converted = []; |
|
newIntervalArray.forEach((element) => { |
|
converted.push({ |
|
literal: element.literal, |
|
date_object: element.date_object, |
|
timeList: [], |
|
}); |
|
}); |
|
this.dateList = [...new Set(converted)]; |
|
// add only dates that are not already present with a Set of unique items |
|
console.log('this.dateList', this.dateList); |
|
this.showDateInterval = false; |
|
|
|
this.form.patchValue({ choices: this.dateList }); |
|
|
|
this.toastService.display(`les dates ont été ajoutées aux réponses possibles.`); |
|
} |
|
|
|
/** |
|
* handle keyboard shortcuts |
|
* @param $event |
|
* @param choice_number |
|
*/ |
|
keyOnChoice($event: KeyboardEvent, choice_number: number): void { |
|
$event.preventDefault(); |
|
|
|
const lastChoice = this.choices.length - 1 === choice_number; |
|
// 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 |
|
|
|
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.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(); |
|
} |
|
} |
|
} |
|
|
|
/** |
|
* change time spans |
|
*/ |
|
addTime() { |
|
this.timeList.push({ |
|
literal: '', |
|
timeList: [], |
|
date_object: new Date(), |
|
}); |
|
} |
|
|
|
removeAllTimes() { |
|
this.timeList = []; |
|
} |
|
|
|
resetTimes() { |
|
this.timeList = otherDefaultDates; |
|
} |
|
|
|
/** |
|
* 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: '', |
|
timeList: [], |
|
date_object: new Date(), |
|
}); |
|
const selector = '[ng-reflect-choice_label="dateTime_' + id + '_Choices_' + (this.timeList.length - 1) + '"]'; |
|
const elem = this.document.querySelector(selector); |
|
if (elem) { |
|
elem.focus(); |
|
} |
|
} |
|
|
|
public createPoll(): void { |
|
console.log('this.form', this.form); |
|
const newpoll = this.newPollFromForm(this.form); |
|
console.log('newpoll', newpoll); |
|
this.apiService.createPoll(newpoll); |
|
} |
|
|
|
/** |
|
* default interval of dates proposed is from today to 7 days more |
|
*/ |
|
setDefaultDatesForInterval(): void { |
|
const dateCurrent = new Date(); |
|
const dateJson = dateCurrent.toISOString(); |
|
this.startDateInterval = dateJson.substring(0, 10); |
|
this.endDateInterval = this.dateUtilities |
|
.addDaysToDate(this.intervalDaysDefault, dateCurrent) |
|
.toISOString() |
|
.substring(0, 10); |
|
this.form.patchValue({ |
|
startDateInterval: this.startDateInterval, |
|
endDateInterval: this.endDateInterval, |
|
}); |
|
this.countDays(); |
|
} |
|
|
|
askInitFormDefault(): void { |
|
this.initFormDefault(false); |
|
this.toastService.display('formulaire réinitialisé'); |
|
} |
|
|
|
countDays(): void { |
|
this.intervalDays = this.dateUtilities.countDays( |
|
this.dateUtilities.parseInputDateToDateObject(this.startDateInterval), |
|
this.dateUtilities.parseInputDateToDateObject(this.endDateInterval) |
|
); |
|
} |
|
|
|
focusOnChoice(index): void { |
|
const selector = '#choice_label_' + index; |
|
const elem = this.document.querySelector(selector); |
|
if (elem) { |
|
elem.focus(); |
|
} |
|
} |
|
|
|
deleteChoiceField(index: number): void { |
|
if (this.choices.length !== 1) { |
|
this.choices.removeAt(index); |
|
} |
|
} |
|
|
|
initFormDefault(showDemoValues = true): void { |
|
this.form = this.createFormGroup(); |
|
this.setDefaultDatesForInterval(); |
|
|
|
if (showDemoValues) { |
|
this.setDemoValues(); |
|
} |
|
} |
|
|
|
get choices(): FormArray { |
|
return this.form.get('choices') as FormArray; |
|
} |
|
|
|
reinitChoices(): void { |
|
this.choices.setValue([]); |
|
} |
|
|
|
addChoice(optionalLabel = ''): void { |
|
const newControlGroup = this.fb.group({ |
|
label: this.fb.control('', [Validators.required]), |
|
imageUrl: ['', [Validators.required]], |
|
}); |
|
|
|
if (optionalLabel) { |
|
newControlGroup.patchValue({ |
|
label: optionalLabel, |
|
imageUrl: 'mon url', |
|
}); |
|
} |
|
this.choices.push(newControlGroup); |
|
|
|
this.focusOnChoice(this.choices.length - 1); |
|
} |
|
|
|
/** |
|
* make a uniq slug for the current poll creation |
|
* @param form |
|
*/ |
|
makeSlug(form: FormGroup): string { |
|
let str = ''; |
|
str = |
|
form.value.created_at.getFullYear() + |
|
'_' + |
|
(form.value.created_at.getMonth() + 1) + |
|
'_' + |
|
form.value.created_at.getDate() + |
|
'_' + |
|
form.value.creatorPseudo + |
|
'_' + |
|
form.value.title; |
|
str = str.replace(/^\s+|\s+$/g, ''); // trim |
|
str = str.toLowerCase(); |
|
|
|
// remove accents, swap ñ for n, etc |
|
const from = 'àáäâèéëêìíïîòóöôùúüûñç·/_,:;'; |
|
const to = 'aaaaeeeeiiiioooouuuunc------'; |
|
for (let i = 0, l = from.length; i < l; i++) { |
|
str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i)); |
|
} |
|
|
|
str = str |
|
.replace(/[^a-z0-9 -]/g, '') // remove invalid chars |
|
.replace(/\s+/g, '-') // collapse whitespace and replace by - |
|
.replace(/-+/g, '-'); // collapse dashes |
|
|
|
return str + '-' + this.uuidService.getUUID(); |
|
} |
|
|
|
public async saveCurrentPoll(): Promise<void> { |
|
const pollUrl: Subscription = await this.apiService.createPoll(this._poll.getValue()); |
|
// TODO: Maybe handle the url to update currentPoll according to backend response |
|
if (pollUrl) { |
|
this.toastService.display('Le sondage a été enregistré.'); |
|
} else { |
|
this.toastService.display('Le sondage n’a été correctement enregistré, veuillez ré-essayer.'); |
|
} |
|
} |
|
|
|
public saveParticipation(choice: Choice, user: User, response: Answer): void { |
|
const currentPoll = this._poll.getValue(); |
|
currentPoll.choices.find((c) => c.label === choice.label)?.updateParticipation(user, response); |
|
this.updateCurrentPoll(currentPoll); |
|
this.apiService.createParticipation(currentPoll.slug, choice.label, user.pseudo, response); |
|
this.toastService.display('Votre participation au sondage a été enregistrée.'); |
|
} |
|
|
|
public async deleteAllAnswers(): Promise<void> { |
|
await this.apiService.deletePollAnswers(this._poll.getValue().slug); |
|
this.toastService.display('Les participations des votants à ce sondage ont été supprimées.'); |
|
} |
|
|
|
public async addComment(comment: string): Promise<void> { |
|
await this.apiService.createComment(this._poll.getValue().slug, comment); |
|
this.toastService.display('Votre commentaire a été enregistré.'); |
|
} |
|
|
|
public async deleteComments(): Promise<void> { |
|
await this.apiService.deletePollComments(this._poll.getValue().slug); |
|
this.toastService.display('Les commentaires de ce sondage ont été supprimés.'); |
|
} |
|
|
|
public buildAnswersByChoiceLabelByPseudo(poll: Poll): Map<string, Map<string, Answer>> { |
|
const pseudos: Set<string> = new Set(); |
|
poll.choices.forEach((choice: Choice) => { |
|
choice.participants.forEach((users: Set<User>) => { |
|
users.forEach((user: User) => { |
|
pseudos.add(user.pseudo); |
|
}); |
|
}); |
|
}); |
|
|
|
const list = new Map<string, Map<string, Answer>>(); |
|
pseudos.forEach((pseudo: string) => { |
|
list.set( |
|
pseudo, |
|
new Map<string, Answer>( |
|
poll.choices.map((choice: Choice) => { |
|
return [choice.label, undefined]; |
|
}) |
|
) |
|
); |
|
}); |
|
|
|
poll.choices.forEach((choice: Choice) => { |
|
choice.participants.forEach((users: Set<User>, answer: Answer) => { |
|
users.forEach((user: User) => { |
|
list.get(user.pseudo).set(choice.label, answer); |
|
}); |
|
}); |
|
}); |
|
|
|
return list; |
|
} |
|
|
|
newPollFromForm(form: any): any { |
|
const newpoll = new Poll( |
|
this.userService.getCurrentUser(), |
|
this.uuidService.getUUID(), |
|
form.controls.title.value |
|
); |
|
/** |
|
* convert to API version 1 config poll |
|
*/ |
|
const apiV1Poll = { |
|
menuVisible: true, |
|
expiracyDateDefaultInDays: newpoll.configuration.expiresDaysDelay, |
|
deletionDateAfterLastModification: newpoll.configuration.expiracyAfterLastModificationInDays, |
|
pollType: newpoll.configuration.isAboutDate ? 'dates' : 'classic', // classic or dates |
|
title: newpoll.title, |
|
description: newpoll.description, |
|
myName: newpoll.owner.pseudo, |
|
myComment: '', |
|
isAdmin: true, // when we create a poll, we are admin on it |
|
myVoteStack: {}, |
|
myTempVoteStack: 0, |
|
myEmail: newpoll.owner.email, |
|
myPolls: [], // list of retrieved polls from the backend api |
|
/* |
|
date specific poll, we have the choice to setup different hours (timeList) for all possible dates (dateList), or use the same hours for all dates |
|
*/ |
|
allowSeveralHours: 'true', |
|
// access |
|
visibility: newpoll.configuration.areResultsPublic, // visible to one with the link: |
|
voteChoices: newpoll.configuration.isMaybeAnswerAvailable ? 'yes, maybe, no' : 'yes', // possible answers to a vote choice: only "yes", "yes, maybe, no" |
|
created_at: new Date(), |
|
expirationDate: '', // expiracy date |
|
voteStackId: null, // id of the vote stack to update |
|
pollId: null, // id of the current poll when created. data given by the backend api |
|
pollSlug: null, // id of the current poll when created. data given by the backend api |
|
currentPoll: null, // current poll selected with createPoll or getPoll of ConfigService |
|
passwordAccess: newpoll.configuration.isProtectedByPassword, |
|
password: newpoll.configuration.password, |
|
customUrl: newpoll.slug, // custom slug in the url, must be unique |
|
customUrlIsUnique: null, // given by the backend |
|
urlSlugPublic: null, |
|
urlPublic: null, |
|
urlAdmin: null, |
|
adminKey: '', // key to change config of the poll |
|
owner_modifier_token: '', // key to change a vote stack |
|
canModifyAnswers: newpoll.configuration.isAllowingtoChangeOwnAnswers, // bool for the frontend selector |
|
whoModifiesAnswers: newpoll.configuration.whoCanChangeAnswers, // everybody, self, nobody (: just admin) |
|
whoCanChangeAnswers: newpoll.configuration.whoCanChangeAnswers, // everybody, self, nobody (: just admin) |
|
dateList: newpoll.dateChoices, // sets of days as strings, config to set identical time for days in a special days poll |
|
timeList: newpoll.timeChoices, // ranges of time expressed as strings |
|
|
|
answers: newpoll.choices, |
|
// modals |
|
displayConfirmVoteModalAdmin: false, |
|
}; |
|
console.log('apiV1Poll', apiV1Poll); |
|
return apiV1Poll; |
|
} |
|
}
|
|
|