link to base config

src/app/core/models/poll.model.ts

@@ -8,9 +8,12 @@ import { User } from './user.model';
 export class Poll {
 	constructor(
 		public owner: User = new User(),
-		public slug: string = 'default-slug',
-		public title: string = 'default title',
+		public slug: string = '',
+		public title: string = '',
 		public description?: string,
+		public creatorPseudo?: string,
+		public creatorEmail?: string,
+		public isAboutDate?: boolean,
 		public configuration: PollConfiguration = new PollConfiguration(),
 		public comments: Comment[] = [],
 		public choices: Choice[] = [],

src/app/features/administration/administration.module.ts

@@ -1,6 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
+import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { SharedModule } from '../../shared/shared.module';
@@ -35,6 +35,7 @@ import { AdvancedConfigComponent } from './form/advanced-config/advanced-config.
 		CommonModule,
 		ReactiveFormsModule,
 		SharedModule,
+		FormsModule,
 		TranslateModule.forChild({ extend: true }),
 		DateValueAccessorModule,
 	],

src/app/features/administration/form/base-config/base-config.component.html

@@ -4,11 +4,12 @@
 			<p>
 				{{ 'creation.choose_title' | translate }}
 			</p>
+			<h2 class="title is-2">slug: {{ form.value.slug }}</h2>
 			<br />
 			<label class="hidden" for="title">Titre</label>
 			<input
-				#title
 				matInput
+				#title
 				[placeholder]="'creation.choose_title_placeholder' | translate"
 				formControlName="title"
 				id="title"
@@ -18,11 +19,11 @@
 			/>
 			<button
 				mat-button
-				*ngIf="title.value"
+				*ngIf="form.value.title"
 				matSuffix
 				mat-icon-button
 				aria-label="Clear"
-				(click)="title.value = ''"
+				(click)="form.patchValue({ title: '' })"
 			>
 				<i class="fa fa-close"></i>
 			</button>
@@ -35,7 +36,7 @@
 			</label>
 
 			<input
-				#title
+				#creatorEmail
 				matInput
 				placeholder="{{ 'creation.email_placeholder' | translate }}"
 				formControlName="creatorEmail"
@@ -49,57 +50,64 @@
 					{{ 'creation.name' | translate }}
 				</span>
 			</label>
-			<input #title matInput placeholder="pseudo" formControlName="creatorPseudo" id="creatorPseudo" required />
+			<input
+				#creatorPseudo
+				matInput
+				placeholder="pseudo"
+				formControlName="creatorPseudo"
+				id="creatorPseudo"
+				required
+			/>
 		</div>
 
 		<hr />
 	</div>
 
 	<hr />
-	<div class="columns">
-		<div class="column">
-			<!--			<img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
-			<div>
-				<h2>
-					{{ 'choices.title' | translate }}
-				</h2>
-				{{ 'dates.add' | translate }}
-				<p>
-					<i>
-						{{ 'choices.helper' | translate }}
-					</i>
-				</p>
-				{{ 'choices.answer_preset_1' | translate }}
-				{{ 'choices.add' | translate }}
-				{{ 'choices.continue' | translate }}
-			</div>
-		</div>
-	</div>
-	<div class="column">
-		<button class="btn btn--warning" (click)="askInitFormDefault()">
-			<i class="fa fa-refresh"></i>
-			Tout réinitialiser
-		</button>
-		<br />
-		<button class="btn is-success" (click)="createPoll()">
-			<i class="fa fa-save"></i>
-			Enregistrer le sondage
-		</button>
-		<br />
-		<button class="btn is-default" (click)="automaticSlug()">
-			<i class="fa fa-refresh"></i>
-			Slug automatique
-		</button>
+	<!--	<div class="columns">-->
+	<!--		<div class="column">-->
+	<!--						<img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
+	<!--			<div>-->
+	<!--				<h2>-->
+	<!--					{{ 'choices.title' | translate }}-->
+	<!--				</h2>-->
+	<!--				{{ 'dates.add' | translate }}-->
+	<!--				<p>-->
+	<!--					<i>-->
+	<!--						{{ 'choices.helper' | translate }}-->
+	<!--					</i>-->
+	<!--				</p>-->
+	<!--				{{ 'choices.answer_preset_1' | translate }}-->
+	<!--				{{ 'choices.add' | translate }}-->
+	<!--				{{ 'choices.continue' | translate }}-->
+	<!--			</div>-->
+	<!--		</div>-->
+	<!--	</div>-->
+	<!--	<div class="column">-->
+	<!--		<button class="btn btn&#45;&#45;warning" (click)="askInitFormDefault()">-->
+	<!--			<i class="fa fa-refresh"></i>-->
+	<!--			Tout réinitialiser-->
+	<!--		</button>-->
+	<!--		<br />-->
+	<!--		<button class="btn is-success" (click)="createPoll()">-->
+	<!--			<i class="fa fa-save"></i>-->
+	<!--			Enregistrer le sondage-->
+	<!--		</button>-->
+	<!--		<br />-->
+	<!--		<button class="btn is-default" (click)="automaticSlug()">-->
+	<!--			<i class="fa fa-refresh"></i>-->
+	<!--			Slug automatique-->
+	<!--		</button>-->
 
-		<div class="columns">
-			<div class="column">
-				Slug:
-			</div>
-			<div class="column">
-				<div class="well">
-					{{ poll.slug }}
-				</div>
-			</div>
-		</div>
-	</div>
+	<!--		<div class="columns">-->
+	<!--			<div class="column">-->
+	<!--				Slug:-->
+	<!--			</div>-->
+	<!--			<div class="column">-->
+	<!--				<div class="well">-->
+	<!--					{{ form.slug }}-->
+	<!--				</div>-->
+	<!--			</div>-->
+	<!--		</div>-->
+	<!--	</div>-->
 </form>

src/app/features/administration/form/base-config/base-config.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, Component, Inject, Input, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, EventEmitter, Inject, Input, OnInit, Output } from '@angular/core';
 import { ToastService } from '../../../../core/services/toast.service';
 import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { UuidService } from '../../../../core/services/uuid.service';
@@ -30,12 +30,10 @@ export class BaseConfigComponent implements OnInit {
 		@Inject(DOCUMENT) private document: Document
 	) {}
 
-	ngOnInit(): void {
-		this.initFormDefault(false);
-	}
+	ngOnInit(): void {}
 
 	askInitFormDefault(): void {
-		this.initFormDefault(false);
+		// this.initFormDefault(false);
 		this.toastService.display('formulaire réinitialisé');
 	}
 
@@ -60,29 +58,6 @@ export class BaseConfigComponent implements OnInit {
 		// }
 	}
 
-	initFormDefault(showDemoValues = true): void {
-		this.form = this.fb.group({
-			title: ['', [Validators.required, Validators.minLength(12)]],
-			creatorPseudo: ['', [Validators.required]],
-			creatorEmail: ['', [Validators.required]],
-			slug: [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]],
-			expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]],
-		});
-		console.log('this.form ', this.form);
-	}
-
 	public updateSlug(): void {
 		const newValueFormatted = 'TODO';
 		this.form.patchValue({ slug: newValueFormatted });
@@ -94,4 +69,8 @@ export class BaseConfigComponent implements OnInit {
 	automaticSlug() {
 		this.form.patchValue({ slug: this.pollService.makeSlug(this.poll) });
 	}
+
+	formUpdate() {
+		this.formChange.emit(this.form);
+	}
 }

src/app/features/administration/form/form.component.html

@@ -1,13 +1,29 @@
 <div class="admin-form padded">
 	<form [formGroup]="form">
-		<h1>
-			{{ 'creation.title' | translate }}
-		</h1>
-		<p class="subtitle">
-			{{ 'creation.want' | translate }}
-		</p>
-		<app-kind-select [poll]="poll" [form]="form"></app-kind-select>
-		<app-base-config [poll]="poll" [form]="form"></app-base-config>
+		<div 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-base-config [(form)]="form"></app-base-config>
+			</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>
+		</div>
 
 		<!--			choix spécialement pour les dates-->
 		<!--	<app-date-select ng-if="form.kind == 'date'"></app-date-select>-->

src/app/features/administration/form/form.component.ts

@@ -77,20 +77,26 @@ export class FormComponent implements OnInit {
 	 */
 	setDemoValues(): void {
 		this.form.patchValue({
-			title: 'mon titre',
+			title: '',
 			description: 'répondez SVP <3 ! *-* ',
 			slug: this.uuidService.getUUID(),
 			creatorPseudo: 'Chuck Norris',
 			creatorEmail: 'chucknorris@example.com',
 			isAboutDate: true,
-			whoModifiesAnswers: 'everybody',
-			whoCanChangeAnswers: 'everybody',
-			isProtectedByPassword: false,
-			isOwnerNotifiedByEmailOnNewVote: false,
-			isOwnerNotifiedByEmailOnNewComment: false,
-			isMaybeAnswerAvailable: false,
-			areResultsPublic: true,
-			expiracyNumberOfDays: 60,
+			// configuration: {
+			// 	whoModifiesAnswers: 'everybody',
+			// 	whoCanChangeAnswers: 'everybody'
+			// isProtectedByPassword: false,
+			// isOwnerNotifiedByEmailOnNewVote: false,
+			// isOwnerNotifiedByEmailOnNewComment: false,
+			// isMaybeAnswerAvailable: false,
+			// areResultsPublic: true,
+			// expiracyNumberOfDays: 60,
+			// },
+			comments: [],
+			choices: [],
+			dateChoices: [],
+			timeChoices: [],
 		});
 	}
 }