<div class="result-header">
  <h2>This is the results</h2>
  <p>
    Filtres:
    {{#if location}}
      <span class="filters location">{{location}}<span class="fa fa-times" {{action 'deleteTag' 'location'}}></span></span>
    {{/if}}
    {{#if langue}}
      <span class="filters langue">{{langue}}<span class="fa fa-times" {{action 'deleteTag' 'langue'}}></span></span>
    {{/if}}
    {{#if discours}}
      <span class="filters discours">{{discours}}<span class="fa fa-times" {{action 'deleteTag' 'discours'}}></span></span>
    {{/if}}
    {{#if date}}
      {{#each date as |item| }}
        <span class="filters date">{{item}}<span class="fa fa-times" {{action 'deleteTag' 'date' item }}></span></span>
      {{/each}}
    {{/if}}
    {{#if thematique}}
      <span class="filters thematique">{{thematique}}<span class="fa fa-times" {{action 'deleteTag' 'thematique'}}></span></span>
    {{/if}}
  </p>
</div>
<div class='result-list'>
  {{#each filteredSounds as |item| }}
    <div id="{{item.id}}" {{action "details" item}} class='result-item'>
      <span class="fa fa-play-circle fa-lg fa-fw pull-right" {{action 'play' item}}></span>
      <strong>{{ item.title }}</strong> - {{item.interviewer}}
      <div class="description">
        {{item.description}}
      </div>
      <button class="pull-right" {{action 'toggleModal' item}}>Details</button>
    </div>
  {{/each}}
  {{#if isShowingModal}}
    {{#ember-wormhole to='info-modal'}}
      <div class="overlay" {{action 'toggleModal'}}></div>
      <div class="dialog">
        <h1>{{currentDetails.title}}</h1>
        <p><b>Description: </b>{{currentDetails.description}}</p>
        <p><b>Interviewer: </b>{{currentDetails.interviewer}}</p>
        <p><b>Type de Discours: </b>{{currentDetails.type}}</p>
        <p><b>Localisation: </b>{{currentDetails.spatial}}</p>
        <p><b>Langue: </b>{{currentDetails.language}}</p>
        <p><b>Date de Creation: </b>{{currentDetails.created}}</p>
        <button class="pull-right" {{action 'toggleModal'}}>Close</button>
      </div>
    {{/ember-wormhole}}
  {{/if}}
</div>