harmonizing poll default properties with payload and advanced config

2021-02-05 23:03:49 +01:00 · 2021-02-05 23:03:49 +01:00 · 2a4219e149
parent 237984c040
commit 2a4219e149
10 changed files with 206 additions and 195 deletions
--- a/src/app/core/models/configuration.model.ts
+++ b/src/app/core/models/configuration.model.ts
@ -3,26 +3,32 @@ import { DateService } from '../services/date.service';

 export class PollConfiguration {
 	constructor(
-		public isAboutDate: boolean = false,
-		public isProtectedByPassword: boolean = false,
+		public allowComments: boolean = true,
+		public areResultsPublic: boolean = true,
+		public dateCreated: Date = new Date(Date.now()),
 		public password: string = '',
+		public isAboutDate: boolean = false,
+		public isAllowingtoChangeOwnAnswers: boolean = true,
+		public isMaybeAnswerAvailable: boolean = false,
+		public isProtectedByPassword: boolean = false,
 		public isOwnerNotifiedByEmailOnNewVote: boolean = false,
 		public isOwnerNotifiedByEmailOnNewComment: boolean = false,
-		public isMaybeAnswerAvailable: boolean = false,
-		public areResultsPublic: boolean = true,
-		public isAllowingtoChangeOwnAnswers: boolean = true,
+		public isZeroKnoledge: boolean = true,
+		public hasSeveralHours: boolean = false,
+		public hasMaxCountOfAnswers: boolean = false,
 		public whoCanChangeAnswers: string = 'everybody',
-		public dateCreated: Date = new Date(Date.now()),
-		public expiresDaysDelay: number = environment.poll.defaultConfig.expiracyInDays,
+		public maxCountOfAnswers: number = environment.poll.defaultConfig.maxCountOfAnswers,
+		public expiresDaysDelay: number = environment.poll.defaultConfig.expiresDaysDelay,
 		public expiracyAfterLastModificationInDays: number = environment.poll.defaultConfig
 			.expiracyAfterLastModificationInDays,
-		public expires: Date = DateService.addDaysToDate(
-			environment.poll.defaultConfig.expiracyInDays,
+		// date after creation day when people will not be able to vote anymore
+		public expiracyDate: Date = DateService.addDaysToDate(
+			environment.poll.defaultConfig.expiresDaysDelay,
 			new Date(Date.now())
 		)
 	) {}

 	public static isArchived(configuration: PollConfiguration): boolean {
-		return configuration.expires ? DateService.isDateInPast(configuration.expires) : undefined;
+		return configuration.expiracyDate ? DateService.isDateInPast(configuration.expiracyDate) : undefined;
 	}
 }
--- a/src/app/core/models/poll.model.ts
+++ b/src/app/core/models/poll.model.ts
@ -14,6 +14,9 @@ export class Poll {
 		public creatorPseudo?: string,
 		public creatorEmail?: string,
 		public isAboutDate?: boolean,
+		public isZeroKnoledge?: boolean,
+		public allowSeveralHours?: boolean,
+		public archiveNumberOfDays?: number,
 		public configuration: PollConfiguration = new PollConfiguration(),
 		public comments: Comment[] = [],
 		public choices: Choice[] = [],
--- a/src/app/core/services/poll.service.ts
+++ b/src/app/core/services/poll.service.ts
@ -64,7 +64,7 @@ export class PollService implements Resolve<Poll> {
 				console.log('getAllAvailablePolls res', res);
 			});
 		} catch (e) {
-			console.log('getAllAvailablePolls e', e);
+			console.error('getAllAvailablePolls e', e);
 		}
 	}

--- a/src/app/features/administration/form/advanced-config/advanced-config.component.html
+++ b/src/app/features/administration/form/advanced-config/advanced-config.component.html
@ -52,8 +52,8 @@
 				consultable</mat-label
 			>
 			<input
-				#expiracy
-				id="expiracy"
+				#expiresDaysDelay
+				id="expiresDaysDelay"
 				matInput
 				type="number"
 				placeholder="Nombre de jours avant fin des votes"
@ -62,11 +62,11 @@
 			/>
 			<button
 				mat-button
-				*ngIf="expiracy.value"
+				*ngIf="expiresDaysDelay.value"
 				matSuffix
 				mat-icon-button
 				aria-label="Clear"
-				(click)="expiracy.value = ''"
+				(click)="expiresDaysDelay.value = ''"
 			>
 				<i class="fa fa-close"></i>
 			</button>
@ -149,8 +149,8 @@
 		</mat-checkbox>
 		<input
 			*ngIf="form.value.hasMaxCountOfAnswers"
-			#limitCount
-			id="limitCount"
+			#maxCountOfAnswers
+			id="maxCountOfAnswers"
 			matInput
 			type="number"
 			placeholder="Nombre de réponses max"
--- a/src/app/features/administration/form/date-select/date-select.component.html
+++ b/src/app/features/administration/form/date-select/date-select.component.html
@ -1,145 +1,146 @@
 <div class="date-selection">
-	<form [formGroup]="form">
-		<!--	interval-->
+	<!--	<form [formGroup]="form">-->
+	<!--	interval-->

-		<!--	<section *ngIf="showDateInterval" class="date-interval form-row">-->
-		<!--		<button-->
-		<!--			(click)="showDateInterval = !showDateInterval"-->
-		<!--			[ngClass]="{ active: showDateInterval }"-->
-		<!--			class="btn btn&#45;&#45;primary"-->
-		<!--			id="toggle_interval_button"-->
-		<!--		>-->
-		<!--			<i class="fa fa-clock-o" aria-hidden="true"></i>-->
-		<!--			{{ 'dates.add_interval' | translate }}-->
-		<!--		</button>-->
-		<!--		<h2>{{ 'dates.add_interval' | translate }}</h2>-->
-		<!--		<div class="columns">-->
-		<!--			<div class="column">-->
-		<!--				{{ 'dates.interval_propose' | translate }}-->
-		<!--			</div>-->
-		<!--			<div class="column">-->
-		<!--				<label for="start_interval" class="hidden">start</label>-->
-		<!--				<input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />-->
-		<!--			</div>-->
-		<!--		</div>-->
-		<!--		<div class="columns">-->
-		<!--			<div class="column">-->
-		<!--				{{ 'dates.interval_span' | translate }}-->
-		<!--			</div>-->
-		<!--			<div class="column">-->
-		<!--				<label for="end_interval" class="hidden">end</label>-->
-		<!--				<input id="end_interval" formControlName="endDateInterval" type="date" />-->
-		<!--			</div>-->
-		<!--		</div>-->
-		<!--		<button (click)="addIntervalOfDates()" class="btn btn-block btn&#45;&#45;primary">-->
-		<!--			<i class="fa fa-plus" aria-hidden="true"></i>-->
-		<!--			{{ 'dates.interval_button' | translate }}-->
-		<!--			{{ intervalDays }}-->
-		<!--			{{ 'dates.interval_button_dates' | translate }}-->
-		<!--		</button>-->
-		<!--	</section>-->
+	<!--	<section *ngIf="showDateInterval" class="date-interval form-row">-->
+	<!--		<button-->
+	<!--			(click)="showDateInterval = !showDateInterval"-->
+	<!--			[ngClass]="{ active: showDateInterval }"-->
+	<!--			class="btn btn&#45;&#45;primary"-->
+	<!--			id="toggle_interval_button"-->
+	<!--		>-->
+	<!--			<i class="fa fa-clock-o" aria-hidden="true"></i>-->
+	<!--			{{ 'dates.add_interval' | translate }}-->
+	<!--		</button>-->
+	<!--		<h2>{{ 'dates.add_interval' | translate }}</h2>-->
+	<!--		<div class="columns">-->
+	<!--			<div class="column">-->
+	<!--				{{ 'dates.interval_propose' | translate }}-->
+	<!--			</div>-->
+	<!--			<div class="column">-->
+	<!--				<label for="start_interval" class="hidden">start</label>-->
+	<!--				<input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />-->
+	<!--			</div>-->
+	<!--		</div>-->
+	<!--		<div class="columns">-->
+	<!--			<div class="column">-->
+	<!--				{{ 'dates.interval_span' | translate }}-->
+	<!--			</div>-->
+	<!--			<div class="column">-->
+	<!--				<label for="end_interval" class="hidden">end</label>-->
+	<!--				<input id="end_interval" formControlName="endDateInterval" type="date" />-->
+	<!--			</div>-->
+	<!--		</div>-->
+	<!--		<button (click)="addIntervalOfDates()" class="btn btn-block btn&#45;&#45;primary">-->
+	<!--			<i class="fa fa-plus" aria-hidden="true"></i>-->
+	<!--			{{ 'dates.interval_button' | translate }}-->
+	<!--			{{ intervalDays }}-->
+	<!--			{{ 'dates.interval_button_dates' | translate }}-->
+	<!--		</button>-->
+	<!--	</section>-->

-		<div class="dates-list">
-			<div class="title">
-				<span class="count-dates">
-					{{ timeList.length }}
-				</span>
-				<span class="count-dates-txt">
-					{{ 'dates.count_time' | translate }}
-					(pour chaque jour)
-				</span>
-			</div>
-			<div class="actions">
-				<button
-					(click)="addTime()"
-					*ngIf="'false' === allowSeveralHours"
-					class="btn btn--primary"
-					id="add_time_button"
-				>
-					<i class="fa fa-plus" aria-hidden="true"></i>
-					{{ 'dates.add_time' | translate }}
-				</button>
-				<button
-					(click)="removeAllTimes()"
-					*ngIf="'false' === allowSeveralHours"
-					class="btn btn--warning"
-					id="remove_time_button"
-				>
-					<i class="fa fa-trash" aria-hidden="true"></i>
-					Aucune plage horaire
-				</button>
-				<button
-					(click)="resetTimes()"
-					*ngIf="'false' === allowSeveralHours"
-					class="btn btn--warning"
-					id="reset_time_button"
-				>
-					<i class="fa fa-refresh" aria-hidden="true"></i>
-					réinitialiser
-				</button>
-			</div>
-
-			<div *ngIf="'false' === allowSeveralHours" class="identical-dates">
-				<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
-					<div *ngFor="let time of timeList; index as id" class="time-choice" cdkDrag>
-						<label for="timeChoices_{{ id }}">
-							<i class="fa fa-clock-o" aria-hidden="true"></i>
-						</label>
-						<input
-							[(ngModel)]="time.literal"
-							name="timeChoices_{{ id }}"
-							type="text"
-							id="timeChoices_{{ id }}"
-						/>
-						<button (click)="time.timeList.splice(id, 1)" class="btn btn-warning">
-							<i class="fa fa-times" aria-hidden="true"></i>
-						</button>
-					</div>
-				</div>
-			</div>
-			<hr />
-			<span class="count-dates title">
-				{{ dateList.length }}
+	<!--	</form>-->
+	<div class="dates-list">
+		<div class="title">
+			<span class="count-dates">
+				{{ timeList.length }}
 			</span>
-			<span>
-				{{ 'dates.count_dates' | translate }}
+			<span class="count-dates-txt">
+				{{ 'dates.count_time' | translate }}
+				(pour chaque jour)
 			</span>
-			<button class="btn btn--primary" (click)="addChoice()">
-				{{ 'dates.add' | translate }}
+		</div>
+		<div class="actions">
+			<pre class="debug padded warning">
+			form.value.hasSeveralHours :
+				{{ form.value.hasSeveralHours | json }}
+			</pre
+			>
+			<button
+				(click)="addTime()"
+				*ngIf="!form.value.hasSeveralHours"
+				class="btn btn--primary"
+				id="add_time_button"
+			>
+				<i class="fa fa-plus" aria-hidden="true"></i>
+				{{ 'dates.add_time' | translate }}
 			</button>
-			<div *ngFor="let choice of dateList; index as id" class="date-choice">
-				{{ id }})
-				<input
-					[(ngModel)]="choice.date_object"
-					name="dateChoices_{{ id }}"
-					id="dateChoices_{{ id }}"
-					useValueAsDate
-					type="date"
-				/>
-				<button (click)="dateList.splice(id, 1)" class="btn btn-warning">
-					<i class="fa fa-times" aria-hidden="true"></i>
-				</button>
-				<button
-					(click)="addTimeToDate(choice, id)"
-					*ngIf="'true' === allowSeveralHours"
-					class="btn btn--primary"
-				>
-					{{ 'dates.add_time' | translate }}
-				</button>
-				<div *ngIf="'true' === allowSeveralHours" class="several-times">
-					<div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice">
-						<input
-							[(ngModel)]="timeItem.literal"
-							name="dateTime_{{ id }}_Choices_{{ idTime }}"
-							id="dateTime_{{ id }}_Choices_{{ idTime }}"
-							type="text"
-						/>
-						<button (click)="choice.timeList.splice(idTime, 1)" class="btn btn-warning">
-							<i class="fa fa-times" aria-hidden="true"></i>
-						</button>
-					</div>
+			<button
+				(click)="removeAllTimes()"
+				*ngIf="'false' === allowSeveralHours"
+				class="btn btn--warning"
+				id="remove_time_button"
+			>
+				<i class="fa fa-trash" aria-hidden="true"></i>
+				Aucune plage horaire
+			</button>
+			<button
+				(click)="resetTimes()"
+				*ngIf="'false' === allowSeveralHours"
+				class="btn btn--warning"
+				id="reset_time_button"
+			>
+				<i class="fa fa-refresh" aria-hidden="true"></i>
+				réinitialiser
+			</button>
+		</div>
+
+		<!--			<div *ngIf="'false' === allowSeveralHours" class="identical-dates">-->
+		<!--				<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">-->
+		<!--					<div *ngFor="let time of timeList; index as id" class="time-choice" cdkDrag>-->
+		<!--						<label for="timeChoices_{{ id }}">-->
+		<!--							<i class="fa fa-clock-o" aria-hidden="true"></i>-->
+		<!--						</label>-->
+		<!--						<input-->
+		<!--							[(ngModel)]="time.literal"-->
+		<!--							name="timeChoices_{{ id }}"-->
+		<!--							type="text"-->
+		<!--							id="timeChoices_{{ id }}"-->
+		<!--						/>-->
+		<!--						<button (click)="time.timeList.splice(id, 1)" class="btn btn-warning">-->
+		<!--							<i class="fa fa-times" aria-hidden="true"></i>-->
+		<!--						</button>-->
+		<!--					</div>-->
+		<!--				</div>-->
+		<!--			</div>-->
+		<hr />
+		<span class="count-dates title">
+			{{ dateList.length }}
+		</span>
+		<span>
+			{{ 'dates.count_dates' | translate }}
+		</span>
+		<button class="btn btn--primary" (click)="addChoice()">
+			{{ 'dates.add' | translate }}
+		</button>
+		<div *ngFor="let choice of dateList; index as id" class="date-choice">
+			{{ id }})
+			<input
+				[(ngModel)]="choice.date_object"
+				name="dateChoices_{{ id }}"
+				id="dateChoices_{{ id }}"
+				useValueAsDate
+				type="date"
+			/>
+			<button (click)="dateList.splice(id, 1)" class="btn btn-warning">
+				<i class="fa fa-times" aria-hidden="true"></i>
+			</button>
+			<button (click)="addTimeToDate(choice, id)" *ngIf="'true' === allowSeveralHours" class="btn btn--primary">
+				{{ 'dates.add_time' | translate }}
+			</button>
+			<div *ngIf="'true' === allowSeveralHours" class="several-times">
+				<div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice">
+					<input
+						[(ngModel)]="timeItem.literal"
+						name="dateTime_{{ id }}_Choices_{{ idTime }}"
+						id="dateTime_{{ id }}_Choices_{{ idTime }}"
+						type="text"
+					/>
+					<button (click)="choice.timeList.splice(idTime, 1)" class="btn btn-warning">
+						<i class="fa fa-times" aria-hidden="true"></i>
+					</button>
 				</div>
 			</div>
 		</div>
-	</form>
+	</div>
 </div>
--- a/src/app/features/administration/form/form.component.html
+++ b/src/app/features/administration/form/form.component.html
@ -1,44 +1,11 @@
 <div class="admin-form padded">
 	<form [formGroup]="form">
-		<div class="columns">
+		<header class="columns">
 			<div class="column">
 				<h1>
 					{{ 'creation.title' | translate }}
 				</h1>
-				<p class="subtitle">
-					{{ 'creation.want' | translate }}
-				</p>
-				<app-kind-select [form]="form"></app-kind-select>
-				<app-date-select ng-if="form.value.isAboutDate" [form]="form"></app-date-select>
-				<app-text-select ng-if="!form.value.isAboutDate" [form]="form"></app-text-select>
-
-				<app-base-config [form]="form"></app-base-config>
 			</div>
-		</div>
-		<div class="column">
-			<pre class="debug padded warning">
-				form values :
-					{{ form.value | json }}
-				</pre
-			>
-			<pre class="debug padded warning">
-				poll initial values :
-				{{ poll | json }}
-				</pre
-			>
-		</div>
-		<!--			choix spécialement pour les dates-->
-
-		<button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
-			<i class="fa fa-save"></i>
-			{{ 'creation.advanced' | translate }}
-		</button>
-		<app-advanced-config [poll]="poll" [form]="form" *ngIf="advancedDisplayEnabled"></app-advanced-config>
-
-		<hr />
-
-		<div class="columns">
-			<div class="column"></div>
 			<div class="column">
 				<button
 					class="btn is-success"
@ -49,9 +16,40 @@
 					Enregistrer le sondage
 				</button>
 			</div>
-		</div>
+		</header>
+		<main class="columns">
+			<div class="column">
+				<p class="subtitle">
+					{{ 'creation.want' | translate }}
+				</p>
+				<!--				<app-kind-select [form]="form"></app-kind-select>-->
+				<app-date-select ng-if="form.value.isAboutDate" [form]="form"></app-date-select>
+				<!--				<app-text-select ng-if="!form.value.isAboutDate" [form]="form"></app-text-select>-->
+
+				<!--				<app-base-config [form]="form"></app-base-config>-->
+
+				<button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
+					<i class="fa fa-save"></i>
+					{{ 'creation.advanced' | translate }}
+				</button>
+				<app-advanced-config [poll]="poll" [form]="form" *ngIf="advancedDisplayEnabled"></app-advanced-config>
+			</div>
+		</main>
+		<footer class="column">
+			<pre class="debug padded warning">
+				form values :
+					{{ form.value | json }}
+				</pre
+			>
+			<pre class="debug padded warning">
+				poll initial values :
+				{{ poll | json }}
+				</pre
+			>
+		</footer>
+		<hr />
 		<div class="validation">
-			<div class="has-background-danger" *ngIf="!form.valid">
+			<div class="has-background-danger" *ngIf="!form.valid && form.touched">
 				le formulaire est invalide
 				<pre>
 		 {{ form.errors | json }}
--- a/src/app/features/administration/form/form.component.ts
+++ b/src/app/features/administration/form/form.component.ts
@ -20,7 +20,7 @@ export class FormComponent implements OnInit {
 	public poll?: Poll;
 	public form: FormGroup;

-	public advancedDisplayEnabled = true;
+	public advancedDisplayEnabled = false;

 	constructor(
 		private fb: FormBuilder,
@ -53,10 +53,11 @@ export class FormComponent implements OnInit {
 			whoModifiesAnswers: ['', [Validators.required]],
 			whoCanChangeAnswers: ['', [Validators.required]],
 			isAboutDate: [true, [Validators.required]],
+			isProtectedByPassword: [false, [Validators.required]],
 			startDateInterval: ['', [Validators.required]],
 			endDateInterval: ['', [Validators.required]],
-			isProtectedByPassword: [false, [Validators.required]],
-			hasMaxCountOfAnswers: [true, [Validators.required]],
+			hasMaxCountOfAnswers: [true, [Validators.required, Validators.min(1)]],
+			hasSeveralHours: [false, [Validators.required]],
 			allowComments: [true, [Validators.required]],
 			maxCountOfAnswers: [150, [Validators.required]],
 			isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
@ -74,7 +75,7 @@ export class FormComponent implements OnInit {
 	}

 	/**
-	 * add example values to the form
+	 * add example values to the form, overrides defaults of PollConfiguration
 	 */
 	setDemoValues(): void {
 		this.form.patchValue({
@ -84,6 +85,7 @@ export class FormComponent implements OnInit {
 			creatorPseudo: 'Chuck Norris',
 			creatorEmail: 'chucknorris@example.com',
 			isAboutDate: true,
+			hasSeveralHours: true,
 			configuration: {
 				whoModifiesAnswers: 'everybody',
 				whoCanChangeAnswers: 'everybody',
--- a/src/app/features/administration/stepper/stepper.component.ts
+++ b/src/app/features/administration/stepper/stepper.component.ts
@ -50,7 +50,7 @@ export class StepperComponent implements OnInit {
 			],
 			areResultsPublic: [this.poll ? this.poll.configuration.areResultsPublic : true, [Validators.required]],
 			expiracyNumberOfDays: [
-				this.poll ? DateService.diffInDays(new Date(), this.poll.configuration.expires) : 60,
+				this.poll ? DateService.diffInDays(new Date(), this.poll.configuration.expiracyDate) : 60,
 				[Validators.required],
 			],
 		});
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@ -39,7 +39,7 @@ export const environment = {
 	},
 	poll: {
 		defaultConfig: {
-			expiracyInDays: 60,
+			expiresDaysDelay: 60,
 			expiracyAfterLastModificationInDays: 180,
 		},
 	},
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@ -54,7 +54,8 @@ export const environment = {
 	},
 	poll: {
 		defaultConfig: {
-			expiracyInDays: 60,
+			maxCountOfAnswers: 150,
+			expiresDaysDelay: 60,
 			expiracyAfterLastModificationInDays: 180,
 		},
 	},