EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3320 routes: Define dynamic mainmenu routes

main
Noel De Martin 2020-11-02 15:16:40 +01:00
parent 1d9df66aad
commit 7a3dd22189
8 changed files with 101 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/app.module.ts
View File

@ -59,6 +59,7 @@ import { initCoreSyncDB } from '@services/sync.db';
import { CoreEmulatorModule } from '@core/emulator/emulator.module';
import { CoreLoginModule } from '@core/login/login.module';
import { CoreCoursesModule } from '@core/courses/courses.module';
import { CoreSettingsInitModule } from '@core/settings/settings-init.module';
import { setSingletonsInjector } from '@singletons/core.singletons';
@ -88,6 +89,7 @@ export function createTranslateLoader(http: HttpClient): TranslateHttpLoader {
CoreEmulatorModule,
CoreLoginModule,
CoreCoursesModule,
CoreSettingsInitModule,
],
providers: [
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },

74
src/app/core/mainmenu/mainmenu-routing.module.ts
View File

@ -12,36 +12,60 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { InjectionToken, Injector, ModuleWithProviders, NgModule } from '@angular/core';
import { RouterModule, ROUTES, Routes } from '@angular/router';
import { CoreArray } from '@/app/singletons/array';
import { CoreMainMenuPage } from './pages/menu/menu.page';
import { CoreMainMenuMorePage } from './pages/more/more.page';
const routes: Routes = [
{
path: '',
component: CoreMainMenuPage,
children: [
{
path: 'home', // @todo: Add this route dynamically.
loadChildren: () => import('./pages/home/home.page.module').then( m => m.CoreHomePageModule),
},
{
path: 'more',
children: [
{
path: '',
component: CoreMainMenuMorePage,
},
],
},
],
},
];
function buildMainMenuRoutes(injector: Injector): Routes {
const routes = CoreArray.flatten(injector.get<Routes[]>(MAIN_MENU_ROUTES, []));
return [
{
path: '',
component: CoreMainMenuPage,
children: [
{
path: 'home', // @todo: Add this route dynamically.
loadChildren: () => import('./pages/home/home.page.module').then(m => m.CoreHomePageModule),
},
{
path: 'more',
children: [
{
path: '',
component: CoreMainMenuMorePage,
},
...routes,
],
},
...routes,
// @todo handle 404.
],
},
];
}
export const MAIN_MENU_ROUTES = new InjectionToken('MAIN_MENU_ROUTES');
@NgModule({
imports: [RouterModule.forChild(routes)],
providers: [
{ provide: ROUTES, multi: true, useFactory: buildMainMenuRoutes, deps: [Injector] },
],
exports: [RouterModule],
})
export class CoreMainMenuRoutingModule {}
export class CoreMainMenuRoutingModule {
static forChild(routes: Routes): ModuleWithProviders<CoreMainMenuRoutingModule> {
return {
ngModule: CoreMainMenuRoutingModule,
providers: [
{ provide: MAIN_MENU_ROUTES, multi: true, useValue: routes },
],
};
}
}

20
src/app/core/mainmenu/pages/more/more.html
View File

@ -25,7 +25,7 @@
<ion-spinner></ion-spinner>
</ion-item>
<ion-item button *ngFor="let handler of handlers" [ngClass]="['core-moremenu-handler', handler.class || '']"
(click)="openHandler(handler)" title="{{ handler.title | translate }}" detail="true" details>
(click)="openHandler(handler)" title="{{ handler.title | translate }}" detail="true" detail>
<ion-icon [name]="handler.icon" slot="start"></ion-icon>
<ion-label>
<h2>{{ handler.title | translate}}</h2>
@ -36,55 +36,55 @@
</ion-item>
<ng-container *ngFor="let item of customItems">
<ion-item button *ngIf="item.type != 'embedded'" [href]="item.url" title="{{item.label}}" core-link
[capture]="item.type == 'app'" [inApp]="item.type == 'inappbrowser'" class="core-moremenu-customitem" details>
[capture]="item.type == 'app'" [inApp]="item.type == 'inappbrowser'" class="core-moremenu-customitem" detail>
<ion-icon [name]="item.icon" slot="start"></ion-icon>
<ion-label>
<h2>{{item.label}}</h2>
</ion-label>
</ion-item>
<ion-item button *ngIf="item.type == 'embedded'" (click)="openItem(item)" title="{{item.label}}"
class="core-moremenu-customitem" details>
class="core-moremenu-customitem" detail>
<ion-icon [name]="item.icon" slot="start"></ion-icon>
<ion-label>
<h2>{{item.label}}</h2>
</ion-label>
</ion-item>
</ng-container>
<ion-item button *ngIf="showScanQR" (click)="scanQR()" details>
<ion-item button *ngIf="showScanQR" (click)="scanQR()" detail>
<ion-icon name="fa-qrcode" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.scanqr' | translate }}</h2>
</ion-label>
</ion-item>
<ion-item button *ngIf="showWeb && siteInfo" [href]="siteInfo.siteurl" core-link autoLogin="yes"
title="{{ 'core.mainmenu.website' | translate }}" details>
title="{{ 'core.mainmenu.website' | translate }}" detail>
<ion-icon name="globe" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.mainmenu.website' | translate }}</h2>
</ion-label>
</ion-item>
<ion-item button *ngIf="showHelp" [href]="docsUrl" core-link autoLogin="no"
title="{{ 'core.mainmenu.help' | translate }}" details>
title="{{ 'core.mainmenu.help' | translate }}" detail>
<ion-icon name="help-buoy" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.mainmenu.help' | translate }}</h2>
</ion-label>
</ion-item>
<ion-item button (click)="openSitePreferences()" title="{{ 'core.settings.preferences' | translate }}" details>
<ion-item button (click)="openSitePreferences()" title="{{ 'core.settings.preferences' | translate }}" detail>
<ion-icon name="fa-wrench" slot="start"></ion-icon>
<ion-label>
<h2>{{ 'core.settings.preferences' | translate }}</h2>
</ion-label>
</ion-item>
<ion-item button (click)="logout()" title="{{ logoutLabel | translate }}" details>
<ion-item button (click)="logout()" title="{{ logoutLabel | translate }}" detail>
<ion-icon name="log-out" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ logoutLabel | translate }}</h2>
</ion-label>
</ion-item>
<ion-item-divider></ion-item-divider>
<ion-item button router-direction="forward" routerLink="/settings/app"
title="{{ 'core.settings.appsettings' | translate }}" details>
<ion-item button router-direction="forward" routerLink="settings"
title="{{ 'core.settings.appsettings' | translate }}" detail>
<ion-icon name="fa-cogs" slot="start"></ion-icon>
<ion-label>
<h2>{{ 'core.settings.appsettings' | translate }}</h2>

2
src/app/core/settings/pages/about/about.html
View File

@ -21,7 +21,7 @@
<ion-icon name="fa-user-shield" slot="start"></ion-icon>
<ion-label>{{ 'core.settings.privacypolicy' | translate }}</ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="openPage('deviceinfo')" detail>
<ion-item button class="ion-text-wrap" router-direction="forward" routerLink="deviceinfo" detail>
<ion-icon name="fa-mobile" slot="start"></ion-icon>
<ion-label>{{ 'core.settings.deviceinfo' | translate }}</ion-label>
</ion-item>

6
src/app/core/settings/pages/about/about.page.module.ts
View File

@ -28,6 +28,12 @@ const routes: Routes = [
path: '',
component: CoreSettingsAboutPage,
},
{
path: 'deviceinfo',
loadChildren: () =>
import('@core/settings/pages/deviceinfo/deviceinfo.page.module')
.then(m => m.CoreSettingsDeviceInfoPageModule),
},
];
@NgModule({

2
src/app/core/settings/pages/app/app.page.ts
View File

@ -59,7 +59,7 @@ export class CoreSettingsAppPage {
openSettings(page: string, params?: Params): void {
this.selectedPage = page;
// this.splitviewCtrl!.push(page, params);
this.router.navigate(['../'+page], { relativeTo: this.route, queryParams: params });
this.router.navigate([page], { relativeTo: this.route, queryParams: params });
}
}

31
src/app/core/settings/settings-init.module.ts 100644
View File

@ -0,0 +1,31 @@
// (C) Copyright 2015 Moodle Pty Ltd.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import { NgModule } from '@angular/core';
import { Routes } from '@angular/router';
import { CoreMainMenuRoutingModule } from '@core/mainmenu/mainmenu-routing.module';
const routes: Routes = [
{
path: 'settings',
loadChildren: () => import('@core/settings/settings.module').then(m => m.CoreSettingsModule),
},
];
@NgModule({
imports: [CoreMainMenuRoutingModule.forChild(routes)],
exports: [CoreMainMenuRoutingModule],
})
export class CoreSettingsInitModule {}

11
src/app/core/settings/settings-routing.module.ts
View File

@ -20,18 +20,9 @@ const routes: Routes = [
path: 'about',
loadChildren: () => import('./pages/about/about.page.module').then( m => m.CoreSettingsAboutPageModule),
},
{
path: 'deviceinfo',
loadChildren: () => import('./pages/deviceinfo/deviceinfo.page.module').then( m => m.CoreSettingsDeviceInfoPageModule),
},
{
path: 'app',
loadChildren: () => import('./pages/app/app.page.module').then( m => m.CoreSettingsAppPageModule),
},
{
path: '',
redirectTo: 'app',
pathMatch: 'full',
loadChildren: () => import('./pages/app/app.page.module').then( m => m.CoreSettingsAppPageModule),
},
];