Liness/framadate-responsive
5
0
Fork 0
forked from tykayn/funky-framadate-front
Code Pull Requests Activity

reorder questions

Browse Source
This commit is contained in:
tykayn 2020-11-05 19:13:43 +01:00 committed by Baptiste Lemoine
parent 10c1930e4d
commit 8df2b95c1e
12 changed files with 132 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
main.lqa Normal file
View File

@ -0,0 +1,4 @@
<?xml version='1.0' encoding='UTF-8'?>
<qa version="1.0">
<category name="default"/>
</qa>

4
src/app/core/components/footer/footer.component.scss
View File

@ -0,0 +1,4 @@
.app-logo {
max-width: 5em;
max-height: 5em;
}

4
src/app/core/components/header/header.component.html
View File

@ -3,7 +3,7 @@
<div class="navbar-brand">
<a class="navbar-item" routerLink="/">
<img class="app-logo logo" *ngIf="appLogo" src="{{ appLogo }}" alt="{{ appTitle }}" />
<span class="app-title title">
<span class="app-title title is-2">
{{ appTitle }}
</span>
<span class="dev-env" *ngIf="!env.production">
@ -39,7 +39,7 @@
<app-language-selector></app-language-selector>
<app-theme-selector></app-theme-selector>
<a class="navbar-item btn btn-primary" routerLink="user/polls" routerLinkActive="is-active">
<i class="fa fa-user"></i> {{ 'config.find_my_polls' | translate }}
<i class="fa fa-user"></i>
</a>
</div>
</div>

6
src/app/core/models/poll.model.ts
View File

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

4
src/app/core/models/user.model.ts
View File

@ -3,8 +3,8 @@ import { Poll } from './poll.model';
export class User {
constructor(
public pseudo: string,
public email: string,
public pseudo: string = 'pseudo',
public email: string = 'example@example.com',
public polls: Poll[] = [],
public role?: UserRole,
public token?: string

10
src/app/core/services/poll.service.ts
View File

@ -10,6 +10,7 @@ import { ApiService } from './api.service';
import { ToastService } from './toast.service';
import { UserService } from './user.service';
import { UuidService } from './uuid.service';
import { Form } from '@angular/forms';
@Injectable({
providedIn: 'root',
@ -124,4 +125,13 @@ export class PollService implements Resolve<Poll> {
return list;
}
newPollFromForm(form: any) {
const newpoll = new Poll(
this.userService.getCurrentUser(),
this.uuidService.getUUID(),
form.controls.title.value
);
return newpoll;
}
}

131
src/app/features/administration/form/form.component.html
View File

@ -2,9 +2,7 @@
<h1>
{{ 'creation.title' | translate }}
</h1>
<span class="pre-selector">
{{ 'creation.want' | translate }}
</span>
<button class="btn btn--warning" (click)="askInitFormDefault()">
<i class="fa fa-refresh"></i>
Tout réinitialiser
@ -12,37 +10,38 @@
<form [formGroup]="form">
<div class="form-field">
<h2>Choix de réponse</h2>
<span formArrayName="choices">
<h3>Choix proposés</h3>
<button (click)="addChoice()">
<i class="fa fa-plus"></i>
Ajouter un choix
</button>
<button (click)="reinitChoices()">
<i class="fa fa-recycle"></i>
Réinitialiser
</button>
<div *ngFor="let choice of choices.controls; let i = index">
<div class="form-row" [formGroup]="choice">
<label for="label" class="hidden">label</label>
<input formControlName="label" id="label" placeholder="Enter a choice description" />
<label for="imageUrl" class="imageUrl">image Url</label>
<input formControlName="imageUrl" id="imageUrl" placeholder="URL de l' image" />
<button (click)="deleteChoiceField(i)">
<i class="fa fa-times"></i>
</button>
</div>
</div>
<span class="pre-selector">
{{ 'creation.want' | translate }}
</span>
<div class="kind-of-poll">
<h1 class="title is-1">
<i class="fa fa-calendar" aria-hidden="true"></i> {{ 'dates.title' | translate }}
</h1>
<button
class="btn"
[ngClass]="{ 'is-primary': form.controls.isAboutDate.value }"
(click)="form.controls.isAboutDate.setValue(true)"
>
<i class="fa fa-calendar"></i>
{{ 'creation.kind.date' | translate }}
</button>
<button
[ngClass]="{ 'is-primary': !form.controls.isAboutDate.value }"
(click)="form.controls.isAboutDate.setValue(false)"
>
<i class="fa fa-doc-text"></i>
{{ 'creation.kind.classic' | translate }}
</button>
</div>
<div class="form-field">
<span>
{{ 'creation.choose_title' | translate }}
</span>
<label class="hidden" for="title">Titre</label>
<input
#title
matInput
placeholder="Votre titre de sondage"
[placeholder]="'creation.choose_title_placeholder' | translate"
formControlName="title"
id="title"
autofocus="autofocus"
@ -60,6 +59,47 @@
<i class="fa fa-close"></i>
</button>
</div>
<div class="form-field">
<h2>Choix de réponse</h2>
<span>
<span class="columns">
<span class="column">
<button class="btn is-primary" (click)="addChoice()">
<i class="fa fa-plus"></i>
Ajouter un choix
</button>
</span>
<span class="column pull-right">
<button class="btn is-warning" (click)="reinitChoices()">
<i class="fa fa-recycle"></i>
Réinitialiser
</button>
</span>
</span>
<span *ngFor="let choice of choices.controls; let i = index">
<div class="form-row" [formGroup]="choice">
<div class="columns">
<div class="column">{{ i * 1 + 1 }})</div>
<div class="column">
<label for="label" class="hidden">label</label>
<input formControlName="label" id="label" placeholder="Enter a choice description" />
<br />
<label for="imageUrl" class="imageUrl">image Url</label>
<input formControlName="imageUrl" id="imageUrl" placeholder="URL de l' image" />
</div>
<div class="column">
<button class="btn btn-warning" (click)="deleteChoiceField(i)">
<i class="fa fa-times"></i>
</button>
</div>
</div>
</div>
</span>
</span>
</div>
<div>
<label class="hidden" for="creatorEmail">creator email</label>
<input
@ -129,23 +169,6 @@
</span>
<input #slug matInput id="slug" placeholder="Url" formControlName="slug" required />
<br />
<h2>
Type de sondage
</h2>
<h1 class="title is-1"><i class="fa fa-calendar" aria-hidden="true"></i> {{ 'dates.title' | translate }}</h1>
<button class="btn" (click)="form.setValue({ isAboutDate: true })">
Spécial date
</button>
<button class="btn" (click)="form.controls.isAboutDate.setValue(false)">
Classique - textes
</button>
<button
[ngClass]="{ 'is-primary': !form.controls.isAboutDate.value }"
(click)="form.controls.isAboutDate.setValue(false)"
>
Classique - textes
</button>
<h2>Version complète du formulaire</h2>
<div appearance="outline" class="is-flex">
<mat-label>Nombre de jours avant expiration</mat-label>
@ -188,12 +211,22 @@
La réponse « peut-être » sera disponible
</mat-checkbox>
<button mat-button (click)="createPoll()" [disabled]="!form.valid || !form.valid">
<button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
<i class="fa fa-save"></i>
Options avancées
</button>
<div class="columns">
<div class="column">
<span class="complete well" *ngIf="advancedDisplayEnabled">
version longue du formulaire activée
</span>
</div>
<div class="column">
<button class="btn is-success" (click)="createPoll()" [disabled]="!form.valid || !form.valid">
<i class="fa fa-save"></i>
Enregistrer le sondage
</button>
<span class="complete well" *ngIf="longFormVersionEnabled">
version longue du formulaire activée
</span>
</div>
</div>
</form>
</div>

2
src/app/features/administration/form/form.component.scss
View File

@ -17,7 +17,5 @@
padding-left: 1em;
}
.fa {
margin-right: 1em;
color: $primary_color;
}
}

29
src/app/features/administration/form/form.component.ts
View File

@ -4,6 +4,7 @@ import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { UuidService } from '../../../core/services/uuid.service';
import { ApiService } from '../../../core/services/api.service';
import { ToastService } from '../../../core/services/toast.service';
import { PollService } from '../../../core/services/poll.service';
@Component({
selector: 'app-admin-form',
@ -15,14 +16,14 @@ export class FormComponent implements OnInit {
public poll?: Poll;
public form: FormGroup;
public longFormVersionEnabled = true;
public urlPrefix: string = window.location.origin + '/participation/';
public advancedDisplayEnabled = false;
constructor(
private fb: FormBuilder,
private uuidService: UuidService,
private toastService: ToastService,
private pollService: PollService,
private apiService: ApiService
) {}
@ -33,8 +34,9 @@ export class FormComponent implements OnInit {
public createPoll(): void {
if (this.form.valid && this.form.valid) {
console.log('Le sondage est correctement rempli, prêt à enregistrer.');
let newpoll = this.pollService.newPollFromForm(this.form);
// TODO : save the poll
this.apiService.createPoll(this.poll);
this.apiService.createPoll(newpoll);
}
}
@ -47,13 +49,18 @@ export class FormComponent implements OnInit {
return this.form.get('choices') as FormArray;
}
addChoice() {
this.choices.push(
this.fb.group({
addChoice(optionalLabel: string = '') {
let newControlGroup = this.fb.group({
label: this.fb.control('', [Validators.required]),
imageUrl: ['', [Validators.required]],
})
);
});
if (optionalLabel) {
newControlGroup.patchValue({
label: optionalLabel,
});
}
this.choices.push(newControlGroup);
}
deleteChoiceField(index: number) {
@ -84,9 +91,9 @@ export class FormComponent implements OnInit {
});
console.log('this.form ', this.form);
this.addChoice();
this.addChoice();
this.addChoice();
this.addChoice('orange');
this.addChoice('raisin');
this.addChoice('abricot');
this.form.patchValue({
title: 'mon titre',

3
src/app/shared/components/selectors/theme-selector/theme-selector.component.html
View File

@ -1,7 +1,4 @@
<div class="columns">
<div class="column">
<p>Theme</p>
</div>
<div class="column">
<div class="buttons has-addons">
<button

3
src/assets/i18n/en.json → src/assets/i18n/EN.json
View File

@ -133,6 +133,9 @@
"choiceNotColorblind": "I am not",
"colorblindText": "colorblind."
},
"selectors": {
"lang": "Select the lang"
},
"LANGUAGES": {
"DE": "Allemand",
"FR": "French",

0
src/assets/i18n/fr.json → src/assets/i18n/FR.json
View File