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.

Oops, something went wrong.

This file was deleted.

Oops, something went wrong.

This file was deleted.

Oops, something went wrong.

This file was deleted.

Oops, something went wrong.
@@ -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>
No changes.
@@ -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>
No changes.
@@ -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>
No changes.
@@ -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() {}
}
Oops, something went wrong.

0 comments on commit 8d72854

Please sign in to comment.
You can’t perform that action at this time.