templates/front/index.html.twig line 1

Open in your IDE?
  1. {% extends 'front/base.html.twig' %}
  2. {% block body %}
  3.     <!-- case loading -->
  4.         {% if page.template.loadingHtml is not null %}
  5.             {{ page.template.loadingHtml|raw }}
  6.         {% endif %}
  7.     <!-- end case loading -->
  8.     <!-- case pageConstruction -->
  9.         {% if page.etat == 2 %}
  10.             {% include "front/cases/pageConstruction.html.twig" %}
  11.         {% endif %}
  12.     <!-- end case pageConstruction -->
  13.     <!-- case navbar -->
  14.         {# {% if page.template.nom == "Append" %} #}
  15.             {# {% include "charte/append/cases/navbar.html.twig" %} #}
  16.         {# {% elseif page.template.nom == "cycloflore" %}
  17.             {% include "/charte/cycloflore/body.html.twig" %}
  18.         {% elseif page.template.nom == "3D style" %}
  19.             {% include "/charte/3DStyles/body.html.twig" %} #}
  20.         {# {% elseif page.template.nom == "Parisglobe" %}
  21.         {% else %} #}
  22.             {# include "charte/woody/cases/navbar.html.twig" #}
  23.         {# {% endif %} #}
  24.     <!-- end case navbar -->
  25.     <!-- boucle les éléments elemDiv -->
  26.     {# {% for elemDiv in page.modElemDivs|sort((a, b) => a.ordre <=> b.ordre) %} #}
  27.         <!-- Début ElemDiv -->
  28.         {# {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %} #}
  29.             {# {{ elemDiv.type.ouverture|replace({'id':  'id="elem_'~elemDiv.id~'"', 'class':  'class="'~elemDiv.class~'"', 'style':  'style="'~elemDiv.styles~' border: 2px dashed pink;"' })|raw }} #}
  30.         {# {% else %} #}
  31.             {# {{ elemDiv.type.ouverture|replace({'id':  'id="elem_'~elemDiv.id~'"', 'class':  'class="'~elemDiv.class~'"', 'style':  'style="'~elemDiv.styles~'"' })|raw }} #}
  32.         {# {% endif %} #}
  33.             <!-- Début contenu ElemDiv -->
  34.             <!-- fin contenu ElemDiv -->
  35.             
  36.             <!-- ROLE_ADMIN -->
  37.             {# {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %} #}
  38.                 {# <div id="divActions_{{ elemDiv.id }}" style="display:none; border:1px solid crimson; border-radius:12px; padding:6px 12px; background-color: white;">
  39.                     <!-- nom div -->
  40.                     <div style="display:inline; color:crimson;">
  41.                         {{ elemDiv.type.nom }}.{{ elemDiv.id }}
  42.                     </div>
  43.                     <!-- bouton ajouter dedans -->
  44.                     <button id="btnNewElemDivDansElemDiv_{{ elemDiv.id }}" class="btn btn-sm btn-default" title="Ajoute élément dans {{ elemDiv.type.nom }}">
  45.                         <i class="fa-solid fa-square-arrow-up-right" style="color:crimson;"></i>
  46.                     </button>
  47.                     <!-- bouton monter div -->
  48.                     <button id="monteElem_{{ elemDiv.id }}" class="btn btn-sm btn-default" {% if elemDiv.ordre == 1 %}disabled{% endif %} title="Monte l'élément">
  49.                         <i class="fa-solid fa-circle-chevron-up" style="color:crimson;"></i>
  50.                     </button>
  51.                     <!-- bouton descendre div -->
  52.                     <button id="descendElem_{{ elemDiv.id }}" class="btn btn-sm btn-default" {% if elemDiv.ordre == page.modElemDivs|length %}disabled{% endif %} title="Descendre l'élément">
  53.                         <i class="fa-solid fa-circle-chevron-down" style="color:crimson;"></i>
  54.                     </button>
  55.                     <!-- bouton configurer div -->
  56.                     <button id="modifElem_{{ elemDiv.id }}" class="btn btn-sm btn-default" title="Modifier l'élément">
  57.                         <i class="fa-solid fa-gear" style="color:crimson;"></i>
  58.                     </button>
  59.                     <!-- bouton supprimer div -->
  60.                     <button id="supprElem_{{ elemDiv.id }}" class="btn btn-sm btn-default" title="Supprimer l'élément">
  61.                         <i class="fa-solid fa-trash-can" style="color:crimson;"></i>
  62.                     </button>
  63.                 </div> #}
  64.             {# {% endif %} #}
  65.         {# {{ elemDiv.type.fermeture|raw }} #}
  66.         <!-- // Fin Div -->
  67.     {# {% endfor %} #}
  68.     <!-- boucle les éléments -->
  69.     {# {% for div in page.modDivs|sort((a, b) => a.ordre <=> b.ordre) %} #}
  70.         <!-- Début Div -->
  71.         {# <div id="div_{{ div.id }}" class="{% if div.container == 1 %}container{% elseif div.container == 2 %}container-fluid{% endif %}" {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %}style="border: 2px dashed pink;"{% endif %}> #}
  72.             {# <div class="row" style="{% if div.hauteur > 0 %}min-height:{{ div.hauteur }}px;{% endif %}"> #}
  73.                 {# {% for col in div.modDivCols|sort((a, b) => a.ordre <=> b.ordre) %} #}
  74.                     <!-- Début col -->
  75.                     {# <div id="div_{{ div.id }}_col_{{ col.id }}" class="{% if col.largeur != 0 %}col-{{ col.largeur }} {% endif %}{% if col.sm != 0 %}col-sm-{{ col.sm }} {% endif %}{% if col.md != 0 %}col-md-{{ col.md }} {% endif %}{% if col.lg != 0 %}col-lg-{{ col.lg }} {% endif %}{% if col.xl != 0 %}col-xl-{{ col.xl }} {% endif %}{% if col.xxl != 0 %}col-xxl-{{ col.xxl }} {% endif %}" {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %}style="border: 2px dashed pink;"{% endif %}> #}
  76.                         {# {% for case in col.contCases %} #}
  77.                             {# {% set numeroDeCaseRecherche = case.id %}
  78.                             {% set numeroDElementRecherche = case.element.id %}
  79.                             {% set codeTrouve = null %} #}
  80.                             {# {% for element in mesCases %}
  81.                                 {% set numeroDeCase = element[0] %}
  82.                                 {% set numeroDElement = element[1] %}
  83.                                 {% if numeroDeCase == numeroDeCaseRecherche and numeroDElement == numeroDElementRecherche %}
  84.                                     {% set codeTrouve = element[2] %}
  85.                                 {% endif %}
  86.                             {% endfor %} #}
  87.                             {# {% if codeTrouve is not null %}
  88.                                 {{ codeTrouve|raw }}
  89.                             {% else %}
  90.                                 <i class="fa-solid fa-plug-circle-xmark"></i>
  91.                             {% endif %} #}
  92.                             {#
  93.                             {% set case = case.element.code|raw %}
  94.                             {% if '[IMG]' in case %}
  95.                                 {% set case = case|replace({'[IMG]': "oranges"}) %}
  96.                             {% endif %}
  97.                             {{ case|raw }}
  98.                             #}
  99.                         {# {% endfor %} #}
  100.                         <!-- ROLE_ADMIN -->
  101.                         {# {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %}
  102.                             <div style="display:inline; color:crimson; ">
  103.                                 col.{{ col.id }}
  104.                                 <!-- btnNewElement -->
  105.                                 <button id="btnNewElem_{{ col.id }}" class="btn btn-sm btn-default" style="color:crimson;border-color:crimson; border-radius:12px;">
  106.                                     <i class="fa-regular fa-square-plus"></i> élément
  107.                                 </button>
  108.                             </div>
  109.                         {% endif %} #}
  110.                     {# </div> #}
  111.                     <!-- // fin col -->
  112.                 {# {% else %}
  113.                     pas de colonne
  114.                 {% endfor %} #}
  115.             {# </div> #}
  116.             <!-- ROLE_ADMIN -->
  117.             {# {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %}
  118.                 <div id="divActions_{{ div.id }}" style="display:none; border:1px solid crimson; border-radius:12px; padding:6px 12px; background-color: white;">
  119.                     <!-- nom div -->
  120.                     <div style="display:inline; color:crimson;">
  121.                         Div.{{ div.id }}
  122.                     </div>
  123.                     <!-- bouton monter div -->
  124.                     <button id="montedDiv_{{ div.id }}" class="btn btn-sm btn-default" {% if div.ordre == 1 %}disabled{% endif %}>
  125.                         <i class="fa-solid fa-circle-chevron-up" style="color:crimson;"></i>
  126.                     </button>
  127.                     <!-- bouton descendre div -->
  128.                     <button id="descendDiv_{{ div.id }}" class="btn btn-sm btn-default" {% if div.ordre == page.modDivs|length %}disabled{% endif %}>
  129.                         <i class="fa-solid fa-circle-chevron-down" style="color:crimson;"></i>
  130.                     </button>
  131.                     <!-- bouton configurer div -->
  132.                     <button id="modifDiv_{{ div.id }}" class="btn btn-sm btn-default">
  133.                         <i class="fa-solid fa-gear" style="color:crimson;"></i>
  134.                     </button>
  135.                     <!-- bouton supprimer div -->
  136.                     <button id="supprDiv_{{ div.id }}" class="btn btn-sm btn-default">
  137.                         <i class="fa-solid fa-trash-can" style="color:crimson;"></i>
  138.                     </button>
  139.                 </div>
  140.             {% endif %} #}
  141.         {# </div> #}
  142.         <!-- // Fin Div -->
  143.     {# {% endfor %} #}
  144.     <!-- ROLE_ADMIN -->
  145.     {# {% if user.roles[0] is defined and user.roles[0] == "ROLE_ADMIN" %}
  146.         <div class="container mt-4">
  147.             <div class="row">
  148.                 <div class="col-12" style="text-align: center;">
  149.                     <!-- btnNewElement -->
  150.                     <button id="btnNewDiv" class="btn btn-sm btn-default" style="color:crimson;border-color:crimson; border-radius:12px;">
  151.                         <i class="fa-regular fa-square-plus"></i>
  152.                         Ajouter une div
  153.                     </button>
  154.                     <!-- btnNewElement -->
  155.                     <button id="btnNewElemDivSurPage" class="btn btn-sm btn-default" style="color:crimson;border-color:crimson; border-radius:12px;">
  156.                         <i class="fa-regular fa-square-plus"></i>
  157.                         Ajouter une elemDiv
  158.                     </button>
  159.                 </div>
  160.             </div>
  161.         </div>
  162.         <!-- modal -->
  163.         <div class="modal fade" id="modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  164.             <div class="modal-dialog modal-dialog-centered">
  165.                 <div class="modal-content">
  166.                     <div class="modal-header">
  167.                         <h5 class="modal-title">Modal title</h5>
  168.                         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  169.                     </div>
  170.                     <div class="modal-body">
  171.                         <p>Modal body text goes here.</p>
  172.                     </div>
  173.                     <div class="modal-footer">
  174.                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
  175.                         <button id="action" type="button" class="btn btn-primary">Save changes</button>
  176.                     </div>
  177.                 </div>
  178.             </div>
  179.         </div>
  180.     {% endif %} #}
  181.     <!-- boucle les éléments elemDiv -->
  182.     {% for case in mesCases %}
  183.         {{ case[1]|raw }}
  184.     {% endfor %}
  185. {% endblock %}
  186. {% block javascripts %}
  187.     <script>
  188.         function addFormToCollection($collectionHolderClass) {
  189.             console.log("collectionHolderClass");
  190.             console.log($collectionHolderClass);
  191.             // Get the ul that holds the collection of tags
  192.             var $collectionHolder = $('.' + $collectionHolderClass);
  193.             console.log("collectionHolder");
  194.             console.log($collectionHolder);
  195.             // Get the data-prototype explained earlier
  196.             var prototype = $collectionHolder.data('prototype');
  197.             console.log("prototype");
  198.             console.log(prototype);
  199.             // get the new index
  200.             var index = $collectionHolder.data('index');
  201.             console.log("index");
  202.             console.log(index);
  203.             var newForm = prototype;
  204.             // You need this only if you didn't set 'label' => false in your tags field in TaskType
  205.             // Replace '__name__label__' in the prototype's HTML to
  206.             // instead be a number based on how many items we have
  207.             // newForm = newForm.replace(/__name__label__/g, index);
  208.             // Replace '__name__' in the prototype's HTML to
  209.             // instead be a number based on how many items we have
  210.             newForm = newForm.replace(/__name__/g, index);
  211.             // increase the index with one for the next item
  212.             $collectionHolder.data('index', index + 1);
  213.             // Display the form in the page in an li, before the "Add a tag" link li
  214.             var $newFormLi = $('<li></li>').append(newForm);
  215.             // Add the new form at the end of the list
  216.             $collectionHolder.append($newFormLi);
  217.             // add a delete link to the new form
  218.             addTagFormDeleteLink($newFormLi, $collectionHolderClass);
  219.         }
  220.         function addTagFormDeleteLink($tagFormLi, $collectionHolderClass) {
  221.             console.log($collectionHolderClass);
  222.             if($collectionHolderClass == 'ModDivCol' )
  223.             {
  224.                 var $removeFormButton = $('<button type="button" class="btn btn-sm btnImmemory rouge">Supprimer la colonne</button>');
  225.                 var $removeFormButtonX = ' - <button type="button" class="add_item_link btn btn-sm btnImmemory vert" data-collection-holder-class="ModDivCol">Ajouter la colonne</button>';
  226.             }
  227.             else
  228.             {
  229.                 var $removeFormButton = $('<button type="button" class="btn btn-sm btnImmemory rouge">Supprimer le timer</button>');
  230.                 var $removeFormButtonX = ' - <button type="button" class="add_item_link btn btn-sm btnImmemory vert" data-collection-holder-class="timers">Ajouter un timer</button>';
  231.             }
  232.             $tagFormLi.append($removeFormButton);
  233.             $tagFormLi.append($removeFormButtonX);
  234.             $removeFormButton.on('click', function(e) {
  235.                 // remove the li for the tag form
  236.                 $tagFormLi.remove();
  237.             });
  238.         }
  239.         $(function(){
  240.         });
  241.     </script>
  242.     <!-- boucle les éléments elemDiv -->
  243.     {% for case in mesCases %}
  244.         {% if case[3] != "" %}
  245.             {% include case[3] %}
  246.         {% endif %}
  247.     {% endfor %}
  248.     {# {% for div in page.modDivs|sort((a, b) => a.ordre <=> b.ordre) %}
  249.         {% for col in div.modDivCols|sort((a, b) => a.ordre <=> b.ordre) %}
  250.             {% for case in col.contCases %}
  251.                 {% if case.element.head is defined and case.element.head is not null  %}
  252.                     {% include case.element.head %}
  253.                 {% endif %}
  254.             {% endfor %}
  255.         {% else %}
  256.             pas de colonne
  257.         {% endfor %}
  258.     {% endfor %} #}
  259. {% endblock %}