mirror of
https://framagit.org/framasoft/framadate/funky-framadate-front.git
synced 2023-08-25 13:53:14 +02:00
Merge branch 'visibility-page' into 'dev'
Visibility page See merge request framasoft/framadate/funky-framadate-front!16
This commit is contained in:
ty kayn
commit
157a8d63c5
@ -7,6 +7,8 @@
|
||||
|
||||
</a>
|
||||
<div id="translate_example">
|
||||
<img src="assets/img/icone-langue.svg" alt="location icon">
|
||||
<img src="assets/img/icone-menu.svg" alt="menu icon">
|
||||
<div class="lang-choices">
|
||||
<button class="btn btn-info" (click)="switchLanguage('en')">en</button>
|
||||
<button class="btn btn-info" (click)="switchLanguage('fr')">fr</button>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {LOCALE_ID, NgModule} from '@angular/core';
|
||||
import {NgModule} from '@angular/core';
|
||||
|
||||
import {AppRoutingModule} from './app-routing.module';
|
||||
import {AppComponent} from './app.component';
|
||||
@ -19,7 +19,6 @@ import {PicturesComponent} from './pages/pictures/pictures.component';
|
||||
import {AnswersComponent} from './pages/answers/answers.component';
|
||||
import {EndConfirmationComponent} from './pages/end-confirmation/end-confirmation.component';
|
||||
import {CreateOrRetrieveComponent} from './pages/create-or-retrieve/create-or-retrieve.component';
|
||||
import {CalendarComponent} from './calendar/calendar.component';
|
||||
import localeFr from '@angular/common/locales/fr';
|
||||
import localeEn from '@angular/common/locales/en';
|
||||
import {VotingSummaryComponent} from './pages/voting-summary/voting-summary.component';
|
||||
@ -29,7 +28,7 @@ import {PasswordComponent} from './pages/password/password.component';
|
||||
import {HomeComponent} from './pages/home/home.component';
|
||||
import {VoteChoiceComponent} from './vote-choice/vote-choice.component';
|
||||
import {HttpClient, HttpClientModule} from '@angular/common/http';
|
||||
import { MarkdownModule } from 'ngx-markdown';
|
||||
import {MarkdownModule} from 'ngx-markdown';
|
||||
import {
|
||||
MissingTranslationHandler,
|
||||
MissingTranslationHandlerParams,
|
||||
@ -38,9 +37,10 @@ import {
|
||||
TranslateService
|
||||
} from '@ngx-translate/core';
|
||||
import {TranslateHttpLoader} from '@ngx-translate/http-loader';
|
||||
import { PollGraphicComponent } from './poll-graphic/poll-graphic.component';
|
||||
import {PollGraphicComponent} from './poll-graphic/poll-graphic.component';
|
||||
|
||||
import { AdminComponent } from './pages/admin/admin.component';
|
||||
import {AdminComponent} from './pages/admin/admin.component';
|
||||
import {SelectorComponent} from './ui/selector/selector.component';
|
||||
|
||||
export class MyMissingTranslationHandler implements MissingTranslationHandler {
|
||||
handle(params: MissingTranslationHandlerParams) {
|
||||
@ -70,7 +70,6 @@ export function HttpLoaderFactory(http: HttpClient) {
|
||||
AnswersComponent,
|
||||
EndConfirmationComponent,
|
||||
CreateOrRetrieveComponent,
|
||||
CalendarComponent,
|
||||
VotingSummaryComponent,
|
||||
VotingGraphComponent,
|
||||
VotingChoiceComponent,
|
||||
@ -79,6 +78,7 @@ export function HttpLoaderFactory(http: HttpClient) {
|
||||
PollGraphicComponent,
|
||||
VoteChoiceComponent,
|
||||
AdminComponent,
|
||||
SelectorComponent,
|
||||
|
||||
],
|
||||
imports: [
|
||||
|
||||
@ -1 +0,0 @@
|
||||
<p>calendar works!</p>
|
||||
@ -1 +0,0 @@
|
||||
|
||||
@ -1,15 +0,0 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'framadate-calendar',
|
||||
templateUrl: './calendar.component.html',
|
||||
styleUrls: ['./calendar.component.scss']
|
||||
})
|
||||
export class CalendarComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
@ -27,31 +27,10 @@ export const defaultDates = [
|
||||
timeList: [{literal: 'matin'}, {literal: 'midi'}, {literal: 'soir'}]
|
||||
}
|
||||
];
|
||||
|
||||
/**
|
||||
* configuration of the poll, add new fields at will
|
||||
*/
|
||||
export class PollConfig {
|
||||
step = 0;
|
||||
stepMax = 3;
|
||||
pollType = 'classic';
|
||||
title = '';
|
||||
description = '';
|
||||
myName = '';
|
||||
|
||||
// date specific poll
|
||||
allowSeveralHours = 'false';
|
||||
// access
|
||||
visibility = 'link_only'; // visible to anyone with the link:
|
||||
password = '';
|
||||
whoCanChangeAnswers = 'everybody';// everybody, self, nobody (= just admin)
|
||||
dateList: DateOption[] = defaultDates; // sets of days as strings, config to set identical time for days in a special days poll
|
||||
timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings
|
||||
answers: any = [{
|
||||
export const defaultAnswers = [{
|
||||
id: 0,
|
||||
text: 'réponse de démo 1'
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
text: 'réponse 2'
|
||||
@ -61,5 +40,34 @@ export class PollConfig {
|
||||
text: 'la réponse D'
|
||||
}];
|
||||
|
||||
/**
|
||||
* configuration of the poll, add new fields at will
|
||||
*/
|
||||
export class PollConfig {
|
||||
expiracyDateDefaultInDays = 60;
|
||||
step = 0;
|
||||
stepMax = 3;
|
||||
pollType = 'classic';// classic or date
|
||||
title = 'titre';
|
||||
description = 'ma description';
|
||||
myName = 'mon pseudo';
|
||||
|
||||
// date specific poll, we have the choice to setup different hours (timeList) for all possible dates (dateList), or use the same hours for all dates
|
||||
allowSeveralHours = 'false';
|
||||
// access
|
||||
visibility = 'link_only'; // visible to anyone with the link:
|
||||
voteChoices = 'only_yes'; // possible answers to a vote choice: only "yes", "yes, maybe, no"
|
||||
expirationDate = ''; // expiracy date
|
||||
passwordAccess = 0;
|
||||
password = '';
|
||||
customUrl = '';
|
||||
canModifyAnswers = 1;// everybody, self, nobody (= just admin)
|
||||
whoModifiesAnswers = "self";// everybody, self, nobody (= just admin)
|
||||
whoCanChangeAnswers = 'everybody';// everybody, self, nobody (= just admin)
|
||||
dateList: DateOption[] = defaultDates; // sets of days as strings, config to set identical time for days in a special days poll
|
||||
timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings
|
||||
|
||||
answers: any = defaultAnswers;
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -1,75 +1,100 @@
|
||||
<form>
|
||||
<h1>Nom du sondage</h1>
|
||||
<!--Infos-->
|
||||
<h2>Informations du sondage</h2>
|
||||
<label for="title">Le titre du sondage est</label>
|
||||
<input type="text" name="title">
|
||||
<label for="desc">et sa description :</label>
|
||||
<textarea name="desc"> </textarea>
|
||||
<label for="name">Je peux aussi préciser mon nom si je le souhaite :</label>
|
||||
<input type="text" name="name">
|
||||
<!--Params-->
|
||||
<h2>Paramètres</h2>
|
||||
<h3>Visibilité des réponses</h3>
|
||||
<section class="row">
|
||||
<label for="answer-visible">Je veux que</label>
|
||||
<select name="answer-visible">
|
||||
<option value="all" selected>tout le monde</option>
|
||||
<option value="per">seulement moi</option>
|
||||
</select>
|
||||
<label for="answer-visible">puisse voir les réponses au sondage</label>
|
||||
</section>
|
||||
<h3>Votes</h3>
|
||||
<section class="row">
|
||||
<label for="vote-date">Les personnes sondées pourront voter jusqu'au</label>
|
||||
<input type="date" name="vote-date">
|
||||
</section>
|
||||
<section class="row">
|
||||
<label for="alter-vote">Elles</label>
|
||||
<select name="alter-vote">
|
||||
<option value="yes" selected>auront</option>
|
||||
<option value="no">n'auront pas</option>
|
||||
</select>
|
||||
<label for="type-vote">la possibilité de modifier</label>
|
||||
<select name="type-vote">
|
||||
<option value="solo" selected>leur vote</option>
|
||||
<option value="all">tout les votes</option>
|
||||
</select>
|
||||
</section>
|
||||
<h1>Nom du sondage</h1>
|
||||
<!--Infos-->
|
||||
<h2>Informations du sondage</h2>
|
||||
<label for="title">Le titre du sondage est</label>
|
||||
<input type="text" name="title">
|
||||
<label for="desc">et sa description :</label>
|
||||
<textarea name="desc"> </textarea>
|
||||
<label for="name">Je peux aussi préciser mon nom si je le souhaite :</label>
|
||||
<input type="text" name="name">
|
||||
<!--Params-->
|
||||
<h2>Paramètres</h2>
|
||||
<h3>Visibilité des réponses</h3>
|
||||
<section class="row">
|
||||
<label for="answer-visible">Je veux que</label>
|
||||
<select name="answer-visible">
|
||||
<option value="all" selected>tout le monde</option>
|
||||
<option value="per">seulement moi</option>
|
||||
</select>
|
||||
<label for="answer-visible">puisse voir les réponses au sondage</label>
|
||||
</section>
|
||||
<h3>Votes</h3>
|
||||
<section>
|
||||
<label for="vote-date">Les personnes sondées pourront voter jusqu'au</label>
|
||||
<input type="date" name="vote-date">
|
||||
</section>
|
||||
<section>
|
||||
<label for="alter-vote">Elles</label>
|
||||
<select name="alter-vote">
|
||||
<option value="yes" selected>auront</option>
|
||||
<option value="no">n'auront pas</option>
|
||||
</select>
|
||||
<label for="type-vote">la possibilité de modifier</label>
|
||||
<select name="type-vote">
|
||||
<option value="solo" selected>leur vote</option>
|
||||
<option value="all">tout les votes</option>
|
||||
</select>
|
||||
</section>
|
||||
|
||||
<label for="del-vote">Pour repartir à zéro, je peux tous les supprimer :</label>
|
||||
<input class="btn btn--alert btn--outline" type="submit" name="del-vote" value="Supprimer tous les votes">
|
||||
<h3>Commentaires</h3>
|
||||
<label for="del-com">Si je le souhaite,je peux supprimer l'ensemble des commentaires</label>
|
||||
<input class="btn btn--alert btn--outline" type="submit" name="del-com" value="Supprimer tous les commentaires">
|
||||
<h3>Archivage</h3>
|
||||
<section class="row">
|
||||
<label for="arch">Ce sondage ne sera plus éditable à partir du</label>
|
||||
<input type="date" name="arch">
|
||||
</section>
|
||||
<h3>Accés au sondage</h3>
|
||||
<section class="row">
|
||||
<label for="password">Je</label>
|
||||
<select name="password">
|
||||
<option value="yes" selected>n'ai pas besoin</option>
|
||||
<option value="no">voudrais</option>
|
||||
</select>
|
||||
<label for="alter-vote">qu'il soit protégé par un mot de passe</label>
|
||||
</section>
|
||||
<h3>Tout supprimer</h3>
|
||||
<label for="del">Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :</label>
|
||||
<input class="btn btn--alert" type="submit" name="del" value="Supprimer le sondage">
|
||||
<h2>Liens d'accès au sondage</h2>
|
||||
<h3>Coté administrateur·ice</h3>
|
||||
<label for="copy-link-admin">Pour accéder au sondage et à tous ses paramètres :
|
||||
https://framadate.org/urladmindusondage</label>
|
||||
<input class="btn btn--mini" type="submit" name="copy-link-admin" value="Copier le lien">
|
||||
<a href="#" class="next">Voir le sondage coté administrateur·ice</a>
|
||||
<h3>Côté sondé·es</h3>
|
||||
<label for="copy-link">Pour accéder au sondage et à tous ses paramètres :
|
||||
https://framadate.org/urladmindusondage</label>
|
||||
<input class="btn btn--mini" type="submit" name="copy-link" value="Copier le lien">
|
||||
<a href="#" class="next">Voir le sondage</a>
|
||||
<h3>Recevoir les liens par mail</h3>
|
||||
<label for="mail">Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail :</label>
|
||||
<input type="email" name="mail">
|
||||
<input class="btn btn--mini" type="submit" name="send-mail" value="Envoyer les liens du sondage">
|
||||
|
||||
<section class="deletion">
|
||||
{{"admin.deletion"|translate}}
|
||||
{{"admin.deletion_desc"|translate}}
|
||||
{{"admin.deletion_btn"|translate}}
|
||||
|
||||
</section>
|
||||
<section class="links">
|
||||
{{"admin.link"|translate}}
|
||||
{{"admin.link_admin"|translate}}
|
||||
{{"admin.link_admin_desc"|translate}}
|
||||
{{"admin.link_admin_btn"|translate}}
|
||||
{{"admin.copy_link"|translate}}
|
||||
|
||||
{{"admin.polled_people"|translate}}
|
||||
{{"admin.polled_people_desc"|translate}}
|
||||
{{"admin.polled_people_btn"|translate}}
|
||||
{{"admin.email_links"|translate}}
|
||||
{{"admin.email_links_desc"|translate}}
|
||||
{{"admin.email_links_key"|translate}}
|
||||
{{"admin.email_links_btn"|translate}}
|
||||
</section>
|
||||
|
||||
<label for="del-vote">Pour repartir à zéro, je peux tous les supprimer :</label>
|
||||
<input class="btn btn--alert btn--outline" type="submit" name="del-vote" value="Supprimer tous les votes">
|
||||
<h3>Commentaires</h3>
|
||||
<label for="del-com">Si je le souhaite,je peux supprimer l'ensemble des commentaires</label>
|
||||
<input class="btn btn--alert btn--outline" type="submit" name="del-com" value="Supprimer tous les commentaires">
|
||||
<h3>Archivage</h3>
|
||||
<section class="row">
|
||||
<label for="arch">Ce sondage ne sera plus éditable à partir du</label>
|
||||
<input type="date" name="arch">
|
||||
</section>
|
||||
<h3>Accés au sondage</h3>
|
||||
<section class="row">
|
||||
<label for="password">Je</label>
|
||||
<select name="password">
|
||||
<option value="yes" selected>n'ai pas besoin</option>
|
||||
<option value="no">voudrais</option>
|
||||
</select>
|
||||
<label for="alter-vote">qu'il soit protégé par un mot de passe</label>
|
||||
</section>
|
||||
<h3>Tout supprimer</h3>
|
||||
<label for="del">Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :</label>
|
||||
<input class="btn btn--alert" type="submit" name="del" value="Supprimer le sondage">
|
||||
<h2>Liens d'accès au sondage</h2>
|
||||
<h3>Coté administrateur·ice</h3>
|
||||
<label for="copy-link-admin">Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage</label>
|
||||
<input class="btn btn--mini" type="submit" name="copy-link-admin" value="Copier le lien">
|
||||
<a href="#" class="next">Voir le sondage coté administrateur·ice</a>
|
||||
<h3>Côté sondé·es</h3>
|
||||
<label for="copy-link">Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage</label>
|
||||
<input class="btn btn--mini" type="submit" name="copy-link" value="Copier le lien">
|
||||
<a href="#" class="next">Voir le sondage</a>
|
||||
<h3>Recevoir les liens par mail</h3>
|
||||
<label for="mail">Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail :</label>
|
||||
<input type="email" name="mail">
|
||||
<input class="btn btn--mini" type="submit" name="send-mail" value="Envoyer les liens du sondage">
|
||||
</form>
|
||||
|
||||
@ -14,9 +14,11 @@
|
||||
type="text"
|
||||
class="answer"
|
||||
[(ngModel)]="answer.text"
|
||||
(keyup.enter)="addAnswer()"
|
||||
(keyup)="navigateOrDelete($event,i)"
|
||||
placeholder="réponse"
|
||||
>
|
||||
<button (click)="config.answers.splice(i,1)">X</button>
|
||||
<button class="btn btn--alert" (click)="config.answers.splice(i,1)">X</button>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
|
||||
import {AfterViewInit, ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
|
||||
import {BaseComponent} from '../base-page/base.component';
|
||||
import {ConfigService} from '../../config.service';
|
||||
|
||||
@ -9,7 +9,7 @@ import {DOCUMENT} from '@angular/common';
|
||||
templateUrl: './answers.component.html',
|
||||
styleUrls: ['./answers.component.scss']
|
||||
})
|
||||
export class AnswersComponent extends BaseComponent implements OnInit {
|
||||
export class AnswersComponent extends BaseComponent implements OnInit, AfterViewInit {
|
||||
|
||||
private answerList = [];
|
||||
|
||||
@ -24,6 +24,10 @@ export class AnswersComponent extends BaseComponent implements OnInit {
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.focusOnAnswer(0)
|
||||
}
|
||||
|
||||
trackFunction(index: number, item: any): number {
|
||||
return item.id;
|
||||
}
|
||||
@ -35,19 +39,30 @@ export class AnswersComponent extends BaseComponent implements OnInit {
|
||||
text: ''
|
||||
});
|
||||
this.cd.detectChanges(); // to refresh the view before focusing on the new input
|
||||
this.focusOnAnswer(this.config.answers.length - 1)
|
||||
}
|
||||
|
||||
focusOnAnswer(i) {
|
||||
const AnswersDomToFocus = this.document.querySelectorAll('.answers .answer');
|
||||
const dom = AnswersDomToFocus[AnswersDomToFocus.length - 1];
|
||||
const dom = AnswersDomToFocus[i];
|
||||
if (dom.focus) {
|
||||
dom.focus();
|
||||
}
|
||||
if (dom.select) {
|
||||
dom.select();
|
||||
}
|
||||
}
|
||||
|
||||
// add a new answer on the press of ENTER in an input
|
||||
addWhenEnterKey(event) {
|
||||
navigateOrDelete(event: KeyboardEvent, i) {
|
||||
console.log('event', event);
|
||||
if (event.keyCode === 13) {
|
||||
this.addAnswer();
|
||||
if (event.ctrlKey && event.key == "d") {
|
||||
this.config.answers.splice(i, 1)
|
||||
}
|
||||
if (event.key == "ArrowUp" && i > 0) {
|
||||
this.focusOnAnswer(i - 1);
|
||||
}
|
||||
if (event.key == "ArrowDown" && i < this.config.answers.length) {
|
||||
this.focusOnAnswer(i + 1);
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,9 +5,10 @@ section {
|
||||
border-bottom: 6px solid #000;
|
||||
}
|
||||
|
||||
& + & {
|
||||
margin-top: 3rem;
|
||||
+ section {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
article {
|
||||
|
||||
@ -1,10 +1,31 @@
|
||||
<h1 i18n>
|
||||
Résumé avant validation
|
||||
<h1>
|
||||
Récapitulatif
|
||||
</h1>
|
||||
<h2 class="hero-title">
|
||||
{{config.title}}
|
||||
</h2>
|
||||
<div class="creation">
|
||||
créé par
|
||||
{{config.myName}}
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
{{config.description}}
|
||||
</p>
|
||||
</div>
|
||||
<section>
|
||||
<div markdown *ngFor="let questions of config.answers">
|
||||
{{questions.id+1}}. {{questions.text}}
|
||||
</div>
|
||||
<ul>
|
||||
<li markdown *ngFor="let questions of config.answers">
|
||||
{{questions.id + 1}}. {{questions.text}}
|
||||
</li>
|
||||
</ul>
|
||||
<button [routerLink]="'/step/answers'" class="btn btn-info">Retour</button>
|
||||
</section>
|
||||
<button [routerLink]="'/step/end'" class="btn btn--primary" i18n="@@confirm">C'est parfait!</button>
|
||||
|
||||
<div class="back">
|
||||
<a [routerLink]="'/step/visibility'"
|
||||
class="btn btn--back">
|
||||
Retour
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -1,14 +1,158 @@
|
||||
<h1 i18n>
|
||||
{{"visibility.top_txt"|translate}}
|
||||
</h1>
|
||||
<section class="answers">
|
||||
<h2>
|
||||
{{"visibility.title"|translate}}
|
||||
</h1>
|
||||
<h1 i18n>
|
||||
{{"visibility.votes"|translate}}
|
||||
</h1>
|
||||
<h1 i18n>
|
||||
{{"visibility.archiving"|translate}}
|
||||
</h1>
|
||||
</h2>
|
||||
<span>
|
||||
{{"visibility.visibility_want"|translate}}
|
||||
</span>
|
||||
<select
|
||||
name="visible_people"
|
||||
id="visible_people"
|
||||
[(ngModel)]="config.visibility"
|
||||
>
|
||||
<option value="link_only">
|
||||
{{"visibility.visibility_link"|translate}}
|
||||
</option>
|
||||
<option value="only_me">
|
||||
{{"visibility.visibility_nobody"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
<span>
|
||||
{{"visibility.visibility_see"|translate}}
|
||||
</span>
|
||||
|
||||
<h1 i18n>
|
||||
</section>
|
||||
|
||||
<section class="possible_votes">
|
||||
<h2>
|
||||
{{"visibility.votes"|translate}}
|
||||
</h2>
|
||||
<label for="votes">
|
||||
{{"visibility.votes_possible"|translate}}
|
||||
</label>
|
||||
<select
|
||||
name="votes"
|
||||
id="votes"
|
||||
[(ngModel)]="config.voteChoices"
|
||||
>
|
||||
<option value="only_yes">
|
||||
{{"visibility.votes_possible_single"|translate}}
|
||||
</option>
|
||||
<option value="normal">
|
||||
{{"visibility.votes_possible_normal"|translate}}
|
||||
</option>
|
||||
<option value="full">
|
||||
{{"visibility.votes_possible_full"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
</section>
|
||||
<section class="expiracy">
|
||||
<label for="expirationDate">
|
||||
{{"visibility.archiving"|translate}}
|
||||
</label>
|
||||
|
||||
<input type="date"
|
||||
id="expirationDate"
|
||||
[(ngModel)]="config.expirationDate">
|
||||
<div class="modification">
|
||||
<label for="modificationAbility">
|
||||
{{"visibility.archiving_start"|translate}}
|
||||
</label>
|
||||
<select
|
||||
name="modificationAbility"
|
||||
id="modificationAbility"
|
||||
[(ngModel)]="config.canModifyAnswers">
|
||||
<option value="1">
|
||||
{{"visibility.archiving_can"|translate}}
|
||||
</option>
|
||||
<option value="0">
|
||||
{{"visibility.archiving_can_not"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
<label for="modificationScope">
|
||||
{{"visibility.archiving_end"|translate}}
|
||||
</label>
|
||||
|
||||
<select
|
||||
name="modificationScope"
|
||||
id="modificationScope"
|
||||
[(ngModel)]="config.whoModifiesAnswers"
|
||||
[disabled]="!config.canModifyAnswers">
|
||||
<option value="self">
|
||||
{{"visibility.modfiy_their"|translate}}
|
||||
</option>
|
||||
<option value="everybody">
|
||||
{{"visibility.modfiy_everyone"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
<section class="access">
|
||||
<h2>
|
||||
{{"visibility.access"|translate}}
|
||||
</h1>
|
||||
<a [routerLink]="'/step/end'" class="btn btn--primary" i18n="@@confirm">C'est parfait!</a>
|
||||
</h2>
|
||||
<label for="url">
|
||||
{{"visibility.access_url"|translate}}
|
||||
<br>
|
||||
{{"visibility.access_url_key"|translate}}
|
||||
</label>
|
||||
<br>
|
||||
<input type="text"
|
||||
class="input-lg"
|
||||
name="url"
|
||||
id="url"
|
||||
[(ngModel)]="config.customUrl">
|
||||
|
||||
<sub class="instructions">
|
||||
{{"visibility.access_instructions"|translate}}
|
||||
</sub>
|
||||
<br>
|
||||
<label for="passwordAccess">
|
||||
{{"visibility.access_want"|translate}}
|
||||
</label>
|
||||
<select name="passwordAccess" id="passwordAccess" [(ngModel)]="config.passwordAccess">
|
||||
<option value="0"> {{"visibility.access_want_no"|translate}}</option>
|
||||
<option value="1"> {{"visibility.access_want_yes"|translate}}</option>
|
||||
</select>
|
||||
|
||||
<label for="password">
|
||||
{{"visibility.access_protect"|translate}}
|
||||
</label>
|
||||
|
||||
<div class="enablepassword" *ngIf="config.passwordAccess">
|
||||
|
||||
<input type="password"
|
||||
name="password"
|
||||
id="password"
|
||||
min="8"
|
||||
*ngIf="!showCustomPassword"
|
||||
[(ngModel)]="config.password">
|
||||
<input type="text"
|
||||
name="password_visible"
|
||||
id="password_visible"
|
||||
min="8"
|
||||
*ngIf="showCustomPassword"
|
||||
[(ngModel)]="config.password">
|
||||
<button class="btn btn--default" (click)="showCustomPassword = !showCustomPassword">
|
||||
{{"visibility.see_pass"|translate}}
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<a [routerLink]="'/step/end'"
|
||||
class="btn btn-link btn--primary">
|
||||
{{"visibility.validate_btn"|translate}}
|
||||
</a>
|
||||
<div class="back">
|
||||
|
||||
<a [routerLink]="'/step/answers'"
|
||||
class="btn btn--back">
|
||||
Retour
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -8,12 +8,36 @@ import {ConfigService} from '../../config.service';
|
||||
styleUrls: ['./visibility.component.scss']
|
||||
})
|
||||
export class VisibilityComponent extends BaseComponent implements OnInit {
|
||||
showCustomPassword = false;
|
||||
|
||||
constructor(public config: ConfigService) {
|
||||
super(config);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.config.customUrl = this.makeUuid();
|
||||
this.config.expirationDate = (this.addDaysToDate(this.config.expiracyDateDefaultInDays, new Date())).toISOString().substring(0, 10);
|
||||
}
|
||||
|
||||
/**
|
||||
* generate unique id to have a default url for future poll
|
||||
*/
|
||||
makeUuid() {
|
||||
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
|
||||
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||||
return v.toString(16);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* add some days to a date, to compute intervals
|
||||
* @param days
|
||||
* @param date
|
||||
*/
|
||||
addDaysToDate(days: number, date: Date) {
|
||||
date = new Date(date.valueOf());
|
||||
date.setDate(date.getDate() + days);
|
||||
return date;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
@ -26,6 +26,9 @@
|
||||
<a [routerLink]="'/graphic/toto'" i18n>
|
||||
Graphique
|
||||
</a>
|
||||
<a [routerLink]="'/step/admin'" i18n>
|
||||
Administration
|
||||
</a>
|
||||
<a [routerLink]="'/home'" i18n>
|
||||
Accueil
|
||||
</a>
|
||||
|
||||
9
src/app/ui/selector/selector.component.html
Normal file
9
src/app/ui/selector/selector.component.html
Normal file
@ -0,0 +1,9 @@
|
||||
<select
|
||||
class="custom-selector"
|
||||
name="{{selectorConfig.name}}"
|
||||
id="{{selectorConfig.id}}"
|
||||
[(ngModel)]="selectorConfig.selectorNgModel">
|
||||
<option value="{{item.value}}" selected *ngFor="let item of selectorConfig.listItems">
|
||||
{{item.label}}
|
||||
</option>
|
||||
</select>
|
||||
@ -1,20 +1,20 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CalendarComponent } from './calendar.component';
|
||||
import { SelectorComponent } from './selector.component';
|
||||
|
||||
describe('CalendarComponent', () => {
|
||||
let component: CalendarComponent;
|
||||
let fixture: ComponentFixture<CalendarComponent>;
|
||||
describe('SelectorComponent', () => {
|
||||
let component: SelectorComponent;
|
||||
let fixture: ComponentFixture<SelectorComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ CalendarComponent ]
|
||||
declarations: [ SelectorComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(CalendarComponent);
|
||||
fixture = TestBed.createComponent(SelectorComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
30
src/app/ui/selector/selector.component.ts
Normal file
30
src/app/ui/selector/selector.component.ts
Normal file
@ -0,0 +1,30 @@
|
||||
import {Component, Input, OnInit} from '@angular/core';
|
||||
|
||||
interface Item {
|
||||
label: string,
|
||||
value: string
|
||||
}
|
||||
|
||||
interface SelectorConfig {
|
||||
label: string,
|
||||
name: string,
|
||||
id: string,
|
||||
selectorNgModel: any,
|
||||
listItems: Item[]
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'framadate-selector',
|
||||
templateUrl: './selector.component.html',
|
||||
styleUrls: ['./selector.component.scss']
|
||||
})
|
||||
export class SelectorComponent implements OnInit {
|
||||
@Input() selectorConfig: SelectorConfig;
|
||||
|
||||
constructor() {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
@ -63,14 +63,55 @@
|
||||
"links_mail": "Receive links by email"
|
||||
},
|
||||
"visibility": {
|
||||
"top_txt": "A few settings...",
|
||||
"title": "Visibility of answers",
|
||||
"visibility_want": "Je veux que",
|
||||
"visibility_link": "Ceux avec le lien",
|
||||
"visibility_nobody": "personne ne",
|
||||
"visibility_see": "puisse voir les réponses au sondage.",
|
||||
"votes": "Votes",
|
||||
"archiving": "Archiving",
|
||||
"access": "Access to the pool"
|
||||
"votes_possible": "Les réponses possibles seront :",
|
||||
"votes_possible_single": "Uniquement « oui »",
|
||||
"votes_possible_normal": "« oui » ou « peut-être »",
|
||||
"votes_possible_full": "« oui » ou « peut-être » ou « non »",
|
||||
"archiving": "Les personnes sondées pourront voter jusqu’au ",
|
||||
"archiving_start": "Elles",
|
||||
"archiving_can": "auront",
|
||||
"archiving_can_not": "n'auront pas",
|
||||
"archiving_end": "la possibilité de modifier",
|
||||
"modfiy_their": "leur vote",
|
||||
"modfiy_everyone": "tous les votes",
|
||||
"access": "Accès au sondage",
|
||||
"access_url": "Les votants pourront y accéder via cette adresse :",
|
||||
"access_url_key": "URL",
|
||||
"see_pass": "voir",
|
||||
"access_instructions": "peut contenir des lettres, chiffres et des tirets",
|
||||
"access_want": "Je",
|
||||
"access_want_yes": "souhaite",
|
||||
"access_want_no": "n'ai pas besoin",
|
||||
"access_protect": "qu’il soit protégé par un mot de passe.",
|
||||
"validate_btn": "Créer ce sondage !"
|
||||
},
|
||||
"pollGraphic":{
|
||||
"choiceColorblind":"I am",
|
||||
"choiceNotColorblind":"I am not",
|
||||
"colorblindText":"colorblind."
|
||||
"admin": {
|
||||
"deletion": "Tout supprimer",
|
||||
"deletion_desc": "Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :",
|
||||
"deletion_btn": "Supprimer le sondage",
|
||||
"link": "Liens d’accès au sondage",
|
||||
"link_admin": "Coté administrateur·ice",
|
||||
"link_admin_desc": "Pour accéder au sondage et à tous ses paramètres :",
|
||||
"link_admin_btn": "Voir le sondage coté administrateur·ice",
|
||||
"copy_link": "Copier le lien",
|
||||
"polled_people": "Côté sondé·es",
|
||||
"polled_people_desc": "Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage",
|
||||
"polled_people_btn": "Voir le sondage",
|
||||
"email_links": "Recevoir les liens par mail",
|
||||
"email_links_desc": "Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail",
|
||||
"email_links_key": "mail",
|
||||
"email_links_btn": "Envoyer les liens du sondage"
|
||||
},
|
||||
"pollGraphic": {
|
||||
"choiceColorblind": "I am",
|
||||
"choiceNotColorblind": "I am not",
|
||||
"colorblindText": "colorblind."
|
||||
}
|
||||
}
|
||||
|
||||
@ -65,14 +65,55 @@
|
||||
"links_mail": "Recevoir les liens par e-mail"
|
||||
},
|
||||
"visibility": {
|
||||
"top_txt": "Un peu de paramétrage…",
|
||||
"title": "Visibilité des réponses",
|
||||
"visibility_want": "Je veux que",
|
||||
"visibility_link": "Tout le monde",
|
||||
"visibility_nobody": "seulement moi",
|
||||
"visibility_see": "puisse voir les réponses au sondage.",
|
||||
"votes": "Votes",
|
||||
"archiving": "Archivage",
|
||||
"access": "Accès au sondage"
|
||||
"votes_possible": "Les réponses possibles seront :",
|
||||
"votes_possible_single": "Uniquement « oui »",
|
||||
"votes_possible_normal": "« oui » ou « peut-être »",
|
||||
"votes_possible_full": "« oui » ou « peut-être » ou « non »",
|
||||
"archiving": "Les personnes sondées pourront voter jusqu’au ",
|
||||
"archiving_start": "Elles",
|
||||
"archiving_can": "auront",
|
||||
"archiving_can_not": "n'auront pas",
|
||||
"archiving_end": "la possibilité de modifier",
|
||||
"modfiy_their": "leur vote",
|
||||
"modfiy_everyone": "tous les votes",
|
||||
"access": "Accès au sondage",
|
||||
"access_url": "Les votants pourront y accéder via cette adresse :",
|
||||
"access_url_key": "URL",
|
||||
"see_pass": "voir",
|
||||
"access_instructions": "peut contenir des lettres, chiffres et des tirets",
|
||||
"access_want": "Je",
|
||||
"access_want_yes": "souhaite",
|
||||
"access_want_no": "n'ai pas besoin",
|
||||
"access_protect": "qu’il soit protégé par un mot de passe.",
|
||||
"validate_btn": "Créer ce sondage !"
|
||||
},
|
||||
"pollGraphic":{
|
||||
"choiceColorblind":"Je suis",
|
||||
"choiceNotColorblind":"Je ne suis pas",
|
||||
"colorblindText":"daltonien."
|
||||
"admin": {
|
||||
"deletion": "Tout supprimer",
|
||||
"deletion_desc": "Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :",
|
||||
"deletion_btn": "Supprimer le sondage",
|
||||
"link": "Liens d’accès au sondage",
|
||||
"link_admin": "Coté administrateur·ice",
|
||||
"link_admin_desc": "Pour accéder au sondage et à tous ses paramètres :",
|
||||
"link_admin_btn": "Voir le sondage coté administrateur·ice",
|
||||
"copy_link": "Copier le lien",
|
||||
"polled_people": "Côté sondé·es",
|
||||
"polled_people_desc": "Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage",
|
||||
"polled_people_btn": "Voir le sondage",
|
||||
"email_links": "Recevoir les liens par mail",
|
||||
"email_links_desc": "Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail",
|
||||
"email_links_key": "mail",
|
||||
"email_links_btn": "Envoyer les liens du sondage"
|
||||
},
|
||||
"pollGraphic": {
|
||||
"choiceColorblind": "Je suis",
|
||||
"choiceNotColorblind": "Je ne suis pas",
|
||||
"colorblindText": "daltonien."
|
||||
}
|
||||
}
|
||||
|
||||
3
src/assets/img/icone-langue.svg
Normal file
3
src/assets/img/icone-langue.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="23" height="23" viewBox="0 0 23 23">
|
||||
<path fill="#000" fill-rule="nonzero" d="M10.628 14.218c-.024.086-.605-.197-.759-.259a15.58 15.58 0 0 1-1.031-.602c-.178-.123-.854-.701-.937-.738a22.327 22.327 0 0 1-1.588 2.226c-.214.258-.854 1.095-1.245 1.353-.06.037-.403.074-.45.05.19-.148.735-.85.972-1.132.296-.357 1.707-2.399 1.944-2.866.249-.468.996-2.017 1.031-2.165-.118-.012-1.055.32-1.304.406-.237.074-.889.234-.936.27-.048.05-.012.197-.036.246-.024.05-.237.16-.367.185-.119.037-.392.05-.558 0-.154-.037-.296-.197-.332-.258 0 0-.047-.074-.059-.283.142-.05.38-.062.64-.136.261-.073.901-.27 1.245-.393.344-.123 1.008-.381 1.21-.43.213-.038.746-.407 1.03-.505.285-.098.487-.221.498-.16.012.062 0 .332-.011.406-.012.062-.581 1.218-.664 1.402-.048.099-.38.75-.913 1.612.19.086.593.258.759.344a73.66 73.66 0 0 0 1.683.738c.071.025.201.59.178.689zM8.198 8.24c.035.21-.024.295-.048.344-.118.234-.415.394-.593.468a2.098 2.098 0 0 1-.71.147c-.107-.012-.32-.049-.582-.32-.142-.16-.249-.59-.201-.54.047.049.391.098.545.06.154-.036.522-.147.688-.196.178-.061.533-.16.652-.172.118 0 .213.05.249.209zm8.274 1.587l.747 2.792-1.648-.517.901-2.275zm-13.135 9.84l8.227-2.854V4.12L3.337 6.985v12.682zm14.712-3.9l1.209.382-2.146-8.081-1.185-.382-2.56 6.593 1.208.382.534-1.353 2.501.8.439 1.66zM12.086 3.936l6.792 2.263V1.524l-6.792 2.41zm3.687 16.273l1.873.16-.64 1.968-.475-.812c-.96.64-2.145 1.132-3.272 1.328-.343.074-.735.148-1.078.148h-.996c-1.257 0-3.545-.775-4.54-1.525-.071-.062-.095-.11-.095-.197 0-.135.095-.234.213-.234.107 0 .664.357.818.43 1.067.554 2.56 1.059 3.758 1.059 1.482 0 2.49-.197 3.84-.8.392-.184.736-.418 1.103-.627l-.51-.898zm5.31-13.272v13.272c-9.163-3.026-9.175-3.026-9.175-3.026-.19.086-8.69 3.063-8.808 3.063a.229.229 0 0 1-.213-.16c0-.012-.012-.025-.012-.037V6.788c.012-.036.024-.098.047-.122.072-.087.166-.111.238-.136.035-.012.758-.258 1.766-.615V1.192l6.615 2.435c.083-.024 7.456-2.669 7.563-2.669.13 0 .237.099.237.259v5.141l1.742.578z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
3
src/assets/img/icone-menu.svg
Normal file
3
src/assets/img/icone-menu.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="18" viewBox="0 0 26 18">
|
||||
<path fill="#000" fill-rule="nonzero" d="M23.267 2H2.733C2.328 2 2 1.552 2 1s.328-1 .733-1h20.534c.405 0 .733.448.733 1s-.328 1-.733 1zm0 14c.405 0 .733.448.733 1s-.328 1-.733 1H2.733C2.328 18 2 17.552 2 17s.328-1 .733-1h20.534zm0-8c.405 0 .733.448.733 1s-.328 1-.733 1H2.733C2.328 10 2 9.552 2 9s.328-1 .733-1h20.534z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 417 B |
@ -1,6 +1,6 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@mixin btnTheme ($color) {
|
||||
@mixin btnTheme($color) {
|
||||
background-color: $color;
|
||||
color: $white;
|
||||
&.btn--outline {
|
||||
@ -12,6 +12,7 @@
|
||||
&:hover,
|
||||
&:active {
|
||||
background-color: rgba($color, .8);
|
||||
|
||||
&.btn--outline {
|
||||
background-color: rgba($color, .2);
|
||||
}
|
||||
@ -43,9 +44,16 @@
|
||||
display: block;
|
||||
min-width: 100%;
|
||||
}
|
||||
&--mini{
|
||||
|
||||
&--mini {
|
||||
background-color: $mini-button-color;
|
||||
|
||||
}
|
||||
|
||||
&--link {
|
||||
min-width: 219.3px;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -1,9 +1,24 @@
|
||||
@charset "UTF-8";
|
||||
input[type="date"]::after{
|
||||
content:"au format JJ/MM/AAAA";
|
||||
|
||||
.input-lg {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
select {
|
||||
margin-right: 1ch;
|
||||
}
|
||||
|
||||
input {
|
||||
margin-right: 1ch;
|
||||
|
||||
&[type="date"]::after {
|
||||
content: "au format JJ/MM/AAAA";
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
@ -16,8 +31,8 @@ textarea {
|
||||
input,
|
||||
select {
|
||||
display: inline-block;
|
||||
margin-bottom:10px;
|
||||
margin-left:5px;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
@ -28,15 +43,15 @@ textarea {
|
||||
select,
|
||||
option {
|
||||
// delete default display
|
||||
-webkit-appearance : none;
|
||||
-moz-appearance : none;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
|
||||
background-color: transparent;
|
||||
background-image: url("./assets/img/fleche_bas.svg");
|
||||
padding-right:1.5rem;
|
||||
padding-right: 1.5rem;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
background-size: 9px 8px;
|
||||
|
||||
@ -6,10 +6,11 @@ h2 {
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
h1::after{
|
||||
|
||||
h1::after {
|
||||
background-color: $primary_color;
|
||||
height:2px;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
@ -1,7 +1 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
section {
|
||||
& + & {
|
||||
margin-top: 6rem;
|
||||
}
|
||||
}
|
||||
@ -4,3 +4,7 @@
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user