templates/Nordinfo/Main/parts/card.html.twig line 1

Open in your IDE?
  1. {% if type == 'contact' %}
  2.   <div class="cardContact">
  3.     <div class="cardContact__inner">
  4.       <div>
  5.         <div class="cardContact__img"><img
  6.             src="{{ img_src }}" alt=""></div>
  7.       </div>
  8.       <div>
  9.         <div class="cardContact__name">{{ title }}</div>
  10.         <div class="cardContact__desc">{{ description }}</div>
  11.       </div>
  12.       <div><a href="{{ url }}">Contacter</a></div>
  13.     </div>
  14.   </div>
  15. {% elseif type == 'organisation' %}
  16.   {% if is_map == true %}
  17.     {% if is_organization_4|default and is_organization_4 == true %}
  18.       <li>
  19.         <a href="https://www.google.com/maps/search/?api=1&query={{ organization }}" class="cardContact --map" target="_blank" title="Itinéraire via Google Maps">
  20.           <div class="cardContact__inner">
  21.             <div>
  22.               <div class="cardContact__img">
  23.                 <iframe allowfullscreen="allowfullscreen" height="100%"
  24.                         src="https://maps.google.com/maps?q={{ organization }}&z=12&amp;output=embed"
  25.                         style="border:0" width="100%"></iframe>
  26.               </div>
  27.             </div>
  28.             <div>
  29.               <div class="cardContact__name" data-card-map>{{ organization|raw }}</div>
  30.             </div>
  31.           </div>
  32.         </a>
  33.       </li>
  34.     {% else %}
  35.       {% if is_elastic_search|default and is_elastic_search == true %}
  36.         <a href="https://www.google.com/maps/search/?api=1&query={% if organization['longitude']|length == 0 or organization['latitude'] == 0 %}{{ organization['rue'] }}, {{ organization['codePostal'] }} {{ organization['ville'] }}{% else %}{{ organization['longitude'] }},{{ organization['latitude'] }}{% endif %}" target="_blank" class="cardContact --map" title="Itinéraire via Google Maps">
  37.           <div class="cardContact__inner">
  38.             <div>
  39.               <div class="cardContact__img">
  40.                 {% if organization['longitude']|length == 0 or organization['latitude'] == 0 %}
  41.                   <iframe allowfullscreen="allowfullscreen" height="100%"
  42.                           src="https://maps.google.com/maps?q={{ organization['rue'] }}, {{ organization['codePostal'] }} {{ organization['ville'] }}&z=12&amp;output=embed"
  43.                           style="border:0" width="100%"></iframe>
  44.                 {% else %}
  45.                   <iframe allowfullscreen="allowfullscreen" height="100%"
  46.                           src="https://maps.google.com/maps?q={{ organization['longitude'] }},{{ organization['latitude'] }}&z=12&amp;output=embed"
  47.                           style="border:0" width="100%"></iframe>
  48.                 {% endif %}
  49.               </div>
  50.             </div>
  51.             <div>
  52.               <div class="cardContact__name" data-card-map>{{ organization['title'] }}</div>
  53.               <div class="cardContact__desc">{{ organization['subtitle'] }}</div>
  54.             </div>
  55.           </div>
  56.         </a>
  57.       {% else %}
  58.         <a href="https://www.google.com/maps/search/?api=1&query={% if organization.longitude|length == 0 or organization.latitude == 0 %}{{ organization.rue }}, {{ organization.codePostal }} {{ organization.ville }}{% else %}{{ organization.longitude }},{{ organization.latitude }}{% endif %}" target="_blank" class="cardContact --map" title="Itinéraire via Google Maps">
  59.           <div class="cardContact__inner">
  60.             <div>
  61.               <div class="cardContact__img">
  62.                 {% if organization.longitude|length == 0 or organization.latitude == 0 %}
  63.                   <iframe allowfullscreen="allowfullscreen" height="100%"
  64.                           src="https://maps.google.com/maps?q={{ organization.rue }}, {{ organization.codePostal }} {{ organization.ville }}&z=12&amp;output=embed"
  65.                           style="border:0" width="100%"></iframe>
  66.                 {% else %}
  67.                   <iframe allowfullscreen="allowfullscreen" height="100%"
  68.                           src="https://maps.google.com/maps?q={{ organization.longitude }},{{ organization.latitude }}&z=12&amp;output=embed"
  69.                           style="border:0" width="100%"></iframe>
  70.                 {% endif %}
  71.               </div>
  72.             </div>
  73.             <div>
  74.               <div class="cardContact__name" data-card-map>{{ organization.title }}</div>
  75.               <div class="cardContact__desc">{{ organization.subtitle }}</div>
  76.             </div>
  77.           </div>
  78.         </a>
  79.       {% endif %}
  80.     {% endif %}
  81.     <script>
  82.       (function() {
  83.         function wrapTextBeforeFirstComma(inputString) {
  84.           // Find the index of the first comma in the input string
  85.           const commaIndex = inputString.indexOf(',');
  86.           // If there is no comma in the input string, return the input string as is
  87.           if (commaIndex === -1) {
  88.             return inputString;
  89.           }
  90.           // Extract the text before the first comma
  91.           const textBeforeComma = inputString.slice(0, commaIndex);
  92.           // Wrap the text before the first comma in a span HTML element
  93.           const wrappedText = `<strong>${textBeforeComma}</strong>`;
  94.           // Return the input string with the text before the first comma wrapped in a span HTML element
  95.           return inputString.replace(textBeforeComma, wrappedText);
  96.         }
  97.         const cardsMap = document.querySelectorAll('[data-card-map]')
  98.         for (let i = 0; i < cardsMap.length; i++) {
  99.           const nameCardMapText = cardsMap[i].innerText
  100.           cardsMap[i].innerText = nameCardMapText.replace(/,(?=[^\s])/g, ", ")
  101.           cardsMap[i].innerHTML = wrapTextBeforeFirstComma(cardsMap[i].innerText)
  102.         }
  103.       })()
  104.     </script>
  105.   {% else %}
  106.     {% if is_elastic_search|default and is_elastic_search == true %}
  107.       <div class="cardContact">
  108.         <div class="cardContact__inner">
  109.           <div>
  110.             <div class="cardContact__img">
  111.               <img src="{{ asset('img/icons/home.png') }}" alt="{{ organization['title'] }}">
  112.             </div>
  113.           </div>
  114.           <div>
  115.             <div class="cardContact__name">{{ organization['title'] }}</div>
  116.             <div class="cardContact__desc">{{ organization['subtitle'] }}</div>
  117.           </div>
  118.           <div><a href="{{ path('organisation_detail', {'id': organization['id']}) }}">Contacter</a></div>
  119.         </div>
  120.       </div>
  121.     {% else %}
  122.       <div class="cardContact">
  123.         <div class="cardContact__inner">
  124.           <div>
  125.             <div class="cardContact__img">
  126.               <img src="{{ asset('img/icons/home.png') }}" alt="{{ organization.title }}">
  127.             </div>
  128.           </div>
  129.           <div>
  130.             <div class="cardContact__name">{{ organization.title }}</div>
  131.             <div class="cardContact__desc">{{ organization.subtitle }}</div>
  132.           </div>
  133.           <div><a href="{{ path('organisation_detail', {'id': organization.id}) }}">Contacter</a></div>
  134.         </div>
  135.       </div>
  136.     {% endif %}
  137.   {% endif %}
  138. {% elseif type == 'resource' %}
  139.   <a href="{{ url }}"
  140.      class="linkBlock linkBlock--download" download="">
  141.     <div class="linkBlock__inner">
  142.       <div><span class="linkBlock__icon"><svg aria-hidden="true" id="f3ce6478-5c65-4999-af52-59a99b9cbf14" data-name="Layer 1"
  143.                                               xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path
  144.               d="M481.79,453.6H309.33L463.76,275.91a24.2,24.2,0,1,0-36.54-31.74L312.42,376.25V34.2a24.21,24.21,0,0,0-48.41,0V376.78L148.75,244.15a24.2,24.2,0,1,0-36.53,31.74L266.66,453.6H94.21a24.2,24.2,0,1,0,0,48.4H481.79a24.2,24.2,0,0,0,0-48.4Z"></path></svg></span>
  145.       </div>
  146.       <div><span>{{ title }} (<span>pdf</span> - 0.85 <abbr title="mégaoctet">Mo</abbr>)</span></div>
  147.     </div>
  148.   </a>
  149. {% elseif type == 'link-external' %}
  150.   <a href="{{ url }}" class="linkBlock linkBlock--external">
  151.     <div class="linkBlock__inner">
  152.       <div><span class="linkBlock__icon"><svg id="f2c09b3a-291a-4f9b-af4e-4c54c8628938" data-name="Layer 1" aria-hidden="true"
  153.                                               xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.62 460.76"><g
  154.               id="a923b6ed-2241-4971-af5b-20b676d74906" data-name="Path 691"><path
  155.                 d="M193.42,486.38l-4.1-.84-27.54-1.45-4.17-2.26a132.48,132.48,0,0,1-96.85-78.05,279.57,279.57,0,0,1-12.59-46.6l-.48-2.71L49.84,323c1.71-6.51,3.28-12.39,5.21-18.24A137,137,0,0,1,92.4,246.46l28.65-25.78c13.14-12.56,30.74-14.74,44.3-5.17l-27.58,39c6.1,4.28,13.55,3,15.85,1.09l-29,26.15a88.92,88.92,0,0,0-24.11,37.82c-1.45,4.41-2.63,8.78-3.81,13.23l-1,18.58a231.66,231.66,0,0,0,9.5,34.86c10.91,25.29,34.82,44.1,63.41,49l4,1.05c.49.16,1,.35,1.48.54l13.33.7c.5-.12,1-.24,1.51-.33l3.33-.47a89.55,89.55,0,0,0,56.45-25c15.75-14.44,31-28.44,46.57-41.95a88.54,88.54,0,0,0,31.86-55.05c6-32.36-6.12-64.32-31.62-84.07l29.26-37.78a132.88,132.88,0,0,1,49.47,130,135.32,135.32,0,0,1-48.16,83.47c-14.66,12.78-29.64,26.5-44.63,40.22a137,137,0,0,1-83.31,37.69Zm58.16-167.7A134.55,134.55,0,0,1,202.08,187a135.87,135.87,0,0,1,47.17-81.74C259.87,96,270.82,86,281.71,76.1L297.23,62a134.34,134.34,0,0,1,80.41-35.07,30.08,30.08,0,0,1,4.44-1l2.26-.33,30.33,1.59,3.22,1.9A136.7,136.7,0,0,1,525,135.83c.77,3.87,1.35,7.73,1.91,11.58l1.45,9.08-2.52,32.57-4,12.72a128.1,128.1,0,0,1-35.89,60.09c-9.5,9.2-20.86,20-33.11,29.72L423.1,254.15c10.52-8.35,20.88-18.21,29.75-26.8a81.47,81.47,0,0,0,23-38.64l3.52-11.21,1-18.41-.75-4.82c-.42-3-.84-6-1.44-8.88A89.08,89.08,0,0,0,407,75.67a36,36,0,0,1-4.88-1.26L388,73.66a27.36,27.36,0,0,1-3.88.69,87.81,87.81,0,0,0-54.62,22.93l-15.57,14.15c-11.15,10.15-22.37,20.38-33.68,30.23a88.87,88.87,0,0,0-31.09,53.75c-6.24,32.78,6,65.39,31.89,85.61Z"
  156.                 transform="translate(-47.69 -25.62)"></path></g></svg></span></div>
  157.       <div><span>{{ title }}</span></div>
  158.     </div>
  159.   </a>
  160. {% elseif type == 'link-internal' %}
  161.   <a href="{{ url }}" class="linkBlock linkBlock--internal">
  162.     <div class="linkBlock__inner">
  163.       <div><span class="linkBlock__icon"><svg id="f2c09b3a-291a-4f9b-af4e-4c54c8628938" data-name="Layer 1"
  164.                                               xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 480.62 460.76"><g
  165.               id="a923b6ed-2241-4971-af5b-20b676d74906" data-name="Path 691"><path
  166.                 d="M193.42,486.38l-4.1-.84-27.54-1.45-4.17-2.26a132.48,132.48,0,0,1-96.85-78.05,279.57,279.57,0,0,1-12.59-46.6l-.48-2.71L49.84,323c1.71-6.51,3.28-12.39,5.21-18.24A137,137,0,0,1,92.4,246.46l28.65-25.78c13.14-12.56,30.74-14.74,44.3-5.17l-27.58,39c6.1,4.28,13.55,3,15.85,1.09l-29,26.15a88.92,88.92,0,0,0-24.11,37.82c-1.45,4.41-2.63,8.78-3.81,13.23l-1,18.58a231.66,231.66,0,0,0,9.5,34.86c10.91,25.29,34.82,44.1,63.41,49l4,1.05c.49.16,1,.35,1.48.54l13.33.7c.5-.12,1-.24,1.51-.33l3.33-.47a89.55,89.55,0,0,0,56.45-25c15.75-14.44,31-28.44,46.57-41.95a88.54,88.54,0,0,0,31.86-55.05c6-32.36-6.12-64.32-31.62-84.07l29.26-37.78a132.88,132.88,0,0,1,49.47,130,135.32,135.32,0,0,1-48.16,83.47c-14.66,12.78-29.64,26.5-44.63,40.22a137,137,0,0,1-83.31,37.69Zm58.16-167.7A134.55,134.55,0,0,1,202.08,187a135.87,135.87,0,0,1,47.17-81.74C259.87,96,270.82,86,281.71,76.1L297.23,62a134.34,134.34,0,0,1,80.41-35.07,30.08,30.08,0,0,1,4.44-1l2.26-.33,30.33,1.59,3.22,1.9A136.7,136.7,0,0,1,525,135.83c.77,3.87,1.35,7.73,1.91,11.58l1.45,9.08-2.52,32.57-4,12.72a128.1,128.1,0,0,1-35.89,60.09c-9.5,9.2-20.86,20-33.11,29.72L423.1,254.15c10.52-8.35,20.88-18.21,29.75-26.8a81.47,81.47,0,0,0,23-38.64l3.52-11.21,1-18.41-.75-4.82c-.42-3-.84-6-1.44-8.88A89.08,89.08,0,0,0,407,75.67a36,36,0,0,1-4.88-1.26L388,73.66a27.36,27.36,0,0,1-3.88.69,87.81,87.81,0,0,0-54.62,22.93l-15.57,14.15c-11.15,10.15-22.37,20.38-33.68,30.23a88.87,88.87,0,0,0-31.09,53.75c-6.24,32.78,6,65.39,31.89,85.61Z"
  167.                 transform="translate(-47.69 -25.62)"></path></g></svg></span></div>
  168.       <div><span>{{ title }}</span></div>
  169.     </div>
  170.   </a>
  171. {% endif %}