<ion-view cache-view="false" view-title="{{'Edit tracklist' | translate}}">
  <ion-nav-bar class="bar-stable">
    <ion-nav-back-button class="button-clear" ng-click="goBack()">
      <i class="mopidy-mobile-icon-check"></i> {{'Done' | translate}}
    </ion-nav-back-button>
  </ion-nav-bar>
  <ion-nav-buttons side="secondary">
    <button class="mopidy-mobile-button-icon mopidy-mobile-icon-create"
            nav-transition="none"
            ui-sref="^.add"
            >
    </button>
    <button class="mopidy-mobile-button-icon mopidy-mobile-icon-menu"
            ng-controller="TracklistMenuController as menu"
            ng-click="menu.show($event)"
            >
    </button>
  </ion-nav-buttons>
  <ion-content>
    <ion-list show-delete="true" show-reorder="true">
      <ion-item class="item-thumbnail-left"
                ng-class="{'item-positive': tlTrack.tlid == currentTlTrack.tlid}"
                ng-repeat="tlTrack in tlTracks"
                >
        <img ng-class="{'mopidy-mobile-thumbnail-track': !images[tlTrack.track.uri].uri}"
             ng-src="{{images[tlTrack.track.uri].uri || thumbnail.src}}"
             >
        <h2>{{tlTrack.track.name || tlTrack.track.uri}}</h2>
        <h3 class="mopidy-mobile-artists" ng-show="tlTrack.track.artists.length">
          <span ng-repeat="artist in tlTrack.track.artists">{{artist.name || artist.uri}}</span>
        </h3>
        <h4>{{tlTrack.track.album.name || tlTrack.track.genre || tlTrack.track.comment}}</h4>
        <ion-delete-button class="ion-minus-circled" ng-click="remove(tlTrack)">
        </ion-delete-button>
        <ion-reorder-button class="ion-navicon" on-reorder="move($fromIndex, $toIndex)">
        </ion-reorder-button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>
