sync fetch stuff

This commit is contained in:
Baptiste Lemoine 2020-01-22 16:49:15 +01:00
parent 9900e1ec97
commit 02995c8b3d
10 changed files with 166 additions and 20 deletions

View File

@ -5,7 +5,7 @@ import {RouterModule, Routes} from '@angular/router';
const routes: Routes = []; const routes: Routes = [];
@NgModule({ @NgModule({
imports: [RouterModule.forRoot(routes, {useHash: true})], imports: [RouterModule.forRoot(routes, {useHash: true, anchorScrolling: 'enabled',})],
exports: [RouterModule] exports: [RouterModule]
}) })
export class AppRoutingModule { export class AppRoutingModule {

View File

@ -33,6 +33,7 @@ export class AppComponent {
this.route.events.subscribe((event: any) => { this.route.events.subscribe((event: any) => {
this.scrollGoToTop(); this.scrollGoToTop();
console.log('event', event)
if (event.url) { if (event.url) {
const tab = event.url.split('/'); const tab = event.url.split('/');

View File

@ -32,7 +32,7 @@ export class PollConfig {
myComment: string = 'wouah trop bien framadate!'; myComment: string = 'wouah trop bien framadate!';
isAdmin: boolean = true; isAdmin: boolean = true;
myEmail: string = "tktest@tktest.com"; myEmail: string = "tktest@tktest.com";
myPolls: any;// list of retrieved polls from the backend api myPolls: any = [];// list of retrieved polls from the backend api
// 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 // 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'; allowSeveralHours = 'false';
// access // access

View File

@ -0,0 +1,109 @@
export const mockPoll1 = {
"message": "your poll config",
"data": {
"id": 1,
"title": "citron ou orange",
"customUrl": null,
"description": "votre sorbert préféré",
"creationDate": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"expiracyDate": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"owner": {
"__initializer__": {},
"__cloner__": {},
"__isInitialized__": false
},
"kind": "text",
"allowedAnswers": [
"yes"
],
"modificationPolicy": "nobody",
"mailOnComment": null,
"mailOnVote": true,
"hideResults": null,
"showResultEvenIfPasswords": null,
"votes": {},
"stacksOfVotes": {},
"choices": {},
"comments": {},
"defaultExpiracyDaysFromNow": 60
},
"stacks_count": 2,
"stacks": [
{
"id": 1,
"pseudo": "voting_people_TEST",
"creation_date": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"votes": [
{
"id": 1,
"vote_id": 1,
"value": "yes",
"choice_id": 1,
"text": "orange"
},
{
"id": 1,
"vote_id": 2,
"value": "yes",
"choice_id": 2,
"text": null
}
]
},
{
"id": 2,
"pseudo": "voting_people_TEST",
"creation_date": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"votes": [
{
"id": 2,
"vote_id": 3,
"value": "maybe",
"choice_id": 1,
"text": "orange"
}
]
}
],
"choices_count": 2,
"choices": [
{
"id": 1,
"date": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"text": "orange",
"url": null
},
{
"id": 2,
"date": {
"date": "2020-01-22 14:28:19.000000",
"timezone_type": 3,
"timezone": "Europe/Paris"
},
"text": "citron",
"url": null
}
],
"comments": [],
"comments_count": 0
};

View File

@ -146,7 +146,7 @@
(click)='config.addComment()' > (click)='config.addComment()' >
<framadate-voting-comment <framadate-voting-comment
[comment]="c" [comment]="c"
*ngFor="let c of comments " > *ngFor="let c of config.currentPoll.comments " >
</framadate-voting-comment > </framadate-voting-comment >
</div > </div >
<div class="sharing" > <div class="sharing" >
@ -156,14 +156,14 @@
<p <p
class="nobold text-14" class="nobold text-14"
for="copyLink" >Pour partager le sondage, vous pouvez diffuser ce lien : for="copyLink" >Pour partager le sondage, vous pouvez diffuser ce lien :
<a href='{{config.urlPublic}}' > <a href='{{config.currentPoll.urlPublic}}' >
{{config.urlPublic}} {{config.currentPoll.urlPublic}}
</a > </a >
</p > </p >
<button <button
class=" btn btn--primary btn--outline" class=" btn btn--primary btn--outline"
[ngxClipboard] [ngxClipboard]
[cbContent]="config.urlPublic" [cbContent]="config.currentPoll.urlPublic"
id="copyLink" > id="copyLink" >
<i class='fa fa-copy' ></i > <i class='fa fa-copy' ></i >
{{"admin.copy_link" |translate}} {{"admin.copy_link" |translate}}

View File

@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core';
import {BaseComponent} from "../base-page/base.component"; import {BaseComponent} from "../base-page/base.component";
import {ConfigService} from "../../services/config.service"; import {ConfigService} from "../../services/config.service";
import {mockComments} from "../../config/mocks/mock-comments"; import {mockComments} from "../../config/mocks/mock-comments";
import {ActivatedRoute} from "@angular/router"; import {ActivatedRoute, Router, RouterEvent} from "@angular/router";
@Component({ @Component({
selector: 'framadate-poll-display', selector: 'framadate-poll-display',
@ -14,21 +14,37 @@ export class PollDisplayComponent extends BaseComponent implements OnInit {
comments = mockComments; comments = mockComments;
constructor(public config: ConfigService, constructor(public config: ConfigService,
private router: Router,
public activeRoute: ActivatedRoute) { public activeRoute: ActivatedRoute) {
super(config); super(config);
router.events.subscribe((val: RouterEvent) => {
// see also
console.log(this.activeRoute);
if (val.url && !this.config.loading) {
this.fetchPoll();
}
});
} }
ngOnInit() { ngOnInit() {
this.config.currentPoll;
// fetch poll with its ID or slug.
}
// fetch poll with its ID or slug.
fetchPoll() {
const id = this.activeRoute.snapshot.params.poll; const id = this.activeRoute.snapshot.params.poll;
const pollSlug = this.activeRoute.snapshot.params.pollSlug; const pollSlug = this.activeRoute.snapshot.params.pollSlug;
if (id) {
if (id) {
this.config.loading = true;
// store it in the poll property here // store it in the poll property here
this.config.getPollById(id).subscribe( this.config.getPollById(id).subscribe(
(res: any) => { (res: any) => {
console.log('res', res)
this.config.pollId = id; this.config.pollId = id;
this.config.currentPoll = res; this.config.currentPoll = res;
this.config.loading = false; this.config.loading = false;
@ -38,8 +54,10 @@ export class PollDisplayComponent extends BaseComponent implements OnInit {
} }
); );
} else if (pollSlug) { } else if (pollSlug) {
this.config.loading = true;
this.config.getPollByURL(pollSlug).subscribe( this.config.getPollByURL(pollSlug).subscribe(
(res: any) => { (res: any) => {
console.log('res', res)
this.config.pollId = res.id; this.config.pollId = res.id;
this.config.currentPoll = res; this.config.currentPoll = res;
this.config.loading = false; this.config.loading = false;
@ -50,7 +68,6 @@ export class PollDisplayComponent extends BaseComponent implements OnInit {
); );
} }
} }
} }

View File

@ -1,7 +1,9 @@
<div class="comment" > <div class="comment" >
<span class="cname" >{{comment.pseudo}} </span >, le <span class="cname" >{{comment.pseudo}} </span >, le
<span class="date padding-btm-x1" >{{comment.date}}</span > <span class="date padding-btm-x1" >{{comment.date.date | date:'medium'}}</span >
<p class="text" > <blockquote >
{{comment.text}} <p class="text" >
</p > {{comment.text}}
</p >
</blockquote >
</div > </div >

View File

@ -4,7 +4,7 @@ import {DOCUMENT} from '@angular/common';
import {mockGraphConfig} from "../config/mocks/mock-graph"; import {mockGraphConfig} from "../config/mocks/mock-graph";
import {graphOptions} from "../config/graph-canevas-options"; import {graphOptions} from "../config/graph-canevas-options";
import {ConfigService} from "../services/config.service"; import {ConfigService} from "../services/config.service";
import {mockPoll3} from "../config/mocks/mock-poll3"; import {mockPoll1} from "../config/mocks/mock1";
@Component({ @Component({
selector: "framadate-poll-graphic", selector: "framadate-poll-graphic",
@ -13,7 +13,7 @@ import {mockPoll3} from "../config/mocks/mock-poll3";
}) })
export class PollGraphicComponent implements OnInit { export class PollGraphicComponent implements OnInit {
isColorblind: boolean = false; isColorblind: boolean = false;
pollConfigRetrieved: any = mockPoll3; pollConfigRetrieved: any = mockPoll1;
graphicConfig: any = mockGraphConfig; graphicConfig: any = mockGraphConfig;
preferred: any = "rien"; preferred: any = "rien";
yesList: number[] = []; yesList: number[] = [];

View File

@ -4,9 +4,9 @@ import {HttpClient, HttpHeaders} from "@angular/common/http";
import {environment} from "../../environments/environment"; import {environment} from "../../environments/environment";
import {ConfirmationService, MessageService} from 'primeng/api'; import {ConfirmationService, MessageService} from 'primeng/api';
import {Router} from "@angular/router"; import {Router} from "@angular/router";
import {mockPoll3} from "../config/mocks/mock-poll3";
import {mockMyPolls} from "../config/mocks/mockmypolls"; import {mockMyPolls} from "../config/mocks/mockmypolls";
import {defaultAnswers, defaultDates, timeOfDay} from "../config/defaultConfigs"; import {defaultAnswers, defaultDates, timeOfDay} from "../config/defaultConfigs";
import {mockPoll1} from "../config/mocks/mock1";
/** /**
* le service transverse à chaque page qui permet de syncroniser la configuration de sondage souhaitée * le service transverse à chaque page qui permet de syncroniser la configuration de sondage souhaitée
@ -29,7 +29,7 @@ export class ConfigService extends PollConfig {
// fill in mock values if we are not in production environment // fill in mock values if we are not in production environment
if (!environment.production) { if (!environment.production) {
console.info(' ######### framadate ######### we are not in production env, filling with mock values'); console.info(' ######### framadate ######### we are not in production env, filling with mock values');
this.currentPoll = mockPoll3; this.currentPoll = mockPoll1;
this.myPolls = mockMyPolls; this.myPolls = mockMyPolls;
this.dateList = defaultDates; this.dateList = defaultDates;
this.timeList = timeOfDay; this.timeList = timeOfDay;
@ -121,6 +121,8 @@ export class ConfigService extends PollConfig {
dateList: this.dateList, dateList: this.dateList,
timeList: this.timeList, timeList: this.timeList,
answers: this.answers, answers: this.answers,
expiracyDateDefaultInDays: this.expiracyDateDefaultInDays,
deletionDateAfterLastModification: this.deletionDateAfterLastModification,
}; };
return jsonConfig return jsonConfig
} }
@ -181,6 +183,7 @@ export class ConfigService extends PollConfig {
this.myEmail = email; this.myEmail = email;
this.todo('send email for real : TODO');
this.loading = true; this.loading = true;
this.http.get(`${this.baseHref}/send-polls-to-user/${this.myEmail}`, this.http.get(`${this.baseHref}/send-polls-to-user/${this.myEmail}`,
this.makeHeaders(), this.makeHeaders(),
@ -290,6 +293,9 @@ export class ConfigService extends PollConfig {
this.currentPoll = res; this.currentPoll = res;
this.pollId = res.pollId; this.pollId = res.pollId;
this.loading = false; this.loading = false;
if (!this.myPolls) {
this.myPolls = [];
}
this.myPolls.push(config); this.myPolls.push(config);
this.router.navigate(['step/end']); this.router.navigate(['step/end']);
// TODO save new poll to localstorage // TODO save new poll to localstorage
@ -311,6 +317,7 @@ export class ConfigService extends PollConfig {
if (!voteStack) { if (!voteStack) {
voteStack = { voteStack = {
pseudo: this.myName, pseudo: this.myName,
email: this.myEmail,
answers: this.answers answers: this.answers
} }
} }
@ -362,7 +369,7 @@ export class ConfigService extends PollConfig {
} }
} }
this.http.post( this.http.post(
`${this.baseHref}/poll/${this.pollId}/comment`, `${this.baseHref}/poll/${this.currentPoll.id}/comment`,
comment, comment,
this.makeHeaders()) this.makeHeaders())
.subscribe((res: any) => { .subscribe((res: any) => {

View File

@ -74,6 +74,16 @@
i18n > i18n >
Sondage dessins animés Sondage dessins animés
</a > </a >
<a
[routerLink]="'/vote/poll/id/4'"
i18n >
Sondage 4
</a >
<a
[routerLink]="'/vote/poll/id/5'"
i18n >
Sondage 5
</a >
<a <a
[routerLink]="'/graphic/toto'" [routerLink]="'/graphic/toto'"
[ngClass]="{'active': step == 'graphic'}" [ngClass]="{'active': step == 'graphic'}"