diff --git a/src/app/pages/dates/dates.component.scss b/src/app/pages/dates/dates.component.scss
index a62fa1c8..84c17656 100644
--- a/src/app/pages/dates/dates.component.scss
+++ b/src/app/pages/dates/dates.component.scss
@@ -1,7 +1,11 @@
.several-times {
padding-left: 1em;
+}
- input {
- margin-right: 1em;
+:host {
+ input, button {
+ + button {
+ margin-left: 1em;
+ }
}
}
diff --git a/src/app/pages/dates/dates.component.ts b/src/app/pages/dates/dates.component.ts
index 300d1580..7e0d8f6a 100644
--- a/src/app/pages/dates/dates.component.ts
+++ b/src/app/pages/dates/dates.component.ts
@@ -1,6 +1,7 @@
-import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
+import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
import {ConfigService} from '../../config.service';
import {BaseComponent} from '../base-page/base.component';
+import {DOCUMENT} from '@angular/common';
@Component({
selector: 'framadate-dates',
@@ -8,41 +9,145 @@ import {BaseComponent} from '../base-page/base.component';
styleUrls: ['./dates.component.scss']
})
export class DatesComponent extends BaseComponent implements OnInit {
- constructor(public config: ConfigService, private cd: ChangeDetectorRef) {
+ showDateInterval: boolean = true;
+ startDateInterval: any;
+ intervalDays: any;
+ intervalDaysDefault: number = 7;
+ endDateInterval: any;
+
+ constructor(public config: ConfigService,
+ private cd: ChangeDetectorRef,
+ @Inject(DOCUMENT) private document: any
+ ) {
super(config);
}
+ countDays() {
+ // compute the number of days in the date interval
+ if (this.endDateInterval && this.startDateInterval) {
+ this.intervalDays = (this.dayDiff(this.endDateInterval, this.startDateInterval)).toFixed(0)
+ }
+ }
+
+ /**
+ * set the interval options
+ */
ngOnInit() {
+ let dateCurrent = new Date();
+ const dateJson = dateCurrent.toISOString();
+ this.startDateInterval = dateJson.substring(0, 10);
+ this.endDateInterval = this.addDaysToDate(this.intervalDaysDefault, dateCurrent).toISOString().substring(0, 10);
}
addDate() {
- this.config.dateList.push({literal: ''});
+ this.config.dateList.push({literal: '', timeList: []});
+ let selector = '[ng-reflect-name="dateChoices_' + (this.config.dateList.length - 1) + '"]';
+ this.cd.detectChanges();
+ const elem = this.document.querySelector(selector);
+ if (elem) {
+ elem.focus();
+ }
}
- addtime() {
- this.config.timeList.push({literal: ''});
+ addTime() {
+ this.config.timeList.push({literal: '', timeList: []});
}
+ /**
+ * 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;
+ };
+
/**
* add a time period to a specific date choice,
* focus on the new input
* @param config
* @param id
*/
- addTimetoDate(config: any, id: number) {
+ addTimeToDate(config: any, id: number) {
config.timeList.push({literal: ''});
let selector = '[ng-reflect-name="dateTime_' + id + '_Choices_' + (config.timeList.length - 1) + '"]';
- console.log('selector', selector);
this.cd.detectChanges();
- const elem = document.querySelector(selector);
+ const elem = this.document.querySelector(selector);
if (elem) {
- //this.elem.focus();
+ elem.focus();
}
}
+ /**
+ * remove all input contents, does not reset to default
+ */
emptyAll() {
this.config.dateList.forEach(element => {
element.literal = '';
+ element.timeList = ['', '', ''];
+ });
+ this.config.timeList.forEach(element => {
+ element.literal = '';
});
}
+
+ /**
+ * add all the dates between the start and end dates in the interval section
+ */
+ addIntervalOfDates() {
+ let newIntervalArray = this.getDatesInRange(this.startDateInterval, this.endDateInterval, 1);
+
+ const converted = [];
+ newIntervalArray.forEach(element => {
+ converted.push({literal: element, timeList: []});
+ });
+ this.config.dateList = [...new Set(converted)]; // add only dates that are not already present with a Set of unique items
+ this.showDateInterval = false;
+
+ }
+
+ /**
+ *
+ * @param d1
+ * @param d2
+ * @param interval
+ */
+ getDatesInRange(d1: Date, d2: Date, interval: number) {
+ d1 = new Date(d1);
+ d2 = new Date(d2);
+ const dates = [];
+ while (+d1 < +d2) {
+ dates.push(this.formateDate(d1));
+ d1.setDate(d1.getDate() + interval)
+ }
+ return dates.slice(0)
+ }
+
+ /**
+ * get the number of days between two dates
+ * @param d1
+ * @param d2
+ */
+ dayDiff(d1: Date, d2: Date): Number {
+ return Number(((d2.getTime()) - (d1.getTime()) / 31536000000));
+ }
+
+ /**
+ * format a date object to the date format used by the inputs of type date
+ * YYYY-MM-DD
+ * @param date
+ */
+ formateDate(date) {
+ return [
+ date.getFullYear(),
+ this.getDoubleDigits(date.getMonth() + 1),
+ this.getDoubleDigits(date.getDate()),
+ ].join('-')
+ }
+
+ getDoubleDigits(str) {
+ return ("00" + str).slice(-2);
+ }
}
diff --git a/src/app/poll-graphic/poll-graphic.component.html b/src/app/poll-graphic/poll-graphic.component.html
new file mode 100644
index 00000000..6f969732
--- /dev/null
+++ b/src/app/poll-graphic/poll-graphic.component.html
@@ -0,0 +1,19 @@
+
+{{ "pollGraphic.colorblindText" | translate }}
+
+
+
+
diff --git a/src/app/poll-graphic/poll-graphic.component.scss b/src/app/poll-graphic/poll-graphic.component.scss
new file mode 100644
index 00000000..5eb2a3bb
--- /dev/null
+++ b/src/app/poll-graphic/poll-graphic.component.scss
@@ -0,0 +1,4 @@
+#selectColorblind {
+ direction: rtl;
+ padding:0;
+}
diff --git a/src/app/poll-graphic/poll-graphic.component.spec.ts b/src/app/poll-graphic/poll-graphic.component.spec.ts
new file mode 100644
index 00000000..ed5118d3
--- /dev/null
+++ b/src/app/poll-graphic/poll-graphic.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PollGraphicComponent } from './poll-graphic.component';
+
+describe('PollGraphicComponent', () => {
+ let component: PollGraphicComponent;
+ let fixture: ComponentFixture
;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ PollGraphicComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(PollGraphicComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/poll-graphic/poll-graphic.component.ts b/src/app/poll-graphic/poll-graphic.component.ts
new file mode 100644
index 00000000..f3ba0682
--- /dev/null
+++ b/src/app/poll-graphic/poll-graphic.component.ts
@@ -0,0 +1,161 @@
+import {Component, OnInit} from "@angular/core";
+import {Chart} from "chart.js";
+
+@Component({
+ selector: "framadate-poll-graphic",
+ templateUrl: "./poll-graphic.component.html",
+ styleUrls: ["./poll-graphic.component.scss"]
+})
+export class PollGraphicComponent implements OnInit {
+ isColorblind: boolean = false;
+ lineChart: Chart;
+ pollData: any;
+ yesList: number[] = [];
+ maybeList: number[] = [];
+ noList: number[] = [];
+ nbPoll: number = 0;
+ dateList: string[] = [];
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ var toto = {
+ step: 0,
+ stepMax: 3,
+ pollType: "special dates",
+ title: "",
+ description: "",
+ myName: "",
+ visibility: "link_only",
+ // date specific poll
+ allowSeveralHours: "true",
+ dateLgfgfgfgist: ["jeudi", "vendredi", "samedi"], // sets of days as strings
+ timeList: ["08:00", "08:30", "09:00"], // ranges of time expressed as strings
+ answers: [
+ {
+ id: 0,
+ text: "no"
+ },
+
+ {
+ id: 1,
+ text: "yes"
+ },
+ {
+ id: 2,
+ text: "maybe"
+ },
+ {
+ id: 3,
+ text: "maybe"
+ },
+ {
+ id: 4,
+ text: "maybe"
+ },
+ {
+ id: 5,
+ text: "maybe"
+ },
+ {
+ id: 6,
+ text: "maybe"
+ },
+ {
+ id: 7,
+ text: "maybe"
+ },
+ {
+ id: 8,
+ text: "maybe"
+ }
+ ]
+ };
+
+ this.formatDataAnswers(toto);
+
+ this.isColorblind = false;
+ this.pollData = new Chart(document.getElementById("graph"), {
+ type: "horizontalBar",
+ data: {
+ labels: ["jeudi"],
+ datasets: [
+ {
+ type: "horizontalBar",
+ stack: "Yes",
+ backgroundColor: "#429a00",
+ data: this.yesList
+ },
+ {
+ type: "horizontalBar",
+ stack: "Yes",
+ backgroundColor: "#f5a623",
+ data: this.maybeList
+ },
+ {
+ type: "horizontalBar",
+ stack: "No",
+ backgroundColor: "#cd0000",
+ data: this.noList
+ }
+ ]
+ },
+ options: {
+ legend: {display: false},
+ scales: {
+ xAxes: [
+ {
+ gridLines: {drawBorder: false, display: false},
+ display: false,
+ stacked: true,
+ ticks: {
+ beginAtZero: true,
+ maxRotation: 0,
+ minRotation: 0
+ }
+ }
+ ],
+ yAxes: [
+ {
+ gridLines: {drawBorder: true, display: false},
+ display: true,
+ stacked: true
+ }
+ ]
+ }
+ }
+ });
+ }
+
+ toggleColorblind() {
+ this.isColorblind = !this.isColorblind;
+ }
+
+ formatDataAnswers(poll) {
+ if (poll && poll.pollType === "special dates") {
+ this.initPollCounter();
+ poll.answers.forEach(response => {
+ switch (response.text) {
+ case "yes":
+ this.yesList[this.nbPoll - 1]++;
+ break;
+ case "maybe":
+ this.maybeList[this.nbPoll - 1]++;
+ break;
+ case "no":
+ this.noList[this.nbPoll - 1]++;
+ break;
+ }
+ });
+ }
+ }
+
+ initPollCounter() {
+ this.nbPoll++;
+ this.dateList[this.nbPoll - 1] = "jeudi";
+ this.maybeList[this.nbPoll - 1] = 0;
+ this.yesList[this.nbPoll - 1] = 0;
+ this.noList[this.nbPoll - 1] = 0;
+ }
+}
diff --git a/src/app/services/poll-service.service.spec.ts b/src/app/services/poll-service.service.spec.ts
new file mode 100644
index 00000000..c9b6bcec
--- /dev/null
+++ b/src/app/services/poll-service.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { PollServiceService } from './poll-service.service';
+
+describe('PollServiceService', () => {
+ beforeEach(() => TestBed.configureTestingModule({}));
+
+ it('should be created', () => {
+ const service: PollServiceService = TestBed.get(PollServiceService);
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/src/app/services/poll-service.service.ts b/src/app/services/poll-service.service.ts
new file mode 100644
index 00000000..0bf09ae0
--- /dev/null
+++ b/src/app/services/poll-service.service.ts
@@ -0,0 +1,32 @@
+import {Injectable} from '@angular/core';
+import {ConfigService} from "../config.service";
+import {HttpClient} from "@angular/common/http";
+import {environment} from "../../environments/environment";
+
+class JsonResponse {
+ message: string;
+ data: string;
+}
+
+@Injectable({
+ providedIn: 'root'
+})
+export class PollServiceService {
+
+ private baseHref: string = environment.baseApiHref;
+
+ constructor(private configService: ConfigService,
+ private http: HttpClient) {
+ }
+
+ findPollsByEmail(email: string) {
+ // TODO check if the person has a key to retrieve her polls
+ // If no key is found in the localstorage, ask the backend to send an email to the user
+
+ this.configService.myEmail = email;
+ this.http.get(this.baseHref + '/').subscribe(res => {
+ this.configService.myPolls = res;
+ }, err => console.error('err', err)
+ )
+ }
+}
diff --git a/src/app/ui/navigation/navigation.component.html b/src/app/ui/navigation/navigation.component.html
index c7fa566b..fcce0856 100644
--- a/src/app/ui/navigation/navigation.component.html
+++ b/src/app/ui/navigation/navigation.component.html
@@ -1,29 +1,32 @@
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 14073764..4bc4ecae 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -37,8 +37,15 @@
"identical": "same",
"different": "possibly different"
},
- "add": "Add a date range",
- "count_dates": "choices of dates"
+ "add": "Add a date choice",
+ "add_time": "Add a time span",
+ "count_dates": "choices of dates",
+ "count_time": "choices of hour span",
+ "add_interval": "Add a date interval",
+ "interval_propose": "I want to suggest all the dates from",
+ "interval_span": "to",
+ "interval_button": "Add these",
+ "interval_button_dates": "dates"
},
"choices": {
"title": "Write the proposals",
@@ -60,5 +67,10 @@
"votes": "Votes",
"archiving": "Archiving",
"access": "Access to the pool"
+ },
+ "pollGraphic":{
+ "choiceColorblind":"I am",
+ "choiceNotColorblind":"I am not",
+ "colorblindText":"colorblind."
}
}
diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json
index 1f6621e2..53dc4aa1 100644
--- a/src/assets/i18n/fr.json
+++ b/src/assets/i18n/fr.json
@@ -32,15 +32,22 @@
},
"dates": {
"title": "Config spécialement pour les dates ",
- "hours_different": "Je souhaite mettre des créneaux horaires pour chaque journée",
+ "hours_different": "Je souhaite mettre des créneaux horaires",
+ "hours_each_day": "pour chaque journée",
"multiple": {
"identical": "identiques",
"different": "possiblement différentes"
},
"add": "Ajouter une plage de dates",
- "addTime": "Ajouter une plage d'heure",
+ "add_time": "Ajouter une plage d'heure",
"empty": "Vider",
- "count_dates": "choix de dates"
+ "count_dates": "choix de dates",
+ "count_time": "choix de plages horaires",
+ "add_interval": "Ajouter une intervalle de dates",
+ "interval_propose": "Je souhaite proposer pour mon sondage toutes les dates entre le",
+ "interval_span": "et le",
+ "interval_button": "Ajouter ces",
+ "interval_button_dates": "dates"
},
"choices": {
"title": "Choisir les propositions",
@@ -62,5 +69,10 @@
"votes": "Votes",
"archiving": "Archivage",
"access": "Accès au sondage"
+ },
+ "pollGraphic":{
+ "choiceColorblind":"Je suis",
+ "choiceNotColorblind":"Je ne suis pas",
+ "colorblindText":"daltonien."
}
}
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
index 3612073b..0a1bc680 100644
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -1,3 +1,4 @@
export const environment = {
- production: true
+ production: true,
+ baseApiHref : 'http://127.0.0.1:8000/api/v1/'
};
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index 7b4f817a..918f5d2b 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -3,7 +3,8 @@
// The list of file replacements can be found in `angular.json`.
export const environment = {
- production: false
+ production: false,
+ baseApiHref: "http://127.0.0.1:8000/api/v1/"
};
/*
diff --git a/yarn.lock b/yarn.lock
index 4fdebb05..3ea57eea 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1452,6 +1452,29 @@ chardet@^0.7.0:
resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
integrity sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==
+chart.js@^2.8.0:
+ version "2.9.3"
+ resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.3.tgz#ae3884114dafd381bc600f5b35a189138aac1ef7"
+ integrity sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==
+ dependencies:
+ chartjs-color "^2.1.0"
+ moment "^2.10.2"
+
+chartjs-color-string@^0.6.0:
+ version "0.6.0"
+ resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
+ integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
+ dependencies:
+ color-name "^1.0.0"
+
+chartjs-color@^2.1.0:
+ version "2.4.1"
+ resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
+ integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
+ dependencies:
+ chartjs-color-string "^0.6.0"
+ color-convert "^1.9.3"
+
"chokidar@>=2.0.0 <4.0.0":
version "3.0.2"
resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.0.2.tgz#0d1cd6d04eb2df0327446188cd13736a3367d681"
@@ -1606,7 +1629,7 @@ collection-visit@^1.0.0:
map-visit "^1.0.0"
object-visit "^1.0.0"
-color-convert@^1.9.0:
+color-convert@^1.9.0, color-convert@^1.9.3:
version "1.9.3"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
@@ -1618,6 +1641,11 @@ color-name@1.1.3:
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
+color-name@^1.0.0:
+ version "1.1.4"
+ resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
+ integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
+
colors@1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/colors/-/colors-1.1.2.tgz#168a4701756b6a7f51a12ce0c97bfa28c084ed63"
@@ -4391,6 +4419,11 @@ mkdirp@0.5.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.0:
dependencies:
minimist "0.0.8"
+moment@^2.10.2:
+ version "2.24.0"
+ resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
+ integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
+
move-concurrently@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"