templates/index/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% set page_title = 'Paper doll' %}
  4. {% block body %}
  5.     {% if is_granted('ROLE_USER') %}
  6.         <div class="alert alert-info userStatusInfo">
  7.             Hallo {{ app.user.email }}<br>
  8.             <a href="{{ path('app_logout') }}">Logout!</a>
  9.         </div>
  10.     {%  else %}
  11.         <div class="alert alert-warning userStatusInfo">
  12.             Hallo, du bist nicht eingeloggt und wirst daher deine Kreation nicht speichern können. <a href="{{ path('app_login') }}">Logge dich hier ein!</a>
  13.         </div>
  14.     {% endif %}
  16.     <section id="chooseRace">
  17.         {% for r in races %}
  18.             <div class="card">
  19.                 <img src="/uploads/{{ r.image }}" class="card-img-top" alt="...">
  20.                 <div class="card-body">
  21.                     <h5 class="card-title"> {{ r.name }}</h5>
  22.                     <p>{{ r.description }}</p>
  23.                     {% for l in r.layers %}
  24.                             {% if l.category.name == 'Körper' and l.mainLayer == true %}
  25.                                 <a href="#" class="btn btn-primary selectRaceAndBody" data-race="{{ r.id }}" data-layer="{{ l.id }}" data-image="{{ l.image }}">Auswählen</a>
  26.                             {% endif %}
  27.                     {% endfor %}
  28.                 </div>
  29.             </div>
  30.         {% endfor %}
  31.     </section>
  33.     <section id="canvas">
  35.     </section>
  37.     <section id="categories">
  38.         <section id="categoryMenu">
  39.             {% if is_granted('ROLE_USER') %}
  40.                 <div id="creationManagementLink">
  41.                     <img src="/imag/icon_objekt_nach_vorn.png" class="d-block">
  42.                 </div>
  43.             {% endif %}
  44.             <div id="existingElementsLink">
  45.                 <img src="/img/icon_objekt_entfernen.png" class="d-block">
  46.             </div>
  47.             {% for c in categories %}
  48.                     <div class="outfitCategoryLink" data-id="{{ c.id }}" id="outfitCategoryLink{{ c.id }}">
  49.                         <img src="/uploads/{{ c.iconFile }}" class="d-block">
  50.                     </div>
  51.             {% endfor %}
  52.         </section>
  54.         {% if is_granted('ROLE_USER') %}
  55.         <div id="creationManagementWrapper">
  56.             <h2>Kreation speichern/laden</h2>
  57.             <ul id="creations">
  58.             {%for c in creations %}
  59.                 <li><a href="#" class="loadCreation" data-creation="{{ c.id }}"><i>{{ c.race.name }}</i> - {{ c.name }}</a></li>
  60.             {% endfor %}
  61.             </ul>
  62.             <br>
  63.             <a href="#" class="btn btn-success" id="saveCreation">Kreation speichern</a>
  64.         </div>
  65.         {% endif %}
  66.         <div id="existingElementsWrapper" style="min-height: 50px;">
  67.             <h2>Vorhandene Elemente</h2>
  68.             <div id="canvasLayers">
  69.                 <div id="carouselExampleCaptionsCanvasLayers" class="carousel slide">
  70.                     <div class="carousel-inner">
  71.                     </div>
  72.                     <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptionsCanvasLayers" data-bs-slide="prev">
  73.                         <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  74.                         <span class="visually-hidden">Previous</span>
  75.                     </button>
  76.                     <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptionsCanvasLayers" data-bs-slide="next">
  77.                         <span class="carousel-control-next-icon" aria-hidden="true"></span>
  78.                         <span class="visually-hidden">Next</span>
  79.                     </button>
  80.                 </div>
  81.             </div>
  82.         </div>
  83.     {% for c in categories %}
  84.             <div class="outfitCategoryWrapper" id="outfitCategoryWrapper{{ c.id }}">
  85.                 <h2>{{ c.name }}</h2>
  86.                 <div id="carouselExampleCaptions{{ c.id }}" class="carousel slide" data-bs-ride="carousel" data-bs-interval="false">
  87.                     <div class="carousel-inner">
  88.                             {% for l in layers %}
  89.                                 {% if l.category.name == c.name %}
  90.                                     {% for r in l.race %}
  91.                                         <div class="carousel-item" data-bs-interval="false" data-race="{{ r.id }}" data-layer="{{ l.id }}">
  92.                                             <img loading="lazy" src="/uploads/{{ l.thumbnail }}" class="d-block" alt="...">
  93.                                             <br><br>
  94.                                             <div class="carousel-caption d-md-block">
  95.                                                <!-- <h5>{{ l.name }}</h5> -->
  96.                                                 <a href="#" class="btn btn-sm btn-primary selectElement" data-race="{{ r.id }}" data-category="{{ c.id }}"  data-layer="{{ l.id }}" data-offset="{{ l.offset }}" data-image="{{ l.image }}" data-zindex="{{ l.defaultLayerZindex ? l.defaultLayerZindex : c.defaultLayerZindex }}">Auswählen</a>
  97.                                             </div>
  98.                                         </div>
  99.                                     {% endfor %}
  100.                                 {% endif %}
  101.                             {% endfor %}
  102.                     </div>
  103.                     <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions{{ c.id }}" data-bs-slide="prev">
  104.                         <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  105.                         <span class="visually-hidden">Previous</span>
  106.                     </button>
  107.                     <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions{{ c.id }}" data-bs-slide="next">
  108.                         <span class="carousel-control-next-icon" aria-hidden="true"></span>
  109.                         <span class="visually-hidden">Next</span>
  110.                     </button>
  111.                 </div>
  112.             </div>
  114.     {% endfor %}
  115.         <br><br><br>
  116.         <a href="/" class="btn btn-danger">Zurück zum Start</a>
  117.     </section>
  118.     <script type="text/javascript">
  119.         canvasTextsJson = '{{ canvasTexts | json_encode | raw }}';
  120.     </script>
  122. {% endblock %}