tykayn/funky-framadate-front
1
1
Fork 1
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git synced 2023-08-25 13:53:14 +02:00
Code Issues Projects Releases Wiki Activity

add AR lang 👽 and complete sections of consultation

Browse Source
This commit is contained in:
Tykayn 2022-02-07 13:58:23 +01:00 committed by tykayn
parent 4c9c691f4e
commit d8f2a718e4
15 changed files with 272 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/core/enums/language.enum.ts
View File

@ -3,6 +3,7 @@
* Cette enum est utilisé dans le composant de sélection de langue.
*/
export enum LanguageEnum {
ar = 'ar',
br = 'br',
ca = 'ca',
de = 'de',

94
src/app/features/consultation/consultation.component.html
View File

@ -1,6 +1,52 @@
<div class="step-info">
<div class="container">
<div class="columns">
<div class="column">
<a
class="logo-home-link navbar-item pull-left is-hidden-mobile"
[routerLink]="['/']"
routerLinkActive="active"
>
<img
class="stepper-app-logo logo"
*ngIf="environment.appLogo"
src="{{ environment.appLogo }}"
alt="accueil {{ environment.appTitle }}"
/>
</a>
<h1>
<span class="step-title-poll" *ngIf="pollService.step_current == 1">
{{ 'creation.title' | translate }}
</span>
<span *ngIf="pollService.step_current > 1">
<span class="step-title-poll poll-title-filled" *ngIf="pollService.form.value.title.length">
{{ pollService.form.value.title }}
</span>
<span class="step-title-poll poll-title-empty" *ngIf="!pollService.form.value.title.length">
{{ 'nav.no_title' | translate }}
</span>
</span>
</h1>
</div>
<div class="column has-text-right">
<app-language-selector class="nav-button"></app-language-selector>
<button
class="has-no-border nav-button cancel-button"
[routerLink]="'/'"
id="display_cancel_popup_button"
aria-haspopup="dialog"
>
{{ 'nav.leave' | translate }} <i class="fa fa-times"></i>
</button>
</div>
</div>
</div>
</div>
<section class="poll_loaded padded consultation" *ngIf="!fetching && poll">
<div class="step">
<div class="rounded-box">
<section class="main-title-poll rounded-block">
<div class="columns">
<div class="column">
<h2 class="title is-2">
@ -18,7 +64,51 @@
<p class="description">
{{ poll.description }}
</p>
</div>
<button class="vote-button is-primary button" [routerLink]="'/poll/' + poll.custom_url + '/vote'">
{{ 'participation.fav_title' | translate }}
</button>
</section>
<section class="favourite">
<h2 class="title is-3">
{{ 'participation.fav_choice' | translate }}
</h2>
<div class="rounded-block">
<div class="section no-votes">
<div class="message is-info" *ngIf="poll.stacks.length == 0">
<div class="message-body">
{{ 'participation.no_votes_yet' | translate }}
<br />
{{ 'participation.fav_description_not_exist' | translate }}
</div>
</div>
</div>
<div class="has-votes" *ngIf="poll.stacks.length !== 0">
{{ 'participation.fav_description_one' | translate: { maxYesCount: maxYesCount } }}
{{ 'participation.fav_description_several' | translate }}
</div>
</div>
</section>
<section class="poll-answers">
<h2 class="title is-3">
{{ 'participation.poll' | translate }}
</h2>
<div class="rounded-block">
<app-poll-results-dinum [poll]="poll"></app-poll-results-dinum>
</div>
</section>
<section class="poll-comments">
<h2 class="title is-3">
{{ 'participation.comments' | translate }}
</h2>
<div class="rounded-block">
<!-- *ngIf="poll.allow_comments"-->
<app-comments [poll]="poll" [vote_stack]="storageService.vote_stack"></app-comments>
<!-- <div class="alert has-background-info" *ngIf="!poll.allow_comments">-->
<!-- Ce sondage ne permet pas d'ajouter de commentaires-->
<!-- </div>-->
</div>
</section>
</div>
</section>
<section class="loadin_poll" *ngIf="fetching">

9
src/app/features/consultation/consultation.component.scss
View File

@ -4,3 +4,12 @@
left: 1em;
z-index: 10;
}
.poll_loaded {
.title {
margin-bottom: 0;
}
.description {
min-height: 2rem;
}
}

3
src/app/features/consultation/consultation.component.ts
View File

@ -8,6 +8,7 @@ import { PollUtilitiesService } from '../../core/services/poll.utilities.service
import { StorageService } from '../../core/services/storage.service';
import { ApiService } from '../../core/services/api.service';
import { ToastService } from '../../core/services/toast.service';
import { environment } from 'src/environments/environment';
@Component({
selector: 'app-consultation',
@ -17,12 +18,14 @@ import { ToastService } from '../../core/services/toast.service';
export class ConsultationComponent implements OnInit, OnDestroy {
public fetching = true;
public environment = environment;
private routeSubscription: Subscription;
window: any;
private isArchived: boolean;
private poll: Poll;
private pollSlug: string;
private pass_hash: string;
maxYesCount: any = 1;
constructor(
private router: Router,

2
src/app/features/consultation/consultation.module.ts
View File

@ -17,6 +17,7 @@ import { SuccessComponent } from './success/success.component';
import { AdministrationModule } from '../administration/administration.module';
import { EditComponent } from './edit/edit.component';
import { ResultsRoundedComponent } from './results-rounded/results-rounded.component';
import { PollResultsDinumComponent } from './poll-results-dinum/poll-results-dinum.component';
@NgModule({
declarations: [
@ -30,6 +31,7 @@ import { ResultsRoundedComponent } from './results-rounded/results-rounded.compo
SuccessComponent,
EditComponent,
ResultsRoundedComponent,
PollResultsDinumComponent,
],
imports: [
CommonModule,

27
src/app/features/consultation/edit/edit.component.html
View File

@ -6,6 +6,31 @@
<div class="date-choices" *ngIf="pollService.poll.kind == 'date'">
<div class="box" *ngFor="let group of poll.choices_grouped"></div>
</div>
<div class="rounded-block"></div>
<div class="rounded-block">
<div class="time-slice-choice" *ngFor="let choice of group.choices">
<h4 class="title is-4 choice-label">
{{ choice.name }}
</h4>
<app-choice-button
[poll]="poll"
[choice]="choice"
[answerKind]="'YES'"
*ngIf="poll.allowed_answers.indexOf('yes') !== -1"
></app-choice-button>
<app-choice-button
[poll]="poll"
[choice]="choice"
[answerKind]="'MAYBE'"
*ngIf="poll.allowed_answers.indexOf('maybe') !== -1"
></app-choice-button>
<app-choice-button
[poll]="poll"
[choice]="choice"
[answerKind]="'NO'"
*ngIf="poll.allowed_answers.indexOf('no') !== -1"
></app-choice-button>
</div>
</div>
</div>
<app-nav-steps [next_step_number]="2" [previous_step_number]="0"></app-nav-steps>

3
src/app/features/consultation/poll-results-compact/poll-results-compact.component.html
View File

@ -1,4 +1,3 @@
{{ poll.choices.length }} choix
<div class="date-choices" *ngIf="poll.kind == 'date'">
<div class="box" *ngFor="let group of poll.choices_grouped">
<h3 class="title is-3">
@ -9,7 +8,7 @@
>
<i class="fa fa-check-circle-o fa"></i>
</button>
{{ showAsDate(group.date_string) | date: 'fullDate':'Europe/Paris':'fr' }}
{{ showAsDate(group.date_string) | date: 'fullDate':'Europe/Paris' }}
</h3>
<div class="time-slice-choice" *ngFor="let choice of group.choices">
<div class="columns is-vcentered is-mobile">

23
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.html Normal file
View File

@ -0,0 +1,23 @@
<div class="date-choices" *ngIf="poll.kind == 'date'">
<div class="box" *ngFor="let group of poll.choices_grouped">
<h3 class="title is-3">
{{ showAsDate(group.date_string) | date: 'fullDate':'Europe/Paris' }}
</h3>
<div class="time-slice-choice" *ngFor="let choice of group.choices">
<h4 class="title is-4 choice-label">
{{ choice.name }}
</h4>
<div class="columns is-vcentered is-mobile">
<div class="column"></div>
<div class="column is-narrow">
<span class="max_score" *ngIf="poll.max_score > 0 && choice.score == poll.max_score">
<i class="fa fa-star fa-2x"></i>
</span>
</div>
<div class="column is-narrow">
<div class="buttons"></div>
</div>
</div>
</div>
</div>
</div>

3
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.scss Normal file
View File

@ -0,0 +1,3 @@
.max_score {
color: green;
}

24
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.spec.ts Normal file
View File

@ -0,0 +1,24 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { PollResultsDinumComponent } from './poll-results-dinum.component';
describe('PollResultsDinumComponent', () => {
let component: PollResultsDinumComponent;
let fixture: ComponentFixture<PollResultsDinumComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [PollResultsDinumComponent],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(PollResultsDinumComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

26
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.ts Normal file
View File

@ -0,0 +1,26 @@
import { Component, Input, OnInit } from '@angular/core';
import { Poll } from '../../../core/models/poll.model';
import { Answer } from '../../../core/enums/answer.enum';
import { ModalService } from '../../../core/services/modal.service';
import { StorageService } from '../../../core/services/storage.service';
@Component({
selector: 'app-poll-results-dinum',
templateUrl: './poll-results-dinum.component.html',
styleUrls: ['./poll-results-dinum.component.scss'],
})
export class PollResultsDinumComponent implements OnInit {
@Input() public poll: Poll;
public answerEnum = Answer;
constructor(private modalService: ModalService, private storageService: StorageService) {}
ngOnInit(): void {}
toggleAnswer(choice_id: number, value: string) {
this.storageService.toggleAnswer(choice_id, value);
}
showAsDate(date_string: string) {
return new Date(date_string);
}
}

55
src/app/shared/components/comments/comments.component.html
View File

@ -4,8 +4,8 @@
</div>
<section class="comments-part" *ngIf="!poll.is_archived && poll.comments">
<h2 class="title is-2">
<i class="fa fa-comment"></i>
{{ poll.comments.length }} Commentaires
<!-- {{ poll.comments.length }}-->
{{ 'participation.comments_new' | translate }}
</h2>
<article class="message" *ngFor="let comment of poll.comments">
@ -14,9 +14,17 @@
<em class="cname"> {{ comment.pseudo }} </em>,
<span class="date date-days-ago">
il y a
{{ calculateDaysAgoOfComment(comment.created_at) }} jours, le </span
><span class="date is-small">
{{
'participation.dipslay_comments_delay'
| translate
: {
counter_delay: calculateDaysAgoOfComment(comment.created_at),
time_unit: 'participation.days' | translate
}
}}
{{ calculateDaysAgoOfComment(comment.created_at) }} ,
</span>
<span class="date is-small">
{{ comment.created_at | date: 'short':'Europe/Paris':'fr_FR' }}
</span>
</p>
@ -29,29 +37,31 @@
</article>
</section>
<section class="add-comment" *ngIf="!poll.is_archived && vote_stack.owner">
<h2 class="margin-top-x7">Laisser un commentaire</h2>
<article class="message">
<div class="message-header">
<div class="field">
<span class="control has-icons-left has-icons-right">
<input
type="email"
name="cremail"
id="email_comment"
[(ngModel)]="vote_stack.owner.email"
required="required"
/>
<span class="icon is-small is-left">
<i class="fa fa-envelope"></i>
</span>
</span>
<!-- <span class="control has-icons-left has-icons-right">-->
<!-- <input-->
<!-- type="email"-->
<!-- name="cremail"-->
<!-- id="email_comment"-->
<!-- [(ngModel)]="vote_stack.owner.email"-->
<!-- required="required"-->
<!-- />-->
<!-- <span class="icon is-small is-left">-->
<!-- <i class="fa fa-envelope"></i>-->
<!-- </span>-->
<!-- </span>-->
<label for="comment_pseudo">
{{ 'participation.name_label' | translate }}
</label>
<span class="control has-icons-left">
<input
type="text"
class="margin-btm-x3"
name="crname"
[(ngModel)]="vote_stack.pseudo"
id="crname"
id="comment_pseudo"
required="required"
/>
<span class="icon is-small is-left">
@ -65,14 +75,17 @@
<!-- <label for="cremail"><i class="fa fa-envelope" aria-hidden="true"></i> Votre email :</label>-->
</div>
<div class="message-body">
<label for="comment">Votre commentaire :</label>
<label for="comment">
{{ 'participation.content_label' | translate }}
</label>
<br />
<textarea name="comment" id="comment" [(ngModel)]="vote_stack.comment"> </textarea>
<input
type="submit"
name="add-comment"
class="btn btn--primary btn--outline"
class="button is-primary is-fullwidth"
value="Ajouter mon commentaire ✉️"
(click)="addComment()"
/>

17
src/assets/i18n/en.json
View File

@ -755,6 +755,7 @@
"your-vote-has-been-saved-but-please-note-you-need-to-keep-this-personalised-link-to-be-able-to-edit-": "Your vote has been saved, but please note: you need to keep this personalized link to be able to edit your vote."
},
"LANGUAGES": {
"AR": "Arabic",
"DE": "German",
"FR": "French",
"BR": "Breton",
@ -771,6 +772,22 @@
"OC": "Occitan",
"SV": "Swedish"
},
"LANGUAGES_SHORT": {
"AR": "Ar",
"DE": "De",
"FR": "Fr",
"BR": "Br",
"CA": "Ca",
"EL": "el",
"ES": "Es",
"EN": "En",
"GL": "gl",
"HU": "hu",
"IT": "It",
"NL": "Nl",
"OC": "oc",
"SV": "sv"
},
"calendar_widget": {
"startsWith": "Starts with",
"contains": "Contains",

2
src/assets/i18n/fr.json
View File

@ -760,6 +760,7 @@
"your-vote-has-been-saved-but-please-note-you-need-to-keep-this-personalised-link-to-be-able-to-edit-": "Votre vote a bien été pris en compte, mais faites attention : ce sondage n'autorise l'édition de votre vote qu'avec le lien personnalisé suivant ; conservez-le précieusement"
},
"LANGUAGES": {
"AR": "Arabe",
"DE": "Allemand",
"FR": "Français",
"BR": "Breton",
@ -777,6 +778,7 @@
"SV": "Suédois"
},
"LANGUAGES_SHORT": {
"AR": "Ar",
"DE": "De",
"FR": "Fr",
"BR": "Br",

9
src/styles/partials/_forms.scss
View File

@ -310,6 +310,15 @@ mat-checkbox {
.icon {
width: 1rem;
}
.columns {
margin-left: 0;
margin-right: 0;
margin-top: 0;
.column {
padding-left: 0;
}
}
}
// resume de la création de sondage