annotate src/app/app.component.html @ 149:38abcb4830f1

Use tick layer instead of marker layer for instants (it's faster)

<md-toolbar color="primary">
  <md-icon svgIcon="duck"></md-icon>

  <span class="app-toolbar-filler"></span>

  <app-playback-control></app-playback-control>
  <ugly-recording-control
    (finishedRecording)="onFileOpened($event)"
  ></ugly-recording-control>

  <!-- This fills the remaining space of the current row -->
  <span class="app-toolbar-filler"></span>


  <app-audio-file-open (fileOpened)="onFileOpened($event)"></app-audio-file-open>
  <!-- menu opens when trigger button is clicked -->
  <button md-icon-button (click)="sidenav.toggle()">
    <md-icon>extension</md-icon>
  </button>
</md-toolbar>

<md-sidenav-container>
  <md-sidenav #sidenav align="start" mode="over">
    <app-feature-extraction-menu
      (requestOutput)="extractFeatures($event)"
      [disabled]="!canExtract">
    </app-feature-extraction-menu>
  </md-sidenav>
  <app-waveform
    [audioBuffer]="audioBuffer"
    ></app-waveform>
  <ugly-progress-spinner [isVisible]="isProcessing"></ugly-progress-spinner>
</md-sidenav-container>