templates/specieslist_item.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.             {% if type == 'epoch' or type == 'stage' %}
  14.               {% for parent in parents %}
  15.                 <a href="{{ path('specieslist_item', { 'type': parent.type, 'id': parent.id })}}">< {% if app.request.locale == 'nl' %}{{ parent.namenl }}{% else %}{{ parent.nameen }}{% endif %}</a>
  16.               {% endfor %}
  17.               <br>
  18.             {% endif %}
  19.             {% if type == 'era' or type == 'epoch' or type == 'stage' %}
  20.             <picture>
  21.               <source media="(min-width: 1200px)" srcset="/images/bar/era/{{ periodname }}.png">
  22.               <source media="(min-width: 992px)" srcset="/images/bar/era/{{ periodname }}.png">
  23.               <source media="(min-width: 768px)" srcset="/images/bar/era/{{ periodname }}.png">
  24.               <source media="(min-width: 576px)" srcset="/images/bar/era/{{ periodname }}_small.png">
  25.               <source media="(max-width: 575px)" srcset="/images/bar/era/{{ periodname }}_small.png">
  26.               <img src="/images/default.png" alt="Era" style="width:auto;" >
  27.             </picture>
  28.             {% endif %}
  29.             <h2>{{ 'Soortenlijst'|trans }}
  30.             {% if type == 'location' %}<a href="{{ path('locations_fossil', { 'id': title.id })}}">
  31.             {% elseif type == 'era' %}<a href="{{ path('glossary', { 'id': title.glossary.id, 'url': title.glossary.url })}}">
  32.             {% endif %}
  33.             {% if app.request.locale == 'nl' %}{{ title.namenl }}{% else %}{{ title.nameen }}{% endif %}
  34.             </a>
  35.             </h2>
  36.             <p></p>
  37.             <p>
  38.               {{ 'Wil je fossielen toevoegen aan de Fossielendatabase dat kan op <a href="{link}">deze pagina<a>.'|trans({'{link}' : path('fossildb_add')})|raw }}</p>
  39.             </p>
  40.             {% for taxanomy_item in taxonomies %}
  41.               <div class="row">
  42.                 <div class="col-sm-12">
  43.                   {% if taxanomy_item.taxanomy is not null %}<a href="{{ path('specieslist_species',{ 'type' : type, 'id' : id, 'taxanomyid' : taxanomy_item.taxanomy.id }) }}"><img src="/images/icons/fossil/has_{{ taxanomy_item.taxanomy.namescientific|lower }}{{ taxanomy_item.taxanomy.namescientificclarification }}.png">{% if app.request.locale == 'nl' %}{{ taxanomy_item.taxanomy.namenl }}{% else %}{{ taxanomy_item.taxanomy.nameen }}{% endif %}</a>{#{% else %}<a href="{{ path('specieslist_species',{ 'type' : type, 'id' : id, 'taxanomyid' : 0 }) }}"><img src="/images/icons/fossil/has_incertae sedis.png">Incerta Sedis ({{ 'Onbekend'|trans }})</a>#}{% endif %}
  44.                 </div>
  45.               </div>
  46.               <p></p>
  47.             {% endfor %}
  48.             <!-- END Page Content -->
  49.           </div>
  50.           {% include 'sidebar.html.twig' %}
  51.         </div>
  52. {% endblock %}
  53. {% block javascript %}
  54.     <script src="https://cdn.jsdelivr.net/autocomplete.js/0/autocomplete.jquery.min.js"></script>
  55.     <script src="https://unpkg.com/bootstrap-datepicker@1.9.0/dist/js/bootstrap-datepicker.min.js"></script>
  56.     <script>
  57.         jQuery(document).ready(function() {
  58.           $('.js-datepicker').datepicker({
  59.             calendarWeeks: true,
  60.             autoclose: true,
  61.             clearBtn: true,
  62.             todayHighlight: true,
  63.             format: "dd-mm-yyyy",
  64.           });
  66.         $('.js-autocomplete').each(function() {
  67.             var autocompleteUrl = $(this).data('autocomplete-url');
  68.             $(this).autocomplete({hint: false}, [
  69.                 {
  70.                     source: function(query, cb) {
  71.                         $.ajax({
  72.                             url: autocompleteUrl+'?query='+query,
  73.                         }).then(function(data) {
  74.                             cb(data.pages);
  75.                         });
  76.                     },
  77.                     displayKey: 'id',
  78.                     name: 'page',
  79.                     debounce: 500 // only request every 1/2 second
  80.                 }
  81.             ])
  82.         });
  83.       });
  84.     </script>
  85.     <script src="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.min.js"></script>
  86.     <script>
  87.     $(document).on('click', '[data-toggle="lightbox"]', function(event) {
  88.         event.preventDefault();
  89.         $(this).ekkoLightbox({
  90.             wrapping: true,
  91.         });
  92.     });
  93.     </script>
  94. {% endblock %}