import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage:any = 'HomePage';
  fichaMedica:any = 'FichaMedicaPage';
  historico:any = 'HistoricoPage';
  medicos:any = 'MedicosPage';
  cartao:any = 'CartaoPage';
  sobre:any = 'SobrePage';
  inicio:any = 'HomePage';

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }

  openPage(page){
    this.rootPage = page;
  }

}

<ion-menu [content]="content" class="menu-principal">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <button ion-item (click)="openPage(inicio)" menuClose>
            <img name="img-ficha-medica" src="./assets/icon/menu/inicio.png" float-left class="app-icons">  <span float-left>Início</span>
      </button>
      <button ion-item (click)="openPage(fichaMedica)" menuClose>
          <img name="img-ficha-medica" src="./assets/icon/menu/ficha-medica.png" float-left class="app-icons">  <span float-left>Ficha Médica</span>
      </button>
      <button ion-item (click)="openPage(historico)" menuClose>
         <img name="img-historico" src="./assets/icon/menu/historico.png" float-left class="app-icons">  <span float-left>Histórico</span>
      </button>
      <button ion-item (click)="openPage(medicos)" menuClose>
        <img name="img-medicos" src="./assets/icon/menu/medico.png" float-left class="app-icons">  <span float-left>Médicos</span>
      </button>
      <button ion-item (click)="openPage(cartao)" menuClose>
        <img name="img-cartao" src="./assets/icon/menu/cartao.png" float-left class="app-icons">  <span float-left>Cartão</span>
      </button>
      <button ion-item (click)="openPage(sobre)" menuClose>
        <img name="img-sobre" src="./assets/icon/menu/sobre.png" float-left class="app-icons">  <span float-left>Sobre</span>
      </button>
    </ion-list>
  </ion-content>
</ion-menu>

<ion-nav id="nav" #content [root]="rootPage"></ion-nav>