templates/bundles/FOSUserBundle/layout.html.twig line 1

Open in your IDE?
  1. {# LG 20221003 passé + bas {% include "@Paa/Default/post_imports.html.twig" %} #}
  2. <!DOCTYPE html>
  3. <html lang="fr">
  4.     <head>
  5. {# LG 20221003 début
  6.         <meta charset="UTF-8" />
  7.         <meta name="author" content="Limoog">
  8.         <meta name="viewport" content="width=device-width" initial-scale="1">
  9.         {% if not estDemo() %}
  10.             <meta name="robots" content="noindex"/>
  11.             <title>Logiciel planning médico-social et Alternance gratuit</title>
  12.         {% else %}
  13.             <title>PAA</title>
  14.         {% endif %}
  15.         <link rel="icon" type="image/x-icon" href="{{ asset_version('Images/PAA.ICO') }}" />
  16.         <link rel="stylesheet" type="text/css" href="{{asset_version('Limoog/Partages/css/Emma.css')}}">
  17.         <link rel="stylesheet" type="text/css" href="{{asset_version('vendor/bootstrap/4.5.0/css/bootstrap.min.css')}}">
  18. #}
  19.         {% include "@Paa/Default/pre_imports.html.twig" %}
  20.         <meta name="description" content="PAA, le logiciel de planning médico-social (IME, IMPro, ...) et formation en alternance est gratuit en version limitée">
  21.         {% include "@Paa/Default/post_imports.html.twig" %}
  22. {# LG 20221003 fin #}
  23.     </head>
  24.     <body>
  26. <!--PAADemo-->      {#Ne pas enlever ce commentaire : utilisé en JavaScript pour enlever ce contenu inutile dans le popup#}
  27.     {% if estDemo() %}
  28.         <div id="background">
  29.             <div id="screen-splitter">
  30.                 <div id="card-wrapper">
  31.                     <div id="cards">
  32.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  33.                             <h1>Créer et présenter les emplois du temps</H1>
  34.                         </div>
  35.                         <img src="{{ asset_version("Images/Captures/Planning.png") }}" class="rounded" alt="Construisez vos plannings d'activité et de présences en toute simplicité">
  36.                     </div>
  37.                     <div id="cards">
  38.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  39.                             <h1>Gérer le personnel, les usagers, les équipements</h1>
  40.                         </div>
  41.                         <img src="{{ asset_version("Images/Captures/SaisieIntervenants-Général.png") }} " class="rounded" alt="Gérez le personnel, ses activités, ses contrats et ses horaires">
  42.                     </div>
  43.                     <div id="cards">
  44.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  45.                             <h1>Combiner activités collectives et individuelles</h1>
  46.                         </div>
  47.                         <img src="{{ asset_version("Images/Captures/ChoixParticipantsUsagers.png") }}" class="rounded" alt="Définissez simplement les participants de chaque séance">
  48.                     </div>
  49.                 </div>
  50.             </div>
  52.             <div id="screen-splitter"></div>
  53.             <div id="screen-splitter">
  54.                 <div id="card-wrapper">
  55.                     <div id="cards">
  56.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  57.                             <h1>Gérer des bilans d'activités, présence, absences ...</h1>
  58.                         </div>
  59.                         <img src="{{ asset_version("Images/Captures/EditionsRapports.png") }}" class="rounded" alt="Editez les plannings générés dans une multitude de formats">
  60.                     </div>
  61.                     <div id="cards">
  62.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  63.                             <h1>Gérer les données des usagers</h1>
  64.                         </div>
  65.                         <img src="{{ asset_version("Images/Captures/Usagers_Statuts.png") }}" class="rounded" alt="Gérez les données des usagers an plus de leur planning">
  66.                     </div>
  67.                     <div id="cards">
  68.                         <div class="alert alert-light text-center" style="font-size: .80vw; color: black;">
  69.                             <h1>Automatiser la construction des emplois du temps</h1>
  70.                         </div>
  71.                         <img src="{{ asset_version("Images/Captures/CréerUneSemaine.png") }}" class="rounded" alt="Simplifiez les emplois du temps en utilisant des modèles évolutifs">
  72.                     </div>
  73.                 </div>
  74.             </div>
  76.         </div>
  78.    <style>
  79.         body, html {
  80.             overflow: hidden;
  81.         }
  83.         ::-webkit-scrollbar {
  84.             display:none;
  85.         }
  87.         #background {
  88.             display: flex;
  89.             position: fixed;
  90.             transition: opacity .4s;
  91.             background: rgb(230, 230, 230);
  92.             width: 100%;
  93.             height: 100%;
  94.             z-index: -1;
  95.             overflow: hidden;
  96.         }
  98.         #screen-splitter {
  99.             flex: 1;
  100.             flex-direction: column;
  101.         }
  103.         #card-wrapper {
  104.             flex: 1;
  105.             display: flex;
  106.             height: 90%;
  107.             margin-top: 10%;
  108.             width: 100%;
  109.             flex-direction: column;
  110.             justify-content: space-around;
  111.         }
  113.         #card-wrapper * {
  114.             width: 90%;
  115.             display: flex;
  116.             align-self: center;
  117.             justify-content: center;
  118.         }
  120.         #cards {
  121.             display: flex;
  122.             flex: 1;
  123.             flex-direction: column;
  124.         }
  126.         #cards :nth-child(2) {
  127.             margin-bottom: 5%;
  128.         }
  129.         
  130.         @media (max-width: 1100px) {
  131.             #background {
  132.                 opacity: 0;
  133.                 transition: opacity .4s;
  134.             }
  135.         }
  137.         #card-title {
  138.             display: flex;
  139.             align-self: center;
  140.             justify-content: center;
  141.             background-color: gray;
  142.         }
  144.         #card-title p {
  145.             padding: 15px;
  146.         }
  148.         @keyframes fade-in {
  149.             0% {
  150.                 opacity: 0;
  151.                 transform: translateY(-50vh);
  152.             }
  154.             60% {
  155.                 opacity: 0;
  156.             }
  157.         }
  159.         #wrapper {
  160.             display: flex;
  161.             align-items: center;
  162.             justify-content: space-around;
  163.         }
  165.         {# #login_container {
  166.             padding-top: 1.5rem;
  167.             padding-bottom: 1.5rem;
  168.             padding-right: 1.5rem;
  169.         } #}
  170.         #sinscrire{
  171.             display: block !important ;
  172.         }
  174.         h1{
  175.             font-size: .80vw;
  176.             font-weight: bolder;
  177.         }
  178.     </style>
  180.     {% endif %}
  181. <!--PAADemo-->      {#Ne pas enlever ce commentaire : utilisé en JavaScript pour enlever ce contenu inutile dans le popup#}
  183. <!--PAALoginForm--> {#Ne pas enlever ce commentaire : utilisé en JavaScript pour savoir que c'est une demande de login#}
  184.     <style>
  185.         #login_container {
  186.             animation: fade-in 1s;
  187.             display: block;
  188.             box-shadow: 5px 5px 16px -5px rgba(0,0,0,0.3);
  189.             {# padding-top: 1.5rem;
  190.             padding-left: 1.5rem; #}
  191.         }
  193.         #login_container label[for="username"]
  194.                 , #login_container label[for="fos_user_change_password_form_current_password"]
  195.                 , #login_container label[for="fos_user_resetting_form_plainPassword_first"] {
  196.             padding: 0 40px 0 0;
  197.             margin: 0 0 0 5%;
  198.         }
  200.         #login_container label[for="password"]
  201.                 , #login_container label[for="fos_user_change_password_form_plainPassword_first"]
  202.                 , #login_container label[for="fos_user_change_password_form_plainPassword_second"]
  203.                 , #login_container label[for="fos_user_resetting_form_plainPassword_second"] {
  204.             padding: 15px 40px 0 0;
  205.             margin: 0 0 0 5%;
  206.         }
  208.         #login_container input[type="text"], #login_container input[type="password"], #login_container input[type="submit"] {
  209.             width: 90%;
  210.             margin-left: 5%;
  211.         }
  213.         #login_container input[type="checkbox"] {
  214.             width: 50px;
  215.             margin-top: 10px;
  216.         }
  218.         #login_container input[name='_remember_me'], #login_container label[for='remember_me'] {
  219.             margin-top: 15px;
  220.             margin-bottom: 15px;
  221.         }
  223.         label {
  224.             font-size: inherit;
  225.         }
  227.         a {
  228.             color: mediumseagreen;
  229.         }
  231.         p {
  232. /* LG 20230112 déac : perturbe l'affichage de la page par-dessus laquelle le popup arrive (changelog notemment)            font-size: 12px;
  233.             text-align: center; */
  234.         }
  236.         .btn-block {
  237.             background-color: #DCEAD7;
  238.         }
  240.         #login-alert {
  241.             margin-top: 15px;
  242.             margin-bottom: 15px;
  243.             background: #9BBC8A;
  244.             border-radius: 5px;
  245.             text-align: center;
  246.         }
  248.         .login-div{
  249.             width: 90%;
  250.             margin-left: 5%;
  251.             margin-bottom: 15px;
  252.         }
  253.         .login-error{
  254.             color: red ;;
  255.         }
  256.         #sinscrire{
  257.             display: none ;
  258.         }
  259.         #password{
  260.             border-bottom-right-radius: 0 !important;
  261.             border-top-right-radius: 0 !important;
  262.         }
  263.         #ctnAfficheMDP{
  264.             border-top-left-radius: 0;
  265.             border-bottom-left-radius: 0;
  266.             box-shadow: 0 0 7px 1px var(--paa-menu-color);            
  267.         }
  269.     </style>
  270.     {# <div style="height: 100%;"> #}
  271. {#         <div>
  272.             {{ dump(csrf_token('authenticate')) }} = valeur csrf token, qui est un hash de la session actuelle
  273.         </div>
  274.  #}
  276.         <div class = "flex-column d-flex justify-content-center align-items-center h-100">
  277.             <div id="login_container" class = "bg-white p-4" style="width: 400px;">
  278.                 <div class="login-div" style="margin-top: 0px; margin-bottom: 40px; margin-left: -17px;">
  279.                     <a href = "http://www.limoog.net" tabIndex = "-1">      {# LG 20220914 tabIndex = "-1" permet de rendre non focusable le lien, et d'éviter qu'il apparaisse avec un cadre rouge sur certains navigateurs #}
  280.                         <img src="{{ asset_version("Images/logoPAA.png") }} " alt = "Planning Accueil Accompagnement" class = "logo resizeTel" style="width:360px">
  281.                     </a>
  282.                 </div>
  283. {# LG 20231009 old                {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %} #}
  284.                 {% if is_granted("IS_AUTHENTICATED_FULLY") %}
  285.                 <div id="login-alert" class="login-div">
  286.                         {#Affiche "Connecté en tant que ... Déconnexion"#}
  287.                         Vous êtes actuellement connecté en tant que {{ app.user.username }}
  288.                 </div>
  289.                 <div style="display: flex;" class="login-div">
  290.                     <div style="flex: 1;">
  291.                         <a href="{{ path('fos_user_security_logout') }}">
  292.                             {{ 'layout.logout'|trans({}, 'FOSUserBundle') }}
  293.                         </a>
  294.                     </div>
  295.                     <div>
  296.                         <a href="{{ path('index') }}">
  297.                             Aller à l'accueil
  298.                         </a>
  299.                     </div>
  300.                 </div>
  301. {# LG 20231009 déplacé de login.html.twig début #}
  302.                 <div style="m" class="login-div">
  303.                     Vous pouvez aussi vous reconnecter avec une autre identité
  304.                 </div>
  305. {# LG 20231009 déplacé de login.html.twig fin #}
  306.                 {% endif %}
  308.                 {% block pre_fos_user_content %}{% endblock pre_fos_user_content %}
  309.                 {% block fos_user_content %}{% endblock fos_user_content %}
  310.                 {% block post_fos_user_content %}{% endblock post_fos_user_content %}
  311. {# LG 20221007 : déplacé dans Login.html.twig
  312.                 <div id="sinscrire" class="login-div" style="margin-top: 15px">
  313.                 {% if estDemo() %}
  314.                    <a href="https://www.limoog.net/inscription/" target="_blank">Obtenir un accès gratuit</a>
  315.                 {% endif%}
  316.                 </div>
  317. #}           
  318. {# SM 20240515 début de afficher MDP#}
  319.                 <script>
  320. // LG 20240822 old                if (!document.getElementById("afficheMDP")){
  321.                 if (document.getElementById("password") && !document.getElementById("afficheMDP")){
  322.                     //bouton afficher mdp n'existe pas,crée si il n'existe pas, et ne pas le crée si il existe
  323.                         var lab = document.getElementById("remember_me"); //récupérer la position de se souvenir de moi
  324.                         var pass = document.getElementById("password");  //récupérer password
  325.                         var ctn = document.createElement("div"); //création de ladiv final
  326.                         ctn.classList="d-flex ";//class de la div
  327.                         ctn.id="alligneMDP"; //id de la div
  328.                         ctn.style=style="max-width: 307;width: 335px;"//taille de la div du MDP
  329.                         pass.parentElement.append(ctn);//crétion du lien parent enfant entre ctn et pass
  330.                         ctn.append(pass);//on rajoute le mots de passe
  331.                         var dav = document.createElement("div");//on crée la div du span(bouton)
  332.                         dav.id = "ctnAfficheMDP" ;     // LG 20240725
  333.                         dav.classList="input-group-text shadow-form-control";//class de la div
  334.                         ctn.parentElement.append(dav);//on crée le lien parents enfant entre dav et ctn
  335.                         var btn = document.createElement("span");//on crée le span(bouton en forme d'oeil)
  336.                         btn.classList="far fa-eye";//class du span
  337.                         btn.id="afficheMDP";//id du span
  338.                         btn.title="Afficher le mot de passe";//title du span
  339.                         dav.parentElement.append(btn);//création du lien parent enfant entre btn et dav
  340.                         dav.append(btn);//on rajoute le span dans la div
  341.                         ctn.append(dav);//on rajoute la div dans la div principale
  342.                         lab.before(ctn);//on le place avant la position de se souvenir de moi
  344.                         var mdp=document.getElementById("password");
  345.                         var eye = document.getElementById("afficheMDP") ;       // LG 20240809
  346.                         var afficherMDP=document.getElementById("afficheMDP");
  347.                         afficherMDP.addEventListener('click', () => {//quand on clicke 
  348.                         if (mdp.type === "password"){
  349.                             // dans ce cas, si le mots de passe est cachée, le rendre visible
  350.                             mdp.type="text";
  351.                             eye.classList = "fa fa-eye-slash" ;       // LG 20240809
  352.                             btn.title="Masquer le mot de passe";      // LG 20240809
  353.                         } else{
  354.                         // dans les autres cas, le mots de passe est visible, le rendre ilisible
  355.                             mdp.type="password";
  356.                             eye.classList = "fa fa-eye" ;           // LG 20240809
  357.                             btn.title="Afficher le mot de passe";   // LG 20240809
  358.                         }
  359.                     })}
  360.                 </script>
  361. {# SM 20240515 fin de afficher MDP#}
  362.             </div>
  363.         {# </div> #}
  365.         <script>
  366.             // custom-control-label control-label m-0 mr-3
  367. {# LG 20220914 début : quand le form login est appellé dans un popup plusieurs fois, il y a une erreur "Redéclaration de Let usernameTb" #}
  368. {#          let usernameTb = document.getElementById("username");
  369.             let passwdTb = document.getElementById("password");
  370.             let btnSubmit = document.getElementById("_submit")
  371.             usernameTb.classList.add("shadow-form-control", "border-0", "form-control");
  372.             passwdTb.classList.add("shadow-form-control", "border-0", "form-control");
  373.             btnSubmit.classList.add("btn-menu-planning", "btn", "btn-block", "shadow-form-control"); #}
  374.             {# AV 20221007 old document.getElementById("username").classList.add("shadow-form-control", "border-0", "form-control");
  375.             document.getElementById("password").classList.add("shadow-form-control", "border-0", "form-control");
  376.             document.getElementById("_submit").classList.add("btn-menu-planning", "btn", "btn-block", "shadow-form-control"); #}
  377.             // AV 20221007 début les id doivent correspondre en fonction des différents éléments des form: changer le mdp, réinitialiser le mdp et connexion
  378.             if(document.getElementById("username") !== null) {
  379.                 document.getElementById("username").classList.add("shadow-form-control", "border-0", "form-control");
  380. {# //LG 20221008 début : pour préécrire le login de l'utilisateur actuel, quand on peut le connaitre #}
  381.                 {% if psLogin is not defined %}
  382.                     {% set psLogin = '' %}
  383. // LG 20231009 début
  384.                 {% elseif is_granted("IS_AUTHENTICATED_REMEMBERED") %}
  385.                     {% set psLogin = app.user.username %}
  386. // LG 20231009 fin
  387.                 {% endif %}
  389.                 if ("{{ psLogin }}") {
  390.                     {# // Un login a été fourni au twig #}
  391.                     $("#username").val("{{psLogin}}") ;
  392.                 } else if (window.currentUser) {
  393.                     {# // La page actuelle dispose de l'information #}
  394.                     $("#username").val(window.currentUser) ;
  395.                 }
  396. {# //LG 20221008 fin #}
  397.             }
  398.             if(document.getElementById("password") !== null) {
  399.                 document.getElementById("password").classList.add("shadow-form-control", "border-0", "form-control");
  400.             }
  401.             if(document.getElementById("_submit") !== null) {
  402.                 document.getElementById("_submit").classList.add("btn-menu-planning", "btn", "btn-block", "shadow-form-control");
  403.             }
  404.             if($("input[type=submit]").length) {
  405.                 $("input[type=submit]")[0].classList.add("btn-menu-planning", "btn", "btn-block", "shadow-form-control");
  406.                 $("input[type=submit]").css("margin-top", "15px");
  407.             }
  408.             if(document.getElementById("fos_user_change_password_form_current_password") !== null) {
  409.                 document.getElementById("fos_user_change_password_form_current_password").classList.add("shadow-form-control", "border-0", "form-control");
  410.             }
  411.             if(document.getElementById("fos_user_change_password_form_plainPassword_first") !== null) {
  412.                 document.getElementById("fos_user_change_password_form_plainPassword_first").classList.add("shadow-form-control", "border-0", "form-control");
  413.             }
  414.             if(document.getElementById("fos_user_change_password_form_plainPassword_second") !== null) {
  415.                 document.getElementById("fos_user_change_password_form_plainPassword_second").classList.add("shadow-form-control", "border-0", "form-control");
  416.             }
  417.             if(document.getElementById("fos_user_resetting_form_plainPassword_first") !== null) {
  418.                 document.getElementById("fos_user_resetting_form_plainPassword_first").classList.add("shadow-form-control", "border-0", "form-control");
  419.             }
  420.             if(document.getElementById("fos_user_resetting_form_plainPassword_second") !== null) {
  421.                 document.getElementById("fos_user_resetting_form_plainPassword_second").classList.add("shadow-form-control", "border-0", "form-control");
  422.             }
  423.             if(document.getElementById("fos_user_change_password_form__token") !== null) {
  424.                 document.getElementById("fos_user_change_password_form__token").classList.add("btn-menu-planning", "btn", "btn-block", "shadow-form-control");
  425.             }
  426.             // AV 20221007 fin
  428. {# LG 20220927 old            var loNext = $("#flashbag").next()[0] ; #}
  429.             var loNext = $("#aide").next()[0] ;
  430.             if (loNext && loNext.tagName == "DIV" ) {
  431.                 // L'élément flashbag a derierre lui une div : elle a été ajoutée dans vendor/friendsofsymfony/user-bundle/Resources/views/Security/login_content.html.twig
  432.                 // pour afficher l'erreur d'authentification
  433.                 // Lui affecter la classe login-div
  434.                 loNext.classList.add("login-div", "login-error") ;
  435.                 {% if estDemo() %}
  436.                     if ($(loNext).html() == "Identifiants invalides.") {
  437.                         $(loNext).html("Identifiants invalides.<br>Si vous doutez de votre nom d'utilisateur, utilisez plutôt l'adresse mail que vous avez fournie lors de votre inscription.") ;
  438.                     }
  439.                 {% endif %}
  440.             }
  441.         </script>
  442. <!--PAALoginForm--> {#Ne pas enlever ce commentaire : utilisé en JavaScript pour savoir que c'est une demande de login#}
  443.     </body>
  444. </html>