liste_vignettes.html.twig 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. {% extends "videotheque/base.html.twig" %}
  2. {% block stylesheets %}
  3. {{ encore_entry_link_tags('vuejs') }}
  4. {% endblock %}
  5. {% block javascripts %}
  6. {{ encore_entry_script_tags('vuejs') }}
  7. {% endblock %}
  8. {% block title %}
  9. {% if titre is defined %}{{ parent() }} - {{ titre }}{% else %}{{ parent() }}{% endif %}
  10. {% endblock %}
  11. {% block titre %}
  12. {% if titre is defined %}{{ titre }}{% else %}{{ parent() }}{% endif %}
  13. {% endblock %}
  14. {% block body %}
  15. {{ include ('videotheque/_liste_header.html.twig') }}
  16. <section id="tableFilms">
  17. <div id="vue-app">
  18. {% for film in listeFilms %}
  19. <article class="card border-primary mb-4" data-controller="collapser" data-auteur="{{ film.authered.nomComplet }}">
  20. <div class="card-header d-flex justify-content-between">
  21. <h3 class="card-title"><a class="" href="{{ path('videotheque_voirfilm', {'id': film.id}) }}"><span data-bs-toggle="tooltip" data-placement="right" title="{{ film.information }}">{{ film.titre }}</span></a>
  22. {% if film.new %}<span class="badge bg-success">New</span>{% endif %}
  23. </h3>
  24. <div class="d-flex">
  25. {% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
  26. <Seen
  27. class="me-3 btn fa-lg"
  28. content="{{ film.id }}"
  29. :initial-state="{{ app.user in film.usersWantToView ? "true" : "false" }}"
  30. path="{{ path('maliste_modifier_a_voir') }}"
  31. state-on="fa fa-bookmark text-primary"
  32. text-on="Supprimer ce film de votre liste à voir"
  33. state-off="fa fa-bookmark-o text-secondary"
  34. text-off="Ajouter ce film à votre liste à voir"
  35. >
  36. </Seen>
  37. <Seen
  38. class="me-3 btn fa-lg"
  39. content="{{ film.id }}"
  40. :initial-state="{{ app.user in film.usersWhoSeen ? "true" : "false" }}"
  41. path="{{ path('maliste_modifier_vus') }}"
  42. state-on="fa fa-eye text-success"
  43. text-on="Marquer ce film comme non vu"
  44. state-off="fa fa-eye-slash text-secondary"
  45. text-off="Marquer ce film comme vu"
  46. >
  47. </Seen>
  48. {% endif %}
  49. <div class="">
  50. <button class="btn text-primary" data-bs-toggle="collapse" data-bs-target="#collapse-id-{{ film.id }}"><i data-collapser-target="button" class="fa fa-chevron-circle-right fa-lg"></i></button>
  51. </div>
  52. </div>
  53. </div>
  54. <div class="card-body collapse" id="collapse-id-{{ film.id }}" data-collapser-target="collapse">
  55. <table class="table">
  56. <tbody>
  57. <tr>
  58. <th style="width: 9em;">Année</th>
  59. <td>{{ film.annee | date('Y') }}</td>
  60. <tr>
  61. <tr>
  62. <th>Réalisateur(s)</th>
  63. <td>
  64. {% for realisateur in film.realisateurs %}
  65. <a href="{{ path('videotheque_listeparreal', {'id': realisateur.id}) }}"><span class="badge bg-info rounded-pill text-dark">{{ realisateur.nomComplet }}</span></a>
  66. {% endfor %}
  67. </td>
  68. </tr>
  69. <tr>
  70. <th>Genre</th>
  71. <td>
  72. {% for genre in film.genres %}
  73. <a href="{{ path('videotheque_listepargenre', {'id': genre.id}) }}"><span class="badge bg-success rounded-pill">{{ genre.name }}</span></a>
  74. {% endfor %}
  75. </td>
  76. </tr>
  77. {% if film.information %}
  78. <tr>
  79. <th>Informations</th>
  80. <td>{{ film.information | nl2br }}</td>
  81. </tr>
  82. {% endif %}
  83. {% if film.dateSortie %}
  84. <tr>
  85. <th>Date de sortie</th>
  86. <td>{{ film.dateSortie | date('d/m/y')}}</td>
  87. </tr>
  88. {% endif %}
  89. </tbody>
  90. </table>
  91. </div>
  92. <div class="card-footer d-flex justify-content-between">
  93. <div class="d-flex">
  94. <div class="me-3">
  95. <input class="rating"
  96. data-theme="krajee-fa"
  97. data-language="fr"
  98. data-display-only="true"
  99. data-show-caption="false"
  100. style="display:none;"
  101. min=0
  102. max=5
  103. data-step=0.5
  104. data-size="xs"
  105. value="{{ film.note }}">
  106. </div>
  107. <div class="me-3">
  108. {% if film.nbComs %}
  109. <a href="{{ path('videotheque_voirfilm', {'id': film.id}) }}#coms"><span class="badge bg-warning text-dark">{{ film.nbComs }} commentaire{% if film.nbComs > 1 %}s{% endif %}</span></a>
  110. {% endif %}
  111. </div>
  112. <div class="">
  113. {% if film.new %}<span class="badge text-bg-secondary">New</span>{% endif %}
  114. {% if estEnSalle(film.dateSortie) %}<span class="badge text-bg-success">En salle</span>{% endif %}
  115. </div>
  116. </div>
  117. <div class="">
  118. {% if film.authered is defined %}
  119. Ajouté par
  120. {{ film.authered.username }}
  121. {% if film.authered.activeNow %}
  122. <i class="fa fa-user text-success" data-bs-toggle="tooltip" title="En ligne"></i>
  123. {% else %}
  124. <i class="fa fa-user-o text-secondary" data-bs-toggle="tooltip" title="Hors ligne"></i>
  125. {% endif %}
  126. {% endif %}
  127. </div>
  128. </div>
  129. </article>
  130. {% endfor %}
  131. </div>
  132. </section>
  133. {% endblock %}