tykayn
/
funky-framadate-front
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front
1
1
Fork 0
Code Issues Projects Releases Wiki Activity

🐛 select lang wigthout lifecycle bug

Browse Source
creation-form
tykayn 2 years ago committed by Baptiste Lemoine
parent 60eeddbf21
commit 10c1930e4d
15 changed files with 112 additions and 51 deletions
Show Stats Download Patch File Download Diff File

14
lokalize-scripts/scripts.rc
Unescape View File

@ -0,0 +1,14 @@
<!--
Collection name attribute represents the name of the menu, e.g., to use menu "File" use "file" or "Help" use "help". You can add new menus.
If you type a relative script file beware that this script is located in $XDG_DATA_HOME/applicationname/
The following example adds an action with the text "Export..." into the "File" menu
<KrossScripting>
<collection name="file" text="File" comment="File menu">
<script name="export" text="Export..." comment="Export content" file="export.py" />
</collection>
</KrossScripting>
-->

4
src/app/app.module.ts
Unescape View File

@ -52,7 +52,7 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
NgxWebstorageModule.forRoot({ prefix: environment.localStorage.key }),
SharedModule,
TranslateModule.forRoot({
defaultLanguage: 'fr',
defaultLanguage: 'FR',
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
@ -62,7 +62,7 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
provide: MissingTranslationHandler,
useClass: MyMissingTranslationHandler,
},
useDefaultLang: false,
useDefaultLang: true,
}),
],
providers: [Title, TranslateService],

7
src/app/core/components/header/header.component.html
Unescape View File

@ -19,6 +19,8 @@
aria-label="menu"
aria-expanded="false"
data-target="navbarBasicExample"
[ngClass]="{ 'bg-primary': mobileMenuVisible }"
(click)="mobileMenuVisible = !mobileMenuVisible"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
@ -34,10 +36,15 @@
</div>
<div class="navbar-end">
<app-language-selector></app-language-selector>
<app-theme-selector></app-theme-selector>
<a class="navbar-item btn btn-primary" routerLink="user/polls" routerLinkActive="is-active">
<i class="fa fa-user"></i> {{ 'config.find_my_polls' | translate }}
</a>
</div>
</div>
<div class="mobile-menu" *ngIf="mobileMenuVisible">
menu mobile
</div>
</nav>
</header>

3
src/app/core/components/header/header.component.ts
Unescape View File

@ -17,8 +17,9 @@ export class HeaderComponent implements OnInit {
public env = environment;
@Input() public appTitle: string = 'FramaDate Funky';
@Input() public appLogo: string;
mobileMenuVisible = false;
constructor(private userService: UserService, private modalService: ModalService) {}
constructor(private userService: UserService) {}
public ngOnInit(): void {}
}

47
src/app/core/components/sibebar/navigation/navigation.component.html
Unescape View File

@ -2,9 +2,6 @@
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link"> Tous les sondages </a>
<div class="navbar-dropdown">
<a class="navbar-item" routerLink="/poll/inexistentPoll/consultation" routerLinkActive="is-active">
« inexistentPoll »
</a>
<a
class="navbar-item"
*ngFor="let poll of _pollsAvailables | async"
@ -18,7 +15,7 @@
<hr />
<div class="navbar-item has-dropdown is-hoverable">
<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">
@ -34,28 +31,32 @@
Participation
</a>
</div>
</div>
<hr />
<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>
<a class="button is-block" routerLink="oldstuff/step/home" routerLinkActive="active">
<i class="fa fa-home" aria-hidden="true"></i> Accueil
</a>
<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 />
<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/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 class="button is-block" routerLink="oldstuff/step/home" routerLinkActive="active">
<i class="fa fa-home" aria-hidden="true"></i> Accueil
</a>
<a class="button is-block" routerLink="oldstuff/graphic/toto" routerLinkActive="active"> Graphique </a>
</nav>

2
src/app/core/components/sibebar/navigation/navigation.component.ts
Unescape View File

@ -3,6 +3,7 @@ import { Observable } from 'rxjs';
import { Poll } from '../../../models/poll.model';
import { MockingService } from '../../../services/mocking.service';
import { environment } from '../../../../../environments/environment';
@Component({
selector: 'app-navigation',
@ -11,6 +12,7 @@ import { MockingService } from '../../../services/mocking.service';
})
export class NavigationComponent implements OnInit {
public _pollsAvailables: Observable<Poll[]> = this.mockingService.pollsAvailables;
public devModeEnabled = !environment.production;
constructor(private mockingService: MockingService) {}

3
src/app/core/core.module.ts
Unescape View File

@ -10,10 +10,11 @@ import { HomeComponent } from './components/home/home.component';
import { LogoComponent } from './components/logo/logo.component';
import { NavigationComponent } from './components/sibebar/navigation/navigation.component';
import { throwIfAlreadyLoaded } from './guards/module-import.guard';
import { SharedModule } from '../shared/shared.module';
@NgModule({
declarations: [FooterComponent, HeaderComponent, HomeComponent, LogoComponent, NavigationComponent],
imports: [CommonModule, FormsModule, RouterModule, TranslateModule],
imports: [CommonModule, FormsModule, RouterModule, TranslateModule, SharedModule],
exports: [HeaderComponent, FooterComponent, NavigationComponent, LogoComponent],
})
export class CoreModule {

15
src/app/core/enums/language.enum.ts
Unescape View File

@ -1,4 +1,15 @@
export enum Language {
FR = 'FR',
EN = 'EN',
FR = 'fr',
// BR = 'br',
// CA = 'ca',
// DE = 'de',
// EL = 'el',
EN = 'en',
// ES = 'es',
// GL = 'gl',
// HU = 'hu',
// IT = 'it',
// NL = 'nl',
// OC = 'oc',
// SV = 'sv',
}

6
src/app/core/services/language.service.ts
Unescape View File

@ -15,7 +15,7 @@ export class LanguageService {
}
public setLanguage(language: Language): void {
this.translate.use(language.toString().toUpperCase());
this.translate.use(language.toString());
}
public getAvailableLanguages(): string[] {
@ -48,17 +48,19 @@ export class LanguageService {
// set default language
if (!this.translate.currentLang) {
this.setLanguage(Language.EN);
this.setLanguage(Language.FR);
}
}
private setLanguageFromStorage(): void {
console.log('this.storageService.language', this.storageService.language);
if (this.storageService.language && this.translate.getLangs().includes(this.storageService.language)) {
this.setLanguage(this.storageService.language);
}
}
private setLanguageFromBrowser(): void {
const currentBrowserLanguage: Language = this.translate.getBrowserLang().toUpperCase() as Language;
console.log('currentBrowserLanguage', currentBrowserLanguage);
if (this.translate.getLangs().includes(currentBrowserLanguage)) {
this.setLanguage(currentBrowserLanguage);
}

4
src/app/features/administration/form/form.component.html
Unescape View File

@ -1,8 +1,8 @@
<div class="admin-form">
<h1 i18n>
<h1>
{{ 'creation.title' | translate }}
</h1>
<span class="pre-selector" i18n>
<span class="pre-selector">
{{ 'creation.want' | translate }}
</span>
<button class="btn btn--warning" (click)="askInitFormDefault()">

21
src/app/shared/components/selectors/language-selector/language-selector.component.html
Unescape View File

@ -1,14 +1,11 @@
<div class="columns">
<div class="column">
<p>Langue</p>
</div>
<div class="column">
<div class="buttons has-addons">
<select class="select" [(ngModel)]="currentLang">
<option *ngFor="let language of availableLanguages" value="{{ language }}">
{{ 'LANGUAGES.' + language | translate }}
</option>
</select>
</div>
<div class="selector">
<img src="assets/img/icone-langue.svg" alt="langue" />
<div class="buttons has-addons">
<label for="lang_selector" class="hidden">{{ 'selector.lang' | translate }}</label>
<select class="select" id="lang_selector" (change)="setLang()" [(ngModel)]="currentLang">
<option *ngFor="let language of availableLanguages" value="{{ language }}">
{{ language }} - {{ 'LANGUAGES.' + language | translate }}
</option>
</select>
</div>
</div>

4
src/app/shared/components/selectors/language-selector/language-selector.component.ts
Unescape View File

@ -10,7 +10,7 @@ import { LanguageService } from '../../../../core/services/language.service';
templateUrl: './language-selector.component.html',
styleUrls: ['./language-selector.component.scss'],
})
export class LanguageSelectorComponent implements OnInit, DoCheck {
export class LanguageSelectorComponent implements OnInit {
public currentLang: Language;
public availableLanguages: string[] = [];
@ -21,7 +21,7 @@ export class LanguageSelectorComponent implements OnInit, DoCheck {
this.currentLang = this.languageService.getLangage();
}
ngDoCheck(): void {
setLang(): void {
this.languageService.setLanguage(this.currentLang);
}
}

15
src/assets/i18n/en.json
Unescape View File

@ -134,7 +134,18 @@
"colorblindText": "colorblind."
},
"LANGUAGES": {
"FR": "Français",
"EN": "English"
"DE": "Allemand",
"FR": "French",
"BR": "Breton",
"CA": "Canadien",
"EL": "el",
"ES": "Espagnol",
"EN": "English",
"GL": "gl",
"HU": "hu",
"IT": "Italien",
"NL": "Néérlandais",
"OC": "oc",
"SV": "sv"
}
}

16
src/assets/i18n/fr.json
Unescape View File

@ -133,8 +133,22 @@
"choiceNotColorblind": "Je ne suis pas",
"colorblindText": "daltonien."
},
"selectors": {
"lang": "Sélectionner la langue"
},
"LANGUAGES": {
"DE": "Allemand",
"FR": "Français",
"EN": "English"
"BR": "Breton",
"CA": "Canadien",
"EL": "el",
"ES": "Espagnol",
"EN": "English",
"GL": "gl",
"HU": "hu",
"IT": "Italien",
"NL": "Néérlandais",
"OC": "oc",
"SV": "sv"
}
}

2
src/environments/environment.ts
Unescape View File

@ -9,7 +9,7 @@ const backendApiUrlsInDev = {
export const environment = {
production: false,
appTitle: 'FramaDate',
appTitle: 'FramaDate Funky',
appVersion: '2.0.0',
appLogo: 'assets/img/logo.png',
api: {

Write Preview
Loading…
Cancel
Save