templates/base.html.twig line 1

Open in your IDE?
  1. <!doctype html>
  2.     <html lang="fr">
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6.         <meta name="description" content="Site de vente en ligne en Symfony 5">
  7.         <meta name="author" content="Cassano Gabriele">
  8.         <title>GC Belgian Shop</title>
  9.         <link href="{{ asset('assets/css/bootstrap.min.css') }}" rel="stylesheet">
  10.         <link href="{{ asset('assets/css/boutiquebelge.css') }}" rel="stylesheet">
  11.         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
  12.         <link href="{{ asset('assets/css/carousel.css') }}" rel="stylesheet"> 
  13.         
  14.         <style>
  15.         .sf-toolbar {
  16.             display: none !important;
  17.         }
  18.         </style>
  19.     </head>
  20.     
  21.     <body>    
  22.         <header>            
  23.             <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-info">
  24.                 <a class="navbar-brand" href="{{ path('home') }}">GC Belgian Shop</a>
  25.                 
  26.                 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
  27.                     <span class="navbar-toggler-icon"></span>
  28.                 </button>
  29.                 <div class="collapse navbar-collapse" id="navbarCollapse">
  30.                     <ul class="navbar-nav mr-auto">
  31.                         <li class="nav-item active">
  32.                             <a class="nav-link" href="{{path('about')}}">Qui sommes-nous ?</a>
  33.                         </li>
  34.                         <li class="nav-item active">
  35.                             <a class="nav-link" href="{{path('products')}}">Nos produits</a>
  36.                         </li>  
  37.                     </ul>  
  38.                     <div class="navbar-item-custom">
  39.                         {% if app.user %}
  40.                             <a href="{{ path('account')}}">Mon compte <small>({{ app.user.firstname }})</small></a> | <a href="{{ path('app_logout')}}"> Déconnecter</a> 
  41.                         {% else %}
  42.                             <a href="{{ path('app_login')}}">Connexion </a> | <a href="{{ path('register')}}"> Inscription</a> 
  43.                         {% endif %}
  44.                     </div>   
  45.                     <a href="{{ path('cart')}}"><i class="fas fa-shopping-cart text-light ml-2"></i></a> 
  46.                     <span class="text-white ml-2">({{ cartItemCount() }})</span> 
  47.                     {% if app.user %}
  48.                         <a href="{{ path('wishlists')}}"><i class="fas fa-heart text-light ml-2"></i></a>  
  49.                         <span class="text-white ml-2" id="wishlist-count">({{ wishlistItemCount() }})</span>   
  50.                     {% endif %}
  51.                   </div>                 
  52.                 </div>
  53.             </nav>
  54.             
  55.             <div class="alert alert-danger text-center" style="margin-top: 20px !important;" role="alert">
  56.              &#x26A0; Ce site est un site de démonstration, contenant des données fictives, et ayant pour unique objectif, de présenter mes compétences en Symfony.
  57.             </div>
  58.         </header>
  59.         <main role="main">
  60.             {% if block('carousel') is defined %}
  61.             <div id="myCarousel" class="carousel slide custom-carousel" data-ride="carousel">
  62.                 <ol class="carousel-indicators">
  63.                     <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
  64.                     <li data-target="#myCarousel" data-slide-to="1"></li>
  65.                     <li data-target="#myCarousel" data-slide-to="2"></li>
  66.                 </ol>
  67.                 
  68.                 <div class="carousel-inner">
  69.                     <div class="carousel-item active">
  70.                         <img src="{{ asset('assets/img/slider/slider1.jpg') }}" alt="Image 1 du slider" />
  71.                         <div class="container">
  72.                             <div class="carousel-caption text-left">
  73.                                 <h1>Achetez des produits belges</h1>
  74.                                 <p>Un large choix de bières belges.</p>
  75.                                 <p><a class="btn btn-lg btn-primary" href="{{ path('register')}}" role="button">S'inscrire aujourd'hui</a></p>
  76.                             </div>
  77.                         </div>
  78.                     </div>
  79.                     <div class="carousel-item">
  80.                        <img src="{{ asset('assets/img/slider/slider2.jpg') }}" alt="Image 2 du slider" />
  81.                         <div class="container">
  82.                             <div class="carousel-caption">
  83.                                 <h1>Dégustez le café belge</h1>
  84.                                 <p>Découvrez les cafés fabriqués dans notre pays.</p>
  85.                                 <p><a class="btn btn-lg btn-primary" href="#" role="button">Lire plus</a></p>
  86.                             </div>
  87.                         </div>
  88.                     </div>
  89.                     <div class="carousel-item">
  90.                         <img src="{{ asset('assets/img/slider/slider3.jpg') }}" alt="Image 3 du slider" />
  91.                         <div class="container">
  92.                             <div class="carousel-caption text-right">
  93.                                 <h1>Le chocolat belge</h1>
  94.                                 <p>Comme vous le savez, les belges sont spécialistes de la bière, le chocolat et les frites.</p>
  95.                                 <p><a class="btn btn-lg btn-primary" href="#" role="button">Voir la gallerie</a></p>
  96.                             </div>
  97.                         </div>
  98.                     </div>
  99.                 </div>
  100.                 <a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev">
  101.                     <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  102.                     <span class="sr-only">Previous</span>
  103.                 </a>
  104.                 <a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
  105.                     <span class="carousel-control-next-icon" aria-hidden="true"></span>
  106.                     <span class="sr-only">Next</span>
  107.                 </a>
  108.             </div>
  109.             {% endif %}
  110.        
  111.             <div class="container marketing  {% if block('carousel') is not defined %} mt-5 {% endif %}"> 
  112.                 {% block content %}
  113.                 {% endblock %}
  114.             </div>
  115.             <footer class="footer-custom bg-info">                
  116.                 <p class="h5 mb-5 mt-3">
  117.                     &copy; 2023 La boutique belge
  118.                     <br>
  119.                     <small class="h5">
  120.                         <a href="{{ path('cg')}}" class="text-white">Conditions générales</a> 
  121.                         &middot; <a href="{{ path('cgv')}}" class="text-white">Conditions générales de ventes</a>
  122.                         &middot; <a href="{{ path('ml')}}" class="text-white">Mentions légales</a>
  123.                         &middot; <a href="{{ path('confidentialite')}}" class="text-white">Politique de confidentialité</a>
  124.                     </small>
  125.                     <br>
  126.                 
  127.                     <small class="h5">
  128.                     Symfony 5.4.24
  129.                     </small>
  130.                 </p>
  131.             </footer>
  132.         </main>
  133.         <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>     
  134.         <script src="{{ asset('assets/js/bootstrap.bundle.js') }}"></script>              
  135.         <script src="https://js.stripe.com/v3/"></script>
  136.        <script>
  137.         var stripe = Stripe('pk_test_51MmMexI1PfFa9viOYqTeiLsEwHggcXbngjC2pMdIQeGIoEpFKXLrQJdfJQKOOUloRbbj1dJZyJ9jKXymdpCKvWwW00kx87PAdl');
  138.                 
  139.         var checkoutButton = document.getElementById('checkout-button');       
  140.         checkoutButton.addEventListener('click', function() {                 
  141.             {% if reference is defined %}
  142.             // Créer une session de paiement avec Stripe     
  143.             fetch('create-checkout-session/{{ reference }}') // remplacez cette URL par l'URL de votre route Symfony qui crée une session de paiement avec Stripe
  144.                 .then(function(response) {
  145.                     return response.json();
  146.                 })
  147.                 .then(function(session) {
  148.                     if(session.error == "order"){
  149.                         // redirection (la commande n'a pas été créée correctement)
  150.                         window.location.replace('{{ path('order') }}')
  151.                     } else{
  152.                         // Rediriger l'utilisateur vers la page de paiement de Stripe
  153.                         return stripe.redirectToCheckout({ sessionId: session.id });
  154.                     }                    
  155.                 })
  156.                 .then(function(result) {
  157.                     // Afficher un message d'erreur si la redirection échoue
  158.                     if (result.error) {
  159.                         alert(result.error.message);
  160.                     }
  161.                 });
  162.             {% else %}
  163.             alert('La référence n\'est pas définie.');
  164.             {% endif %}
  165.         });
  166.         </script>
  167.       
  168.     </body>
  169. </html>