templates/front/pro/pro-public.html.twig line 1

Open in your IDE?
  1. {% extends "front/base.html.twig" %}
  3. {% block title %}
  4.     {{ pro.proInfo.fullname | capitalize }}
  5. {% endblock %}
  7. {% if pro is instanceof('App\\Entity\\Coach') %}
  8.     {% set type = 'coach' %}
  9. {% elseif pro is instanceof('App\\Entity\\Club') %}
  10.     {% set type = 'club' %}
  11. {% elseif pro is instanceof('App\\Entity\\Operator') %}
  12.     {% set type = 'operator' %}
  13. {% endif %}
  15. {# Profile photo #}
  16. {% if pro.photo is fileexists('avatar_directory') %}
  17.     {% set avatar = pro.photo %}
  18. {% else %}
  19.     {% set avatar = 'default-profile.png' %}
  20. {% endif %}
  22. {# Cover photo #}
  23. {% if pro.proInfo.coverPhoto and pro.proInfo.coverPhoto is fileexists('avatar_directory') %}
  24.     {% set cover = pro.proInfo.coverPhoto %}
  25. {% else %}
  26.     {% set cover = 'cover.png' %}
  27. {% endif %}
  29. {% block stylesheets %}
  30. {% if inactive %}
  31.     <style>
  32.         body {
  33.             overflow: hidden; /* Hide scrollbars */
  34.         }
  35.     </style>
  36. {% endif %}
  37. {% endblock %}
  39. {% block body %}   
  40.     <section class="mt-0 first-section pro-public overflow-hidden-mobile" id="pro-detail">
  41.         <div class="container-fluid">
  42.             <div class="row justify-content-center">
  43.                 <div class="col-md-12 wrap-col">
  44.                     <div class="cover-wrapper">
  46.                         {% if app.user and app.user == pro %}
  47.                             <div class="preview-edit">
  48.                                 <a href="{{ path('pro_page') }}" class="btn main-btn btn-sm">{{ 'pro_page.edit_page' | trans }}</a>
  49.                                 {% if app.user.proInfo.pageVisible == false %}
  50.                                     <form action="{{ path('publish_my_page') }}" method="post">
  51.                                         <button type="submit" class="btn second-btn btn-sm">{{ 'pro_page.publish_page' | trans }}</button>
  52.                                     </form>
  53.                                 {% endif %}
  54.                             </div>
  55.                         {% endif %}
  57.                         <div class="cover-content">
  58.                             <img loading="lazy" class="cover-image" src="{{ asset('/images/profiles/' ~ cover) }}">
  59.                         </div>
  60.                     </div>
  62.                 </div>
  63.             </div>
  64.         </div>
  66.         <div class="container-fluid">
  67.             <div class="row">
  68.                 <div class="public-page-sidebar-col pro-card-col">
  69.                     <div class="pro-sidebar {{ type }}" id="pro-details-sidebar">
  70.                         <div class="pro-profile-wrap">
  71.                             <div class="profile-wrapper">
  72.                                 <img loading="lazy" class="profile-image" src="{{ asset('/images/profiles/' ~ avatar) }}">    
  73.                             </div>
  74.                         </div>
  75.                         <div class="like-wrap">
  76.                             <button class="btn btn-share" data-toggle="modal" data-target="#share-socials">
  77.                                 <i class="fal fa-arrow-square-up"></i>
  78.                             </button>
  79.                             {% if is_granted('ROLE_TRAINEE') %}
  80.                             <a href="{{ path('add_pro_favorite', {'id': pro.id}) }}" class="btn btn-like" data-update data-token="{{ csrf_token('favorite' ~ pro.id) }}">
  81.                                 <i class="fas fa-heart {% if app.user.isProFavorite(pro) %}favorite{% endif %}"></i>
  82.                             </a>
  83.                             {% else %}
  84.                             <button type="button" class="btn btn-like" data-toggle="modal" data-target="#add-to-favorite">
  85.                                 <i class="fas fa-heart"></i>
  86.                             </button>
  87.                             {% endif %}
  88.                         </div>
  90.                         {# <img loading="lazy" class="pro-profile-pic" src="{{ asset('/images/profiles/' ~ avatar) }}"> #}
  92.                         <h1 class="pro-name">{{ pro.proInfo.fullname }}</h1>
  94.                         <div class="pro-review">
  95.                             {% set averageNotes = getAverageNotes(pro)%}
  96.                             {% set average = averageNotes.total %}
  97.                             {% if average != 0 %}
  98.                                 <p class="average-note">{{ average }}</p>
  99.                                 {% for i in 1..5 %}
  100.                                     {% if average >= i %}
  101.                                         <i class="fas fa-star"></i>
  102.                                     {% else %}
  103.                                         {% if average > (i - 1) %}
  104.                                             <i class="fas fa-star-half-alt"></i>
  105.                                         {% else %}
  106.                                             <i class="far fa-star"></i>                                    
  107.                                         {% endif %}
  108.                                     {% endif %}
  109.                                 {% endfor %}
  110.                             {% else %}
  111.                                 {% for i in 1..5 %}
  112.                                 
  113.                                 <i class="fas fa-star grey-star"></i>
  114.                                     
  115.                                 {% endfor %}
  116.                             {% endif %}
  117.                             <span class="pro-review-note" data-toggle="modal" data-target="#view-notes">({{ averageNotes.count }})</span>
  118.                         </div>
  120.                         {% if pro is instanceof('App\\Entity\\Coach') %}
  121.                             <div class="pro-extra-infos">
  122.                                 <i class="fas fa-circle"></i>
  123.                                 <span class="pro-extra-text">
  124.                                     Mobilité:
  125.                                     {% if pro.isMobile %}
  126.                                         {{ 'pro_page.mobile' | trans | capitalize }}
  127.                                     {% elseif not pro.isMobile %}
  128.                                         {{ 'pro_page.static' | trans | capitalize }}
  129.                                     {% endif %}
  130.                                 </span>
  131.                             </div>
  132.                         {% endif %}
  134.                         <div class="pro-extra-infos">
  135.                             <i class="fal fa-map-marker-alt"></i>
  136.                             <span class="pro-extra-text">{{ pro.address.fullAddress }}</span>
  137.                         </div>
  138.                         
  139.                         {% if pro.telephone %}
  140.                         <div class="pro-extra-infos">
  141.                             <i class="fal fa-phone-alt"></i>
  142.                             <a class="pro-extra-text" href="tel:{{ pro.telephone }}">{{ pro.telephone }}</a>
  143.                         </div>
  144.                         {% endif %}
  145.                         <div class="pro-extra-infos email">
  146.                             <i class="fal fa-envelope"></i>
  147.                             <a class="pro-extra-text" href="mailto:{{ pro.proInfo.contactEmail }}">{{ pro.proInfo.contactEmail }}</a>
  148.                         </div>
  149.                         {% if pro.proInfo.website %}
  150.                         <div class="pro-extra-infos">
  151.                             <i class="fal fa-desktop"></i>
  152.                             <a class="pro-extra-text" href={{ pro.proInfo.website }} target="_blank">
  153.                                 {{ 'pro_page.visit_website' | trans }}
  154.                             </a>
  155.                         </div>
  156.                         {% endif %}
  157.                         {% if pro.languages | length > 0 %}
  158.                         <div class="pro-extra-infos-2">
  159.                             <p class="extra-info-title">{{ 'pro_page.languages' | trans | capitalize }}</p>
  160.                             <span class="pro-languages">
  161.                                 {% for language in pro.languages %}
  162.                                     <img loading="lazy" src="{{ asset('/images/flag/' ~ language.slug ~ '.png') }}" alt="{{ language.name }}">
  163.                                 {% endfor %}
  164.                             </span>
  165.                         </div>
  166.                         {% endif %}
  167.                         {% if pro.proInfo.facebook or pro.proInfo.twitter or pro.proInfo.instagram or pro.proInfo.linkedin or pro.proInfo.youtube %}
  168.                         <div class="pro-extra-infos-2">
  169.                             <p class="extra-info-title">{{ 'pro_page.social_network' | trans | capitalize }}</p>
  170.                             <span class="pro-social-media">
  171.                                 {% if pro.proInfo.facebook != null %}
  172.                                     <a href="{{ pro.proInfo.facebook }}" class="social-media-item"  target="_blank">
  173.                                         <i class="fab fa-facebook-f"></i>
  174.                                     </a>
  175.                                 {% endif %}
  176.                                 {% if pro.proInfo.twitter != null %}
  177.                                     <a href="{{ pro.proInfo.twitter }}" class="social-media-item" target="_blank">
  178.                                         <i class="fab fa-x-twitter"></i>
  179.                                     </a>
  180.                                 {% endif %}
  181.                                 {% if pro.proInfo.instagram != null %}
  182.                                     <a href="{{ pro.proInfo.instagram }}" class="social-media-item" target="_blank">
  183.                                         <i class="fab fa-instagram"></i>
  184.                                     </a>
  185.                                 {% endif %}
  186.                                 {% if pro.proInfo.linkedin != null %}
  187.                                     <a href="{{ pro.proInfo.linkedin }}" class="social-media-item" target="_blank">
  188.                                         <i class="fab fa-linkedin"></i>
  189.                                     </a>
  190.                                 {% endif %}
  191.                                 {% if pro.proInfo.youtube != null %}
  192.                                     <a href="{{ pro.proInfo.youtube }}" class="social-media-item" target="_blank">
  193.                                         <i class="fab fa-youtube"></i>
  194.                                     </a>
  195.                                 {% endif %}
  196.                                 {% if pro.proInfo.twitch != null %}
  197.                                     <a href="{{ pro.proInfo.twitch }}" class="social-media-item" target="_blank">
  198.                                         <i class="fab fa-twitch"></i>
  199.                                     </a>
  200.                                 {% endif %}
  201.                                 {% if pro.proInfo.tiktok != null %}
  202.                                     <a href="{{ pro.proInfo.tiktok }}" class="social-media-item" target="_blank">
  203.                                         <i class="fab fa-tiktok"></i>
  204.                                     </a>
  205.                                 {% endif %}
  206.                             </span>
  207.                         </div>
  208.                         {% endif %}
  210.                         {% if not app.user or (app.user and not app.user.isPro) %}
  212.                         <hr>
  214.                         <button class="btn main-btn w-100" data-toggle="modal" data-target="#contact">{{ 'pro_page.contact_button' | trans | capitalize }}</button>
  216.                         {% endif %}
  218.                     </div>
  219.                 </div>
  221.                 {% if not app.user or (app.user and not app.user.isPro) %}
  223.                 {% include "front/pro/_contact-modal.html.twig" with {"pro": pro, "from": "pro"} %}
  225.                 {% endif %}
  226.                 
  228.                 <!-- Modal social media share -->
  229.                 <div class="modal fade" id="share-socials" tabindex="-1" role="dialog" aria-labelledby="share-socials" aria-hidden="true">
  230.                     <div class="modal-dialog modal modal-dialog-centered" role="document">
  231.                         <div class="modal-content">
  232.                             <div class="modal-body">
  233.                                 <div class="modal-title-wrap">
  234.                                     <h5 class="modal-title">{{ "pro_page.share_pro" | trans }}</h5>
  235.                                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  236.                                         <i class="fal fa-times"></i>
  237.                                     </button>
  238.                                 </div>
  239.                                 <div class="row" id="social-networks">
  240.                                     <div class="col-3">
  241.                                     <a href="https://www.facebook.com/sharer/sharer.php?u={{ url('view_pro', {'type': type, 'slug': pro.slug}) }}" target="_blank">
  242.                                         <div class="card">
  243.                                             <div id="icon">
  244.                                                 <i class="fab fa-facebook-f"></i>
  245.                                             </div>
  246.                                         </div>
  247.                                     </a>
  248.                                     </div>
  249.                                     <div class="col-3">
  250.                                         <a href="https://twitter.com/intent/tweet?text={{ url('view_pro', {'type': type, 'slug': pro.slug}) }}" target="_blank">
  251.                                             <div class="card">
  252.                                                 <div id="icon">
  253.                                                     <i class="fab fa-x-twitter"></i>
  254.                                                 </div>
  255.                                             </div>
  256.                                         </a>
  257.                                     </div>
  258.                                     <div class="col-3">
  259.                                         <a href="https://www.linkedin.com/shareArticle?mini=true&url={{ url('view_pro', {'type': type, 'slug': pro.slug}) }}&title={{ pro.proInfo.fullname }}" target="_blank">
  260.                                             <div class="card">
  261.                                                 <div id="icon">
  262.                                                     <i class="fab fa-linkedin-in"></i>
  263.                                                 </div>
  264.                                             </div>
  265.                                         </a>
  266.                                     </div>
  267.                                     <div class="col-3">
  268.                                         <a href="https://api.whatsapp.com/send?&text={{ url('view_pro', {'type': type, 'slug': pro.slug}) }}" target="_blank">
  269.                                             <div class="card">
  270.                                                 <div id="icon">
  271.                                                     <i class="fab fa-whatsapp"></i>
  272.                                                 </div>
  273.                                             </div>
  274.                                         </a>
  275.                                     </div>
  276.                                 </div>
  277.                             </div>
  278.                         </div>
  279.                     </div>
  280.                 </div>
  281.                 
  282.                 
  284.                 <div class="public-page-content-col pro-card-col">
  285.                     
  286.                     <div class="row pro-row">
  288.                         {% if pro.proInfo.gallery | length > 0 and pro.proInfo.videos | length > 0 %}
  289.                         {% set mediaCol = 'col-lg-12 col-xl-6' %}
  290.                         {% else %}
  291.                         {% set mediaCol = 'col-lg-12' %}
  292.                         {% endif %}
  294.                         {% if pro.proInfo.gallery | length > 0 %}                    
  296.                         <div class="{{ mediaCol }} pro-col">
  297.                             <div class="pro-content-card h-100">
  298.                                 <h3 class="pro-content-card-title">{{ 'pro_page.photos' | trans | capitalize }}</h3>
  299.                                 <div class="pro-content-box media align-items-start">
  300.                                     <div class="row">
  301.                                         {% if pro.proInfo.gallery | length > 6 %}
  302.                                         <div class="col-12 text-center p-0">
  303.                                             <a data-target="#all-photos" class="all-media mb-2" data-toggle="modal">{{ 'pro_page.all_photos' | trans }}</a>
  304.                                         </div>
  305.                                         {% endif %}
  306.                                         <div class="col-12 p-0">
  307.                                             <div class="row public-photos">
  309.                                             {% for photo in pro.proInfo.gallery | reverse | slice(0, 7) %}
  311.                                                 {% if loop.index <= 6 %}
  312.                                                 
  313.                                                 <div class="img-col col-6 col-sm-4 col-lg-4">
  314.                                                     <div class="photo-item">
  315.                                                         <img loading="lazy" data-target="#all-photos" data-toggle="modal" src="{{ asset('/images/gallery/' ~ photo.name) }}" alt="{{ photo.name }}">
  316.                                                         {% if pro.proInfo.gallery | length > 6 and loop.index == 6 %}
  317.                                                             {% set galleryRest = pro.proInfo.gallery | length - 6 %}
  318.                                                             <div class="more-photos" data-target="#all-photos" data-toggle="modal">
  319.                                                                 <span>+
  320.                                                                     {{ galleryRest }}</span>
  321.                                                             </div>
  322.                                                         {% endif %}
  323.                                                     </div>
  324.                                                 </div>
  326.                                                 {% endif %}
  328.                                             {% endfor %}
  330.                                             </div>
  331.                                         </div>
  332.                                     </div>
  333.                                 </div>
  335.                                 <!-- Modal see all photos -->
  336.                                 <div class="modal fade bd-example-modal-xl" id="all-photos" tabindex="-1" role="dialog" aria-labelledby="all-photos" aria-hidden="true">
  337.                                     <div class="modal-dialog modal-xl modal-dialog-centered" role="document">
  338.                                         <div class="modal-content">
  339.                                             <div class="modal-body">
  340.                                                 <div class="modal-title-wrap">
  341.                                                     <h5 class="modal-title">{{ 'pro_page.all_photos' | trans }}</h5>
  342.                                                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  343.                                                         <i class="fal fa-times"></i>
  344.                                                     </button>
  345.                                                 </div>
  346.                                                 <div class="row public-photos">
  347.                                                     {% for photo in pro.proInfo.gallery | reverse %}
  348.                                                         <div class="img-col col-6 col-sm-6 col-md-4 col-xl-3">
  349.                                                             <div class="photo-item">
  350.                                                                 <a data-fslightbox href="{{ asset('/images/gallery/' ~ photo.name) }}">
  351.                                                                     <img loading="lazy" src="{{ asset('/images/gallery/' ~ photo.name) }}" alt="image">
  352.                                                                 </a>
  353.                                                             </div>
  354.                                                         </div>
  355.                                                     {% endfor %}
  356.                                                 </div>
  357.                                             </div>
  358.                                         </div>
  359.                                     </div>
  360.                                 </div>
  361.                             </div>
  362.                         </div>
  364.                         {% endif %}
  366.                         {% if pro.proInfo.videos | length > 0 %}
  368.                         {% if pro.proInfo.gallery | length > 0 %}
  369.                         
  370.                         {% set videoItemCol = 'col-12 col-sm-6 col-md-6 col-lg-6' %}
  372.                         {% else %}
  373.                             
  374.                         {% set videoItemCol = 'col-12 col-sm-6 col-md-6 col-lg-3' %}
  376.                         {% endif %}
  378.                         <div class="{{ mediaCol }} pro-col">
  379.                             <div class="pro-content-card h-100">
  380.                                 <h3 class="pro-content-card-title">{{ 'pro_page.videos' | trans | capitalize }}</h3>
  381.                                 <div class="pro-content-box media align-items-start">
  382.                                     {% if pro.proInfo.videos | length > 0 %}
  383.                                         <div class="row">
  384.                                             {% if pro.proInfo.videos | length > 4 %}
  385.                                             
  386.                                             <div class="col-12 text-center">
  387.                                                 <a data-target="#all-videos" class="all-media" data-toggle="modal" class="col-12 text-center">{{ 'pro_page.all_videos' | trans }}</a>
  388.                                             </div>
  389.                                             {% endif %}
  390.                                             {% for video in pro.proInfo.videos | reverse | slice(0, 4) %}
  392.                                                 <div class="video-col {{ videoItemCol }}">
  393.                                                     <div class="video-thumbnail">
  394.                                                     {% if video.type == 'youtube' %}
  395.                                                         <img loading="lazy" src="http://i1.ytimg.com/vi/{{ video.videoId }}/mqdefault.jpg" alt=" {{ video.videoId }}">
  396.                                                     {% else %}
  397.                                                         <img loading="lazy" srcset="https://vumbnail.com/{{ video.videoId }}.jpg 640w" alt="{{ video.videoId }}" />
  398.                                                     {% endif %}
  399.                                                     
  400.                                                     <button class="play" data-toggle="modal" data-target="#watch-video-{{ video.id }}">
  401.                                                         <i class="fal fa-play-circle"></i>
  402.                                                     </button>
  403.                                                     {% if pro.proInfo.videos | length > 4 and loop.last %}
  404.                                                         {% set videoRest = pro.proInfo.videos | length - 4 %}
  405.                                                         <div class="more-photos" data-target="#all-videos" data-toggle="modal">
  406.                                                             <span>+
  407.                                                                 {{ videoRest }}</span>
  408.                                                         </div>
  409.                                                     {% endif %}
  410.                                                     </div>
  411.                                                 </div>
  412.                                             {% endfor %}
  413.                                         </div>
  414.                                     {% else %}
  415.                                         <p class="empty-media">0
  416.                                             {{ 'pro_page.video' | trans | capitalize }}</p>
  417.                                     {% endif %}
  418.                                 </div>
  420.                                 <!-- Modal see all video -->
  421.                                 <div class="modal fade bd-example-modal-xl" id="all-videos" tabindex="-1" role="dialog" aria-labelledby="all-videos" aria-hidden="true">
  422.                                     <div class="modal-dialog modal-xl modal-dialog-centered" role="document">
  423.                                         <div class="modal-content">
  424.                                             <div class="modal-body">
  425.                                                 <div class="modal-title-wrap">
  426.                                                     <h5 class="modal-title">{{ 'pro_page.all_videos' | trans }}</h5>
  427.                                                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  428.                                                         <i class="fal fa-times"></i>
  429.                                                     </button>
  430.                                                 </div>
  432.                                                 <div class="row">
  433.                                                     {% for video in pro.proInfo.videos | reverse %}
  434.                                                         <div class="video-col col-12 col-sm-6 col-md-4 col-xl-3">
  435.                                                             <div class="video-thumbnail">
  436.                                                                 {% if video.type == 'youtube' %}
  437.                                                                     <img loading="lazy" src="http://i1.ytimg.com/vi/{{ video.videoId }}/mqdefault.jpg" alt=" {{ video.videoId }}">
  438.                                                                 {% else %}
  439.                                                                     <img loading="lazy" srcset="https://vumbnail.com/{{ video.videoId }}.jpg 640w" alt="{{ video.videoId }}" />
  440.                                                                 {% endif %}
  441.                                                                 <button class="play" data-toggle="modal" data-target="#watch-video-{{ video.id }}">
  442.                                                                     <i class="fal fa-play-circle"></i>
  443.                                                                 </button>
  444.                                                             </div>
  445.                                                         </div>
  446.                                                     {% endfor %}
  447.                                                 </div>
  448.                                             </div>
  449.                                         </div>
  450.                                     </div>
  451.                                 </div>
  452.                             </div>
  453.                         </div>
  455.                         {% endif %}
  457.                         {% for video in pro.proInfo.videos %}
  458.                             <!-- Modal watch video -->
  459.                             <div class="modal fade watch-video-modal" id="watch-video-{{ video.id }}" tabindex="-1" role="dialog" aria-labelledby="video" aria-hidden="true">
  460.                                 <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
  461.                                     <div class="modal-content">
  462.                                         <div class="modal-body">
  463.                                             <div class="modal-title-wrap">
  464.                                                 <h5 class="modal-title">{{ 'pro_page.watch_video' | trans }}</h5>
  465.                                                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  466.                                                     <i class="fal fa-times"></i>
  467.                                                 </button>
  468.                                             </div>
  469.                                             <div class="row">
  470.                                                 {% if video.type == 'youtube' %}
  471.                                                     <iframe class="yt_player_iframe" width="640" height="360"  id="watched-video" frameborder="0" allowfullscreen src="https://www.youtube.com/embed/{{ video.videoId }}"></iframe>
  472.                                                 {% else %}
  473.                                                     <iframe class="vi_player_iframe" width="640" height="360"  id="watched-video" frameborder="0" allowfullscreen src="https://player.vimeo.com/video/{{ video.videoId }}"></iframe>
  474.                                                 {% endif %}
  475.                                             </div>
  476.                                         </div>
  477.                                     </div>
  478.                                 </div>
  479.                             </div>
  480.                         {% endfor %}
  481.                     </div>
  483.                     {% if pro is instanceof('App\\Entity\\Coach') %}
  485.                         {% if proDescription.description != null %}
  487.                         <div class="row pro-row">
  488.                             <div class="col-lg-12 pro-col">
  489.                                 <div class="pro-content-card">
  490.                                     <h3 class="pro-content-card-title">{{ 'pro_page.about_me' | trans }}</h3>
  491.                                     <div class="pro-content-box description">
  492.                                         <p class="description-text">
  493.                                             {{ proDescription.description |nl2br }}
  494.                                         </p>
  495.                                     </div>
  496.                                 </div>
  497.                             </div>
  498.                         </div>
  500.                         {% endif %}
  502.                         <div class="row pro-row">
  503.                             <div class="col-lg-6 pro-col">
  504.                                 <div class="pro-content-card">
  505.                                     <h3 class="pro-content-card-title">{{ 'pro_page.sports' | trans | capitalize }}</h3>
  506.                                     <div class="pro-content-box sports">
  507.                                         {% for sport in pro.proInfo.sports %}
  508.                                             <span class="coach-sport-item">{{ ("sport_name." ~ sport.slug) | trans }}</span>
  509.                                         {% endfor %}
  510.                                         {% for sport in sports %}
  511.                                             {% if sport not in pro.proInfo.sports %}
  512.                                                 <span class="coach-sport-item not-sport-item">{{ ("sport_name." ~ sport.slug) | trans }}</span>
  513.                                             {% endif %}
  514.                                         {% endfor %}
  515.                                     </div>
  516.                                 </div>
  517.                             </div>
  518.                             <div class="col-lg-6 pro-col">
  519.                                 <div class="pro-content-card">
  520.                                     <h3 class="pro-content-card-title">{{ 'pro_page.areas' | trans | capitalize }}</h3>
  521.                                     <div class="pro-content-box areas">
  523.                                         {% for key, splittedArea in splittedAreas %}
  525.                                         <div class="area-wrap">
  527.                                             <div class="title-wrap">
  528.                                                 <h5 class="title">{{ key | countryName(app.request.locale) }}</h5>
  529.                                             </div>
  531.                                             {% for area in splittedArea %}
  532.                                             
  533.                                             {% if area.city == null and splittedArea | length == 1 %}
  534.                                             
  535.                                             <div class="area-item">
  536.                                                 <i class="fal fa-map-marker-alt"></i>
  537.                                                 <span class="city">{{ 'pro_page.area_country' | trans }}</span>
  538.                                             </div>
  540.                                             {% else %}
  541.                                                 
  542.                                             <div class="area-item">
  543.                                                 <i class="fal fa-map-marker-alt"></i>
  544.                                                 <span class="city">{{ area.city }}</span>
  545.                                             </div>
  547.                                             {% endif %}
  550.                                             {% endfor %}
  552.                                         </div>
  554.                                         {% endfor %}
  556.                                     </div>
  557.                                 </div>
  558.                             </div>
  559.                         </div>
  561.                         {% if pro.coachInfo.experience | length > 0 or pro.coachInfo.formation | length > 0 %}
  563.                         <div class="row pro-row">
  564.                             <div class="col-lg-12 pro-col">
  565.                                 <div class="pro-content-card">
  566.                                     <h3 class="pro-content-card-title">{{ 'pro_page.experience_formation' | trans | capitalize }}
  567.                                     </h3>
  568.                                     <div class="pro-content-box formation-experience align-items-start">
  569.                                         <div class="pro-experiences">
  571.                                             {% for experience in pro.coachInfo.experience %}
  573.                                                 <div class="experience-item">
  574.                                                     <h4 class="experience-job">{{ experience.jobTitle }}</h4>
  575.                                                     <span class="experience-domain">{{ experience.sector }}</span>
  576.                                                     <span class="experience-address">
  577.                                                         <i class="fal fa-map-marker-alt"></i>
  578.                                                         {{ experience.address }}
  579.                                                     </span>
  580.                                                     <span class="experience-period">
  581.                                                         <i class="far fa-calendar-alt"></i>
  582.                                                         {{ experience.begin }}
  583.                                                         -
  584.                                                         {{ experience.end }}
  585.                                                     </span>
  586.                                                     <p class="expererience-description">
  587.                                                         {{ experience.description |nl2br }}
  588.                                                     </p>
  589.                                                 </div>
  590.                                             {% endfor %}
  592.                                         </div>
  593.                                         <div class="pro-formations mt-3">
  595.                                             {% for formation in pro.coachInfo.formation %}
  597.                                                 <div class="formation-item">
  598.                                                     <h4 class="formation-organism">{{ formation.organisation }}</h4>
  599.                                                     <span class="formation-diploma">{{ formation.diploma }}</span>
  600.                                                     <span class="formation-period">{{ formation.begin }}
  601.                                                         -
  602.                                                         {{ formation.end }}</span>
  603.                                                 </div>
  604.                                             {% endfor %}
  605.                                         </div>
  606.                                     </div>
  607.                                 </div>
  608.                             </div>
  609.                         </div>
  610.                     {% endif %}
  612.                     {% elseif pro is instanceof('App\\Entity\\Operator') and proDescription.description != null %}
  614.                         <div class="row pro-row">
  615.                             <div class="col-lg-12 pro-col">
  616.                                 <div class="pro-content-card">
  617.                                     <h3 class="pro-content-card-title">{{ 'pro_page.about_us' | trans }}</h3>
  618.                                     <div class="pro-content-box description">
  619.                                         <p class="description-text">
  620.                                             {{ proDescription.description |nl2br }}
  621.                                         </p>
  622.                                     </div>
  623.                                 </div>
  624.                             </div>
  625.                         </div>
  627.                         <div class="row pro-row">
  628.                             <div class="col-lg-6 pro-col">
  629.                                 <div class="pro-content-card">
  630.                                     <h3 class="pro-content-card-title">{{ 'pro_page.sports' | trans | capitalize }}</h3>
  631.                                     <div class="pro-content-box sports">
  632.                                         {% for sport in pro.proInfo.sports %}
  633.                                             <span class="coach-sport-item">{{ ("sport_name." ~ sport.slug) | trans }}</span>
  634.                                         {% endfor %}
  635.                                         {% for sport in sports %}
  636.                                             {% if sport not in pro.proInfo.sports %}
  637.                                                 <span class="coach-sport-item not-sport-item">{{ ("sport_name." ~ sport.slug) | trans }}</span>
  638.                                             {% endif %}
  639.                                         {% endfor %}
  640.                                     </div>
  641.                                 </div>
  642.                             </div>
  643.                             <div class="col-lg-6 pro-col">
  644.                                 <div class="pro-content-card">
  645.                                     <h3 class="pro-content-card-title">{{ 'pro_page.areas' | trans | capitalize }}</h3>
  646.                                     <div class="pro-content-box areas">
  648.                                         {% for key, splittedArea in splittedAreas %}
  650.                                         <div class="area-wrap">
  652.                                             <div class="title-wrap">
  653.                                                 <h5 class="title">{{ key | countryName(app.request.locale) }}</h5>
  654.                                             </div>
  656.                                             {% for area in splittedArea %}
  657.                                             
  658.                                             {% if area.city == null and splittedArea | length == 1 %}
  659.                                             
  660.                                             <div class="area-item">
  661.                                                 <i class="fal fa-map-marker-alt"></i>
  662.                                                 <span class="city">{{ 'pro_page.area_country' | trans }}</span>
  663.                                             </div>
  665.                                             {% else %}
  666.                                                 
  667.                                             <div class="area-item">
  668.                                                 <i class="fal fa-map-marker-alt"></i>
  669.                                                 <span class="city">{{ area.city }}</span>
  670.                                             </div>
  672.                                             {% endif %}
  675.                                             {% endfor %}
  677.                                         </div>
  679.                                         {% endfor %}
  681.                                     </div>
  682.                                 </div>
  683.                             </div>
  684.                         </div>
  686.                     {% elseif pro is instanceof('App\\Entity\\Club')  %}
  688.                         {% if proDescription.description != null %}
  689.                             <div class="row pro-row">
  690.                                 <div class="col-lg-12 pro-col">
  691.                                     <div class="pro-content-card">
  692.                                         <h3 class="pro-content-card-title">{{ 'pro_page.about_us' | trans }}</h3>
  693.                                         <div class="pro-content-box description">
  694.                                             <p class="description-text">
  695.                                                 {{ proDescription.description |nl2br }}
  696.                                             </p>
  697.                                         </div>
  698.                                     </div>
  699.                                 </div>
  700.                             </div>
  701.                         {% endif %}
  703.                         <div class="row pro-row">
  704.                             <div class="col-lg-12 pro-col">
  705.                                 <div class="pro-content-card">
  706.                                     <h3 class="pro-content-card-title">{{ 'pro_page.availabilities' | trans | capitalize }}</h3>
  707.                                     
  708.                                     <div class="pro-content-box sport-availabilities">
  709.                                         <div class="availability-header">
  710.                                             <span class="sport"></span>
  711.                                             <div class="month-list">
  712.                                                 <span class="month">{{ "short_month.january" | trans }}</span>
  713.                                                 <span class="month">{{ "short_month.february" | trans }}</span>
  714.                                                 <span class="month">{{ "short_month.march" | trans }}</span>
  715.                                                 <span class="month">{{ "short_month.april" | trans }}</span>
  716.                                                 <span class="month">{{ "short_month.may" | trans }}</span>
  717.                                                 <span class="month">{{ "short_month.june" | trans }}</span>
  718.                                                 <span class="month">{{ "short_month.july" | trans }}</span>
  719.                                                 <span class="month">{{ "short_month.august" | trans }}</span>
  720.                                                 <span class="month">{{ "short_month.september" | trans }}</span>
  721.                                                 <span class="month">{{ "short_month.october" | trans }}</span>
  722.                                                 <span class="month">{{ "short_month.november" | trans }}</span>
  723.                                                 <span class="month">{{ "short_month.december" | trans }}</span>
  724.                                             </div>
  725.                                         </div>
  727.                                         {% for availability in pro.availabilities %}
  729.                                         <div class="availability-content">
  730.                                             <span class="pro-sport-item">{{ ("sport_name." ~ availability.sport.slug) | trans }}</span>
  731.                                             <div class="availability-list">
  733.                                                 {% for month in months %}
  735.                                                 <span class="item">
  737.                                                     {% if month in availability.availabilities | join(', ')  %}
  738.                                                     
  739.                                                         <i class="fas fa-check"></i>
  741.                                                     {% else %}
  743.                                                         <i class="fas fa-times"></i>
  745.                                                     {% endif %}
  747.                                                 </span>
  749.                                                 {% endfor %}
  750.                                                 
  751.                                             </div>
  752.                                         </div>
  754.                                         {% endfor %}
  756.                                     </div>
  757.                                         
  758.                                 </div>
  759.                             </div>
  760.                         </div>
  761.                     {% endif %}
  763.                     {% if pro.proInfo.sponsors | length != 0 %}
  764.                         <div class="row pro-row">
  765.                             <div class="col-lg-12 pro-col">
  766.                                 <div class="pro-content-card">
  767.                                     <h3 class="pro-content-card-title">{{ 'pro_page.sponsors' | trans | capitalize }}
  768.                                     </h3>
  769.                                     <div class="pro-content-box sponsor">
  771.                                         <div class="pro-sponsor-slider">
  773.                                             {% for sponsor in pro.proInfo.sponsors %}
  775.                                                 <div class="pro-sponsor-item">
  776.                                                     <div class="pro-sponsor-img">
  777.                                                         <img loading="lazy" src="{{ asset('/images/partners/' ~ sponsor.logo) }}" alt="{{ sponsor.name }}">
  778.                                                     </div>
  779.                                                     <span class="pro-sponsor-name">{{ sponsor.name }}</span>
  780.                                                 </div>
  781.                                             {% endfor %}
  782.                                         </div>
  783.                                     </div>
  784.                                 </div>
  785.                             </div>
  786.                         </div>
  787.                     {% endif %}
  789.                     {% if pro is instanceof('App\\Entity\\Operator') %}
  790.                         {% if pro.proInfo.labels | length != 0 %}
  791.                             <div class="row pro-row">
  792.                                 <div class="col-lg-12 pro-col">
  793.                                     <div class="pro-content-card">
  794.                                         <h3 class="pro-content-card-title">{{ 'pro_page.labels' | trans | capitalize }}
  795.                                         </h3>
  796.                                         <div class="pro-content-box label">
  798.                                             <div class="pro-label-slider">
  800.                                                 {% for label in pro.proInfo.labels %}
  802.                                                     <div class="pro-label-item">
  803.                                                         <div class="pro-label-img">
  804.                                                             <img loading="lazy" src="{{ asset('/images/labels/' ~ label.logo) }}" alt="{{ label.name }}">
  805.                                                         </div>
  806.                                                         <span class="pro-label-name">{{ label.name }}</span>
  807.                                                     </div>
  808.                                                 {% endfor %}
  809.                                             </div>
  810.                                         </div>
  811.                                     </div>
  812.                                 </div>
  813.                             </div>
  814.                         {% endif %}
  815.                     {% endif %}
  817.                     {% if pro is instanceof('App\\Entity\\Club') %}
  818.                         <div class="row pro-row">
  819.                             <div class="col-lg-12 pro-col">
  820.                                 <div class="pro-content-card">
  821.                                     
  822.                                     {% if pro.clubInfo.insurance or pro.clubInfo.swimmingpool or pro.clubInfo.gym or pro.clubInfo.seminarRoom or pro.clubInfo.restaurant or pro.clubInfo.bar %}
  824.                                     <h3 class="pro-content-card-title">{{ 'pro_page.about_club' | trans }}</h3>
  825.                                     
  826.                                     <div class="club-infrastructures">
  827.                                         {% if pro.clubInfo.insurance %}
  828.                                             <div class="infrastructure-item">
  829.                                                 <img loading="lazy" src="{{ asset('/images/icons/assurance.svg') }}">
  830.                                                 <span class="infrastructure-text">{{ "pro_page.insurance" | trans }}</span>
  831.                                             </div>
  832.                                         {% endif %}
  833.                                         {% if pro.clubInfo.swimmingpool %}
  834.                                             <div class="infrastructure-item">
  835.                                                 <img loading="lazy" src="{{ asset('/images/icons/piscine.svg') }}">
  836.                                                 <span class="infrastructure-text">{{ "pro_page.swimmingpool" | trans }}</span>
  837.                                             </div>
  838.                                         {% endif %}
  839.                                         {% if pro.clubInfo.gym %}
  840.                                             <div class="infrastructure-item">
  841.                                                 <img loading="lazy" src="{{ asset('/images/icons/training.svg') }}">
  842.                                                 <span class="infrastructure-text">{{ "pro_page.gym" | trans }}</span>
  843.                                             </div>
  844.                                         {% endif %}
  845.                                         {% if pro.clubInfo.seminarRoom %}
  846.                                             <div class="infrastructure-item">
  847.                                                 <img loading="lazy" src="{{ asset('/images/icons/seminar-room.svg') }}">
  848.                                                 <span class="infrastructure-text">{{ "pro_page.seminar" | trans }}</span>
  849.                                             </div>
  850.                                         {% endif %}
  851.                                         {% if pro.clubInfo.restaurant %}
  852.                                             <div class="infrastructure-item">
  853.                                                 <img loading="lazy" src="{{ asset('/images/icons/restaurant.svg')}}">
  854.                                                 <span class="infrastructure-text">{{ "pro_page.restaurant" | trans }}</span>
  855.                                             </div>
  856.                                         {% endif %}
  857.                                         {% if pro.clubInfo.bar %}
  858.                                             <div class="infrastructure-item">
  859.                                                 <img loading="lazy" src="{{ asset('/images/icons/bar.svg') }}">
  860.                                                 <span class="infrastructure-text">{{ "pro_page.bar" | trans }}</span>
  861.                                             </div>
  862.                                         {% endif %}
  863.                                     </div>
  865.                                     {% endif %}
  867.                                     <h3 class="pro-content-card-title mt-3">{{ "page_course_detail.fields_tables" | trans }}</h3>
  869.                                     <div class="club-infrastructures terrains">
  870.                                     
  871.                                         {% for court in pro.clubInfo.courtInfos %}
  873.                                             {% if court.nbOpen > 0 or court.nbSemiOpen > 0 or court.nbCovered > 0 %}
  875.                                             <div class="infrastructure-item">
  876.                                                 <img loading="lazy" src="{{ asset('/images/icons/' ~ court.sport.icon ) }}">
  877.                                                 <span class="infrastructure-text">
  878.                                                     {{ ("sport_name." ~ court.sport.slug) | trans }}</span>
  879.                                                 <div class="terrains-count">
  881.                                                     {% if court.nbOpen > 0 %}
  882.                                                     <h5 class="count">
  883.                                                         <span>{{court.nbOpen}}</span>
  884.                                                         {{ "page_course_detail.outdoor" | trans }}
  885.                                                     </h5>
  886.                                                     {% endif %}
  888.                                                     {% if court.nbSemiOpen > 0 %}
  889.                                                     <h5 class="count">
  890.                                                         <span>{{court.nbSemiOpen}}</span>
  891.                                                         {{ "page_course_detail.semi_indoor" | trans }}
  892.                                                     </h5>
  893.                                                     {% endif %}
  895.                                                     {% if court.nbCovered > 0 %}
  896.                                                     <h5 class="count">
  897.                                                         <span>{{court.nbCovered}}</span>
  898.                                                         {{ "page_course_detail.indoor" | trans }}
  899.                                                     </h5>
  900.                                                     {% endif %}
  901.                                                     
  902.                                                 </div>
  903.                                             </div>
  905.                                             {% endif %}
  907.                                         {% endfor %}
  908.                                     </div>
  909.                                 </div>
  910.                             </div>
  911.                         </div>
  912.                     {% endif %}
  914.                     {% if courses | length > 0 %}
  915.                         <div class="row pro-courses-row pro-row">
  916.                             <div class="col-lg-12 pro-col">
  917.                                 <div class="main-title mb-5">
  918.                                     <h1 class="title-text">{{ "pro_page.courses_offered" | trans }}</h1>
  919.                                 </div>
  920.                                 <div class="pro-courses-grid">
  921.                                     {% for course in courses %}
  922.                                         {% if course | nextdate(startingDate).begin != null %}
  923.                                             
  924.                                                 {% include "front/course/_course-card.html.twig" %}
  925.                                             
  926.                                         {% endif %}
  927.                                     {% endfor %}
  928.                                 </div>
  929.                             </div>
  930.                         </div>
  931.                     {% endif %}
  933.                     {% if partnershipCourses | length > 0 %}
  934.                         <div class="row pro-courses-row pro-row">
  935.                             <div class="col-lg-12 pro-col">
  936.                                 <div class="main-title mb-5">
  937.                                     <h1 class="title-text">Stages partenaires</h1>
  938.                                 </div>
  939.                                 <div class="pro-courses-grid">
  940.                                     {% for course in partnershipCourses %}
  941.                                         {% if course | nextdate(startingDate).begin != null %}
  942.                                             
  943.                                                 {% include "front/course/_course-card.html.twig" %}
  944.                                             
  945.                                         {% endif %}
  946.                                     {% endfor %}
  947.                                 </div>
  948.                             </div>
  949.                         </div>
  950.                     {% endif %}
  952.                     {% if pro is instanceof('App\\Entity\\Coach') or pro is instanceof('App\\Entity\\Operator') %}
  953.                         {% if clubPartners | length > 0 %}
  954.                             <div class="row pro-row">
  955.                                 <div class="col-lg-12 pro-col">
  956.                                     <div class="main-title mb-5">
  957.                                         <h1 class="title-text">{{ "pro_partner_page.partners_clubs" | trans }}</h1>
  958.                                     </div>
  959.                                     <div class="row partners-wrapper club-partners">
  960.                                         {% for pro in clubPartners %}
  961.                                             {% if pro.owner %}
  962.                                                 {% include "front/pro/_pro-card.html.twig" with {'pro': pro.owner} %}
  963.                                             {% endif %}
  964.                                         {% endfor %}
  965.                                     </div>
  966.                                 </div>
  967.                             </div>
  968.                         {% endif %}
  969.                     {% endif %}
  971.                     {% if pro is instanceof('App\\Entity\\Club') or pro is instanceof('App\\Entity\\Operator') %}
  972.                         {% if coachPartners | length > 0 %}
  973.                             <div class="row pro-row">
  974.                                 <div class="col-lg-12 pro-col">
  975.                                     <div class="main-title mb-5">
  976.                                         <h1 class="title-text">{{ "pro_partner_page.partners_coachs" | trans }}</h1>
  977.                                     </div>
  978.                                     <div class="row partners-wrapper coach-partners">
  979.                                         {% for pro in coachPartners %}
  980.                                             {% if pro.owner %}
  981.                                                 {% include "front/pro/_pro-card.html.twig" with {'pro': pro.owner} %}
  982.                                             {% endif %}
  983.                                         {% endfor %}
  984.                                     </div>
  985.                                 </div>
  986.                             </div>
  987.                         {% endif %}
  988.                     {% endif %}
  989.                 </div>
  991.             </div>
  992.         </div>
  993.         {% include "front/pro/_pro-review.html.twig" with {"pro": pro} %}
  994.     </section>
  996.     {% if inactive %}
  997.         {% if app.user == pro %}
  998.             <div id="inactive-pro">
  999.                 <h2>{{ "pro_page.self_inactive" | trans }}</h2>
  1000.                 <a class="btn btn-get-subscription" href="{{ path('select_subscription') }}">{{ "pro_subscription.select_subscription" | trans }}</a>
  1001.             </div>
  1002.         {% else %}
  1003.             <div id="inactive-pro"><h2>{{ pro.proInfo.fullname | capitalize }} {{ "pro_page.inactive" | trans }}</h2></div>
  1004.         {% endif %}
  1005.     {% endif %}
  1007. {% endblock %}
  1009. {% block javascript %}
  1011.     {% if inactive %}
  1012.     <script>
  1013.         const header = $('header')
  1014.         $(function () {
  1015.             header.css('background-color', '#fff');
  1016.             header.css('box-shadow', '4px 4px 12px rgb(164 160 160 / 25%)');
  1017.         })
  1018.     </script>
  1019.     {% endif %}
  1020.     
  1021.     {{ parent() }}
  1022.     {{ encore_entry_script_tags('pro-public') }}
  1023.     {{ encore_entry_script_tags('search') }}
  1026. {% endblock %}