From 5edeb34ceb895dec03630cac1b4f5f761b0ba986 Mon Sep 17 00:00:00 2001 From: Tykayn Date: Wed, 9 Feb 2022 12:25:08 +0100 Subject: [PATCH] feature choice text --- src/app/core/models/choice.model.ts | 6 +- src/app/core/models/poll.model.ts | 3 +- src/app/core/services/poll.service.ts | 5 +- src/app/core/services/storage.service.ts | 28 +++++--- .../option-link/option-link.component.html | 65 +++++++++++++++++- .../option-link/option-link.component.scss | 10 +++ .../form/option-link/option-link.component.ts | 28 +++++++- .../step-three/step-three.component.html | 68 ++++++++++--------- .../poll-results-detailed.component.scss | 1 - .../ui/wip-todo/wip-todo.component.html | 17 +++++ .../ui/wip-todo/wip-todo.component.ts | 2 + src/assets/i18n/fr.json | 2 +- src/styles/dev-utilities/_helpers.scss | 3 + src/styles/partials/_forms.scss | 7 -- 14 files changed, 188 insertions(+), 57 deletions(-) diff --git a/src/app/core/models/choice.model.ts b/src/app/core/models/choice.model.ts index 1ed62ecc..6bc386ed 100644 --- a/src/app/core/models/choice.model.ts +++ b/src/app/core/models/choice.model.ts @@ -10,7 +10,11 @@ export class AnswerStats { count: number; people: Array; } - +export class ChoiceText { + public name: string; // text of the choice, displayed as an option + public url_href: string; // url used as clickable link on a picture + public url_display: string; // url to fetch a picture to display, this picture might be clickable with url_href filled +} export class Choice { public id: number; public name: string; diff --git a/src/app/core/models/poll.model.ts b/src/app/core/models/poll.model.ts index f030df45..d6afbd81 100644 --- a/src/app/core/models/poll.model.ts +++ b/src/app/core/models/poll.model.ts @@ -1,4 +1,4 @@ -import { Choice, ChoiceGroup } from './choice.model'; +import { Choice, ChoiceGroup, ChoiceText } from './choice.model'; import { Comment } from './comment.model'; import { Owner } from './owner.model'; import { DateChoice, TimeSlices } from './dateChoice.model'; @@ -13,6 +13,7 @@ export class Poll { public archiveNumberOfDays?: number; public areResultsPublic?: boolean = true; public choices: Choice[] = []; + public choicesText: ChoiceText[] = []; public choices_grouped: ChoiceGroup[] = []; public comments: Comment[] = []; public creation_date?: string = new Date().toISOString(); diff --git a/src/app/core/services/poll.service.ts b/src/app/core/services/poll.service.ts index 7451414d..03d9e979 100644 --- a/src/app/core/services/poll.service.ts +++ b/src/app/core/services/poll.service.ts @@ -126,7 +126,7 @@ export class PollService implements Resolve { choices: new FormArray([]), whoModifiesAnswers: ['self', [Validators.required]], whoCanChangeAnswers: ['self', [Validators.required]], - isAboutDate: [true, [Validators.required]], + isAboutDate: [false, [Validators.required]], expiresDaysDelay: [environment.expiresDaysDelay, []], expiracy_date: [this.DateUtilitiesService.addDaysToDate(environment.expiresDaysDelay, new Date()), []], isZeroKnoledge: [false, [Validators.required]], @@ -776,6 +776,9 @@ export class PollService implements Resolve { newpoll.dateChoices.push(converted_day); } console.log('newpoll.dateChoices', newpoll.dateChoices); + } else { + // text choices + newpoll.choicesText = Object.assign([], this.storageService.choicesText); } newpoll.choices = Object.assign([], this.storageService.choices); // newpoll.dateChoices = Object.assign([], this.storageService.dateChoices); diff --git a/src/app/core/services/storage.service.ts b/src/app/core/services/storage.service.ts index 6858e0ae..f183d64c 100644 --- a/src/app/core/services/storage.service.ts +++ b/src/app/core/services/storage.service.ts @@ -1,20 +1,11 @@ import { Injectable } from '@angular/core'; import { LocalStorage } from 'ngx-webstorage'; - -import { LanguageEnum } from '../enums/language.enum'; import { Theme } from '../enums/theme.enum'; import { Stack } from '../models/stack.model'; -import { Choice } from '../models/choice.model'; +import { Choice, ChoiceText } from '../models/choice.model'; import { Vote } from '../models/vote.model'; import { environment } from '../../../environments/environment'; -import { - basicSlicesOfDay, - DateChoice, - defaultTimeOfDay, - moreTimeOfDay, - otherDefaultDates, - TimeSlices, -} from '../../../../mocks/old-stuff/config/defaultConfigs'; +import { DateChoice, defaultTimeOfDay, TimeSlices } from '../../../../mocks/old-stuff/config/defaultConfigs'; import { Poll } from '../models/poll.model'; import { Owner } from '../models/owner.model'; import { DateUtilitiesService } from './date.utilities.service'; @@ -42,9 +33,24 @@ export class StorageService { @LocalStorage() public vote_stack: Stack = new Stack(); + /** + * choix de dates + */ @LocalStorage() public choices: Choice[] = []; + /** + * choix textes dans un sondage classique + */ + @LocalStorage() + public choicesText: ChoiceText[] = [ + { + name: '', + url_display: '', + url_href: '', + }, + ]; + constructor(public dateUtilities: DateUtilitiesService, private toastService: ToastService) { if (environment.autofill_participation) { this.userPolls.push(new Poll(new Owner(), 'Démo: Anniversaire de tonton Patrick', 'aujourdhui-ou-demain')); diff --git a/src/app/features/administration/form/option-link/option-link.component.html b/src/app/features/administration/form/option-link/option-link.component.html index 5e270125..ef622b1c 100644 --- a/src/app/features/administration/form/option-link/option-link.component.html +++ b/src/app/features/administration/form/option-link/option-link.component.html @@ -1 +1,64 @@ -

option-link works!

+
+

+ {{ 'choices.title' | translate }} +

+ +
+ + +
+ image +
+
+ {{ choice.url_href }} +
+ + +
+
+ + + + + +

+ {{ 'choices.modal.title' | translate }} +

+

+ {{ 'choices.modal.description' | translate }} +

+ + + + +
+ + +
+ + + diff --git a/src/app/features/administration/form/option-link/option-link.component.scss b/src/app/features/administration/form/option-link/option-link.component.scss index e69de29b..89ff22ea 100644 --- a/src/app/features/administration/form/option-link/option-link.component.scss +++ b/src/app/features/administration/form/option-link/option-link.component.scss @@ -0,0 +1,10 @@ +.options { + button { + border: 0; + background: transparent; + padding-left: 0.75rem; + img { + margin-right: 1em; + } + } +} diff --git a/src/app/features/administration/form/option-link/option-link.component.ts b/src/app/features/administration/form/option-link/option-link.component.ts index 3c4ee37a..63b7d737 100644 --- a/src/app/features/administration/form/option-link/option-link.component.ts +++ b/src/app/features/administration/form/option-link/option-link.component.ts @@ -1,4 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import { StorageService } from '../../../../core/services/storage.service'; +import { ChoiceText } from '../../../../core/models/choice.model'; @Component({ selector: 'app-option-link', @@ -6,7 +8,31 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./option-link.component.scss'], }) export class OptionLinkComponent implements OnInit { - constructor() {} + public url_href: string; + public url_display: string; + public choice_for_modal: ChoiceText; // choice to be modified after validation of modal + public display_option_dialog: boolean = false; + + constructor(public StorageService: StorageService) {} ngOnInit(): void {} + + openLinkModal(choice: ChoiceText) { + this.choice_for_modal = choice; + this.display_option_dialog = true; + } + + addLink() { + this.StorageService.choicesText.push(new ChoiceText()); + } + + validateModal() { + this.choice_for_modal.url_href = '' + this.url_href; + this.choice_for_modal.url_display = '' + this.url_display; + this.display_option_dialog = false; + } + + closeModal() { + this.display_option_dialog = false; + } } diff --git a/src/app/features/administration/form/steps/step-three/step-three.component.html b/src/app/features/administration/form/steps/step-three/step-three.component.html index e6867403..711f6ed4 100644 --- a/src/app/features/administration/form/steps/step-three/step-three.component.html +++ b/src/app/features/administration/form/steps/step-three/step-three.component.html @@ -1,40 +1,44 @@
-

- {{ 'dates.title' | translate }} -

- - - - - -
- +
+
+
+

+ {{ 'dates.title' | translate }} +

+ + -
- + +
+ +
+ +
+ +
+

+ Support: + + mail + + + Autres canaux + + + Sources + | + + + 🚴 Documentation + +

diff --git a/src/app/shared/components/ui/wip-todo/wip-todo.component.ts b/src/app/shared/components/ui/wip-todo/wip-todo.component.ts index 9e861c15..141cc2fd 100644 --- a/src/app/shared/components/ui/wip-todo/wip-todo.component.ts +++ b/src/app/shared/components/ui/wip-todo/wip-todo.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { environment } from '../../../../../environments/environment'; @Component({ selector: 'app-wip-todo', @@ -6,6 +7,7 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./wip-todo.component.scss'], }) export class WipTodoComponent implements OnInit { + env: any = environment; constructor() {} ngOnInit(): void {} diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json index b8807752..1c5829a0 100755 --- a/src/assets/i18n/fr.json +++ b/src/assets/i18n/fr.json @@ -123,7 +123,7 @@ "answer_preset_1": "réponse de démo 1", "answer_preset_2": "réponse 2", "answer_preset_3": "la réponse D", - "add": "Ajouter option", + "add": "Ajouter proposition", "continue": "Voyons ce que ça donne", "modal": { "title": "Ajoutez un lien à l’option", diff --git a/src/styles/dev-utilities/_helpers.scss b/src/styles/dev-utilities/_helpers.scss index cc2c77f0..56fd4ae8 100644 --- a/src/styles/dev-utilities/_helpers.scss +++ b/src/styles/dev-utilities/_helpers.scss @@ -36,6 +36,9 @@ .marged { margin: 1em; } +.marged-right { + margin-right: 1em; +} .marged-v { margin-top: 1em; margin-bottom: 1em; diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss index ba4ff5f9..d8fa6491 100644 --- a/src/styles/partials/_forms.scss +++ b/src/styles/partials/_forms.scss @@ -30,7 +30,6 @@ select, textarea { display: inline-block; padding: 1rem; - width: calc(100% - 45px); margin-right: 2px; margin-bottom: 1em; @@ -55,7 +54,6 @@ select, line-height: 1.25rem; border: solid 1px $font-color !important; border-radius: 4px; - max-width: 90vw !important; @extend .clickable; &:focus { @extend .outlined; @@ -101,7 +99,6 @@ textarea { width: 100%; display: inline-block; text-align: left; - max-width: 90vw; } } input[type='radio'] { @@ -145,14 +142,12 @@ option { background-position: right 1rem center; background-clip: border-box; min-width: 10rem; - max-width: 90vw; margin-bottom: 0.25rem; border-bottom: 2px solid $primary_color !important; } select { @extend .select, .input; - max-width: 90vw; } #multi_hours select { @@ -162,13 +157,11 @@ select { input { border-color: #4e4c59 !important; @extend .text-ellipsis; - max-width: 90vw; display: block; } textarea { width: 100%; - max-width: 90vw; min-height: 213px; padding: 0.5em 1em; margin-bottom: 1em;