<ion-view view-title="{{'Search {name}' | translate:({name: ref.name || ('Library' | translate)})}}">
  <ion-content>
    <form class="list" name="form" ng-submit="submit()">
      <div class="item item-button-right row" ng-repeat="term in terms">
        <ion-input class="col-33 item-select">
          <select ng-model="term.key" style="max-width: 100%; padding-left: 8px; vertical-align: middle;">
            <option value="any" translate>Any</option>
            <option value="album" translate>Album</option>
            <option value="albumartist" translate>Album artist</option>
            <option value="artist" translate>Artist</option>
            <option value="comment" translate>Comment</option>
            <option value="composer" translate>Composer</option>
            <option value="date" translate>Date</option>
            <option value="genre" translate>Genre</option>
            <option value="performer" translate>Performer</option>
            <option value="track_name" translate>Track</option>
          </select>
        </ion-input>
        <ion-input class="col item-input">
          <input ng-model="term.value"
                 ng-required="$index == 0 || $index != terms.length - 1"
                 placeholder="{{'Search term' | translate}}"
                 type="text">
        </ion-input>
        <button class="button button-clear button-icon button-small mopidy-mobile-icon-close"
                ng-click="terms.splice($index, 1)"
                ng-show="$index != terms.length - 1"
                type="button"
                >
        </button>
      </div>
      <ion-toggle class="item item-toggle" name="exact" ng-model="params.exact">
        <ion-label translate>Find exact</ion-label>
      </ion-toggle>
      <button class="button button-positive button-full item"
              ng-disabled="form.$invalid"
              translate
              type="submit"
              >
        Search
      </button>
    </form>
  </ion-content>
</ion-view>
