templates/page/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% set currentPath = path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) %}
  4. {% block title %}Ween par Aviséa
  5. {% endblock %}
  7. {% block body %}
  9. {% if is_mobile() %}
  10.     <main role="main" id="main" class="container-fluid py-5 bg_client">
  11. {% else %}
  12.     <main role="main" id="main" class="container-fluid pb-5 bg-client" {% if client.background starts with "background." %} style="background: url('/img/background/client/{{client.id}}/{{client.background}}');" {% else %} style="background-color: {{client.background}};" {% endif %}>
  13. {% endif %}
  14.     <!-- PAGE D'ACCUEIL -->
  15.         <div class="d-block d-sm-none mt-5 container px-2">
  16.             {% if is_granted('ROLE_USER') %}
  17.             {% else %}
  18.                 <div class="border bg-white text-center b-radius-5 mb-3 py-2">
  19.                     <span class="fa-sharp fa-solid fa-lock text-notice d-block avisea-homepage-lock-icon opacity-50"></span>
  20.                     <h2 class="h4 work-sans-bold l-text text-graphite my-3">Bienvenue
  21.                         <span class="fa-sharp fa-regular fa-hand-wave"></span>
  22.                     </h2>
  23.                     <p class="work-sans-medium text-carbone fs-6 px-2">Connectez-vous pour accéder au contenu !</p>
  25.                     <div class="d-flex flex-column align-items-center">
  26.                     {% if client is defined %}
  27.                         {% if client.isSecure is same as true %}
  28.                             <a href="{{path('app_login', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="btn-notice text-decoration-none work-sans-medium ns-text">Se connecter</a>
  29.                         {% else %}
  30.                             <a href="{{path('app_login_unsecure', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="btn-notice text-decoration-none work-sans-medium ns-text">Se connecter</a>
  31.                         {% endif %}
  32.                             <a href="{{path('app_register', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="text-graphite mt-2 ns-text work-sans-semi-bold">S'inscrire</a>
  33.                         {% else %}
  34.                         {{ render(controller('App\\Controller\\PageController::renderLoginRegisterBtn')) }}
  35.                     {% endif %}
  36.                         </div>
  37.                 </div>
  38.             {% endif %}
  39.         </div>
  41.         <div class="container px-2 pt-4 mb-2">
  42.         {% if is_mobile() %}
  43.             <div class="">
  44.                 <div class="card card-img-top-hp">
  45.                     <img src="{{asset('img/alt-logo/client/' ~ client.id ~ '/' ~ client.altLogo)}}" class="card-img-top" alt="">
  46.                     <div class="card-body">
  47.                         <h1 class="card-title text-graphite work-sans-bold mb-4 l-text">Informations</h1>
  48.                         <span class="fa-sharp fa-solid fa-link text-{{client.slug}} mb-2"></span>
  49.                         <a href="/document/guide-plateforme-ween.pdf" target="_blank" class="text-graphite work-sans-bold ns-text">Télécharger le guide</a>
  50.                         <p class="card-text work-sans-medium text-carbone m-text">{{client.description|raw}}</p>
  51.                     </div>
  52.                 </div>
  53.                 <div>
  54.                     <!-- Login / Regsiter card -->
  55.                     <div class="d-none d-sm-block">
  56.                         {% if is_granted('ROLE_USER') %}
  57.                             <div class="bg-white ms-4 b-radius-5 mb-3">
  58.                                 <div class="bg_secondary_client py-5 text-end b-radius-5">
  59.                                     <a href="{{path('app_my_profile')}}" class="editEncart text-graphite me-4 work-sans-medium">
  60.                                         <span class="fa-sharp fa-solid fa-pen me-1"></span>Éditer</a>
  61.                                 </div>
  62.                                 <div class="text-center pb-4">
  63.                                     <div class="bg-white mx-auto mb-4 my-account-logo-background-homepage">
  64.                                         {% if app.user.avatar != null %}
  65.                                             {{app.user.avatar.code|raw}}
  66.                                         {% else %}
  67.                                             <span class="fa-duotone fa-user-robot"></span>
  68.                                         {% endif %}
  69.                                     </div>
  70.                                     <h3 class="work-sans-bold mb-0">{{app.user.firstName}}
  71.                                         <span class="text-uppercase">{{app.user.lastName}}</span>
  72.                                     </h3>
  73.                                     <p class="mb-0 work-sans-medium">{{app.user.jobTitle}}</p>
  74.                                     {% if app.user.location != null %}
  75.                                         <p class="work-sans-medium-italic mb-0">{{app.user.location.name}}</p>
  76.                                     {% endif %}
  77.                                     <p class="work-sans-bold text-uppercase mt-1">{{app.user.client.name}}</p>
  78.                                 </div>
  79.                             </div>
  80.                         {% else %}
  81.                             <div class="bg-white ms-4 p-4 text-center b-radius-5 mb-3">
  82.                                 <span class="fa-sharp fa-solid fa-lock text-notice d-block avisea-homepage-lock-icon opacity-50"></span>
  83.                                 <h2 class="h4 work-sans-bold l-text text-graphite my-3">Bienvenue
  84.                                     <span class="fa-sharp fa-regular fa-hand-wave"></span>
  85.                                 </h2>
  86.                                 <p class="work-sans-medium m-text text-carbone">Connectez-vous pour accéder au contenu !</p>
  87.                                 <div class="d-flex flex-column align-items-center">
  88.                                     <a href="{{path('app_login', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="btn-notice text-decoration-none work-sans-medium ns-text">Se connecter</a>
  89.                                     <a href="{{path('app_register', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="text-graphite mt-2 ns-text work-sans-semi-bold">S'inscrire</a>
  90.                                 </div>
  91.                             </div>
  92.                         {% endif %}
  93.                     </div>
  95.                     {% for clientProduct in client.clientProducts %}
  96.                         {% if clientProduct.product.name == 'Defi-inclusion' and app.user != null and userProduct != null and clientProduct.isActive == 1 and clientProduct.hasLocationLadder  == 1 %}
  97.                             {% if locationsArray is defined and locationsArray is not empty %}
  98.                                 <div class="bg-white mt-4 px-4 py-4 b-radius-5">
  99.                                     <div class="d-flex align-items-center mb-3">
  100.                                         <span class="fa-sharp fa-solid fa-crown text-{{client.slug}}"></span>
  101.                                         <h5 class="work-sans-bold ms-2 mb-0">Classement du défi de l'inclusion</h3>
  102.                                     </div>
  103.                                     <div style="max-height: 385px;" class="overflow-auto">
  104.                                         <table class="table table-striped">
  105.                                             <tbody>
  106.                                                 {% for location, score in locationsArray %}
  107.                                                     <tr>
  108.                                                         <td class="ps-4">
  109.                                                             {% if loop.index <= 3 %}
  110.                                                                 <span class="fa-sharp fa-solid fa-trophy text-{{client.slug}} me-2"></span>
  111.                                                             {% else %}
  112.                                                                 <span class="fa-sharp fa-solid fa-medal text-{{client.slug}} me-2"></span>
  113.                                                             {% endif %}
  114.                                                             {{loop.index}}
  115.                                                         </td>
  116.                                                         <td class="text-uppercase">Team {{location}}</td>
  117.                                                         <td class="ps-4">{{score}}</td>
  118.                                                     </tr>
  119.                                                 {% endfor %}
  120.                                             </tbody>
  121.                                         </table>
  122.                                     </div>
  123.                                 </div>
  124.                             {% endif %}
  125.                         {% elseif clientProduct.product.slug == 'autodiagnostic-handicap' and userProduct == null and clientProduct.isActive == 1 and clientProduct.startAt|date("Y-m-d") >= "now"|date("Y-m-d") %}
  126.                             <div class="bg-white pt-4 px-2 pb-5 b-radius-5 d-flex align-items-start position-relative mb-5 mt-5">
  127.                                 <span class="fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  128.                                 <div class="ms-3">
  129.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic Handicap</h2>
  130.                                     <p class="work-sans-medium text-carbone ns-text pe-2">En moins de deux minutes et 8 questions, il vous permet de faire le point sur votre situation et d'identifier les acteurs pour vous accompagner.</p>
  131.                                     <div class="row">
  132.                                         <small class="col-12 text-smoke work-sans-medium ns-text mb-4 mt-3">8 questions (2min)</small>
  133.                                         {% for question in clientProduct.product.diagQuestions %}
  134.                                             {% if question.position == 1 %}
  135.                                                 <div class="col-12 position-relative">
  136.                                                 <a href="{{path('app_auto_diagnostic_quizz', {'clientSlug': client.slug, 'id': question.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  137.                                                 <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  138.                                                 <span class="fa-sharp fa-solid fa-arrow-right"></span>
  139.                                                 </a>
  140.                                                 </div>
  141.                                             {% endif %}
  142.                                         {% endfor %}
  143.                                     </div>
  144.                                 </div>
  145.                             </div>
  146.                         {% elseif clientProduct.product.slug == 'autodiagnostic-handicap-2' and userProduct == null and clientProduct.isActive == 1 and clientProduct.startAt|date("Y-m-d") >= "now"|date("Y-m-d") %}
  147.                             <div class="bg-white pt-4 px-2 pb-5 b-radius-5 d-flex align-items-start position-relative mb-5 mt-5">
  148.                                 <span class="fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  149.                                 <div class="ms-3">
  150.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic : faites le point sur votre situation de santé au travail</h2>
  151.                                     <p class="work-sans-medium text-carbone ns-text pe-2">En moins de 5 minutes et 15 questions, il vous permet de réfléchir à l’impact éventuel de votre état de santé sur votre activité professionnelle et d’identifier des ressources adaptées à vos besoins. Ce test est anonyme et confidentiel : aucune donnée ne sera collectée ou communiquée à votre employeur. </p>
  152.                                     <div class="row">
  153.                                         <small class="col-12 text-smoke work-sans-medium ns-text mb-4 mt-3">15 questions (5min)</small>
  154.                                         {% for question in clientProduct.product.diagQuestions %}
  155.                                             {% if question.position == 1 %}
  156.                                                 <div class="col-12 position-relative">
  157.                                                 <a href="{{path('app_auto_diagnostic_quizz', {'clientSlug': client.slug, 'id': question.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  158.                                                 <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  159.                                                 <span class="fa-sharp fa-solid fa-arrow-right"></span>
  160.                                                 </a>
  161.                                                 </div>
  162.                                             {% endif %}
  163.                                         {% endfor %}
  164.                                     </div>
  165.                                 </div>
  166.                             </div>
  167.                         {% elseif clientProduct.product.slug == 'test-auditif' and userProduct == null and clientProduct.isActive == 1 and clientProduct.startAt|date("Y-m-d") <= 'now' | date('Y-m-d') %}
  168.                             <!-- Test Auditif -->
  169.                             <div class="bg-white pt-4 px-2 pb-5 b-radius-5 d-flex align-items-start position-relative mb-5 mt-2">
  170.                                 <span class="fa-sharp fa-regular fa-ear-listen text-{{client.slug}} avisea-homepage-hear-icon"></span>
  171.                                 <div class="ms-3">
  172.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Test auditif</h2>
  173.                                     <p class="work-sans-medium text-carbone ns-textt pe-2">Vous vous posez des questions quant à votre niveau d'audition ? Réalisez notre test auditif et faisons le point ensemble !</p>
  174.                                     <div class="row">
  175.                                         <small class="col-12 text-smoke work-sans-medium ns-text mb-4 mt-3">6 questions (5min)</small>
  176.                                         <div class="col-12 position-relative">
  177.                                         <a href="{{path('app_audition_test_age', {'clientSlug': client.slug, 'id': clientProduct.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  178.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span>
  179.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  180.                                         </a>
  181.                                     </div>
  182.                                     </div>
  183.                                 </div>
  184.                             </div>
  185.                         {% endif %}
  186.                     {% endfor %}
  187.                 </div>
  188.             </div>
  189.         {% else %}
  190.             <div class="d-flex justify-content-center">
  191.                 <div class="col-md-7 card card-img-top-hp">
  192.                     <img src="{{asset('img/alt-logo/client/' ~ client.id ~ '/' ~ client.altLogo)}}" class="card-img-top" alt="">
  193.                     <div class="card-body">
  194.                         <h1 class="card-title text-graphite work-sans-bold mb-4 l-text">Informations</h1>
  195.                         <span class="fa-sharp fa-solid fa-link text-{{client.slug}} mb-4"></span>
  196.                         <a href="/document/guide-plateforme-ween.pdf" target="_blank" class="ms-2 text-graphite work-sans-bold ns-text">Télécharger le guide de la plateforme</a>
  197.                         <p class="card-text work-sans-medium text-carbone m-text">{{client.description|raw}}</p>
  198.                     </div>
  199.                 </div>
  200.                 <div class="col-md-5">
  201.                     <!-- Login / Regsiter card -->
  202.                     <div class="d-none d-sm-block">
  203.                         {% if is_granted('ROLE_USER') %}
  204.                             <div class="bg-white ms-4 b-radius-5 mb-3">
  205.                                 <div class="bg_secondary_client py-5 text-end b-radius-5">
  206.                                     <a href="{{path('app_my_profile')}}" class="editEncart text-graphite me-4 work-sans-medium">
  207.                                         <span class="fa-sharp fa-solid fa-pen me-1"></span>Éditer</a>
  208.                                 </div>
  209.                                 <div class="text-center pb-4">
  210.                                     <div class="bg-white mx-auto mb-4 my-account-logo-background-homepage">
  211.                                         {% if app.user.avatar != null %}
  212.                                             {{app.user.avatar.code|raw}}
  213.                                         {% else %}
  214.                                             <span class="fa-duotone fa-user-robot"></span>
  215.                                         {% endif %}
  216.                                     </div>
  217.                                     <h3 class="work-sans-bold mb-0">{{app.user.firstName}}
  218.                                         <span class="text-uppercase">{{app.user.lastName}}</span>
  219.                                     </h3>
  220.                                     <p class="mb-0 work-sans-medium">{{app.user.jobTitle}}</p>
  221.                                     {% if app.user.location != null %}
  222.                                         <p class="work-sans-medium-italic mb-0">{{app.user.location.name}}</p>
  223.                                     {% endif %}
  224.                                     <p class="work-sans-bold text-uppercase mt-1">{{app.user.client.name}}</p>
  225.                                 </div>
  226.                             </div>
  227.                         {% else %}
  228.                             <div class="bg-white ms-4 p-4 text-center b-radius-5 mb-3">
  229.                                 <span class="fa-sharp fa-solid fa-lock text-notice d-block avisea-homepage-lock-icon opacity-50"></span>
  230.                                 <h2 class="h4 work-sans-bold l-text text-graphite my-3">Bienvenue
  231.                                     <span class="fa-sharp fa-regular fa-hand-wave"></span>
  232.                                 </h2>
  233.                                 <p class="work-sans-medium m-text text-carbone">Connectez-vous pour accéder au contenu !</p>
  234.                                 <div class="d-flex flex-column align-items-center">
  235.                                     {% if client is defined %}
  236.                                         {% if client.isSecure is same as true %}
  237.                                             <a href="{{path('app_login', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="btn-notice text-decoration-none work-sans-medium ns-text">Se connecter</a>
  238.                                         {% else %}
  239.                                             <a href="{{path('app_login_unsecure', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="btn-notice text-decoration-none work-sans-medium ns-text">Se connecter</a>
  240.                                         {% endif %}
  241.                                     <a href="{{path('app_register', {'clientSlug': client.slug, 'clientSalt': client.salt})}}" class="text-graphite mt-2 ns-text work-sans-semi-bold">S'inscrire</a>
  242.                                     {% else %}
  243.                                         {{ render(controller('App\\Controller\\PageController::renderLoginRegisterBtn')) }}
  244.                                     {% endif %}
  245.                                 </div>
  246.                             </div>
  247.                         {% endif %}
  248.                     </div>
  250.                     {% for clientProduct in client.clientProducts %}
  251.                         {% if clientProduct.product.name == 'Defi-inclusion' and app.user != null and userProduct != null and clientProduct.isActive == 1 and clientProduct.hasLocationLadder  == 1 %}
  252.                             {% if locationsArray is defined and locationsArray is not empty %}
  253.                                 <div class="bg-white ms-4 px-4 py-4 b-radius-5">
  254.                                     <div class="d-flex align-items-center mb-3">
  255.                                         <span class="fa-sharp fa-solid fa-crown text-{{client.slug}}"></span>
  256.                                         <h5 class="work-sans-bold ms-2 mb-0">Classement du défi de l'inclusion</h3>
  257.                                     </div>
  258.                                     <div style="max-height: 385px;" class="overflow-auto">
  259.                                         <table class="table table-striped">
  260.                                             <tbody>
  261.                                                 {% for location, score in locationsArray %}
  262.                                                     <tr>
  263.                                                         <td class="ps-4">
  264.                                                             {% if loop.index <= 3 %}
  265.                                                                 <span class="fa-sharp fa-solid fa-trophy text-{{client.slug}} me-2"></span>
  266.                                                             {% else %}
  267.                                                                 <span class="fa-sharp fa-solid fa-medal text-{{client.slug}} me-2"></span>
  268.                                                             {% endif %}
  269.                                                             {{loop.index}}
  270.                                                         </td>
  271.                                                         <td class="text-uppercase">Team {{location}}</td>
  272.                                                         <td class="ps-4">{{score}}</td>
  273.                                                     </tr>
  274.                                                 {% endfor %}
  275.                                             </tbody>
  276.                                         </table>
  277.                                     </div>
  278.                                 </div>
  279.                             {% endif %}
  280.                         {% endif %}
  281.                         
  282.                         {% if clientProduct.product.slug == 'autodiagnostic-handicap' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d") %}
  283.                             <div class="bg-white p-4 b-radius-5 d-flex align-items-start ms-4 position-relative mt-3">
  284.                                 <span class="fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  285.                                 <div class="ms-3">
  286.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic Handicap</h2>
  287.                                     <p class="work-sans-medium text-carbone ns-text">En moins de deux minutes et 8 questions, il vous permet de faire le point sur votre situation et d'identifier les acteurs pour vous accompagner.</p>
  288.                                     <div class="d-flex align-items-center mt-5 mb-3">
  289.                                         <small class="text-smoke work-sans-medium ns-text">8 questions (2min)</small>
  290.                                         {% for question in clientProduct.product.diagQuestions %}
  291.                                             {% if question.position == 1 %}
  292.                                                 <a href="{{path('app_auto_diagnostic_quizz', {'clientSlug': client.slug, 'id': question.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  293.                                             {% endif %}
  294.                                         {% endfor %}
  295.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  296.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  297.                                         </a>
  298.                                     </div>
  299.                                 </div>
  300.                             </div>
  301.                         {% endif %}
  302.                         {% if clientProduct.product.slug == 'autodiagnostic-handicap-2' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d") %}
  303.                             <div class="bg-white pt-4 px-2 pb-5 b-radius-5 d-flex align-items-start position-relative mb-5 mt-5 ms-4">
  304.                                 <span class="ps-2 fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  305.                                 <div class="ms-3">
  306.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic : faites le point sur votre</h2>
  307.                                     <h2 class="h4 work-sans-bold text-graphite m-text">situation de santé au travail</h2>
  308.                                     <p class="work-sans-medium text-carbone ns-text pe-3">En moins de 5 minutes et 15 questions, il vous permet de réfléchir à l’impact éventuel de votre état de santé sur votre activité professionnelle et d’identifier des ressources adaptées à vos besoins. Ce test est anonyme et confidentiel : aucune donnée ne sera collectée ou communiquée à votre employeur. </p>
  309.                                     <div class="row">
  310.                                         <small class="col-12 text-smoke work-sans-medium ns-text mb-4 mt-3">15 questions (5min)</small>
  311.                                         {% for question in clientProduct.product.diagQuestions %}
  312.                                             {% if question.position == 1 %}
  313.                                                 <div class="col-12 position-relative">
  314.                                                 <a href="{{path('app_auto_diagnostic_quizz', {'clientSlug': client.slug, 'id': question.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  315.                                                 <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  316.                                                 <span class="fa-sharp fa-solid fa-arrow-right"></span>
  317.                                                 </a>
  318.                                                 </div>
  319.                                             {% endif %}
  320.                                         {% endfor %}
  321.                                     </div>
  322.                                 </div>
  323.                             </div>
  324.                         {% endif %}
  325.                         {% if clientProduct.product.slug == 'test-auditif' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d")  %}
  326.                             <!-- Test Auditif -->
  327.                             <div class="bg-white p-4 b-radius-5 d-flex align-items-start ms-4 position-relative mt-3">
  328.                                 <span class="fa-sharp fa-regular fa-ear-listen text-{{client.slug}} avisea-homepage-hear-icon"></span>
  329.                                 <div class="ms-3">
  330.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Test auditif</h2>
  331.                                     <p class="work-sans-medium text-carbone ns-text">Vous vous posez des questions quant à votre niveau d'audition ? Réalisez notre test auditif et faisons le point ensemble !</p>
  332.                                     <div class="d-flex align-items-center mt-5 mb-3">
  333.                                         <small class="text-smoke work-sans-medium ns-text">6 questions (5min)</small>
  334.                                         <a href="{{path('app_audition_test_age', {'clientSlug': client.slug, 'id': clientProduct.id})}}" target="_blank" class="btn-notice text-decoration-none arrow-link">
  335.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span>
  336.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  337.                                         </a>
  339.                                     </div>
  340.                                 </div>
  341.                             </div>
  342.                         {% endif %}
  343.                     {% endfor %}
  344.                 </div>
  345.             </div>
  346.         {% endif %}
  348.             <!-- Carousel Flash Workshops à venir -->
  349.             {% if flashWorkshops != null %}
  350.                     {% if is_mobile() %}    
  351.                     <div class="d-flex justify-content-between mt-4 mb-3">
  352.                         
  353.                         <div class="d-flex">
  354.                             <div class="p-2 col">
  355.                                 <h2 class="fs-6 work-sans-bold"><span lang="en">Event & Flash Learning</span> à venir</h2>
  356.                             </div>
  357.                             <div class="p-2 col">
  358.                                 <div class="slick-container text-end">
  359.                                     <div class="custom-controls">
  360.                                         <button type="button" class="btn-notice carousel-prev text-decoration-none p-2 me-1">
  361.                                             <span aria-hidden="true" class="fa-sharp fa-solid fa-arrow-left text-center"></span>
  362.                                             <span class="visually-hidden">Défiler à gauche</span>
  363.                                         </button>
  364.                                         <button type="button" class="btn-notice carousel-next text-decoration-none p-2">
  365.                                             <span aria-hidden="true" class="fa-sharp fa-solid fa-arrow-right text-center"></span>
  366.                                             <span class="visually-hidden">Défiler à droite</span>
  367.                                         </button>
  368.                                     </div>
  369.                                 </div>
  370.                             </div>
  371.                         </div>
  372.                     </div>
  373.                     {% else %}
  374.                     <div id="incoming_flashworkshops" class="container bg-white b-radius-5 pb-3 mt-4">
  375.                         <div class="p-3">
  376.                             <div class="d-flex justify-content-between mt-2 mb-3">
  377.                                 <h2 class="h4 work-sans-bold"><span lang="en">Event & Flash Learning</span> à venir</h2>
  378.                                 <div class="slick-container me-3">
  379.                                     <div class="custom-controls">
  380.                                         <button type="button" class="btn-notice carousel-prev text-decoration-none me-1 p-2">
  381.                                             <span aria-hidden="true" class="fa-sharp fa-solid fa-arrow-left text-center"></span>
  382.                                             <span class="visually-hidden">Défiler à gauche</span>
  383.                                         </button>
  384.                                         <button type="button" class="btn-notice carousel-next text-decoration-none ms-1 p-2">
  385.                                             <span aria-hidden="true" class="fa-sharp fa-solid fa-arrow-right text-center"></span>
  386.                                             <span class="visually-hidden">Défiler à droite</span>
  387.                                         </button>
  388.                                     </div>
  389.                                 </div>
  390.                             </div>
  391.                         </div>
  392.                     {% endif %}
  393.                         <div class="homepage-flashworkshops">
  394.                             {% set i = 0 %}
  395.                             {% set j = 0 %}
  396.                             {% for flashWorkshop in flashWorkshops %}
  397.                                 {% set i = i + 1 %}
  398.                                 {% if flashWorkshop.flashWorkshopEntity.isOutdated != true %}
  399.                                 <div class="align-content-center card ms-3 mb-5" style="width: 18.5rem;">
  400.                                     <div class="align-self-end card h-100 border-0" >
  401.                                         <div class="position-relative">
  402.                                             {% if flashWorkshop.flashWorkshopEntity.logoProfile is defined and flashWorkshop.flashWorkshopEntity.logoProfile is not null %}
  403.                                                 <div class="badge-triangle-slider">
  404.                                                 {% if 'src' in flashWorkshop.flashWorkshopEntity.logoProfile %}
  405.                                                     <div class="froalaLogoProfile">
  406.                                                     {{flashWorkshop.flashWorkshopEntity.logoProfile|raw}}
  407.                                                     </div>
  408.                                                 {% else %}
  409.                                                     <img alt="" class="rounded" src="{{asset("img/logo/flash-workshop/logo-profile/" ~ flashWorkshop.flashWorkshopEntity.id ~ "/" ~ flashWorkshop.flashWorkshopEntity.logoProfile)}}" style="width:75px!important;">
  410.                                                 {% endif %}
  411.                                                 </div>
  412.                                             {% endif %}
  413.                                             <div class="card-img-top-mobile">{{flashWorkshop.flashWorkshopEntity.imgProfile|raw}}</div>
  414.                                             <small class="flash-workshop-card-category text-white bg-carbone b-radius-5 px-2 py-1">{{flashWorkshop.flashWorkshopEntity.flashWorkshopType.name}}</small>
  415.                                         </div>
  416.                                         <div class="card-body">
  417.                                             <h3 class="h5 card-title text-graphite work-sans-bold ns-text">{{ flashWorkshop.flashWorkshopEntity.title|length > 23 ? flashWorkshop.flashWorkshopEntity.title|slice(0, 23) ~ '…' : flashWorkshop.flashWorkshopEntity.title  }}</h3>
  418.                                             {% if flashWorkshop.flashWorkshopEntity.description is not null %}
  419.                                                 <p class="card-text work-sans-medium text-carbone ns-l">
  420.                                             {% if flashWorkshop.flashWorkshopEntity.description|striptags|length|raw > 160 %}
  421.                                                 {{flashWorkshop.flashWorkshopEntity.description|striptags|slice(0, 160)|raw}} ...
  422.                                             {% else %} 
  423.                                             {{flashWorkshop.flashWorkshopEntity.description|raw}}    
  424.                                             {% endif %}                                        
  425.                                                 </p>
  426.                                             {% endif %}
  427.                                             <ul>
  428.                                                 <li class="text-smoke d-flex align-items-center mb-3">
  429.                                                     <span class="fa-sharp fa-solid fa-microphone text-smoke"></span>
  430.                                                     <small class="text-smoke ms-2 work-sans-medium sm-text">{{flashWorkshop.flashWorkshopEntity.speaker}}</small>
  431.                                                 </li>
  432.                                                 <li class="text-smoke d-flex align-items-center mb-3">
  433.                                                     <span class="fa-sharp fa-solid fa-location-dot text-smoke"></span>
  434.                                                     {% if flashWorkshop.flashWorkshopEntity.onSite == true %}
  435.                                                         <small class="text-smoke ms-2 work-sans-medium sm-text">Dans votre agence ({{flashWorkshop.flashWorkshopEntity.duration}})</small>
  436.                                                     {% else %}
  437.                                                         <small class="text-smoke ms-2 work-sans-medium sm-text">En ligne ({{flashWorkshop.flashWorkshopEntity.duration}})</small>
  438.                                                     {% endif %}
  439.                                                 </li>
  440.                                                 <li class="text-smoke d-flex align-items-center">
  441.                                                     {% if flashWorkshop.flashWorkshopEntity.timeslotDate is not null %}
  442.                                                             <span class="fa-sharp fa-solid fa-calendar-days text-smoke"></span>
  443.                                                             <small class="text-smoke ms-2 work-sans-medium sm-text"> {{flashWorkshop.flashWorkshopEntity.timeslotDate|raw}}
  444.                                                             </small>
  445.                                                     {% endif %}
  446.                                                 </li>
  447.                                             </ul>
  448.                                         </div>
  449.                                     </div>
  450.                                     <div class="card-footer">
  451.                                             {% if is_granted('ROLE_USER') %}
  452.                                                 {% if flashWorkshop.flashWorkshopEntity in flashWorkshopsReservedForUser %}
  453.                                                     {% for flashUserWorkshop in flashWorkshop.flashWorkshopEntity.flashUserWorkshops %}
  454.                                                         {% if flashUserWorkshop.user == app.user %}
  455.                                                             <form method="post" action="{{ path('app_flash_user_workshop_delete', {'userSalt': app.user.salt, 'id': flashUserWorkshop.id}) }}" onsubmit="return confirm('Etes-vous certain de vouloir supprimer cet élément ?');">
  456.                                                                 <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ flashUserWorkshop.id) }}">
  457.                                                                 <button class="btn-notice-outline mt-auto w-100">
  458.                                                                     {% if flashWorkshop.flashWorkshopEntity.isFull == true and flashUserWorkshop.inQueue == true %}
  459.                                                                         Retirer de la liste d'attente
  460.                                                                     {% else %}
  461.                                                                         Retirer de mon agenda
  462.                                                                         <span class="fa-sharp fa-solid fa-calendar-circle-minus text-notice ms-2"></span>
  463.                                                                     {% endif %}
  464.                                                                 </button>
  465.                                                             </form>
  466.                                                         {% endif %}
  467.                                                     {% endfor %}
  468.                                                 {% else %}
  469.                                                     {% if flashWorkshop.flashWorkshopEntity.isEmpty == true or flashWorkshop.flashWorkshopEntity.flashTimeslots|length == 0 %}
  470.                                                     {% elseif flashWorkshop.flashWorkshopEntity.isOutdated == true %}
  471.                                                         <a class="d-block btn-error text-center text-decoration-none mt-auto w-100">Plus de disponibilité</a>
  472.                                                     {% elseif flashWorkshop.flashWorkshopEntity.isFull == true %}
  473.                                                         <a href="{{path('app_flash_user_workshop_new_in_queue', {'flashWorkshopId': flashWorkshop.flashWorkshopEntity.id})}}" class="d-block btn-notice text-center text-decoration-none mt-auto w-100">Ajouter sur liste d'attente</a>
  474.                                                     {% else %}
  475.                                                             <button type="button" class="btn-notice mt-auto w-100" data-bs-toggle="modal" data-bs-target="#modal-choose-timeslot-{{i}}"> <span>Choisir mon créneau</span>
  476.                                                             <span class="fa-sharp fa-solid fa-calendar-clock ms-2"></span>
  477.                                                         </button>
  478.                                                     {% endif %}
  479.                                                 {% endif %}
  480.                                             {% endif %}
  481.                                         </div>
  482.                                     </div>
  483.                                 {% endif %}
  484.                             {% endfor %}
  485.                         </div>
  486.                         {% set k = 0 %}
  487.                         {% set l = 0 %}
  488.                         {% if is_granted('ROLE_USER') %}
  489.                             {% for flashWorkshop in flashWorkshops %}
  490.                                 {% set k = k + 1 %}
  491.                                 <!-- Modal Desktop -->
  492.                                 <div class="modal fade border-none" id="modal-choose-timeslot-{{k}}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel{{k}}" aria-hidden="true">
  493.                                     <div class="modal-dialog modal-lg b-radius-5">
  494.                                         <div class="modal-content bg-white b-radius-5 px-3 timeslot-modal">
  495.                                             <div class="d-flex justify-content-between align-items-center">
  496.                                                 <div class="mt-3">
  497.                                                     <h1 class="h4 modal-title work-sans-bold" id="staticBackdropLabel{{k}}">Choisissez votre créneau</h1>
  498.                                                     <p class="text-graphite">Sélectionnez une date et une heure pour ajouter la session à votre agenda.</p>
  499.                                                 </div>
  500.                                                 <button type="button" class="btn" data-bs-dismiss="modal" aria-label="Fermer">
  501.                                                     <span class="fa-sharp fa-solid fa-circle-xmark modal-mark"></span>
  502.                                                     <span class="sr-only">Fermer la modale</span>
  503.                                                 </button>
  504.                                             </div>
  505.                                             <form method="post" action="{{path('app_flash_user_workshop_new')}}">
  506.                                                 <div class="">
  507.                                                     {% for date, timeslot in flashWorkshop.timeslots %}
  508.                                                         {% set m = 0 %}
  509.                                                         {% for t in timeslot %}
  510.                                                             {% if t.isFull == true %}
  511.                                                                 {% set m = m + 1 %}
  512.                                                             {% endif %}
  513.                                                         {% endfor %}
  514.                                                         {% if date|date('Y-m-d') >= "now"|date('Y-m-d') and m != timeslot|length %}
  515.                                                             <h6 class="text-smoke text-capitalize">{{date|format_datetime(locale='fr', pattern="EEEE dd MMMM YYYY")}}</h6>
  516.                                                         {% endif %}
  518.                                                         {% for t in timeslot %}
  519.                                                             {% set l = l + 1 %}
  520.                                                             {% if t.isFull != true and t.isOutdated != true %}
  521.                                                                 <div class="timeslot-radio-btn">
  522.                                                                     <input data-label="{{t.startHour|replace({':': 'h'})}} - {{t.endHour|replace({':': 'h'})}}" type="radio" id="{{t.id}}_{{l}}" name="{{flashWorkshop.flashWorkshopEntity.id}}" value="{{t.id}}">
  523.                                                                 </div>
  524.                                                             {% endif %}
  525.                                                         {% endfor %}
  526.                                                     {% endfor %}
  527.                                                 </div>
  528.                                                 <div class="text-center">
  529.                                                     <button type="submit" class="d-inline-block modal-center-btn text-decoration-none mb-3">Ajouter à mon agenda</button>
  530.                                                 </div>
  531.                                             </form>
  532.                                         </div>
  533.                                     </div>
  534.                                 </div>
  535.                             {% endfor %}
  536.                         {% endif %}
  537.                 </div>
  538.             {% endif %}
  539.             <div class="d-flex justify-content-between mt-4">
  540.                 {% for clientProduct in client.clientProducts %}
  541.                     {% if clientProduct.product.name == 'Defi-inclusion' and app.user != null and userProduct != null %}
  542.                     {% elseif clientProduct.product.name == 'Autodiagnostic-handicap' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d")%}
  543.                             <!-- Auto Diagnostic Handicap -->
  544.                             <div class="bg-white p-4 b-radius-5 d-flex align-items-start position-relative wp-50-mx">
  545.                                 <span class="fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  546.                                 <div class="ms-3">
  547.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic Handicap</h2>
  548.                                     <p class="work-sans-medium text-carbone ns-text">En moins de deux minutes et 8 questions, il vous permet de faire le point sur votre situation et d'identifier les acteurs pour vous accompagner.</p>
  549.                                     <div class="d-flex align-items-center mt-5 mb-3">
  550.                                         <small class="text-smoke work-sans-medium ns-text">8 questions (2min)</small>
  551.                                         <a href="https://auto-diagnostic-handicap.avisea.fr" target="_blank" class="btn-notice text-decoration-none arrow-link">
  552.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  553.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  554.                                         </a>
  556.                                     </div>
  557.                                 </div>
  558.                             </div>
  559.                     {% elseif clientProduct.product.name == 'autodiagnostic-handicap-2' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d")%}
  560.                             <!-- Auto Diagnostic Handicap -->
  561.                             <div class="bg-white p-4 b-radius-5 d-flex align-items-start position-relative wp-50-mx">
  562.                                 <span class="fa-sharp fa-solid fa-stethoscope text-{{client.slug}} avisea-homepage-stetoscop-icon"></span>
  563.                                 <div class="ms-3">
  564.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Autodiagnostic : faites le point sur votre</h2>
  565.                                     <h2 class="h4 work-sans-bold text-graphite m-text">situation de santé au travail</h2>
  566.                                     <p class="work-sans-medium text-carbone ns-text">En moins de 5 minutes et 15 questions, il vous permet de réfléchir à l’impact éventuel de votre état de santé sur votre activité professionnelle et d’identifier des ressources adaptées à vos besoins. Ce test est anonyme et confidentiel : aucune donnée ne sera collectée ou communiquée à votre employeur. </p>
  567.                                     <div class="d-flex align-items-center mt-5 mb-3">
  568.                                         <small class="text-smoke work-sans-medium ns-text">15 questions (5min)</small>
  569.                                         <a href="https://auto-diagnostic-handicap.avisea.fr" target="_blank" class="btn-notice text-decoration-none arrow-link">
  570.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span> 
  571.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  572.                                         </a>
  574.                                     </div>
  575.                                 </div>
  576.                             </div>
  577.                     {% elseif clientProduct.product.name == 'Test-auditif' and userProduct == null and clientProduct.isActive is same as true and clientProduct.startAt|date("Y-m-d") <= "now"|date("Y-m-d") %}
  578.                             <!-- Test Auditif -->
  579.                             <div class="bg-white p-4 b-radius-5 d-flex align-items-start position-relative wp-50-mx">
  580.                                 <span class="fa-sharp fa-regular fa-ear-listen text-{{client.slug}} avisea-homepage-hear-icon"></span>
  581.                                 <div class="ms-3">
  582.                                     <h2 class="h4 work-sans-bold text-graphite m-text">Test auditif</h2>
  583.                                     <p class="work-sans-medium text-carbone ns-text">Vous vous posez des questions quant à votre niveau d'audition ? Réalisez notre test auditif et faisons le point ensemble !</p>
  584.                                     <div class="d-flex align-items-center mt-5 mb-3">
  585.                                         <small class="text-smoke work-sans-medium ns-text">6 questions (5min)</small>
  586.                                         <a href="https://plateforme-auditive.avisea.fr" target="_blank" class="btn-notice text-decoration-none arrow-link">
  587.                                         <span class="text-white work-sans-medium ml-text">Faire le test</span>
  588.                                             <span class="fa-sharp fa-solid fa-arrow-right"></span>
  589.                                         </a>
  591.                                     </div>
  592.                                 </div>
  593.                             </div>
  594.                     {% endif %}
  595.                 {% endfor %}
  596.             </div>
  597.         </div>
  598.     </main>
  599.     <!---->
  600. {% endblock %}
  602. {% block javascripts %}
  604.     <script>
  605.         $(document).ready(function () {
  606.             $('.homepage-flashworkshops').slick({
  607.                 infinite: true,
  608.                 variableWidth: true,
  609.                 nextArrow: '.carousel-next',
  610.                 prevArrow: '.carousel-prev',
  611.                 slidesToShow: 4,
  612.                 slidesToScroll: 4,
  613.                 responsive: [
  614.                     {
  615.                         breakpoint: 768,
  616.                         settings: {
  617.                             arrows: false,
  618.                             centerMode: true,
  619.                             centerPadding: '40px',
  620.                             slidesToShow: 3,
  621.                             slidesToScroll: 3,
  622.                         }
  623.                     },
  624.                     {
  625.                         breakpoint: 480,
  626.                         settings: {
  627.                             arrows: false,
  628.                             centerMode: true,
  629.                             centerPadding: '40px',
  630.                             slidesToShow: 1,
  631.                             slidesToScroll: 1,
  632.                         }
  633.                     }
  634.                 ]
  635.                 });
  636.             });
  637.     </script>
  639. {% endblock %}