diff --git a/src/app/components/languagetoggle/languagetoggle.component.html b/src/app/components/languagetoggle/languagetoggle.component.html
index 90a8339..15d6724 100644
--- a/src/app/components/languagetoggle/languagetoggle.component.html
+++ b/src/app/components/languagetoggle/languagetoggle.component.html
@@ -1 +1 @@
-
+
diff --git a/src/app/components/languagetoggle/languagetoggle.component.ts b/src/app/components/languagetoggle/languagetoggle.component.ts
index 1e70e33..84d6935 100644
--- a/src/app/components/languagetoggle/languagetoggle.component.ts
+++ b/src/app/components/languagetoggle/languagetoggle.component.ts
@@ -25,12 +25,14 @@ export class LanguagetoggleComponent implements OnInit {
}
ngOnInit() {
- this.route.pathFromRoot.forEach(p => {
- this.router.events.filter(e => e instanceof NavigationEnd).subscribe(e => {
- console.log('language toggle is detecting a navigation end: have to update values, things might have changed!');
- this.updateValues();
- });
+ // start listening to the stateservice for language updates
+ this.stateService.getLanguageObservable(this.route).subscribe(val => {
+ console.log('language toggle gets a language update from state service: ' + val);
+ this.show = (this.language === val);
+ console.log(' after language update, show: ' + this.show);
});
+
+
}
private updateValues() {
@@ -39,13 +41,15 @@ export class LanguagetoggleComponent implements OnInit {
console.log('languagetoggle: language is null from stateservice, ignoring');
return;
}
- console.log('languagetoggle gets lang: ' + lang);
+ console.log('languagetoggle (' + this.language + ') gets lang: ' + lang);
if (lang === this.language) {
console.log('languagetoggle: showing the component ' + lang);
this.show = true;
} else {
+ console.log('languagetoggle: NOT showing the component ' + lang);
this.show = false;
}
+ console.log(`show: ${this.show }`);
}
}
diff --git a/src/app/components/root/root.component.ts b/src/app/components/root/root.component.ts
index 69cf062..b2cba27 100644
--- a/src/app/components/root/root.component.ts
+++ b/src/app/components/root/root.component.ts
@@ -30,15 +30,18 @@ export class RootComponent implements OnInit {
/**
* Listen to changes in the param map (this is the root level, so will only see changes in 'language'. good!
*/
- this.route.paramMap.subscribe((paramMap: ParamMap) => {
- const language = paramMap.get('language');
- console.log(`root comp listens for parammap: ${language}`)
- // console.log('root: parammap changed ' + language);
- if (language !== null) {
- console.log('the subscriber of root changes the language to '+language);
- this.stateService.setLanguage(language, this.route, this.router);
- }
- });
+ // this.route.paramMap.subscribe((paramMap: ParamMap) => {
+ // const language = paramMap.get('language');
+ // console.log(`root comp listens for parammap: ${language}`)
+ // // console.log('root: parammap changed ' + language);
+ // if (language !== null) {
+ // console.log('the subscriber of root changes the language to '+language);
+ // this.stateService.setLanguage(language, this.route, this.router);
+ // }
+ // });
+
+ // set the service, we know that this route is the one we need for language changes (parameter), so we gotta keep track of it
+ this.stateService.setRootRoute(this.route);
// we listen to a 'navigation end' event -> at that point we need update our pagetype string
this.router.events.filter(event => event instanceof NavigationEnd).subscribe(event => {
diff --git a/src/app/services/state.service.ts b/src/app/services/state.service.ts
index 679efcd..3875db9 100644
--- a/src/app/services/state.service.ts
+++ b/src/app/services/state.service.ts
@@ -8,10 +8,11 @@ export class StateService {
// this keeps track of which type is enabled / disabled
private tagFilter: any = [];
private language: string;
+ private rootRoute: ActivatedRoute;
constructor(private router: Router) {
router.events.subscribe(event => {
- console.log('stateservice detects a route event!' + event);
+ // console.log('stateservice detects a route event!' + event);
});
}
@@ -93,9 +94,56 @@ export class StateService {
if (this.language !== language) {
console.log('setting language (triggers navigate): ' + language);
this.language = language;
- router.navigate([language]);
+
+ console.log('GOING TO NAVIGATE!');
+ console.log(this.rootRoute.url);
+
+ //ok, don't know how to do this cleanly... figure out 2 elements
+ //1: the language, we already know it
+ //2: the child path element, just get it from the rootroute
+ if (this.rootRoute.children.length !== 1) {
+ console.log('the root route has more than 1 child :/ NOT navigating now...');
+ console.log(this.rootRoute.children);
+ } else {
+ const childRoute = this.rootRoute.children[0];
+ // console.log('childroute: ' + childRoute.toString() + ' ' + childRoute.url.toString());
+ // console.log(childRoute);
+ const navigationpath = new Array();
+ navigationpath.push(language);
+ childRoute.url.forEach(segments => {
+ // console.log('url segments');
+ // console.log(segments);
+ //add each of these segments to the navigation path
+ segments.forEach(s => navigationpath.push(s.path.toString()));
+ });
+ // console.log('OUR navigation path');
+ // console.log(navigationpath);
+ //actually navigate!
+ this.router.navigate(navigationpath);
+ }
+
+ this.rootRoute.pathFromRoot.forEach(p => console.log(p));
+ this.rootRoute.firstChild.fragment.subscribe(val => {
+ console.log('rootRoute.firstChild.fragment: ' + val);
+ });
+
+ // router.navigate([language]);
} else {
console.log('setting language did nothing: no navigation.')
}
}
+
+ getLanguageObservable(route: ActivatedRoute) {
+ return this.rootRoute.paramMap.map(map => map.get('language'));
+ }
+
+ setRootRoute(route: ActivatedRoute) {
+ this.rootRoute = route;
+ this.rootRoute.paramMap.map(map => map.get('language')).filter(l => l !== null).subscribe(l => {
+ this.language = l;
+ console.log('stateservice updated its internal lang value to ' + this.language);
+ }
+ )
+ ;
+ }
}