view src/app/analysis-item/analysis-item.component.html @ 379:a3b45218c311

Move colour prop to base class

<md-card>
  <md-card-header>
    <md-card-title>{{item.title}}</md-card-title>
    <md-card-subtitle>{{item.description}}</md-card-subtitle>
  </md-card-header>
  <md-card-content>
    <ng-template [ngIf]="isLoading()">
      <ugly-progress-bar
        [isDeterminate]="true"
        [progress]="item.progress"
      ></ugly-progress-bar>
    </ng-template>
    <div class="content">
      <ng-template [ngIf]="!isLoading()">
        <ng-template [ngIf]="isActive && isAudioItem()">
          <ugly-live-play-head
            [timeToPixel]="DOES_NOT_BELONG_HERE"
            [colour]="'#c33c54'"
          >
          </ugly-live-play-head>
        </ng-template>
        <ugly-waveform
          *ngIf="isAudioItem(); else notAudio"
          [timeline]="timeline"
          [width]="contentWidth"
          [audioBuffer]="item.audioData"
          [onSeek]="onSeek"
          [colour]="'#0868ac'"
        ></ugly-waveform>

        <ng-template #notAudio>
          <div class="content"
            *ngIf="getFeatureShape() as shape; else showSpinner">
            <div [ngSwitch]="shape" class="content">
              <ugly-curve
                *ngSwitchCase="'vector'"
                [timeline]="timeline"
                [width]="contentWidth"
                [onSeek]="onSeek"
                [curve]="item.collected"
              ></ugly-curve>
              <ugly-tracks
                *ngSwitchCase="'tracks'"
                [timeline]="timeline"
                [width]="contentWidth"
                [onSeek]="onSeek"
                [tracks]="item.collected"
              ></ugly-tracks>

              <div *ngSwitchDefault>Feature cannot be visualised.</div>
            </div>
          </div>
          <ng-template #showSpinner>
            <ugly-progress-spinner></ugly-progress-spinner>
          </ng-template>
        </ng-template>

      </ng-template>
    </div>
  </md-card-content>
</md-card>