templates/specieslist_species.html.twig line 1

Open in your IDE?
  1. {% extends "base.html.twig" %}
  2. {% block css %}
  3. <link id="bsdp-css" href="https://unpkg.com/bootstrap-datepicker@1.9.0/dist/css/bootstrap-datepicker3.min.css" rel="stylesheet">
  4. <link href="https://cdn.jsdelivr.net/npm/@yaireo/tagify@3.7.3/dist/tagify.css" rel="stylesheet">
  5. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.css" />
  6. {% endblock %}
  7. {% block title %} {{ 'Soortenlijst'|trans }} {% if app.request.locale == 'nl' %}{{ title.namenl }}{% else %}{{ title.nameen }}{% endif %} {% endblock %}
  8. {% block body %}
  9.         <p>&nbsp;</p>
  10.         <div class="row flex-md-row h-md-250 position-relative">
  11.           <div class="col-md-9 position-static">
  12.             <!-- Begin Page Content -->
  13.             <h2>{{ 'Soortenlijst'|trans }}
  14.             {% if type == 'location' %}<a href="{{ path('locations_fossil', { 'id': title.id })}}">
  15.             {% elseif type == 'era' %}<a href="{{ path('glossary', { 'id': title.glossary.id, 'url': title.glossary.url })}}">
  16.             {% endif %}
  17.             {% if app.request.locale == 'nl' %}{{ title.namenl }}{% else %}{{ title.nameen }}{% endif %}
  18.             </a>
  19.             </h2>
  20.             <p></p>
  21.               <div class="row">
  22.                 <div class="col-sm-12">
  23.                   <a href="{{ path('specieslist_item', { 'type' : type, 'id' : id })}}"><button class="btn btn-paleontica"><span class="feather-18" data-feather="arrow-left-circle"></span> {{ 'Terug'|trans }}</button></a>
  24.                   <h3>{% if taxanomytype is not null %}<a href="{{ path('glossary_by_title', {title: taxanomytype.namescientific|lower}) }}"><img src="/images/icons/fossil/has_{{ taxanomytype.namescientific|lower }}{{ taxanomytype.namescientificclarification }}.png"></a>{% if app.request.locale == 'nl' %}{{ taxanomytype.namenl }}{% else %}{{ taxanomytype.nameen }}{% endif %}{% else %}{{ 'Onbekend'|trans }}{% endif %}</h3>
  25.                 </div>
  26.               </div>
  27.               <div class="row d-flex justify-content-between">
  28.                 <div class="col-sm-2">
  29.                   {{ fossils.getTotalItemCount }} {{ 'gevonden'|trans }}.
  30.                 </div>
  31.                 <div class="col-sm-6 pagnation-paleontica">
  32.                     {{ knp_pagination_render(fossils) }}
  33.                 </div>
  34.               </div>
  35.               {% for fossil in fossils %}
  36.               <div class="row">
  37.                 <div class="col-sm-12">
  38.                     <b>
  39.                     {% if fossil.genus is null or fossil.genus is empty %}
  40.                       {% set fossildbsearchgenusurl = '' %}
  41.                       {% set genus = '' %}
  42.                       {% set genus_set = 0 %}
  43.                     {% else %}
  44.                       {% set fossildbsearchgenusurl = '[{"value":"' ~ fossil.genus ~ '"}]' %}
  45.                       {% set genus = fossil.genus %}
  46.                       {% set genus_set = 1 %}
  47.                     {% endif %}
  48.                     {% if fossil.species is null or fossil.species is empty %}
  49.                       {% set fossildbsearchspeciesurl = '' %}
  50.                       {% set species = '' %}
  51.                       {% set species_set = 0 %}
  52.                     {# ToDo-Ante: make this work 
  53.                     {% elseif fossil.species == "sp."%}
  54.                       {% set fossildbsearchspeciesurl = '' %}
  55.                       {% set species = fossil.species %}
  56.                       {% set species = '' %} #}
  57.                     {% else %}
  58.                       {% set fossildbsearchspeciesurl = '[{"value":"' ~ fossil.species ~ '"}]' %}
  59.                       {% set species = fossil.species %}
  60.                       {% set species_set = 1 %}
  61.                     {% endif %}
  62.                     {# genus and species #}
  63.                     {% if genus_set == 1 and species_set == 1 %}
  64.                       <i><a href="{{ path('fossildb', { 'page': '1', 'filter[genus]': fossildbsearchgenusurl, 'filter[species]': fossildbsearchspeciesurl }) }}">{{ genus }} {{ species }}</i></a></b>
  65.                     {# genus #}
  66.                     {% elseif genus_set == 1 and species_set == 0 %}
  67.                         <i><a href="{{ path('fossildb', { 'page': '1', 'filter[genus]': fossildbsearchgenusurl }) }}">{{ genus }}</i></a></b>
  68.                     {# species #}
  69.                     {% elseif genus_set == 0 and species_set == 1 %}
  70.                         <i><a href="{{ path('fossildb', { 'page': '1', 'filter[species]': fossildbsearchspeciesurl }) }}">{{ species }}</i></a></b>
  71.                     {# none #}
  72.                     {% elseif (fossil.genus is null or fossil.genus is empty) and (fossil.species is null or fossil.species is empty)%}
  73.                       {{ '[Ongedetermineerd]'|trans }}
  74.                     {% endif %}
  76.                     {% if fossil.author is defined and fossil.author != ""%} ({{ fossil.author }}{% if fossil.authoryear is defined and fossil.authoryear != "" %}, {{ fossil.authoryear }}{% endif %}){% endif %}</b>
  77.                 </div>
  78.               </div>
  79.               <div class="row">
  80.                 <div class="col-sm-12">
  81.                 {# ToDo-Ante: gallery per soort niet per fossil.id #}
  82.                   {#{{% set random_id = random(0, 10000) %}}#}
  83.                   {% set random_id = null %}
  84.                   {% for fossil in fossil.fossils %}
  85.                     {% if random_id is null %}{% set random_id = fossil.id %}{% endif %}
  86.                     {% for photo in fossil.FossildbPhotos %}
  87.                       {% set thumbnail = '/uploads/fossildb/' ~ photo.filename|slice(0, 2) ~ "/" ~ photo.filename %}
  88.                       <a href="/uploads/fossildb/{{photo.filename|slice(0, 2)}}/{{photo.filename}}" data-toggle="lightbox" data-gallery="fossildb-gallery-{{ random_id }}"><img src="{{ thumbnail|imagine_filter('fossildb_thumb_tiny') }}" class="img-fluid img-thumbnail"></a>
  89.                     {% endfor %}
  90.                   {% endfor %}
  91.                 </div>
  92.               </div>
  93.               <br><br>
  94.               {% endfor %}
  95.               <div class="row d-flex justify-content-between">
  96.                 <div class="col-sm-2">
  97.                   &nbsp;
  98.                 </div>
  99.                 <div class="col-sm-6 pagnation-paleontica">
  100.                     {{ knp_pagination_render(fossils) }}
  101.                 </div>
  102.               </div>
  103.               <p></p>
  104.             <!-- END Page Content -->
  105.           </div>
  106.           {% include 'sidebar.html.twig' %}
  107.         </div>
  108. {% endblock %}
  109. {% block javascript %}
  110.     <script src="https://cdn.jsdelivr.net/autocomplete.js/0/autocomplete.jquery.min.js"></script>
  111.     <script src="https://unpkg.com/bootstrap-datepicker@1.9.0/dist/js/bootstrap-datepicker.min.js"></script>
  112.     <script>
  113.         jQuery(document).ready(function() {
  114.           $('.js-datepicker').datepicker({
  115.             calendarWeeks: true,
  116.             autoclose: true,
  117.             clearBtn: true,
  118.             todayHighlight: true,
  119.             format: "dd-mm-yyyy",
  120.           });
  122.         $('.js-autocomplete').each(function() {
  123.             var autocompleteUrl = $(this).data('autocomplete-url');
  124.             $(this).autocomplete({hint: false}, [
  125.                 {
  126.                     source: function(query, cb) {
  127.                         $.ajax({
  128.                             url: autocompleteUrl+'?query='+query,
  129.                         }).then(function(data) {
  130.                             cb(data.pages);
  131.                         });
  132.                     },
  133.                     displayKey: 'id',
  134.                     name: 'page',
  135.                     debounce: 500 // only request every 1/2 second
  136.                 }
  137.             ])
  138.         });
  139.       });
  140.     </script>
  141.     <script src="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.min.js"></script>
  142.     <script>
  143.     $(document).on('click', '[data-toggle="lightbox"]', function(event) {
  144.         event.preventDefault();
  145.         $(this).ekkoLightbox({
  146.             wrapping: true,
  147.         });
  148.     });
  149.     </script>
  150. {% endblock %}