{% if display_edit_actions is not defined %}
  {% set display_edit_actions = true %}
{% endif %}
{% if display_social_buttons is not defined %}
  {% set display_social_buttons = true %}
{% endif %}
{% if display_player is not defined %}
  {% set display_player = true %}
{% endif %}
{% if display_comments is not defined %}
  {% set display_comments = true %}
{% endif %}
{% if his_group is not defined %}
  {% set his_group = false %}
{% endif %}
{% if display_autoplay is not defined %}
  {% set display_autoplay = false %}
{% endif %}
{% if tag_ids_json is not defined %}
  {% set tag_ids_json = '[]' %}
{% endif %}
{% if display_tags_proposition is not defined %}
  {% set display_tags_proposition = false %}
{% endif %}

<table>
  <tr>
    <td class="element_thumbnail">
      
      {% if element.embed %}
        <a href="#" class="a_thumbnail {% if display_player %}element_open element_embed_open_link{% endif %} {% if element.embed and display_player %}embed{% else %}noembed{% endif %}">
          <img class="play" style="display: none;" src="{{ asset('bundles/muzichcore/img/1328283150_media-playback-start.png') }}" alt="" />
          <img 
            class="element_thumbnail"
            {% if element.thumbnailUrl %}
              src="{{ element.thumbnailUrl }}" 
            {% else %}
              src="{{ asset('bundles/muzichcore/img/nothumb.png') }}" 
            {% endif %}
            title="{{ 'element.show.open_embed'|trans({}, 'elements') }}" 
            alt=""
          />
        </a>
      {% else %}
        <a href="{{ element.url }}" class="a_thumbnail element_open {% if element.embed %}embed{% else %}noembed{% endif %}" target="_blank">
          <img class="open" style="display: none;" src="{{ asset('bundles/muzichcore/img/1328283201_emblem-symbolic-link.png') }}" alt="" />
          <img 
            class="element_thumbnail"
            {% if element.thumbnailUrl %}
              src="{{ element.thumbnailUrl }}" 
            {% else %}
              src="{{ asset('bundles/muzichcore/img/nothumb.png') }}" 
            {% endif %}
            title="{{ 'element.show.open_embed'|trans({}, 'elements') }}" 
            alt=""
          />
        </a>
      {% endif %}
      
      <ul class="element_thumb_actions">
        <li class="score">
          {{ element.points|format_score }}
        </li>
            <li class="vote thumb">
              {% if app.user %}
                {% if element.owner.id != app.user.id %}
                  {% if element.hasVoteGood(app.user.id) %}
                    <a class="vote" href="{{ path('ajax_element_remove_vote_good', {
                      'element_id' : element.id,
                      'token'      : app.user.getPersonalHash(element.id)
                    }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
                      <img src="{{ asset('img/icon_thumb_red.png') }}" alt="vote" />
                    </a>
                  {% else %}
                    <a class="vote" href="{{ path('ajax_element_add_vote_good', {
                      'element_id' : element.id,
                      'token'      : app.user.getPersonalHash(element.id)
                    }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
                      <img src="{{ asset('img/icon_thumb.png') }}" alt="vote" />
                    </a>
                  {% endif %}
                {% else %}
                  <img src="{{ asset('img/icon_thumb_gray.png') }}" alt="vote" />
                {% endif %}
              {% else %}
                <a href="#" class="mustbeconnected">
                  <img src="{{ asset('img/icon_thumb.png') }}" alt="vote" />
                </a>
              {% endif %}
            </li>
        <li class="star">
          {% if not element.private %}
            {% if app.user %}
              {% if element.hasFavoriteUser(app.user.id) %}
                <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': app.user.personalHash(element.id) }) }}" >
                  <img id="favorite_{{ element.id }}_is" src="{{ asset('img/icon_star_2_red.png') }}" title="{{ 'element.favorite.remove'|trans({}, 'elements') }}" alt="{{ 'element.favorite.remove'|trans({}, 'elements') }}"/>
                </a>
              {% else %}
                <a class="favorite_link" href="{{ path('favorite_add', { 'id': element.id, 'token': app.user.personalHash(element.id) }) }}" >
                  <img id="favorite_{{ element.id }}_isnot" src="{{ asset('img/icon_star_2.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
                </a>
              {% endif %}
            {% else %}
              <a class="mustbeconnected" href="#" >
                <img src="{{ asset('img/icon_star_2.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
              </a>
            {% endif %}
          {% else %}
            <img src="{{ asset('img/icon_star_2_gray.png') }}" alt="favorite" />
          {% endif %}
        </li>
      </ul>
      
    </td>
    <td class="element_content">
            
      <ul class="element_links_actions" class="gradient">
        <li class="element_link">
          <a title="{{ 'element.link'|trans({}, 'elements') }}" class="element_link" href="{{ element.url }}" target="_blank">
            <img src="{{ asset('/img/icon_link.png') }}" alt="link" />
          </a>
        </li>
        
        {% if display_autoplay and element|can_autoplay %}
          <li class="element_autoplay">
            <a title="{{ 'element.autoplay.title'|trans({}, 'elements') }}"
               data-element_id="{{ element.id }}"
               class="autoplay_link"
              {% if autoplay_context == 'home' %}
                href="{{ path('elements_get_filter_data_autoplay', {
                  'element_id' : element.id,
                  'type'       : 'filter'
                }) }}"
              {% endif %}
              {% if autoplay_context == 'show_user' %}
                href="{{ path('elements_get_filter_data_autoplay_show', {
                  'element_id' : element.id,
                  'show_type'  : 'user',
                  'show_id'    : viewed_user.id, 
                  'data'       : tag_ids_json
                }) }}"
              {% endif %}
              {% if autoplay_context == 'show_group' %}
                href="{{ path('elements_get_filter_data_autoplay_show', {
                  'element_id' : element.id,
                  'show_type'  : 'group',
                  'show_id'    : group.id, 
                  'data'       : tag_ids_json
                }) }}"
              {% endif %}
              {% if autoplay_context == 'favorite_my' %}
                href="{{ path('elements_get_filter_data_autoplay_favorite', {
                  'element_id' : element.id,
                  'show_type'  : 'user',
                  'show_id'    : app.user.id, 
                  'data'       : tag_ids_json
                }) }}"
              {% endif %}
              {% if autoplay_context == 'favorite_user' %}
                href="{{ path('elements_get_filter_data_autoplay_favorite', {
                  'element_id' : element.id,
                  'show_type'  : 'user',
                  'show_id'    : viewed_user.id, 
                  'data'       : tag_ids_json
                }) }}"
              {% endif %}
               target="_blank"
            >
              <img src="{{ asset('/img/1361037350_control_play.png') }}" alt="playlist" />
            </a>
          </li>
        {% endif %}
        
        {% if app.user %}
          {% if app.user.id != element.owner.id %}
        
            {% if display_edit_actions %}
              <li class="element_propose_tags">
                <a title="{{ 'element.proposition_tags.link_title'|trans({}, 'userui') }}" 
                  class="element_propose_tags" 
                  href="{{ path('ajax_element_propose_tags_open', {'element_id' : element.id}) }}">
                  <img src="{{ asset('img/tag.png') }}" alt="tags_proposition" />
                </a>
              </li>
  
              <li class="element_reshare">
                <a title="{{ 'element.reshare.link_title'|trans({}, 'userui') }}" 
                  class="element_reshare" 
                  href="{{ path('ajax_reshare_element', {'element_id':element.id, 'token':app.user.getPersonalHash('reshare_'~element.id)}) }}">
                  <img src="{{ asset('/img/icon_reload.png') }}" alt="re" />
                </a>
              </li>
              
              <li class="element_report">
                <a title="{{ 'element.report.link_title'|trans({}, 'userui') }}" 
                  class="element_report" 
                  href="{{ path('ajax_report_element', {'element_id':element.id, 'token':app.user.getPersonalHash(element.id)}) }}">
                  <img src="{{ asset('/img/icon_alert.png') }}" alt="report" />
                </a>
              </li>
  
            {% endif %}
  
          {% endif %}

          {% if app.user.id == element.owner.id %}
  
            {% if display_edit_actions %}
  
              {% if element.hasTagProposition %}
                <li class="element_view_propositions_link">
                  <a title="{{ 'element.view_propositions.link'|trans({}, 'elements') }}" class="element_view_propositions_link" 
                    href="{{ path('ajax_element_proposed_tags_view', {'element_id' : element.id})  }}"
                  >
                    <img src="{{ asset('img/tag_color.png') }}" alt="tags proposition" />
                  </a>
                </li>
              {% endif %}
  
              <li class="element_edit_link">
                <a title="{{ 'element.edit.link'|trans({}, 'elements') }}" class="element_edit_link" 
                  href="{{ path('element_edit', {'element_id' : element.id})  }}"
                >
                  <img src="{{ asset('/img/icon_pen.png') }}" alt="edit" />
                </a>
              </li>
  
              <li class="element_remove_link">
                <a title="{{ 'element.remove.link'|trans({}, 'elements') }}" class="element_remove_link" 
                  href="{{ path('element_remove', {'element_id' : element.id, 'token':app.user.getPersonalHash(element.id)})  }}"
                >
                  <img src="{{ asset('/img/icon_close_2.png') }}" alt="delete" />
                </a>
              </li>
            {% endif %}
  
          {% endif %}
        {% else %}
          
          <li class="element_propose_tags">
            <a title="{{ 'element.proposition_tags.link_title'|trans({}, 'userui') }}" 
              class="mustbeconnected" 
              href="#">
              <img src="{{ asset('bundles/muzichcore/img/1333484018_rss-tag.png') }}" alt="tags_proposition" />
            </a>
          </li>

          <li class="element_reshare">
            <a title="{{ 'element.reshare.link_title'|trans({}, 'userui') }}" 
              class="mustbeconnected" 
              href="#">
              <img src="{{ asset('/img/icon_reload.png') }}" alt="re" />
            </a>
          </li>
          
          <li class="element_report">
            <a title="{{ 'element.report.link_title'|trans({}, 'userui') }}" 
              class="mustbeconnected" 
              href="#">
              <img src="{{ asset('/img/icon_alert.png') }}" alt="report" />
            </a>
          </li>
          
        {% endif %}
        
        {% if his_group %}
          <li class="remove_from_group">
            <a title="{{ 'element.group.remove_from.title'|trans({'%group_name%':group.name}, 'elements') }}"
              class="element_remove_from_group_link"
              href="{{ path('element_remove_from_group', {
                 'element_id' : element.id,
                 'group_id'   : group.id,
                 'token'      : app.user.getPersonalHash('remove_from_group_'~element.id)
              })  }}">
              <img src="{{ asset('/img/1360779431_Remove_gray.png') }}" alt="remove from group" />
            </a>
          </li>
        {% endif %}
        
        {% if not element.private %} 
        <li>
          <a
            class="add_to_playlist"
            href="{{ path('playlists_add_element_prompt', { 'element_id' : element.id }) }}"
            title="{{ 'playlist.add_this_element'|trans({}, 'elements') }}"
          >
            <img src="{{ asset('/img/playlist_add_gray.png') }}" alt="add to playlist" />
          </a>
        </li>
        {% endif %}
        
      </ul>
      
      <span class="element_name">
        {% if element.embed %}
          <a href="{{ path('element_show_one', {
            'element_id' : element.id,
            'element_slug' : element.slug
          }) }}" class="element_open element_name_embed_open_link">
            {{ element.name }}
          </a>
        {% else %}
          <a href="{{ path('element_show_one', {
            'element_id' : element.id,
            'element_slug' : element.slug
          }) }}" class="element_open" target="_blank">
            {{ element.name }}
          </a>
        {% endif %}
      </span>
      
      <br />
      {% autoescape false %}
        {% if element.group and no_group_name is not defined%}
          {{ 'element.name.whoandgroup'|trans({
            '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
            '%owner_name%' : element.owner.name,
            '%group_url%'  : path('show_group', {'slug': element.group.slug}),
            '%group_name%' : element.group.name
          }, 'elements') }}
        {% else %}
          {{ 'element.name.who'|trans({
            '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
            '%owner_name%' : element.owner.name
          }, 'elements') }}
        {% endif %}
      
        {{ element.created.date|date_or_relative_date }}
      
        {% if element.parent %}
          {{ 'element.name.reshare'|trans({
            '%owner_url%'  : path('show_user', {'slug': element.parent.owner.slug}),
            '%owner_name%' : element.parent.owner.name
          }, 'elements') }}
        {% endif %}
      {% endautoescape %}
      
      <div class="loader">
        <img class="element_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading"/>
      </div>
      
      {% if element.tags|length %}
      <ul class="element_tags">
        {% for tag in element.tags %} 
          <li class="element_tag">
            <a id="element_tag_{{ tag.id }}" href="#" 
              class="element_tag button {% if app.user %}{% if app.user.haveTagsFavorite(tag.id) %}element_tag_large_for_fav_still{% endif %}{% endif %}"
            >
              {{ tag.name }}
            </a>
            {% if app.user %}
              {% if app.user.haveTagsFavorite(tag.id) %}
                <img class="tag_to_favorites" src="{{ asset('/img/icon_heart.png') }}" 
                  alt="add-to-favorites"
                  title="{{ 'element.tag.isfav.title'|trans({'%tagname%':tag.name}, 'elements') }}"
                />
              {% else %}
                <a 
                  href="{{ path('ajax_tag_add_to_favorites', {
                    'tag_id' : tag.id,
                    'token'  : app.user.getPersonalHash(tag.id)
                  }) }}" 
                  class="tag_to_favorites out button" 
                  style="display: none;"
                  title="{{ 'element.tag.addtofav.title'|trans({}, 'elements') }}"   
                >
                  <img class="tag_add_to_favorites"  src="{{ asset('/img/icon_heart_add.png') }}" alt="add-to-favorites"/>
                </a>
              {% endif %}
            {% else %}
              <a 
                href="#" 
                class="tag_to_favorites mustbeconnected" 
                style="display: none;"
                title="{{ 'element.tag.addtofav.title'|trans({}, 'elements') }}"   
              >
                <img class="tag_add_to_favorites"  src="{{ asset('/img/icon_heart.png') }}" alt="add-to-favorites"/>
              </a>
            {% endif %}
          </li>
        {% endfor %} 
      </ul>
      {% endif %}
      
      <a href="#" class="button element_open element_embed_close_link" style="display: none;">
        {{ 'element.show.close_embed'|trans({}, 'elements') }}
      </a>
      
      {% if display_comments %}
      
        {% autoescape false %}
          {% if element.comments|length > 1 %}
            <a href="#hide_comments_{{ element.id }}" class="hide_comments" style="display: none;">
              {{ 'element.comments.hideare'|trans({}, 'elements') }}
            </a>  
            <a href="#comments_{{ element.id }}" class="display_comments">
              {{ 'element.comments.thereare'|trans({'%count%':element.comments|length}, 'elements') }}
            </a>
          {% elseif element.comments|length == 1 %}
            <a href="#hide_comments_{{ element.id }}" class="hide_comments" style="display: none;">
              {{ 'element.comments.hideis'|trans({}, 'elements') }}
            </a> 
            <a href="#comments_{{ element.id }}" class="display_comments">
              {{ 'element.comments.thereis'|trans({}, 'elements') }}
            </a>
          {%endif %}
        {% endautoescape %}
        
        <a href="#add_comment_{{ element.id }}" class="add_comment">
          {{ 'element.comments.add'|trans({}, 'elements') }}
        </a>
      
      {% endif %}
      
      {% if display_social_buttons %}
        {% set permalink = 'https:' ~ url('element_show_one', {
          'element_id' : element.id,
          'element_slug' : element.slug
        }, true) %}
       {% set element_title = 'Muzich - ' ~ element.name %}

        <div class="social_buttons">
          <ul>
            <li class="facebook">
               <a target="_blank" title="Facebook" href="https://www.facebook.com/sharer.php?u={{ permalink }}&t={{ element_title }}" rel="nofollow" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=500,width=700');return false;"><img src="{{ asset('/img/1387489343_facebook_square.png') }}" alt="Facebook" /></a>
            </li>
            <li class="twitter">
              <a target="_blank" title="Twitter" href="https://twitter.com/share?url={{ permalink }}&text={{ element_title }}&via=Muzich_Official" rel="nofollow" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=400,width=700');return false;"><img src="{{ asset('/img/1387489330_twitter_square.png') }}" alt="Twitter" /></a>
            </li>
            <li class="googleplus">
               <a target="_blank" title="Google +" href="https://plus.google.com/share?url={{ permalink }}&hl=fr" rel="nofollow" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=450,width=650');return false;"><img src="{{ asset('/img/1387489316_google_square.png') }}" alt="Google Plus" /></a>
            </li>
            <li class="mail">
               <a target="_blank" title="Envoyer par mail" href="mailto:?subject={{ element_title }}&body={{ permalink }}" rel="nofollow"><img src="{{ asset('/img/1387489139_aiga_mail.png') }}" alt="email" /></a>
            </li>
          </ul>
        </div>
      {% endif %}
      
    </td>
  </tr>
</table>

{% if ids_display is defined %}
{% if ids_display == event_const('TYPE_TAGS_PROPOSED') %}

  {% include 'MuzichCoreBundle:Element:tag.propositions.html.twig' with {
    'propositions' : element.getTagsProposition,
    'element_id'   : element.id
  } %}

{% endif %}
{% endif %}

{% if display_tags_proposition %}
  {% include 'MuzichCoreBundle:Element:tag.propositions.html.twig' with {
    'propositions' : element.tagsProposition,
    'element_id'   : element.id
  } %}
{% endif %}

{% if display_player %}
  <div id="embed_{{ element.id }}" class="element_embed" style="display: none;"></div>
{% endif %}

{% if display_comments %}

  <div class="comments" style="display: none;">
    <ul class="comments">
    {% if element.comments|length %}
      {% for comment in element.comments %}
        {% include "MuzichCommentBundle:Comment:li.comment.html.twig" with {'element_id' : element.id} %}
      {% endfor %}
    {% endif %}
    </ul>
      
    <div class="comments_loader">
      <img class="comments_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading"/>
    </div>
          
    <form 
      action="{{ path('ajax_add_comment', {'element_id':element.id, 'token' : token_or_unknow(app.user)}) }}" 
      method="post" 
      name="add_comment"
      style="display: none;"
      class="add_comment"
    >
      {% include "MuzichCommentBundle:Comment:form.html.twig" with {
        'submit_value' : 'element.comments.add_submit'|trans({}, 'elements'),
        'cancel_value' : 'element.comments.add_cancel'|trans({}, 'elements'),
        'following'    : element.userFollowComments(app.user|userId),
        'own'          : (app.user|userId == element.owner.id)
      } %}
    </form>
      
    <a href="#add_comment_{{ element.id }}" class="add_comment">
      {{ 'element.comments.add'|trans({}, 'elements') }}
    </a>
      
  </div>

{% endif %}