Skip to content
Permalink
Browse files
Add navigation menus (#4)
  • Loading branch information
AlanCrevon committed May 1, 2019
1 parent 16da523 commit 8d72854133f023d8760e14b292950ac5ef7fc0fb
Showing with 635 additions and 77 deletions.
  1. +16 −6 src/app/app-routing.module.ts
  2. +36 −1 src/app/app.component.html
  3. +4 −0 src/app/app.component.scss
  4. +6 −4 src/app/app.component.ts
  5. +3 −9 src/app/app.module.ts
  6. +0 −23 src/app/home/home.module.ts
  7. +0 −14 src/app/home/home.page.html
  8. +0 −1 src/app/home/home.page.scss
  9. +0 −10 src/app/home/home.page.ts
  10. +21 −0 src/app/pages/tabs/pages/boxes/boxes.module.ts
  11. +7 −0 src/app/pages/tabs/pages/boxes/boxes.page.html
  12. 0 src/app/pages/tabs/pages/boxes/boxes.page.scss
  13. +8 −9 src/app/{home/home.page.spec.ts → pages/tabs/pages/boxes/boxes.page.spec.ts}
  14. +12 −0 src/app/pages/tabs/pages/boxes/boxes.page.ts
  15. +21 −0 src/app/pages/tabs/pages/chats/chats.module.ts
  16. +7 −0 src/app/pages/tabs/pages/chats/chats.page.html
  17. 0 src/app/pages/tabs/pages/chats/chats.page.scss
  18. +26 −0 src/app/pages/tabs/pages/chats/chats.page.spec.ts
  19. +12 −0 src/app/pages/tabs/pages/chats/chats.page.ts
  20. +21 −0 src/app/pages/tabs/pages/me/me.module.ts
  21. +7 −0 src/app/pages/tabs/pages/me/me.page.html
  22. 0 src/app/pages/tabs/pages/me/me.page.scss
  23. +26 −0 src/app/pages/tabs/pages/me/me.page.spec.ts
  24. +12 −0 src/app/pages/tabs/pages/me/me.page.ts
  25. +21 −0 src/app/pages/tabs/pages/moderate/moderate.module.ts
  26. +7 −0 src/app/pages/tabs/pages/moderate/moderate.page.html
  27. 0 src/app/pages/tabs/pages/moderate/moderate.page.scss
  28. +26 −0 src/app/pages/tabs/pages/moderate/moderate.page.spec.ts
  29. +12 −0 src/app/pages/tabs/pages/moderate/moderate.page.ts
  30. +21 −0 src/app/pages/tabs/pages/shared/shared.module.ts
  31. +7 −0 src/app/pages/tabs/pages/shared/shared.page.html
  32. 0 src/app/pages/tabs/pages/shared/shared.page.scss
  33. +26 −0 src/app/pages/tabs/pages/shared/shared.page.spec.ts
  34. +12 −0 src/app/pages/tabs/pages/shared/shared.page.ts
  35. +21 −0 src/app/pages/tabs/pages/wanted/wanted.module.ts
  36. +7 −0 src/app/pages/tabs/pages/wanted/wanted.page.html
  37. 0 src/app/pages/tabs/pages/wanted/wanted.page.scss
  38. +26 −0 src/app/pages/tabs/pages/wanted/wanted.page.spec.ts
  39. +12 −0 src/app/pages/tabs/pages/wanted/wanted.page.ts
  40. +45 −0 src/app/pages/tabs/tabs.module.ts
  41. +8 −0 src/app/pages/tabs/tabs.page.html
  42. 0 src/app/pages/tabs/tabs.page.scss
  43. +26 −0 src/app/pages/tabs/tabs.page.spec.ts
  44. +27 −0 src/app/pages/tabs/tabs.page.ts
  45. +12 −0 src/app/services/navigation.service.spec.ts
  46. +74 −0 src/app/services/navigation.service.ts
@@ -2,14 +2,24 @@ import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'home', loadChildren: './home/home.module#HomePageModule' },
{
path: '',
redirectTo: 'app/shared',
pathMatch: 'full'
},
{
path: 'app',
redirectTo: 'app/shared',
pathMatch: 'full'
},
{
path: 'app',
loadChildren: './pages/tabs/tabs.module#TabsPageModule'
}
];

@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
imports: [RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })],
exports: [RouterModule]
})
export class AppRoutingModule { }
export class AppRoutingModule {}
@@ -1,3 +1,38 @@
<ion-app>
<ion-router-outlet></ion-router-outlet>
<ion-split-pane>
<ion-menu>
<ion-content>
<ion-list>
<ion-menu-toggle auto-hide="false" *ngFor="let appPage of navigationService.appPages">
<ion-item routerDirection="root" [routerLink]="appPage.url" color="primary">
<ion-icon slot="start" [name]="appPage.icon"></ion-icon>
<ion-label>
{{ appPage.title }}
</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<ion-router-outlet main></ion-router-outlet>
</ion-split-pane>

<ion-fab horizontal="end" vertical="top" slot="fixed">
<ion-fab-button color="secondary">
<ion-icon name="menu"></ion-icon>
</ion-fab-button>
<ion-fab-list side="bottom">
<ion-button
*ngFor="let infoPage of navigationService.infoPages"
[href]="infoPage.href ? infoPage.href : null"
[routerLink]="infoPage.routerLink ? infoPage.routerLink : null"
color="medium"
shape="round"
fill="outline"
>
<ion-icon [name]="infoPage.icon" slot="end"></ion-icon>
<ion-label>{{ infoPage.title }}</ion-label>
</ion-button>
</ion-fab-list>
</ion-fab>
</ion-app>
@@ -0,0 +1,4 @@
ion-fab-list {
right: 0;
align-items: flex-end;
}
@@ -1,18 +1,20 @@
import { Component } from '@angular/core';

import { Platform } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { Platform } from '@ionic/angular';
import { NavigationService } from './services/navigation.service';

@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
templateUrl: 'app.component.html',
styleUrls: ['app.component.scss']
})
export class AppComponent {
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar
private statusBar: StatusBar,
public navigationService: NavigationService
) {
this.initializeApp();
}
@@ -1,23 +1,17 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
providers: [StatusBar, SplashScreen, { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
bootstrap: [AppComponent]
})
export class AppModule {}

This file was deleted.

This file was deleted.

This file was deleted.

This file was deleted.

@@ -0,0 +1,21 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { BoxesPage } from './boxes.page';

const routes: Routes = [
{
path: '',
component: BoxesPage
}
];

@NgModule({
imports: [CommonModule, FormsModule, IonicModule, RouterModule.forChild(routes)],
declarations: [BoxesPage]
})
export class BoxesPageModule {}
@@ -0,0 +1,7 @@
<ion-header>
<ion-toolbar>
<ion-title>boxes</ion-title>
</ion-toolbar>
</ion-header>

<ion-content> </ion-content>
Empty file.
@@ -1,22 +1,21 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { HomePage } from './home.page';
import { BoxesPage } from './boxes.page';

describe('HomePage', () => {
let component: HomePage;
let fixture: ComponentFixture<HomePage>;
describe('BoxesPage', () => {
let component: BoxesPage;
let fixture: ComponentFixture<BoxesPage>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ HomePage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
declarations: [BoxesPage],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
}).compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(HomePage);
fixture = TestBed.createComponent(BoxesPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
@@ -0,0 +1,12 @@
import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-boxes',
templateUrl: './boxes.page.html',
styleUrls: ['./boxes.page.scss']
})
export class BoxesPage implements OnInit {
constructor() {}

ngOnInit() {}
}
@@ -0,0 +1,21 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { ChatsPage } from './chats.page';

const routes: Routes = [
{
path: '',
component: ChatsPage
}
];

@NgModule({
imports: [CommonModule, FormsModule, IonicModule, RouterModule.forChild(routes)],
declarations: [ChatsPage]
})
export class ChatsPageModule {}
@@ -0,0 +1,7 @@
<ion-header>
<ion-toolbar>
<ion-title>chats</ion-title>
</ion-toolbar>
</ion-header>

<ion-content> </ion-content>
Empty file.
@@ -0,0 +1,26 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { ChatsPage } from './chats.page';

describe('ChatsPage', () => {
let component: ChatsPage;
let fixture: ComponentFixture<ChatsPage>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ChatsPage],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
}).compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(ChatsPage);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,12 @@
import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-chats',
templateUrl: './chats.page.html',
styleUrls: ['./chats.page.scss']
})
export class ChatsPage implements OnInit {
constructor() {}

ngOnInit() {}
}
@@ -0,0 +1,21 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { MePage } from './me.page';

const routes: Routes = [
{
path: '',
component: MePage
}
];

@NgModule({
imports: [CommonModule, FormsModule, IonicModule, RouterModule.forChild(routes)],
declarations: [MePage]
})
export class MePageModule {}
@@ -0,0 +1,7 @@
<ion-header>
<ion-toolbar>
<ion-title>me</ion-title>
</ion-toolbar>
</ion-header>

<ion-content> </ion-content>
Empty file.
@@ -0,0 +1,26 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { MePage } from './me.page';

describe('MePage', () => {
let component: MePage;
let fixture: ComponentFixture<MePage>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [MePage],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
}).compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(MePage);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,12 @@
import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-me',
templateUrl: './me.page.html',
styleUrls: ['./me.page.scss']
})
export class MePage implements OnInit {
constructor() {}

ngOnInit() {}
}
Loading

0 comments on commit 8d72854

Please sign in to comment.