MOBILE-2567 splitview: Change side when changing language

main
Dani Palou 2018-09-07 11:44:50 +02:00
parent 081c1555a6
commit 39e473e783
2 changed files with 18 additions and 3 deletions

View File

@ -1,5 +1,5 @@
<ion-split-pane (ionChange)="onSplitPaneChanged($event._visible);" [when]="when"> <ion-split-pane (ionChange)="onSplitPaneChanged($event._visible);" [when]="when">
<ion-menu [content]="detailNav" type="push" class="core-avoid-header"> <ion-menu [content]="detailNav" type="push" class="core-avoid-header" [side]="side" #menu>
<ng-content></ng-content> <ng-content></ng-content>
</ion-menu> </ion-menu>
<ion-nav [root]="detailPage" #detailNav main class="core-avoid-header"></ion-nav> <ion-nav [root]="detailPage" #detailNav main class="core-avoid-header"></ion-nav>

View File

@ -15,7 +15,8 @@
// Code based on https://github.com/martinpritchardelevate/ionic-split-pane-demo // Code based on https://github.com/martinpritchardelevate/ionic-split-pane-demo
import { Component, ViewChild, Input, ElementRef, OnInit, Optional, OnDestroy } from '@angular/core'; import { Component, ViewChild, Input, ElementRef, OnInit, Optional, OnDestroy } from '@angular/core';
import { NavController, Nav, ViewController } from 'ionic-angular'; import { NavController, Nav, ViewController, Platform, Menu } from 'ionic-angular';
import { TranslateService } from '@ngx-translate/core';
import { CoreFileUploaderProvider } from '@core/fileuploader/providers/fileuploader'; import { CoreFileUploaderProvider } from '@core/fileuploader/providers/fileuploader';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
@ -45,7 +46,9 @@ import { Subscription } from 'rxjs';
export class CoreSplitViewComponent implements OnInit, OnDestroy { export class CoreSplitViewComponent implements OnInit, OnDestroy {
@ViewChild('detailNav') detailNav: Nav; @ViewChild('detailNav') detailNav: Nav;
@ViewChild('menu') menu: Menu;
@Input() when?: string | boolean = 'md'; @Input() when?: string | boolean = 'md';
protected isEnabled = false; protected isEnabled = false;
protected masterPageName = ''; protected masterPageName = '';
protected masterPageIndex = 0; protected masterPageIndex = 0;
@ -56,16 +59,27 @@ export class CoreSplitViewComponent implements OnInit, OnDestroy {
protected originalMasterCanLeave: Function; protected originalMasterCanLeave: Function;
protected ignoreSplitChanged = false; protected ignoreSplitChanged = false;
protected audioCaptureSubscription: Subscription; protected audioCaptureSubscription: Subscription;
protected languageChangedSubscription: Subscription;
// Empty placeholder for the 'detail' page. // Empty placeholder for the 'detail' page.
detailPage: any = null; detailPage: any = null;
side: string;
constructor(@Optional() private masterNav: NavController, element: ElementRef, fileUploaderProvider: CoreFileUploaderProvider) { constructor(@Optional() private masterNav: NavController, element: ElementRef, fileUploaderProvider: CoreFileUploaderProvider,
platform: Platform, translate: TranslateService) {
this.element = element.nativeElement; this.element = element.nativeElement;
this.audioCaptureSubscription = fileUploaderProvider.onAudioCapture.subscribe((starting) => { this.audioCaptureSubscription = fileUploaderProvider.onAudioCapture.subscribe((starting) => {
this.ignoreSplitChanged = starting; this.ignoreSplitChanged = starting;
}); });
// Change the side when the language changes.
this.languageChangedSubscription = translate.onLangChange.subscribe((event: any) => {
setTimeout(() => {
this.side = platform.isRTL ? 'right' : 'left';
this.menu.setElementAttribute('side', this.side);
});
});
} }
/** /**
@ -244,5 +258,6 @@ export class CoreSplitViewComponent implements OnInit, OnDestroy {
ngOnDestroy(): void { ngOnDestroy(): void {
this.detailsDidEnterSubscription && this.detailsDidEnterSubscription.unsubscribe(); this.detailsDidEnterSubscription && this.detailsDidEnterSubscription.unsubscribe();
this.audioCaptureSubscription.unsubscribe(); this.audioCaptureSubscription.unsubscribe();
this.languageChangedSubscription.unsubscribe();
} }
} }