proustibat/fbrgsmn.mobile.app

<div class="header-image">
    <img no-padding no-margin class="cover" [ngClass]="!configReady ? 'animated' : ''" src="{{currentSong.cover.jpg}}" srcset="{{currentSong.cover.svg}}" alt="Current cover song"/>
</div>


<div class="meta-info" padding>
            <span *ngIf="configReady" ion-text class="label-now-playing" color="secondary" text-uppercase>
                <span class="txt">
                    <span>•&nbsp;</span>{{ 'RADIOPAGE.NOWPLAYING' | translate }}
                </span>
            </span>
    <ion-row class="toggle-buttons" justify-content-center>
        <button [disabled]="!isButtonActive" class="btn-play-pause" ion-button round icon-only
                color="secondary"
                (click)="togglePlayPause()">
            <ion-icon *ngIf="isButtonActive" [name]="playPauseButton"></ion-icon>
            <ion-spinner name="dots" *ngIf="!isButtonActive"></ion-spinner>
        </button>

    </ion-row>
    <h1 ion-text class="artist" color="primary" text-uppercase no-margin padding-horizontal><span>{{currentSong.artist}}</span></h1>
    <h2 ion-text class="track" color="primary" text-capitalize padding-horizontal><span>{{currentSong.track}}</span></h2>
    <share-button *ngIf="configReady"
                  class="current-song"
                  [options]="shareOptions"
                  [doScreenShot]="true"
                  [trackingOptions]="trackingOptions"
                  border icon-only>
    </share-button>

    <button clear color="secondary" ion-button icon-only (click)="postToFeed()">
        <ion-icon name="logo-facebook"></ion-icon>
    </button>

</div>