meBarista_in_Ionic2/src/pages/home/home.html

<ion-header>
  <ion-navbar>   
    <ion-spinner #spinner [hidden]="!spinner_show" [paused]="!this.abc.scanning" (click)="this.abc.bt_discover()" style="float: right; margin-right: 1em; width: 1.5em; height: 1.5em;"></ion-spinner>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>Brewing</ion-title>
  </ion-navbar>
</ion-header>

<ion-content #content (window:orientationchange)="changeOrientation($event)">
  <div class="grid-container" [hidden]="!abc.connected">
    <div class="header">
      <h2>Boiler temperature</h2>
    </div>
    <div class="graph">      
      <canvas #lineCanvas></canvas>
    </div>
    <div class="temperature_label">
      <p>Current temperature:</p>
      <p>Target temperature:</p>
    </div>
    <div class="temperature_value">
      <p>{{ temperature }}</p>
      <p>{{ target_temperature }}</p>
    </div>    
    <div class="gauge-1">
      <h2>Boiler power</h2>      
      <div id="cpuSpeed" #powerGauge class="gauge-container"></div>
    </div>
    <div class="gauge-2" [hidden]="!shottimer_show">
      <h2>Shot timer</h2>
      <div id="cpuSpeed2" #timerGauge class="gauge-container"></div>
    </div>
  </div>
  <div class="grid-container" [hidden]="abc.connected">
    <div class="error">
      <span style="font-size: 4em">😢</span>
      <h2>Not connected</h2>
    </div>
  </div>
</ion-content>