MOBILE-2761 mainmenu: Avoid reloading menu when going to phantom tab

main
Pau Ferrer Ocaña 2018-11-22 16:44:52 +01:00
parent 601508aefc
commit 8ccd5a65ae
6 changed files with 75 additions and 50 deletions

View File

@ -148,8 +148,15 @@ export class CoreIonTabsComponent extends Tabs implements OnDestroy {
// Tabs initialized. Force select the tab if it's not enabled. // Tabs initialized. Force select the tab if it's not enabled.
if (this.selectedDisabled && typeof this.selectedIndex != 'undefined') { if (this.selectedDisabled && typeof this.selectedIndex != 'undefined') {
const tab = this.getByIndex(this.selectedIndex); const tab = this.getByIndex(this.selectedIndex);
if (tab && (!tab.enabled)) {
if (tab && (!tab.enabled || !tab.show)) { this.select(tab);
}
} else {
// Select first tab on init.
const tab = this._tabs.find((tab) => {
return tab.enabled;
});
if (tab) {
this.select(tab); this.select(tab);
} }
} }
@ -170,17 +177,25 @@ export class CoreIonTabsComponent extends Tabs implements OnDestroy {
protected registerBackButtonAction(): void { protected registerBackButtonAction(): void {
this.unregisterBackButtonAction = this.appProvider.registerBackButtonAction(() => { this.unregisterBackButtonAction = this.appProvider.registerBackButtonAction(() => {
let tab = this.previousTab(true); let tab = this.previousTab(true);
if (tab) { if (tab) {
const selectedTab = this.getSelected(); const selectedTab = this.getSelected();
// Remove curent and previous tabs from history. // It can happen when the previous is a phantom tab.
this._selectHistory = this._selectHistory.filter((tabId) => { if (tab.id == selectedTab.id) {
return selectedTab.id != tabId && tab.id != tabId; tab = this.previousTab(true);
}); }
this.select(tab); if (tab) {
// Remove curent and previous tabs from history.
this._selectHistory = this._selectHistory.filter((tabId) => {
return selectedTab.id != tabId && tab.id != tabId;
});
return true; this.select(tab);
return true;
}
} else { } else {
const selected = this.getSelected(); const selected = this.getSelected();
if (selected && this.firstSelectedTab && selected.id != this.firstSelectedTab) { if (selected && this.firstSelectedTab && selected.id != this.firstSelectedTab) {
@ -188,7 +203,7 @@ export class CoreIonTabsComponent extends Tabs implements OnDestroy {
this._selectHistory = []; this._selectHistory = [];
tab = this._tabs.find((t) => { return t.id === this.firstSelectedTab; }); tab = this._tabs.find((t) => { return t.id === this.firstSelectedTab; });
if (tab && tab.enabled && tab.show) { if (tab && tab.enabled) {
this.select(tab); this.select(tab);
return true; return true;
@ -250,6 +265,23 @@ export class CoreIonTabsComponent extends Tabs implements OnDestroy {
} }
} }
/**
* Select a tab by Index. First it will reset the status of the tab.
*
* @param {number} index Index of the tab.
*/
selectTabRootByIndex(index: number): void {
const tab = this.getByIndex(index);
if (tab) {
tab.goToRoot({animate: false, updateUrl: true, isNavRoot: true}).then(() => {
// Tab not previously selected. Select it after going to root.
if (!tab.isSelected) {
this.select(tab, {animate: false, updateUrl: true, isNavRoot: true});
}
});
}
}
/** /**
* Component destroyed. * Component destroyed.
*/ */

View File

@ -24,7 +24,7 @@ import { CoreCourseProvider } from '@core/course/providers/course';
export class CoreCourseLogCronHandler implements CoreCronHandler { export class CoreCourseLogCronHandler implements CoreCronHandler {
name = 'CoreCourseLogCronHandler'; name = 'CoreCourseLogCronHandler';
constructor(private coreProvider: CoreCourseProvider, private sitesProvider: CoreSitesProvider) {} constructor(private courseProvider: CoreCourseProvider, private sitesProvider: CoreSitesProvider) {}
/** /**
* Execute the process. * Execute the process.
@ -35,7 +35,7 @@ export class CoreCourseLogCronHandler implements CoreCronHandler {
*/ */
execute(siteId?: string): Promise<any> { execute(siteId?: string): Promise<any> {
return this.sitesProvider.getSite(siteId).then((site) => { return this.sitesProvider.getSite(siteId).then((site) => {
return this.coreProvider.logView(site.getSiteHomeId(), undefined, site.getId()); return this.courseProvider.logView(site.getSiteHomeId(), undefined, site.getId());
}); });
} }

View File

@ -611,11 +611,7 @@ export class CoreLoginHelperProvider {
* @param {any} params Params to pass to the page. * @param {any} params Params to pass to the page.
*/ */
protected loadPageInMainMenu(page: string, params: any): void { protected loadPageInMainMenu(page: string, params: any): void {
// Due to DeepLinker, we need to remove the path from the URL before going to main menu. this.eventsProvider.trigger(CoreEventsProvider.LOAD_PAGE_MAIN_MENU, { redirectPage: page, redirectParams: params });
// IonTabs checks the URL to determine which path to load for deep linking, so we clear the URL.
this.location.replaceState('');
this.appProvider.getRootNavController().setRoot('CoreMainMenuPage', { redirectPage: page, redirectParams: params });
} }
/** /**

View File

@ -1,4 +1,4 @@
<core-ion-tabs #mainTabs [hidden]="!showTabs" [loaded]="loaded" [selectedIndex]="initialTab" [selectedDisabled]="!!redirectPage" tabsPlacement="bottom" tabsLayout="title-hide"> <core-ion-tabs #mainTabs [hidden]="!showTabs" [loaded]="loaded" tabsPlacement="bottom" tabsLayout="title-hide">
<core-ion-tab [enabled]="false" [show]="false" [root]="redirectPage" [rootParams]="redirectParams"></core-ion-tab> <core-ion-tab [enabled]="false" [show]="false" [root]="redirectPage" [rootParams]="redirectParams"></core-ion-tab>
<core-ion-tab *ngFor="let tab of tabs" [root]="tab.page" [rootParams]="tab.pageParams" [tabTitle]="tab.title | translate" [tabIcon]="tab.icon" [tabBadge]="tab.badge" class="{{tab.class}}"></core-ion-tab> <core-ion-tab *ngFor="let tab of tabs" [root]="tab.page" [rootParams]="tab.pageParams" [tabTitle]="tab.title | translate" [tabIcon]="tab.icon" [tabBadge]="tab.badge" class="{{tab.class}}"></core-ion-tab>
<core-ion-tab root="CoreMainMenuMorePage" [tabTitle]="'core.more' | translate" tabIcon="more"></core-ion-tab> <core-ion-tab root="CoreMainMenuMorePage" [tabTitle]="'core.more' | translate" tabIcon="more"></core-ion-tab>

View File

@ -12,9 +12,11 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
import { Component, OnDestroy } from '@angular/core'; import { Component, OnDestroy, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular'; import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { CoreSitesProvider } from '@providers/sites'; import { CoreSitesProvider } from '@providers/sites';
import { CoreEventsProvider } from '@providers/events';
import { CoreIonTabsComponent } from '@components/ion-tabs/ion-tabs';
import { CoreMainMenuProvider } from '../../providers/mainmenu'; import { CoreMainMenuProvider } from '../../providers/mainmenu';
import { CoreMainMenuDelegate, CoreMainMenuHandlerToDisplay } from '../../providers/delegate'; import { CoreMainMenuDelegate, CoreMainMenuHandlerToDisplay } from '../../providers/delegate';
@ -31,16 +33,15 @@ export class CoreMainMenuPage implements OnDestroy {
loaded = false; loaded = false;
redirectPage: string; redirectPage: string;
redirectParams: any; redirectParams: any;
initialTab: number;
showTabs = false; showTabs = false;
protected subscription; protected subscription;
protected redirectPageLoaded = false; protected redirectObs: any;
@ViewChild('mainTabs') mainTabs: CoreIonTabsComponent;
constructor(private menuDelegate: CoreMainMenuDelegate, private sitesProvider: CoreSitesProvider, navParams: NavParams, constructor(private menuDelegate: CoreMainMenuDelegate, private sitesProvider: CoreSitesProvider, navParams: NavParams,
private navCtrl: NavController) { private navCtrl: NavController, private eventsProvider: CoreEventsProvider) {
this.redirectPage = navParams.get('redirectPage');
this.redirectParams = navParams.get('redirectParams');
} }
/** /**
@ -55,6 +56,27 @@ export class CoreMainMenuPage implements OnDestroy {
this.showTabs = true; this.showTabs = true;
this.redirectObs = this.eventsProvider.on(CoreEventsProvider.LOAD_PAGE_MAIN_MENU, (data) => {
// Check if the redirect page is the root page of any of the tabs.
const i = this.tabs.findIndex((tab, i) => {
return tab.page == data.redirectPage;
});
if (i >= 0) {
// Tab found. Set the params.
this.tabs[i].pageParams = Object.assign({}, data.redirectParams);
} else {
// Tab not found, use a phantom tab.
this.redirectPage = data.redirectPage;
this.redirectParams = data.redirectParams;
}
setTimeout(() => {
// Let the tab load the params before navigating.
this.mainTabs.selectTabRootByIndex(i + 1);
});
});
this.subscription = this.menuDelegate.getHandlers().subscribe((handlers) => { this.subscription = this.menuDelegate.getHandlers().subscribe((handlers) => {
// Remove the handlers that should only appear in the More menu. // Remove the handlers that should only appear in the More menu.
handlers = handlers.filter((handler) => { handlers = handlers.filter((handler) => {
@ -83,33 +105,6 @@ export class CoreMainMenuPage implements OnDestroy {
return b.priority - a.priority; return b.priority - a.priority;
}); });
if (typeof this.initialTab == 'undefined' && !this.loaded) {
this.initialTab = 0;
// Calculate the tab to load.
if (this.redirectPage) {
// Check if the redirect page is the root page of any of the tabs.
const i = this.tabs.findIndex((tab, i) => {
return tab.page == this.redirectPage;
});
if (i >= 0) {
// Tab found. Set the params and unset the redirect page.
this.initialTab = i + 1;
this.tabs[i].pageParams = Object.assign(this.tabs[i].pageParams || {}, this.redirectParams);
this.redirectPage = null;
this.redirectParams = null;
}
} else {
const i = handlers.findIndex((handler, i) => {
return handler.name == 'CoreDashboard';
});
if (i >= 0) {
this.initialTab = i;
}
}
}
this.loaded = this.menuDelegate.areHandlersLoaded(); this.loaded = this.menuDelegate.areHandlersLoaded();
}); });
} }
@ -119,5 +114,6 @@ export class CoreMainMenuPage implements OnDestroy {
*/ */
ngOnDestroy(): void { ngOnDestroy(): void {
this.subscription && this.subscription.unsubscribe(); this.subscription && this.subscription.unsubscribe();
this.redirectObs && this.redirectObs.off();
} }
} }

View File

@ -57,6 +57,7 @@ export class CoreEventsProvider {
static KEYBOARD_CHANGE = 'keyboard_change'; static KEYBOARD_CHANGE = 'keyboard_change';
static CORE_LOADING_CHANGED = 'core_loading_changed'; static CORE_LOADING_CHANGED = 'core_loading_changed';
static ORIENTATION_CHANGE = 'orientation_change'; static ORIENTATION_CHANGE = 'orientation_change';
static LOAD_PAGE_MAIN_MENU = 'load_page_main_menu';
protected logger; protected logger;
protected observables: { [s: string]: Subject<any> } = {}; protected observables: { [s: string]: Subject<any> } = {};