manage mobile menu, and add poll title to page title

src/app/app.component.html

@@ -1,6 +1,6 @@
 <mat-sidenav-container (backdropClick)="sidenav.toggle()">
 	<mat-sidenav #sidenav mode="side">
-		<app-navigation></app-navigation>
+		<app-navigation [appTitle]="appTitle" [appLogo]="appLogo"></app-navigation>
 	</mat-sidenav>
 
 	<mat-sidenav-content>

src/app/core/components/header/header.component.html

@@ -43,10 +43,11 @@
 			</div>
 		</div>
 		<div class="mobile-menu" *ngIf="mobileMenuVisible">
-			menu mobile
+			<!--			menu mobile-->
+			<app-navigation [appTitle]="appTitle" [appLogo]="appLogo"></app-navigation>
 		</div>
 	</nav>
-	<div class="demo padded box" *ngIf="!env.production">
+	<div class="demo padded box" *ngIf="env.display_routes">
 		Environnement de développement: voici des liens de démonstration issus des fixtures Doctrine de date-poll-api.
 		<button class="btn is-primary" [routerLink]="['/poll/aujourdhui-ou-demain/consultation']">
 			consulter le sondage

src/app/core/components/header/header.component.ts

@@ -15,9 +15,9 @@ import { environment } from '../../../../environments/environment';
 export class HeaderComponent implements OnInit {
 	public _user: Observable<Owner> = this.userService.user;
 	public env = environment;
-	@Input() public appTitle: string = 'FramaDate Funky';
-	@Input() public appLogo: string;
-	mobileMenuVisible = false;
+	@Input() public appTitle = environment.appTitle;
+	@Input() public appLogo = environment.appLogo;
+	mobileMenuVisible = true;
 
 	constructor(private userService: UserService) {}
 

src/app/core/components/sibebar/navigation/navigation.component.html

@@ -5,58 +5,66 @@
 			<a
 				class="navbar-item"
 				*ngFor="let poll of _pollsAvailables | async"
-				routerLink="{{ '/poll/' + poll.slug + '/consultation' }}"
+				routerLink="{{ '/poll/' + poll.custom_url + '/consultation' }}"
 				routerLinkActive="is-active"
 			>
-				« {{ poll.slug }} »
+				« {{ poll.custom_url }} »
 			</a>
 		</div>
 	</div>
 
 	<hr />
 
-	<div class="navbar-item has-dropdown is-hoverable is-warning" *ngIf="devModeEnabled">
-		<a class="navbar-link"> Modules </a>
-		<div class="navbar-dropdown">
-			<a class="navbar-item" routerLink="oldstuff" routerLinkActive="is-active">
-				Old stuff
-			</a>
-			<a class="navbar-item" routerLink="administration" routerLinkActive="is-active">
-				Administration
-			</a>
-			<a class="navbar-item" routerLink="consultation" routerLinkActive="is-active">
-				Consultation
-			</a>
-			<a class="navbar-item" routerLink="participation" routerLinkActive="is-active">
-				Participation
+	<div class="navbar-item has-dropdown is-hoverable is-warning" *ngIf="environment.display_routes">
+		<div class="padded">
+			<a class="navbar-link"> Modules </a>
+			<div class="navbar-dropdown">
+				<a class="navbar-item" routerLink="/#/administration" routerLinkActive="is-active">
+					{{ 'creation.title' | translate }}
+				</a>
+			</div>
+
+			<hr />
+			<a class="navbar-item" routerLink="/poll/inexistentPoll/consultation" routerLinkActive="is-active">
+				« tester une page 404 »
 			</a>
+			<hr />
+			<button
+				class="btn"
+				[routerLink]="['/poll/aujourdhui-ou-demain/consultation']"
+				routerLinkActive="is-primary"
+			>
+				consulter le sondage
+				<strong>
+					aujourdhui-ou-demain
+				</strong>
+			</button>
+			<button class="btn" [routerLink]="['/poll/citron/hash/consultation']" routerLinkActive="is-primary">
+				<strong>
+					citron
+				</strong>
+				sans pass
+			</button>
+			<button class="btn" [routerLink]="['/poll/dessin-anime/consultation']" routerLinkActive="is-primary">
+				<strong>
+					dessin-anime
+				</strong>
+			</button>
+			<button
+				class="btn"
+				[routerLink]="['/poll/citron/consultation/1c01ed9c94fc640a1be864f197ff808c']"
+				routerLinkActive="is-primary"
+			>
+				<strong>
+					citron
+				</strong>
+
+				avec son hash md5 de mot de passe intégré
+			</button>
 		</div>
-
-		<hr />
-		<a class="navbar-item" routerLink="/poll/inexistentPoll/consultation" routerLinkActive="is-active">
-			« inexistentPoll »
-		</a>
-		<hr />
-		<a class="button is-block" routerLink="oldstuff/step/creation" routerLinkActive="active"> Création </a>
-		<a class="button is-block" routerLink="oldstuff/step/date" routerLinkActive="active"> Les Dates </a>
-		<a class="button is-block" routerLink="oldstuff/step/answers" routerLinkActive="active"> Réponses </a>
-		<a class="button is-block" routerLink="oldstuff/step/visibility" routerLinkActive="active"> Visibilité </a>
-		<a class="button is-block" routerLink="oldstuff/step/resume" routerLinkActive="active"> Résumé </a>
-		<a class="button is-block" routerLink="oldstuff/step/end" routerLinkActive="active"> Confirmation </a>
-		<a class="button is-block" routerLink="oldstuff/step/admin"> Administration </a>
-
-		<hr />
-
-		<a class="button is-block" routerLink="oldstuff/step/kind" routerLinkActive="active"> Page démo </a>
-		<a class="button is-block" routerLink="oldstuff/vote/poll/id/1" routerLinkActive="active"> Sondage 1 </a>
-		<a class="button is-block" routerLink="oldstuff/vote/poll/id/2" routerLinkActive="active"> Sondage 2 </a>
-		<a class="button is-block" routerLink="oldstuff/vote/poll/id/3" routerLinkActive="active">
-			Sondage 3 (dessins animés)
-		</a>
-		<a class="button is-block" routerLink="oldstuff/graphic/toto" routerLinkActive="active"> Graphique </a>
 	</div>
 
-	<a class="button is-block" routerLink="oldstuff/step/home" routerLinkActive="active">
+	<a class="button is-block" [routerLink]="['/home']" routerLinkActive="active">
 		<i class="fa fa-home" aria-hidden="true"></i> Accueil
 	</a>
 </nav>

src/app/core/components/sibebar/navigation/navigation.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { Observable } from 'rxjs';
 
 import { Poll } from '../../../models/poll.model';
@@ -13,6 +13,9 @@ import { environment } from '../../../../../environments/environment';
 export class NavigationComponent implements OnInit {
 	public _pollsAvailables: Observable<Poll[]> = this.mockingService.pollsAvailables;
 	public devModeEnabled = !environment.production;
+	@Input() public appTitle = 'FramaDate Funky';
+	@Input() public appLogo: string;
+	public environment = environment;
 
 	constructor(private mockingService: MockingService) {}
 

src/app/core/services/poll.service.ts

@@ -13,6 +13,7 @@ import { UuidService } from './uuid.service';
 import { HttpClient } from '@angular/common/http';
 import { environment } from '../../../environments/environment';
 import { StorageService } from './storage.service';
+import { Title } from '@angular/platform-browser';
 
 @Injectable({
 	providedIn: 'root',
@@ -28,6 +29,7 @@ export class PollService implements Resolve<Poll> {
 		private storageService: StorageService,
 		private userService: UserService,
 		private uuidService: UuidService,
+		private titleService: Title,
 		private toastService: ToastService
 	) {}
 
@@ -74,9 +76,11 @@ export class PollService implements Resolve<Poll> {
 		console.log('slug', slug);
 		if (slug) {
 			const poll: Poll | undefined = await this.apiService.getPollBySlug(slug);
+
 			console.log({ loadPollBySlugResponse: poll });
 			if (poll) {
 				this.updateCurrentPoll(poll);
+				this.titleService.setTitle(`☑️ ${poll.title} - ${environment.appTitle}`);
 			} else {
 				this.toastService.display(`sondage ${slug} non trouvé`);
 			}

src/app/features/consultation/consultation.component.ts

@@ -11,6 +11,7 @@ import { StorageService } from '../../core/services/storage.service';
 import { ApiService } from '../../core/services/api.service';
 import { Stack } from '../../core/models/stack.model';
 import { environment } from '../../../environments/environment';
+import { Title } from '@angular/platform-browser';
 
 @Component({
 	selector: 'app-consultation',
@@ -62,7 +63,7 @@ export class ConsultationComponent implements OnInit, OnDestroy {
 			console.log('params', params);
 			this.pollSlug = params.get('slug');
 			this.passHash = params.get('hash');
-			console.log('hash, slug', this.passHash, this.pollSlug);
+
 			if (this.passHash) {
 				this.pollService.loadPollBySlugWithPasswordHash(this.pollSlug, this.passHash);
 			} else {
@@ -86,7 +87,7 @@ export class ConsultationComponent implements OnInit, OnDestroy {
 
 	addVoteStack() {
 		this.api.sendVoteStackOfPoll(this.poll, this.storageService.vote_stack).subscribe((resp) => {
-			console.log('resp', resp);
+			console.log('sendVoteStackOfPoll resp', resp);
 
 			if (resp) {
 				this.api.getPollBySlug(this.poll.custom_url);

src/app/shared/components/feedback/feedback.component.scss

@@ -1,6 +1,6 @@
 :host {
 	position: fixed;
-	bottom: 1em;
+	bottom: 4em;
 	right: 1em;
 	color: white;
 	.feedback-choices {

src/environments/environment.prod.ts

@@ -3,7 +3,7 @@ const backendApiUrlsInDev = {
 	remote: 'https://framadate-api.cipherbliss.com/api/v1',
 };
 const apiV1 = {
-	baseHref: 'http://localhost:8000/api/v1',
+	baseHref: 'https://framadate-api.cipherbliss.com/api/v1',
 	api_new_poll: '/poll/',
 	api_get_poll: '/poll/{id}',
 	'api_test-mail-poll': '/api/v1/poll/mail/test-mail-poll/{emailChoice}',
@@ -12,6 +12,7 @@ const apiV1 = {
 
 export const environment = {
 	production: true,
+	display_routes: true,
 	autofill: true,
 	appTitle: 'FramaDate Funky',
 	appVersion: '2.1.0',

src/environments/environment.ts

@@ -18,7 +18,8 @@ const apiV1 = {
 };
 
 export const environment = {
-	production: false,
+	production: true,
+	display_routes: true,
 	autofill: true,
 	appTitle: 'FramaDate Funky',
 	appVersion: '2.1.0',