var/cache/dev/twig/b9/b932b00f9926f3af0cf9914133167a94.php line 58

Open in your IDE?
  1. <?php
  2. use Twig\Environment;
  3. use Twig\Error\LoaderError;
  4. use Twig\Error\RuntimeError;
  5. use Twig\Extension\CoreExtension;
  6. use Twig\Extension\SandboxExtension;
  7. use Twig\Markup;
  8. use Twig\Sandbox\SecurityError;
  9. use Twig\Sandbox\SecurityNotAllowedTagError;
  10. use Twig\Sandbox\SecurityNotAllowedFilterError;
  11. use Twig\Sandbox\SecurityNotAllowedFunctionError;
  12. use Twig\Source;
  13. use Twig\Template;
  14. use Twig\TemplateWrapper;
  15. /* Parent/DetailsSejour.html.twig */
  16. class __TwigTemplate_2e4d9af98367fb875e9538af7eac3dac extends Template
  17. {
  18.     private Source $source;
  19.     /**
  20.      * @var array<string, Template>
  21.      */
  22.     private array $macros = [];
  23.     public function __construct(Environment $env)
  24.     {
  25.         parent::__construct($env);
  26.         $this->source $this->getSourceContext();
  27.         $this->blocks = [
  28.             'LinksCss' => [$this'block_LinksCss'],
  29.             'Content' => [$this'block_Content'],
  30.             'Javascript' => [$this'block_Javascript'],
  31.         ];
  32.     }
  33.     protected function doGetParent(array $context): bool|string|Template|TemplateWrapper
  34.     {
  35.         // line 1
  36.         return "Parent/LayoutParent.html.twig";
  37.     }
  38.     protected function doDisplay(array $context, array $blocks = []): iterable
  39.     {
  40.         $macros $this->macros;
  41.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  42.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template""Parent/DetailsSejour.html.twig"));
  43.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  44.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template""Parent/DetailsSejour.html.twig"));
  45.         // line 197
  46.         $context["pageMenu"] = CoreExtension::getAttribute($this->env$this->sourceCoreExtension::getAttribute($this->env$this->source, (isset($context["app"]) || array_key_exists("app"$context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.'197$this->source); })()), "session", [], "any"falsefalsefalse197), "get", ["pageMenu"], "method"falsefalsefalse197);
  47.         // line 1
  48.         $this->parent $this->load("Parent/LayoutParent.html.twig"1);
  49.         yield from $this->parent->unwrap()->yield($contextarray_merge($this->blocks$blocks));
  50.         
  51.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  52.         
  53.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  54.     }
  55.     /**
  56.      * @return iterable<null|scalar|\Stringable>
  57.      */
  58.     public function block_LinksCss(array $context, array $blocks = []): iterable
  59.     {
  60.         $macros $this->macros;
  61.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  62.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""LinksCss"));
  63.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  64.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""LinksCss"));
  65.         // line 2
  66.         yield from $this->yieldParentBlock("LinksCss"$context$blocks);
  67.         yield "
  68. <script src=\"https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.js\"></script>
  69. <link rel=\"stylesheet\" href=\"";
  70.         // line 5
  71.         yield "/css/Parent/css/premiercnx.css";
  72.         yield "\" />
  73. <link href=\"";
  74.         // line 6
  75.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("css/Parent/css/detailsejour.css"), "html"nulltrue);
  76.         yield "\" type=\"text/css\" rel=\"stylesheet\" />
  77. <link rel=\"stylesheet\" href=\"";
  78.         // line 7
  79.         yield "/css/Accompagnateur/imgzoom.css";
  80.         yield "\" />
  81. <link rel=\"stylesheet\" href=\"";
  82.         // line 8
  83.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("Plugins/css/dropzone.css"), "html"nulltrue);
  84.         yield "\" />
  85. <link rel=\"stylesheet\" href=\"";
  86.         // line 9
  87.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("css/splide.min.css"), "html"nulltrue);
  88.         yield "\" />
  89. <link rel=\"stylesheet\" href=\"";
  90.         // line 10
  91.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("css/favorites-sidebar.css"), "html"nulltrue);
  92.         yield "\" />
  93. ";
  94.         // line 11
  95.         $context["destination"] = "detailsejour";
  96.         // line 12
  97.         yield "<style>
  98. .btn-cmdFav {
  99.   background-color: #F56040;
  100.   color: white;
  101.   padding: 10px 20px;
  102.   border-radius: 6px;
  103.   font-size: 1rem;
  104.   box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  105.   transition: all 0.3s ease;
  106. }
  107. .btn-cmdFav:hover {
  108.   background-color: #e64a30;
  109.   transform: scale(1.05);
  110.   box-shadow: 0 6px 12px rgba(0,0,0,0.2);
  111. }
  112. .filter-badge {
  113.   background-color: #ccc;
  114.   color: white;
  115.   font-size: 12px;
  116.   padding: 2px 10px;
  117.   border-radius: 20px;
  118.   display: flex;
  119.   align-items: center;
  120.   cursor: pointer;
  121.   transition: all 0.3s ease;
  122. }
  123. .filter-badge:hover {
  124.   background-color: #aaa;
  125. }
  126. /* Quand le filtre est actif */
  127. .filter-badge.active {
  128.   background-color: #3BA39B; /* Vert plus vif */
  129.   box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  130.   font-weight: bold;
  131.   color: white;
  132. }
  133.   .close-btn-purchase {
  134.     position: absolute;
  135.     padding: 2px;
  136.     top: 10px;
  137.     right: 10px;
  138.     background: none;
  139.     border: none;
  140.     font-size: 35px;
  141.     cursor: pointer;
  142.   }
  143.   .close-btn-purchase :hover {
  144.     color: red;
  145.   }
  146.   .rowimag.no-margin {
  147.     display: grid;
  148.     grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  149.     /* auto-fill + minmax ensures they fill the row and wrap automatically */
  150.     gap: 8px; /* spacing between items, optional */
  151.     margin: 0; /* override default margin if you want */
  152.     padding: 0;
  153.   }
  154.   /* Each cell is 200px tall (or pick your own dimension). */
  155.   .photo-item {
  156.     width: 100%;
  157.     height: 250px; /* fixed height: 200px */
  158.     position: relative;
  159.     overflow: hidden; /* hide any overflow if the image is bigger */
  160.     border-radius: 4px; /* optional rounding corners */
  161.     background: #f0f0f0; /* fallback background color while image loads */
  162.     margin-bottom: 20px;
  163.   }
  164.   /* For images, we want them to fill the box and maintain a cover aspect. */
  165.   .photo-item img,
  166.   .photo-item video {
  167.     width: 100%;
  168.     height: 100%;
  169.     object-fit: cover; /* ensures image or video is cropped rather than distorted */
  170.     display: block;
  171.   }
  172.   .fav-button {
  173.     pointer-events: none; /* Makes the entire button unclickable */
  174.   }
  175.   
  176.   /* Enable hover effects only */
  177.   .fav-button * {
  178.     pointer-events: auto; /* Re-enable events for children */
  179.     pointer-events: hover; /* Only allow hover events, not clicks */
  180.   }
  181.   
  182.   /* Add this class to the purchase alert to ensure it remains interactive */
  183.   #purchase-alert {
  184.     pointer-events: auto;
  185.   
  186.   }
  187.   /* Réduit l'espace autour du header */
  188.   .header {
  189.     padding: 15px 15px 5px 15px;
  190.     background: #f9f9f9;
  191.   }
  192.   /* Réduit l'espace sous le titre et le sous-titre */
  193.   .titreDetailSej {
  194.     margin-bottom: 8px;
  195.   }
  196.   .media-counts {
  197.     margin-bottom: 8px;
  198.   }
  199.   /* Centre la navigation des dates */
  200.   .date-navigation {
  201.     display: flex;
  202.     align-items: center;
  203.     justify-content: center;
  204.     gap: 8px;
  205.     width: 100%;
  206.     margin-top: 0;
  207.   }
  208.   /* Centre le conteneur des cartes */
  209.   .date-container {
  210.     display: flex;
  211.     justify-content: center;
  212.     width: 100%;
  213.   }
  214.   .media-list-horizontal {
  215.     gap: 4px;
  216.     font-size: 11px;
  217.     margin-top: 2px;
  218.     display: flex;
  219.     justify-content: center;
  220.     list-style: none;
  221.     margin-bottom: 0;
  222.     padding-left: 0;
  223.   }
  224.   .sejour-title h1 {
  225.     font-size: 1.5rem;
  226.     font-weight: bold;
  227.     color: #3BA39B;
  228.     display: flex;
  229.     align-items: center;
  230.     gap: 10px;
  231.   }
  232.   .sejour-dates {
  233.     font-size: 14px;
  234.     color: #777;
  235.     margin-top: 5px;
  236.   }
  237.   .sejour-medias {
  238.     display: flex;
  239.     gap: 20px;
  240.     align-items: center;
  241.     font-size: 14px;
  242.     color: #555;
  243.   }
  244.   .media-info {
  245.     display: flex;
  246.     align-items: center;
  247.     gap: 5px;
  248.   }
  249.   /* Responsive Mobile */
  250.   @media (max-width: 768px) {
  251.     .sejour-header {
  252.       flex-direction: column;
  253.       align-items: center;
  254.       text-align: center;
  255.     }
  256.     .sejour-medias {
  257.       margin-top: 10px;
  258.       gap: 10px;
  259.     }
  260.   }
  261. </style>
  262. ";
  263.         
  264.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  265.         
  266.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  267.         yield from [];
  268.     }
  269.     // line 197
  270.     /**
  271.      * @return iterable<null|scalar|\Stringable>
  272.      */
  273.     public function block_Content(array $context, array $blocks = []): iterable
  274.     {
  275.         $macros $this->macros;
  276.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  277.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""Content"));
  278.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  279.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""Content"));
  280.         // line 199
  281.         yield "
  282. <!-- Alerte pour inciter à acheter -->
  283. <div id=\"purchase-alert\" class=\"purchase-alert hidden\" style=\"display: none;\">
  284.   <button class=\"close-btn\" onclick=\"closePurchaseAlert()\">&times;</button>
  285.   <div id=\"purchase-alert-content\">
  286.     <!-- Le contenu de l'alerte sera mis à jour dynamiquement en fonction du nombre de favoris -->
  287.   </div>
  288. </div>
  289. <div
  290.   id=\"verifImg\"
  291.   class=\"modal fade\"
  292.   role=\"dialog\"
  293.   style=\"background-color: rgba(112, 112, 112, 0.56); z-index: 1000000\"
  294. >
  295.   <div class=\"modal-dialog dialogUploadImg\">
  296.     <div class=\"row modal-content no-margin contentdialogNoImg\">
  297.       <div class=\"headerdialogUploadImg\">
  298.         <h1 class=\"titledialogUploadImg\"></h1>
  299.         <img
  300.           src=\"";
  301.         // line 220
  302.         yield "/images/Accompagnateur/CroixFermeture.svg";
  303.         yield "\"
  304.           class=\"closeNOUploadImg\"
  305.           data-dismiss=\"modal\"
  306.         />
  307.       </div>
  308.       <div class=\"ContenudetailsSejour\">
  309.         <div class=\"row no-margin detailsSejour\">
  310.           <div class=\"ContentUpload\">
  311.             <h1 class=\"titleTelechargement\">
  312.               Oulala, patience, avant tout sélectionnez vos photos préférées à
  313.               l'aide de ce bouton
  314.               <i
  315.                 class=\"bi bi-heart\"
  316.                 style=\"font-size: 1.3rem\"
  317.                 title=\"Ajouter à  ma sélection\"
  318.               ></i>
  319.               sous les photos  <br /><br /><a style=\"color: #f09e7a\"
  320.                 >Pensez à commander des tirages... pour leurs offrir un beau
  321.                 souvenir !
  322.               </a>
  323.             </h1>
  324.           </div>
  325.         </div>
  326.       </div>
  327.       <div class=\"BottomNoUploadImg\">
  328.         <button class=\"BtnUploadImg btnAnnulerUpload\" data-dismiss=\"modal\">
  329.           OK
  330.         </button>
  331.       </div>
  332.     </div>
  333.   </div>
  334. </div>
  335. <div class=\"main-content\">
  336.   <div class=\"row no-margin\">
  337.     <!-- Chat button -->
  338.     <div
  339.       class=\"fav-button\"
  340.       onmouseover=\"showSelection()\"
  341.       onmouseout=\"hideSelection()\"
  342.     >
  343.       <i id=\"favoris-icon-Accueilpayment\" class=\"bi bi-heart-fill CoeurEclat\"></i
  344.       ><label
  345.         id=\"likeCount\"
  346.         class=\"labelFavCount\"
  347.         style=\"background-color: #f56040\"
  348.       >
  349.         ";
  350.         // line 268
  351.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["likes"]) || array_key_exists("likes"$context) ? $context["likes"] : (function () { throw new RuntimeError('Variable "likes" does not exist.'268$this->source); })())), "html"nulltrue);
  352.         yield "</label
  353.       >
  354.     </div>
  355.     <div class=\"selection-popover\" id=\"selectionPopover\">
  356.       <h4>Votre sélection</h4>
  357.       <p>Tirages : ";
  358.         // line 273
  359.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["likes"]) || array_key_exists("likes"$context) ? $context["likes"] : (function () { throw new RuntimeError('Variable "likes" does not exist.'273$this->source); })())), "html"nulltrue);
  360.         yield " / 12</p>
  361.       <p>Numériques : ";
  362.         // line 274
  363.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["likes"]) || array_key_exists("likes"$context) ? $context["likes"] : (function () { throw new RuntimeError('Variable "likes" does not exist.'274$this->source); })())), "html"nulltrue);
  364.         yield " / 15</p>
  365.       <p>Album : ";
  366.         // line 275
  367.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["likes"]) || array_key_exists("likes"$context) ? $context["likes"] : (function () { throw new RuntimeError('Variable "likes" does not exist.'275$this->source); })())), "html"nulltrue);
  368.         yield " / 20</p>
  369.       <button class=\"finalize-button\">Finaliser ma commande</button>
  370.     </div>
  371.   </div>
  372.   <div class=\"divSliderModern\">
  373.     <input type=\"hidden\" id=\"nbFavCurrent\" value=\"";
  374.         // line 281
  375.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["nblikes"]) || array_key_exists("nblikes"$context) ? $context["nblikes"] : (function () { throw new RuntimeError('Variable "nblikes" does not exist.'281$this->source); })()), "html"nulltrue);
  376.         yield "\" />
  377.     <div
  378.       class=\"splide no-padding no-margin\"
  379.       id=\"imageSlider\"
  380.       style=\"max-height: 200px\"
  381.     >
  382.       <div class=\"splide__track\">
  383.         <ul class=\"splide__list\">
  384.           <!-- Slide 1 -->
  385.           <li class=\"splide__slide\">
  386.             <div class=\"slider-content\" style=\"background: white\">
  387.               <div class=\"namePRD\" style=\"display: block\">
  388.                 <h4
  389.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  390.                   style=\"color: #41a2aa\"
  391.                 >
  392.                   Ajoutez vos favoris dès maintenant
  393.                 </h4>
  394.                 <h4
  395.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  396.                   style=\"color: #f09e7a\"
  397.                 >
  398.                   et profitez de nos produits souvenirs personnalisés !
  399.                 </h4>
  400.               </div>
  401.               <img
  402.                 src=\"";
  403.         // line 309
  404.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/images/imgSliderEmpty2.png"), "html"nulltrue);
  405.         yield "\"
  406.                 class=\"imgslider\"
  407.                 alt=\"Image 1\"
  408.               />
  409.             </div>
  410.           </li>
  411.           <!-- Slide 2 -->
  412.           <li class=\"splide__slide\">
  413.             <div class=\"slider-content\" style=\"background: white\">
  414.               <div class=\"namePRD\" style=\"display: block\">
  415.                 <h4
  416.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  417.                   style=\"color: #f09e7a\"
  418.                 >
  419.                   Pensez à commander le livre du séjour
  420.                 </h4>
  421.                 <h4
  422.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  423.                   style=\"color: #41a2aa\"
  424.                 >
  425.                   et offrez lui le plus beau des cadeaux !
  426.                 </h4>
  427.               </div>
  428.               <img
  429.                 src=\"";
  430.         // line 333
  431.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/images/imgSliderEmpty1.png"), "html"nulltrue);
  432.         yield "\"
  433.                 class=\"imgslider\"
  434.                 alt=\"Image 2\"
  435.               />
  436.             </div>
  437.           </li>
  438.         </ul>
  439.       </div>
  440.     </div>
  441.   </div>
  442.   <!-- Section de contenu à atteindre après le scroll -->
  443.   <div
  444.     class=\"no-margin\"
  445.     id=\"scrollTarget\"
  446.     style=\"width: 100%; background: #f9f9f9; padding-top: 30px\"
  447.   >
  448.     <div class=\"no-margin\" id=\"scrollTarget\" style=\"width: 100%\">
  449.       <!-- Conteneur principal en ligne -->
  450.       <div
  451.         class=\"header d-flex align-items-center justify-content-between\"
  452.         style=\"padding: 15px;\"
  453.       >
  454.         <!-- Bloc titre -->
  455.         <div class=\"box divInfosSejour\" style=\"width: 95%;\">
  456.           <img
  457.             class=\"imageTitreSej\"
  458.             src=\"/Accueil/imagesAccueil/sejour.png\"
  459.             alt=\"Icône séjour\"
  460.             style=\"width: 40px; height: auto\"
  461.           />
  462.           <h1 class=\"titreDetailSej\">
  463.             Séjour ";
  464.         // line 365
  465.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'365$this->source); })()), "codeSejour", [], "any"falsefalsefalse365), "html"nulltrue);
  466.         yield " ";
  467.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'365$this->source); })()), "themSejour", [], "any"falsefalsefalse365), "html"nulltrue);
  468.         yield "
  469.             <span class=\"spnTitleSej\">
  470.               du
  471.               ";
  472.         // line 369
  473.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::replace($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'369$this->source); })()), "dateDebutSejour", [], "any"falsefalsefalse369), "d M Y"), ["Jan" => "janv.""Feb" => "fév.""Mar" => "mars""Apr" => "avr.""May" => "mai""Jun" => "juin""Jul" => "juil.""Aug" => "août""Sep" => "sept.""Oct." => "oct.""Nov." => "nov.""Dec." => "déc."]), "html"nulltrue);
  474.         yield "
  475.               au
  476.               ";
  477.         // line 371
  478.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::replace($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'371$this->source); })()), "dateFinSejour", [], "any"falsefalsefalse371), "d M Y"), ["Jan" => "janv.""Feb" => "fév.""Mar" => "mars""Apr" => "avr.""May" => "mai""Jun" => "juin""Jul" => "juil.""Aug" => "août""Sep" => "sept.""Oct." => "oct.""Nov." => "nov.""Dec." => "déc."]), "html"nulltrue);
  479.         yield "
  480.             </span>
  481.           </h1>
  482.           <span class=\"spnTitleSej\" style=\"color:black\">
  483.         
  484.             (📷 ";
  485.         // line 376
  486.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["attachementsCount"]) || array_key_exists("attachementsCount"$context) ? $context["attachementsCount"] : (function () { throw new RuntimeError('Variable "attachementsCount" does not exist.'376$this->source); })()), "html"nulltrue);
  487.         yield " Photos/Vidéos | 🎵 ";
  488.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["nbmessages"]) || array_key_exists("nbmessages"$context) ? $context["nbmessages"] : (function () { throw new RuntimeError('Variable "nbmessages" does not exist.'376$this->source); })()), "html"nulltrue);
  489.         yield " Audios  ❤️  <label
  490.         id=\"mesFavCount\" style=\"color:black;margin-right:5px\"
  491.       
  492.     >
  493.     ";
  494.         // line 380
  495.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["nblikes"]) || array_key_exists("nblikes"$context) ? $context["nblikes"] : (function () { throw new RuntimeError('Variable "nblikes" does not exist.'380$this->source); })()), "html"nulltrue);
  496.         yield "   </label> Favoris )
  497.   
  498.           </span>
  499.           <div class=\"date-navigation\">
  500.           
  501.      
  502.             <div class=\"date-container\">
  503.               ";
  504.         // line 389
  505.         $context['_parent'] = $context;
  506.         $context['_seq'] = CoreExtension::ensureTraversable((isset($context["listeattach"]) || array_key_exists("listeattach"$context) ? $context["listeattach"] : (function () { throw new RuntimeError('Variable "listeattach" does not exist.'389$this->source); })()));
  507.         $context['loop'] = [
  508.           'parent' => $context['_parent'],
  509.           'index0' => 0,
  510.           'index'  => 1,
  511.           'first'  => true,
  512.         ];
  513.         if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  514.             $length count($context['_seq']);
  515.             $context['loop']['revindex0'] = $length 1;
  516.             $context['loop']['revindex'] = $length;
  517.             $context['loop']['length'] = $length;
  518.             $context['loop']['last'] = === $length;
  519.         }
  520.         foreach ($context['_seq'] as $context["x"] => $context["groupAttach"]) {
  521.             // line 390
  522.             yield "                ";
  523.             $context["xDate"] = $this->extensions['Twig\Extension\CoreExtension']->convertDate($context["x"]);
  524.             // line 391
  525.             yield "                ";
  526.             $context["finDate"] = $this->extensions['Twig\Extension\CoreExtension']->convertDate(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'391$this->source); })()), "dateFinSejour", [], "any"falsefalsefalse391));
  527.             // line 392
  528.             yield "                ";
  529.             if (((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'392$this->source); })()) <= (isset($context["finDate"]) || array_key_exists("finDate"$context) ? $context["finDate"] : (function () { throw new RuntimeError('Variable "finDate" does not exist.'392$this->source); })()))) {
  530.                 // line 393
  531.                 yield "                  <div
  532.                     class=\"date-card modern-card ";
  533.                 // line 394
  534.                 if ((CoreExtension::getAttribute($this->env$this->source$context["loop"], "last", [], "any"falsefalsefalse394) && ((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'394$this->source); })()) <= (isset($context["finDate"]) || array_key_exists("finDate"$context) ? $context["finDate"] : (function () { throw new RuntimeError('Variable "finDate" does not exist.'394$this->source); })())))) {
  535.                     yield " active ";
  536.                 }
  537.                 yield "\"
  538.                     data-aos=\"fade-up\"
  539.                     data-bs-toggle=\"collapse\"
  540.                     data-bs-target=\"#demP";
  541.                 // line 397
  542.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["loop"], "index", [], "any"falsefalsefalse397), "html"nulltrue);
  543.                 yield "\"
  544.                     id=\"iconedemoP";
  545.                 // line 398
  546.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["loop"], "index", [], "any"falsefalsefalse398), "html"nulltrue);
  547.                 yield "\"
  548.                   >
  549.                     <div class=\"card-content text-center\">
  550.                       <span class=\"day\">
  551.                         ";
  552.                 // line 402
  553.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "isFirstDay", [], "any"falsefalsefalse402) == "yes")) {
  554.                     yield " Premier jour
  555.                         ";
  556.                 } elseif ((CoreExtension::getAttribute($this->env$this->source,                 // line 403
  557. $context["groupAttach"], "isLastDay", [], "any"falsefalsefalse403) == "yes")) {
  558.                     yield " Dernier jour
  559.                         ";
  560.                 } else {
  561.                     // line 405
  562.                     yield "                          ";
  563.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::replace($this->extensions['Twig\Extension\CoreExtension']->formatDate((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'405$this->source); })()), "D"), ["Mon" => "lun.""Tue" => "mar.""Wed" => "mer.""Thu" => "jeu.""Fri" => "ven.""Sat" => "sam.""Sun" => "dim."]), "html"nulltrue);
  564.                     // line 413
  565.                     yield "
  566.                         ";
  567.                 }
  568.                 // line 415
  569.                 yield "                      </span>
  570.                       <span class=\"full-date\">
  571.                         ";
  572.                 // line 417
  573.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::replace($this->extensions['Twig\Extension\CoreExtension']->formatDate((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'417$this->source); })()), "d M Y"), ["Jan" => "janv.""Feb" => "fév.""Mar" => "mars""Apr" => "avr.""May" => "mai""Jun" => "juin""Jul" => "juil.""Aug" => "août""Sep" => "sept.""Oct." => "oct.""Nov." => "nov.""Dec." => "déc."]), "html"nulltrue);
  574.                 // line 430
  575.                 yield "
  576.                       </span>
  577.                       <ul class=\"media-list-horizontal\">
  578.                         ";
  579.                 // line 433
  580.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countPhotos", [], "any"falsefalsefalse433) > 0)) {
  581.                     // line 434
  582.                     yield "                        <li>
  583.                           <i class=\"bi bi-images\" style=\"color: #f56040; font-size: 0.7rem; margin-right: 3px\"></i>
  584.                           ";
  585.                     // line 436
  586.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countPhotos", [], "any"falsefalsefalse436), "html"nulltrue);
  587.                     yield "
  588.                         </li>
  589.                         ";
  590.                 }
  591.                 // line 439
  592.                 yield "                        ";
  593.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse439) > 0)) {
  594.                     // line 440
  595.                     yield "                        <li>
  596.                           <i class=\"bi bi-mic-fill\" style=\"color: #ffa500; font-size: 0.7rem; margin-right: 5px\"></i>
  597.                           ";
  598.                     // line 442
  599.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse442), "html"nulltrue);
  600.                     yield "
  601.                         </li>
  602.                         ";
  603.                 }
  604.                 // line 445
  605.                 yield "                        ";
  606.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countVideos", [], "any"falsefalsefalse445) > 0)) {
  607.                     // line 446
  608.                     yield "                        <li>
  609.                           <i class=\"bi bi-camera-video-fill\" style=\"color: #41a2aa; font-size: 0.7rem; margin-right: 5px\"></i>
  610.                           ";
  611.                     // line 448
  612.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countVideos", [], "any"falsefalsefalse448), "html"nulltrue);
  613.                     yield "
  614.                         </li>
  615.                         ";
  616.                 }
  617.                 // line 451
  618.                 yield "                      </ul>
  619.                     </div>
  620.                   </div>
  621.                 ";
  622.             }
  623.             // line 455
  624.             yield "              ";
  625.             ++$context['loop']['index0'];
  626.             ++$context['loop']['index'];
  627.             $context['loop']['first'] = false;
  628.             if (isset($context['loop']['revindex0'], $context['loop']['revindex'])) {
  629.                 --$context['loop']['revindex0'];
  630.                 --$context['loop']['revindex'];
  631.                 $context['loop']['last'] = === $context['loop']['revindex0'];
  632.             }
  633.         }
  634.         $_parent $context['_parent'];
  635.         unset($context['_seq'], $context['x'], $context['groupAttach'], $context['_parent'], $context['loop']);
  636.         $context array_intersect_key($context$_parent) + $_parent;
  637.         yield " <div id=\"dynamic-card\" class=\"dynamic-card\">
  638.       <div id=\"dynamic-card-content\" class=\"dynamic-card-content\">
  639.         <!-- Le contenu dynamique (album, pochette, montage vidéo) sera injecté ici -->
  640.       </div>
  641.     </div>
  642.             </div>
  643.           </div>
  644.         </div>
  645.       </div>
  646.     </div>
  647.     <!-- Descriptions and Attachments -->
  648.     <div class=\"container--gallery modern\">
  649.       ";
  650.         // line 468
  651.         $context["lastValidIndex"] = 0;
  652.         // line 469
  653.         yield "      ";
  654.         $context["hasAttachments"] = false;
  655.         // line 470
  656.         yield "      ";
  657.         $context['_parent'] = $context;
  658.         $context['_seq'] = CoreExtension::ensureTraversable((isset($context["listeattach"]) || array_key_exists("listeattach"$context) ? $context["listeattach"] : (function () { throw new RuntimeError('Variable "listeattach" does not exist.'470$this->source); })()));
  659.         $context['loop'] = [
  660.           'parent' => $context['_parent'],
  661.           'index0' => 0,
  662.           'index'  => 1,
  663.           'first'  => true,
  664.         ];
  665.         if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  666.             $length count($context['_seq']);
  667.             $context['loop']['revindex0'] = $length 1;
  668.             $context['loop']['revindex'] = $length;
  669.             $context['loop']['length'] = $length;
  670.             $context['loop']['last'] = === $length;
  671.         }
  672.         foreach ($context['_seq'] as $context["x"] => $context["groupAttach"]) {
  673.             // line 471
  674.             yield "      ";
  675.             $context["xDate"] = $this->extensions['Twig\Extension\CoreExtension']->convertDate($context["x"]);
  676.             // line 472
  677.             yield "      ";
  678.             $context["finDate"] = $this->extensions['Twig\Extension\CoreExtension']->convertDate(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'472$this->source); })()), "dateFinSejour", [], "any"falsefalsefalse472));
  679.             // line 473
  680.             yield "      ";
  681.             if (((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'473$this->source); })()) <= (isset($context["finDate"]) || array_key_exists("finDate"$context) ? $context["finDate"] : (function () { throw new RuntimeError('Variable "finDate" does not exist.'473$this->source); })()))) {
  682.                 // line 474
  683.                 yield "      ";
  684.                 $context["lastValidIndex"] = CoreExtension::getAttribute($this->env$this->source$context["loop"], "index", [], "any"falsefalsefalse474);
  685.                 // line 475
  686.                 yield "      ";
  687.                 $context["hasAttachments"] = true;
  688.                 // line 476
  689.                 yield "      <div
  690.         id=\"demP";
  691.                 // line 477
  692.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["loop"], "index", [], "any"falsefalsefalse477), "html"nulltrue);
  693.                 yield "\"
  694.         class=\"collapse ";
  695.                 // line 478
  696.                 if ((CoreExtension::getAttribute($this->env$this->source$context["loop"], "last", [], "any"falsefalsefalse478) && ((isset($context["xDate"]) || array_key_exists("xDate"$context) ? $context["xDate"] : (function () { throw new RuntimeError('Variable "xDate" does not exist.'478$this->source); })()) <= (isset($context["finDate"]) || array_key_exists("finDate"$context) ? $context["finDate"] : (function () { throw new RuntimeError('Variable "finDate" does not exist.'478$this->source); })())))) {
  697.                     yield "show";
  698.                 }
  699.                 yield "\"
  700.         style=\"padding: 2%; padding-top: 0%\"
  701.       >
  702.         <div class=\"journal-entry\">
  703.         <div class=\"entry-header\" style=\"
  704.     display: flex;
  705.     align-items: center;
  706.     justify-content: space-between;
  707.     background: #ffffff;
  708.     padding: 8px 15px;
  709.     border-radius: 10px;
  710.     margin-bottom: 20px;
  711.     box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  712.     border-bottom: 1px solid #eee;
  713.     flex-wrap: wrap;
  714. \">
  715.   <!-- Bouton Jour Précédent -->
  716.   ";
  717.                 // line 496
  718.                 if ((($tmp =  !CoreExtension::getAttribute($this->env$this->source$context["loop"], "first", [], "any"falsefalsefalse496)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  719.                     // line 497
  720.                     yield "  <button class=\"btn-prev-day\" data-target=\"";
  721.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((CoreExtension::getAttribute($this->env$this->source$context["loop"], "index0", [], "any"falsefalsefalse497) - 1), "html"nulltrue);
  722.                     yield "\" style=\"
  723.       background-color: #3BA39B;
  724.       border: none;
  725.       padding: 5px 10px;
  726.       border-radius: 8px;
  727.       font-weight: bold;
  728.       font-size: 14px;
  729.       height: 36px;
  730.       display: flex;
  731.       align-items: center;
  732.       color: white;
  733.       cursor: pointer;
  734.       transition: all 0.3s ease;
  735.   \">
  736.     <i class=\"bi bi-chevron-left\" style=\"font-size: 18px;\"></i>
  737.   </button>
  738.   ";
  739.                 } else {
  740.                     // line 514
  741.                     yield "  <div style=\"width: 36px;\"></div>
  742.   ";
  743.                 }
  744.                 // line 516
  745.                 yield "
  746.   <!-- Centre : Date + Médias -->
  747.   <div style=\"
  748.       flex-grow: 1;
  749.       display: flex;
  750.       align-items: center;
  751.       justify-content: center;
  752.       flex-wrap: wrap;
  753.       gap: 12px;
  754.   \">
  755.     <!-- Date -->
  756.     <div style=\"font-weight: bold; font-size: 16px; color: #333;\">
  757.       ";
  758.                 // line 528
  759.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::replace($this->extensions['Twig\Extension\CoreExtension']->formatDate($context["x"], "l d F Y"), ["Monday" => "Lundi""Tuesday" => "Mardi""Wednesday" => "Mercredi""Thursday" => "Jeudi""Friday" => "Vendredi""Saturday" => "Samedi""Sunday" => "Dimanche""January" => "Janvier""February" => "Février""March" => "Mars""April" => "Avril""May" => "Mai""June" => "Juin""July" => "Juillet""August" => "Août""September" => "Septembre""October" => "Octobre""November" => "Novembre""December" => "Décembre"]), "html"nulltrue);
  760.                 // line 536
  761.                 yield "
  762.     </div>
  763.   <!-- Filtres Médias -->
  764. <div class=\"filter-icons\" style=\"display: flex; gap: 8px; flex-wrap: wrap;\">
  765.     <span class=\"filter-badge active\" data-filter=\"all\" title=\"Afficher tout\">
  766.         <i class=\"bi bi-grid-3x3-gap-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> Tout
  767.     </span>
  768.     ";
  769.                 // line 545
  770.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countPhotos", [], "any"falsefalsefalse545) > 0)) {
  771.                     // line 546
  772.                     yield "    <span class=\"filter-badge\" data-filter=\"photo\" title=\"Filtrer les photos\">
  773.         <i class=\"bi bi-image\" style=\"margin-right: 5px; font-size: 14px;\"></i> ";
  774.                     // line 547
  775.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countPhotos", [], "any"falsefalsefalse547), "html"nulltrue);
  776.                     yield "
  777.     </span>
  778.     ";
  779.                 }
  780.                 // line 550
  781.                 yield "
  782.     ";
  783.                 // line 551
  784.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countVideos", [], "any"falsefalsefalse551) > 0)) {
  785.                     // line 552
  786.                     yield "    <span class=\"filter-badge\" data-filter=\"video\" title=\"Filtrer les vidéos\">
  787.         <i class=\"bi bi-camera-video-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> ";
  788.                     // line 553
  789.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countVideos", [], "any"falsefalsefalse553), "html"nulltrue);
  790.                     yield "
  791.     </span>
  792.     ";
  793.                 }
  794.                 // line 556
  795.                 yield "
  796.     ";
  797.                 // line 557
  798.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse557) > 0)) {
  799.                     // line 558
  800.                     yield "    <span class=\"filter-badge\" data-filter=\"audio\" title=\"Filtrer les messages audio\">
  801.         <i class=\"bi bi-mic-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> ";
  802.                     // line 559
  803.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse559), "html"nulltrue);
  804.                     yield "
  805.     </span>
  806.     ";
  807.                 }
  808.                 // line 562
  809.                 yield "</div>
  810.   </div>
  811.   <!-- Bouton Jour Suivant -->
  812.   ";
  813.                 // line 567
  814.                 if ((($tmp =  !CoreExtension::getAttribute($this->env$this->source$context["loop"], "last", [], "any"falsefalsefalse567)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  815.                     // line 568
  816.                     yield "  <button class=\"btn-next-day\" data-target=\"";
  817.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((CoreExtension::getAttribute($this->env$this->source$context["loop"], "index0", [], "any"falsefalsefalse568) + 1), "html"nulltrue);
  818.                     yield "\" style=\"
  819.       background-color: #3BA39B;
  820.       border: none;
  821.       padding: 5px 10px;
  822.       border-radius: 8px;
  823.       font-weight: bold;
  824.       font-size: 14px;
  825.       height: 36px;
  826.       display: flex;
  827.       align-items: center;
  828.       color: white;
  829.       cursor: pointer;
  830.       transition: all 0.3s ease;
  831.   \">
  832.     <i class=\"bi bi-chevron-right\" style=\"font-size: 18px;\"></i>
  833.   </button>
  834.   ";
  835.                 } else {
  836.                     // line 585
  837.                     yield "  <div style=\"width: 36px;\"></div>
  838.   ";
  839.                 }
  840.                 // line 587
  841.                 yield "
  842.    
  843.    
  844.         </div>
  845.         <!-- Contenu -->
  846.         <div class=\"entry-content\" id=\"TourContent\">
  847.       
  848.           <p class=\"description\" style=\"margin-left:2%;width:95%;margin-top:1%;margin-bottom:1%;text-align:left\">
  849.             ";
  850.                 // line 597
  851.                 $context['_parent'] = $context;
  852.                 $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'597$this->source); })()), "jourdescripdate", [], "any"falsefalsefalse597));
  853.                 foreach ($context['_seq'] as $context["_key"] => $context["description"]) {
  854.                     yield " ";
  855.                     if (($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env$this->source,                     // line 598
  856. $context["description"], "datejourphoto", [], "any"falsefalsefalse598), "m/d/Y") == $this->extensions['Twig\Extension\CoreExtension']->formatDate($context["x"], "m/d/Y"))) {
  857.                         // line 599
  858.                         yield "            ";
  859.                         yield Twig\Extension\CoreExtension::nl2br($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["description"], "description", [], "any"falsefalsefalse599), "html"nulltrue));
  860.                         yield "
  861.             ";
  862.                     }
  863.                     // line 600
  864.                     yield " ";
  865.                 }
  866.                 $_parent $context['_parent'];
  867.                 unset($context['_seq'], $context['_key'], $context['description'], $context['_parent']);
  868.                 $context array_intersect_key($context$_parent) + $_parent;
  869.                 // line 601
  870.                 yield "          </p>
  871.  
  872.           <!-- Conteneur des photos et vidéos -->
  873.           <div
  874.             class=\"rowimag no-margin\"
  875.             style=\"
  876.               width: 100%;
  877.               display: flex;
  878.               flex-wrap: wrap;
  879.               margin: 0;
  880.               box-sizing: border-box;
  881.             \"
  882.           >
  883.             <!-- Afficher les Photos et Vidéos -->
  884.             ";
  885.                 // line 616
  886.                 $context['_parent'] = $context;
  887.                 $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "attachments", [], "any"falsefalsefalse616));
  888.                 foreach ($context['_seq'] as $context["_key"] => $context["attach"]) {
  889.                     // line 617
  890.                     yield "              ";
  891.                     if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse617) == "photo")) {
  892.                         // line 618
  893.                         yield "           
  894.             <div class=\"column\" data-type=\"";
  895.                         // line 619
  896.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse619), "html"nulltrue);
  897.                         yield "\">
  898.             
  899.               <div class=\"photo-zoom photo-item\">
  900.          
  901.                 <a href=\"";
  902.                         // line 623
  903.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse623), "html"nulltrue);
  904.                         yield "\">
  905.                   <img src=\"";
  906.                         // line 624
  907.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse624), "html"nulltrue);
  908.                         yield "\" alt=\"";
  909.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse624), "html"nulltrue);
  910.                         yield "\" />
  911.                 </a>
  912.                 <!-- Icône du cœur avec logique existante -->
  913.                 <div
  914.                   class=\"heart-icon\"
  915.                   id=\"coeur";
  916.                         // line 630
  917.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "id_attchment", [], "any"falsefalsefalse630), "html"nulltrue);
  918.                         yield "\"
  919.                   data-id=\"";
  920.                         // line 631
  921.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "id_attchment", [], "any"falsefalsefalse631), "html"nulltrue);
  922.                         yield "\"
  923.                   data-sejour-id=\"";
  924.                         // line 632
  925.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'632$this->source); })()), "id", [], "any"falsefalsefalse632), "html"nulltrue);
  926.                         yield "\"
  927.                   data-path=\"";
  928.                         // line 633
  929.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse633), "html"nulltrue);
  930.                         yield "\"
  931.                   data-description=\"";
  932.                         // line 634
  933.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse634), "html"nulltrue);
  934.                         yield "\"
  935.                 >
  936.                   ";
  937.                         // line 636
  938.                         if ((($tmp CoreExtension::getAttribute($this->env$this->source, (isset($context["app"]) || array_key_exists("app"$context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.'636$this->source); })()), "user", [], "any"falsefalsefalse636)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  939.                             yield " ";
  940.                             if ((($tmp CoreExtension::getAttribute($this->env$this->source$context["attach"], "is_favorite", [], "any"falsefalsefalse636)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  941.                                 // line 637
  942.                                 yield "                  <i
  943.                     class=\"bi bi-heart-fill\"
  944.                     title=\"Sélectionnée\"
  945.                     style=\"color: #f56040\"
  946.                   ></i>
  947.                   ";
  948.                             } else {
  949.                                 // line 643
  950.                                 yield "                  <i class=\"bi bi-heart\" title=\"Ajouter à ma sélection\"></i>
  951.                   ";
  952.                             }
  953.                             // line 644
  954.                             yield " ";
  955.                         }
  956.                         // line 645
  957.                         yield "                </div>
  958.                 <div class=\"photo-actions\" style=\"display: none\">
  959.                   <button class=\"menu-btn\">⋮</button>
  960.                   <div class=\"menu-options\">
  961.                     <button onclick=\"addToPack('tirage')\">
  962.                       🖨️ Ajouter au tirage
  963.                     </button>
  964.                     <button onclick=\"addToPack('numerique')\">
  965.                       💾 Ajouter au numérique
  966.                     </button>
  967.                   </div>
  968.                 </div>
  969.               
  970.               </div>
  971.               ";
  972.                         // line 659
  973.                         if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse659) != "")) {
  974.                             // line 660
  975.                             yield "              <h4 class=\"description\">";
  976.                             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse660), "html"nulltrue);
  977.                             yield "</h4>
  978.               ";
  979.                         }
  980.                         // line 662
  981.                         yield "            </div>
  982.             ";
  983.                     }
  984.                     // line 666
  985.                     yield 
  986.              ";
  987.                     // line 669
  988.                     if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse669) == "video")) {
  989.                         // line 670
  990.                         yield "           
  991.             <div class=\"column\" data-type=\"";
  992.                         // line 671
  993.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse671), "html"nulltrue);
  994.                         yield "\">
  995.                  
  996.             
  997.                  <div class=\"video-container\" style=\"position: relative; display: inline-block; width: 100%; border-radius: 8px; overflow: hidden;\">
  998.                         <video class=\"photo-zoom\" controls controlslist=\"nodownload noplaybackrate\" style=\"width: 100%;\">
  999.                           <source src=\"";
  1000.                         // line 676
  1001.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse676), "html"nulltrue);
  1002.                         yield "\" type=\"video/mp4\" />
  1003.                           Votre navigateur ne supporte pas la lecture vidéo.
  1004.                         </video>
  1005.                       
  1006.                       </div>
  1007.               ";
  1008.                         // line 681
  1009.                         if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse681) != "")) {
  1010.                             // line 682
  1011.                             yield "              <h4 class=\"description\">";
  1012.                             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse682), "html"nulltrue);
  1013.                             yield "</h4>
  1014.               ";
  1015.                         }
  1016.                         // line 684
  1017.                         yield "            </div>
  1018.             ";
  1019.                     }
  1020.                     // line 685
  1021.                     yield 
  1022.             
  1023.             ";
  1024.                 }
  1025.                 $_parent $context['_parent'];
  1026.                 unset($context['_seq'], $context['_key'], $context['attach'], $context['_parent']);
  1027.                 $context array_intersect_key($context$_parent) + $_parent;
  1028.                 // line 688
  1029.                 yield "          </div>
  1030.           <!-- Section séparée pour les messages audio -->
  1031.           ";
  1032.                 // line 691
  1033.                 if ((CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse691) > 0)) {
  1034.                     // line 692
  1035.                     yield "          <div class=\"audio-messages-section\" style=\"margin-top:15px; border-top: 1px solid #eee; padding: 30px;\">
  1036.             <h4 style=\"margin-bottom: 15px; color: #555\">
  1037.               <i class=\"bi bi-mic-fill\" style=\"margin-right: 8px; color: #ffa500\"></i>
  1038.               Messages vocaux (";
  1039.                     // line 695
  1040.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "countAudio", [], "any"falsefalsefalse695), "html"nulltrue);
  1041.                     yield ")
  1042.             </h4>
  1043.             
  1044.             ";
  1045.                     // line 698
  1046.                     if ((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'698$this->source); })()), "codeSejour", [], "any"falsefalsefalse698), 02) == "PF")) {
  1047.                         // line 699
  1048.                         yield "              ";
  1049.                         // line 700
  1050.                         yield "              <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  1051.                 ";
  1052.                         // line 701
  1053.                         $context['_parent'] = $context;
  1054.                         $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "attachments", [], "any"falsefalsefalse701));
  1055.                         foreach ($context['_seq'] as $context["_key"] => $context["attach"]) {
  1056.                             // line 702
  1057.                             yield "                  ";
  1058.                             if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse702) == "message")) {
  1059.                                 // line 703
  1060.                                 yield "                    <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  1061.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  1062.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  1063.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  1064.                           <source src=\"";
  1065.                                 // line 707
  1066.                                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse707), "html"nulltrue);
  1067.                                 yield "\" type=\"audio/mp3\" />
  1068.                           Votre navigateur ne supporte pas la lecture audio.
  1069.                         </audio>
  1070.                       </div>
  1071.                       ";
  1072.                                 // line 711
  1073.                                 if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse711) != "")) {
  1074.                                     // line 712
  1075.                                     yield "                        <div class=\"audio-description\" style=\"padding-left: 30px\">
  1076.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  1077.                             ";
  1078.                                     // line 714
  1079.                                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse714), "html"nulltrue);
  1080.                                     yield "
  1081.                           </p>
  1082.                         </div>
  1083.                       ";
  1084.                                 }
  1085.                                 // line 718
  1086.                                 yield "                    </div>
  1087.                   ";
  1088.                             }
  1089.                             // line 720
  1090.                             yield "                ";
  1091.                         }
  1092.                         $_parent $context['_parent'];
  1093.                         unset($context['_seq'], $context['_key'], $context['attach'], $context['_parent']);
  1094.                         $context array_intersect_key($context$_parent) + $_parent;
  1095.                         // line 721
  1096.                         yield "              </div>
  1097.             
  1098.             ";
  1099.                     } elseif ((((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env$this->source,                     // line 723
  1100. (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'723$this->source); })()), "codeSejour", [], "any"falsefalsefalse723), 02) == "PP") && (CoreExtension::getAttribute($this->env$this->source, (isset($context["parentsejour"]) || array_key_exists("parentsejour"$context) ? $context["parentsejour"] : (function () { throw new RuntimeError('Variable "parentsejour" does not exist.'723$this->source); })()), "payment", [], "any"falsefalsefalse723) == 1)) || ((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'723$this->source); })()), "codeSejour", [], "any"falsefalsefalse723), 02) == "EF") && (CoreExtension::getAttribute($this->env$this->source, (isset($context["parentsejour"]) || array_key_exists("parentsejour"$context) ? $context["parentsejour"] : (function () { throw new RuntimeError('Variable "parentsejour" does not exist.'723$this->source); })()), "payment", [], "any"falsefalsefalse723) == 1)))) {
  1101.                         // line 724
  1102.                         yield "              ";
  1103.                         // line 725
  1104.                         yield "              <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  1105.                 ";
  1106.                         // line 726
  1107.                         $context['_parent'] = $context;
  1108.                         $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "attachments", [], "any"falsefalsefalse726));
  1109.                         foreach ($context['_seq'] as $context["_key"] => $context["attach"]) {
  1110.                             // line 727
  1111.                             yield "                  ";
  1112.                             if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse727) == "message")) {
  1113.                                 // line 728
  1114.                                 yield "                    <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  1115.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  1116.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  1117.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  1118.                           <source src=\"";
  1119.                                 // line 732
  1120.                                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse732), "html"nulltrue);
  1121.                                 yield "\" type=\"audio/mp3\" />
  1122.                           Votre navigateur ne supporte pas la lecture audio.
  1123.                         </audio>
  1124.                       </div>
  1125.                       ";
  1126.                                 // line 736
  1127.                                 if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse736) != "")) {
  1128.                                     // line 737
  1129.                                     yield "                        <div class=\"audio-description\" style=\"padding-left: 30px\">
  1130.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  1131.                             ";
  1132.                                     // line 739
  1133.                                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse739), "html"nulltrue);
  1134.                                     yield "
  1135.                           </p>
  1136.                         </div>
  1137.                       ";
  1138.                                 }
  1139.                                 // line 743
  1140.                                 yield "                    </div>
  1141.                   ";
  1142.                             }
  1143.                             // line 745
  1144.                             yield "                ";
  1145.                         }
  1146.                         $_parent $context['_parent'];
  1147.                         unset($context['_seq'], $context['_key'], $context['attach'], $context['_parent']);
  1148.                         $context array_intersect_key($context$_parent) + $_parent;
  1149.                         // line 746
  1150.                         yield "              </div>
  1151.             
  1152.             ";
  1153.                     } elseif ((((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env$this->source,                     // line 748
  1154. (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'748$this->source); })()), "codeSejour", [], "any"falsefalsefalse748), 02) == "PP") && (CoreExtension::getAttribute($this->env$this->source, (isset($context["parentsejour"]) || array_key_exists("parentsejour"$context) ? $context["parentsejour"] : (function () { throw new RuntimeError('Variable "parentsejour" does not exist.'748$this->source); })()), "payment", [], "any"falsefalsefalse748) == 0)) || ((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env$this->source, (isset($context["sejour"]) || array_key_exists("sejour"$context) ? $context["sejour"] : (function () { throw new RuntimeError('Variable "sejour" does not exist.'748$this->source); })()), "codeSejour", [], "any"falsefalsefalse748), 02) == "EF") && (CoreExtension::getAttribute($this->env$this->source, (isset($context["parentsejour"]) || array_key_exists("parentsejour"$context) ? $context["parentsejour"] : (function () { throw new RuntimeError('Variable "parentsejour" does not exist.'748$this->source); })()), "payment", [], "any"falsefalsefalse748) == 0)))) {
  1155.                         // line 749
  1156.                         yield "              ";
  1157.                         // line 750
  1158.                         yield "              <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px; opacity: 0.5; pointer-events: none; filter: grayscale(100%);\">
  1159.                 <div class=\"audio-messages-restricted\" style=\"padding: 20px; background: #f0f0f0; border-radius: 8px; text-align: center; margin-bottom: 15px; width: 100%;\">
  1160.                   <i class=\"bi bi-lock-fill\" style=\"font-size: 24px; color: #808080; margin-bottom: 10px;\"></i>
  1161.                   <p style=\"margin: 0; color: #555;\">Pour accéder aux messages vocaux, veuillez effectuer le paiement de votre séjour.</p>
  1162.                 </div>
  1163.                 ";
  1164.                         // line 755
  1165.                         $context['_parent'] = $context;
  1166.                         $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env$this->source$context["groupAttach"], "attachments", [], "any"falsefalsefalse755));
  1167.                         foreach ($context['_seq'] as $context["_key"] => $context["attach"]) {
  1168.                             // line 756
  1169.                             yield "                  ";
  1170.                             if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "libiller", [], "any"falsefalsefalse756) == "message")) {
  1171.                                 // line 757
  1172.                                 yield "                    <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  1173.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  1174.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  1175.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\" disabled>
  1176.                           <source src=\"";
  1177.                                 // line 761
  1178.                                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "path", [], "any"falsefalsefalse761), "html"nulltrue);
  1179.                                 yield "\" type=\"audio/mp3\" />
  1180.                           Votre navigateur ne supporte pas la lecture audio.
  1181.                         </audio>
  1182.                       </div>
  1183.                       ";
  1184.                                 // line 765
  1185.                                 if ((CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse765) != "")) {
  1186.                                     // line 766
  1187.                                     yield "                        <div class=\"audio-description\" style=\"padding-left: 30px\">
  1188.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  1189.                             ";
  1190.                                     // line 768
  1191.                                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env$this->source$context["attach"], "descreption", [], "any"falsefalsefalse768), "html"nulltrue);
  1192.                                     yield "
  1193.                           </p>
  1194.                         </div>
  1195.                       ";
  1196.                                 }
  1197.                                 // line 772
  1198.                                 yield "                    </div>
  1199.                   ";
  1200.                             }
  1201.                             // line 774
  1202.                             yield "                ";
  1203.                         }
  1204.                         $_parent $context['_parent'];
  1205.                         unset($context['_seq'], $context['_key'], $context['attach'], $context['_parent']);
  1206.                         $context array_intersect_key($context$_parent) + $_parent;
  1207.                         // line 775
  1208.                         yield "              </div>
  1209.             ";
  1210.                     }
  1211.                     // line 777
  1212.                     yield "          </div>
  1213.         ";
  1214.                 }
  1215.                 // line 779
  1216.                 yield "        </div>
  1217.       </div>
  1218.     </div>
  1219.     ";
  1220.             }
  1221.             // line 783
  1222.             yield "    ";
  1223.             ++$context['loop']['index0'];
  1224.             ++$context['loop']['index'];
  1225.             $context['loop']['first'] = false;
  1226.             if (isset($context['loop']['revindex0'], $context['loop']['revindex'])) {
  1227.                 --$context['loop']['revindex0'];
  1228.                 --$context['loop']['revindex'];
  1229.                 $context['loop']['last'] = === $context['loop']['revindex0'];
  1230.             }
  1231.         }
  1232.         $_parent $context['_parent'];
  1233.         unset($context['_seq'], $context['x'], $context['groupAttach'], $context['_parent'], $context['loop']);
  1234.         $context array_intersect_key($context$_parent) + $_parent;
  1235.         // line 784
  1236.         yield "    ";
  1237.         if ((($tmp =  !(isset($context["hasAttachments"]) || array_key_exists("hasAttachments"$context) ? $context["hasAttachments"] : (function () { throw new RuntimeError('Variable "hasAttachments" does not exist.'784$this->source); })())) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  1238.             // line 785
  1239.             yield "    <div class=\"welcome-message\" style=\"padding: 50px 20px; text-align: center; background: #f9f9f9; border-radius: 15px; margin: 30px auto; max-width: 800px; box-shadow: 0 5px 15px rgba(0,0,0,0.05);\">
  1240.       <img src=\"/images/welcome-icon.svg\" alt=\"Bienvenue\" style=\"width: 80px; margin-bottom: 20px;\" onerror=\"this.src='/images/Accompagnateur/Picto5sur5.svg'; this.style.width='120px';\">
  1241.       
  1242.       <h2 style=\"color: #41a2aa; margin-bottom: 20px; font-size: 24px;\">Bienvenue sur votre espace séjour !</h2>
  1243.       
  1244.       <p style=\"font-size: 18px; color: #555; margin-bottom: 15px;\">
  1245.         Aucun contenu n'a encore été partagé pour ce séjour.
  1246.       </p>
  1247.       
  1248.       <p style=\"font-size: 16px; color: #666; margin-bottom: 25px;\">
  1249.         L'accompagnateur partagera bientôt des photos, vidéos et messages vocaux.
  1250.         <br>Revenez consulter cette page régulièrement pour suivre les aventures du séjour !
  1251.       </p>
  1252.       
  1253.       <div style=\"display: flex; justify-content: center; gap: 15px; flex-wrap: wrap;\">
  1254.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  1255.           <i class=\"bi bi-images\" style=\"font-size: 24px; color: #f56040; margin-right: 10px;\"></i>
  1256.           <span>Photos du séjour</span>
  1257.         </div>
  1258.         
  1259.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  1260.           <i class=\"bi bi-camera-video-fill\" style=\"font-size: 24px; color: #41a2aa; margin-right: 10px;\"></i>
  1261.           <span>Vidéos des activités</span>
  1262.         </div>
  1263.         
  1264.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  1265.           <i class=\"bi bi-mic-fill\" style=\"font-size: 24px; color: #ffa500; margin-right: 10px;\"></i>
  1266.           <span>Messages vocaux</span>
  1267.         </div>
  1268.       </div>
  1269.     </div>
  1270.     
  1271.     <!-- Espace supplémentaire pour déplacer le footer vers le bas -->
  1272.     <div style=\"height: 300px;\"></div>
  1273.     ";
  1274.         }
  1275.         // line 820
  1276.         yield "    
  1277.     <!-- Make sure we're showing the right content by default if no valid content is marked 'show' -->
  1278.     ";
  1279.         // line 822
  1280.         if (((isset($context["lastValidIndex"]) || array_key_exists("lastValidIndex"$context) ? $context["lastValidIndex"] : (function () { throw new RuntimeError('Variable "lastValidIndex" does not exist.'822$this->source); })()) > 0)) {
  1281.             // line 823
  1282.             yield "    <script>
  1283.       document.addEventListener('DOMContentLoaded', function() {
  1284.         // Check if no content is showing
  1285.         if (document.querySelectorAll('.container--gallery .collapse.show').length === 0) {
  1286.           // Show the content for the last valid date
  1287.           var lastValidContent = document.getElementById('demP";
  1288.             // line 828
  1289.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["lastValidIndex"]) || array_key_exists("lastValidIndex"$context) ? $context["lastValidIndex"] : (function () { throw new RuntimeError('Variable "lastValidIndex" does not exist.'828$this->source); })()), "html"nulltrue);
  1290.             yield "');
  1291.           if (lastValidContent) {
  1292.             lastValidContent.classList.add('show');
  1293.             
  1294.             // Also mark the corresponding date card as active
  1295.             var dateCards = document.querySelectorAll('.date-card');
  1296.             if (dateCards.length >= ";
  1297.             // line 834
  1298.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["lastValidIndex"]) || array_key_exists("lastValidIndex"$context) ? $context["lastValidIndex"] : (function () { throw new RuntimeError('Variable "lastValidIndex" does not exist.'834$this->source); })()), "html"nulltrue);
  1299.             yield ") {
  1300.               dateCards.forEach(card => card.classList.remove('active'));
  1301.               dateCards[";
  1302.             // line 836
  1303.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((isset($context["lastValidIndex"]) || array_key_exists("lastValidIndex"$context) ? $context["lastValidIndex"] : (function () { throw new RuntimeError('Variable "lastValidIndex" does not exist.'836$this->source); })()) - 1), "html"nulltrue);
  1304.             yield "].classList.add('active');
  1305.             }
  1306.           }
  1307.         }
  1308.       });
  1309.     </script>
  1310.     ";
  1311.         }
  1312.         // line 843
  1313.         yield "  </div>
  1314. </div>
  1315.   ";
  1316.         
  1317.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  1318.         
  1319.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  1320.         yield from [];
  1321.     }
  1322.     // line 846
  1323.     /**
  1324.      * @return iterable<null|scalar|\Stringable>
  1325.      */
  1326.     public function block_Javascript(array $context, array $blocks = []): iterable
  1327.     {
  1328.         $macros $this->macros;
  1329.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  1330.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""Javascript"));
  1331.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  1332.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block""Javascript"));
  1333.         // line 847
  1334.         yield "  ";
  1335.         yield from $this->yieldParentBlock("Javascript"$context$blocks);
  1336.         yield "
  1337.   <script>// Gestion de la sidebar des favoris
  1338. document.addEventListener('DOMContentLoaded', function() {
  1339.     const sidebar = document.getElementById('favorites-sidebar');
  1340.     const openBtn = document.getElementById('openFavoritesSidebar');
  1341.     const closeBtn = document.querySelector('.favorites-close');
  1342.     const favButton = document.querySelector('.fav-button');
  1343.     function openSidebar() {
  1344.         sidebar.classList.add('active');
  1345.         updateFavoritesSidebar();
  1346.     }
  1347.     function closeSidebar() {
  1348.         sidebar.classList.remove('active');
  1349.     }
  1350.     function updateFavoritesSidebar() {
  1351.         const grid = document.getElementById('favorites-grid');
  1352.         const counter = document.getElementById('favorites-counter');
  1353.         const emptyState = document.getElementById('favorites-empty-state');
  1354.         const progress = document.getElementById('favorites-progress');
  1355.         
  1356.         const count = parseInt(document.getElementById('likeCount').textContent);
  1357.         counter.textContent = count +1;
  1358.         
  1359.         if (count === 0) {
  1360.             emptyState.style.display = 'flex';
  1361.             grid.style.display = 'none';
  1362.         } else {
  1363.             emptyState.style.display = 'none';
  1364.             grid.style.display = 'grid';
  1365.             const percentage = (count / 20) * 100;
  1366.             progress.style.width = `\${percentage}%`;
  1367.         }
  1368.     }
  1369.     if (openBtn) {
  1370.         openBtn.addEventListener('click', openSidebar);
  1371.     }
  1372.     if (favButton) {
  1373.         favButton.addEventListener('click', openSidebar);
  1374.     }
  1375.     if (closeBtn) {
  1376.         closeBtn.addEventListener('click', closeSidebar);
  1377.     }
  1378.     document.addEventListener('click', (e) => {
  1379.         if (sidebar.classList.contains('active') && 
  1380.             !sidebar.contains(e.target) && 
  1381.             !favButton.contains(e.target) && 
  1382.             !openBtn.contains(e.target)) {
  1383.             closeSidebar();
  1384.         }
  1385.     });
  1386. });
  1387. // Modification des fonctions existantes
  1388. const originalAddFavoris = window.AddFavoris;
  1389. window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  1390.     if (originalAddFavoris) {
  1391.         originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  1392.     }
  1393.     
  1394.     // Vérifier si la sidebar est ouverte - noter que nous vérifions la valeur CSS right: 0
  1395.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1396.         // Recharger les favoris
  1397.         loadFavorites();
  1398.     }
  1399. };
  1400. const originalSupprimerFavoris = window.supprimerFavoris;
  1401. window.supprimerFavoris = function(\$id, \$idSejour) {
  1402.     if (originalSupprimerFavoris) {
  1403.         originalSupprimerFavoris(\$id, \$idSejour);
  1404.     }
  1405.     
  1406.     // Vérifier si la sidebar est ouverte
  1407.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1408.         // Recharger les favoris
  1409.         loadFavorites();
  1410.     }
  1411. };
  1412. // Variables globales
  1413. let selectedFavorites = [];
  1414. let allFavorites = [];
  1415. // Fonction pour mettre à jour la sidebar
  1416. function loadFavorites() {
  1417.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  1418.     
  1419.     \$.ajax({
  1420.         url: \"/Parent/mes-favoris\",
  1421.         type: \"GET\",
  1422.         dataType: \"json\",
  1423.         success: function(data) {
  1424.             \$(\"#favorites-grid\").empty();
  1425.             allFavorites = data.data || [];
  1426.             
  1427.             if (allFavorites.length > 0) {
  1428.                 \$(\"#favorites-empty-state\").hide();
  1429.                 
  1430.                 \$.each(allFavorites, function(i, fav) {
  1431.                     var isSelected = selectedFavorites.includes(fav.id);
  1432.                     
  1433.                     var item = \$(\"<div class='favorite-item' style='position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;'></div>\");
  1434.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  1435.                     
  1436.                     // Overlay de sélection
  1437.                     var selectionOverlay = \$(\"<div class='selection-overlay' style='position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;'></div>\");
  1438.                     
  1439.                     // Icône de sélection
  1440.                     var checkIcon = \$(\"<div style='width:25px;height:25px;border-radius:50%;border:2px solid white;display:flex;align-items:center;justify-content:center;background:\" + (isSelected ? \"#F56040\" : \"transparent\") + \";transition:background 0.2s;'></div>\");
  1441.                     if (isSelected) {
  1442.                         checkIcon.append(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  1443.                     }
  1444.                     
  1445.                     selectionOverlay.append(checkIcon);
  1446.                     
  1447.                     // Overlay d'action (bouton supprimer)
  1448.                     var actionOverlay = \$(\"<div class='action-overlay' style='position:absolute;top:5px;right:5px;opacity:0;transition:opacity 0.2s;'></div>\");
  1449.                   
  1450.                     actionOverlay.append(deleteBtn);
  1451.                     
  1452.                     // Ajouter les événements
  1453.                     item.hover(
  1454.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"1\"); },
  1455.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"0\"); }
  1456.                     );
  1457.                     
  1458.                     item.click(function() {
  1459.                         toggleSelection(fav.id, \$(this).find(\".selection-overlay > div\"));
  1460.                     });
  1461.                     
  1462.                     item.append(img).append(selectionOverlay).append(actionOverlay);
  1463.                     \$(\"#favorites-grid\").append(item);
  1464.                 });
  1465.                 
  1466.                 \$(\"#favorites-counter\").text(allFavorites.length);
  1467.                 
  1468.                 // Mettre à jour le compteur sur le bouton également
  1469.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  1470.                 
  1471.                 // Mettre à jour l'interface produits
  1472.                 updateProductsView();
  1473.                 
  1474.             } else {
  1475.                 \$(\"#favorites-empty-state\").show();
  1476.                 \$(\"#favorites-counter\").text(\"0\");
  1477.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  1478.                 \$(\"#selection-count\").text(\"0\");
  1479.                 updateProductsView();
  1480.             }
  1481.         },
  1482.         error: function() {
  1483.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  1484.         }
  1485.     });
  1486. }
  1487. // Fonction pour supprimer un favori
  1488. function removeFavorite(id) {
  1489.     \$.ajax({
  1490.         url: \"/Parent/remove-favorite/\" + id,
  1491.         type: \"POST\",
  1492.         success: function() {
  1493.             // Retirer de la sélection si présent
  1494.             selectedFavorites = selectedFavorites.filter(favId => favId != id);
  1495.             
  1496.             // Mettre à jour le compteur de sélection
  1497.             \$(\"#selection-count\").text(selectedFavorites.length);
  1498.             
  1499.             // Recharger les favoris
  1500.             loadFavorites();
  1501.             
  1502.             // Mettre à jour les compteurs globaux
  1503.             var count = parseInt(\$(\"#likeCount\").text());
  1504.             if (!isNaN(count)) {
  1505.                 \$(\"#likeCount\").text(count - 1);
  1506.             }
  1507.             
  1508.             var countFav = parseInt(\$(\"#mesFavCount\").text());
  1509.             if (!isNaN(countFav)) {
  1510.                 \$(\"#mesFavCount\").text(countFav - 1);
  1511.             }
  1512.             
  1513.             // Mettre à jour l'interface produits
  1514.             updateProductsView();
  1515.         },
  1516.         error: function() {
  1517.             alert(\"Erreur lors de la suppression du favori\");
  1518.         }
  1519.     });
  1520. }
  1521. // Fonction pour basculer la sélection d'une photo
  1522. function toggleSelection(id, checkElement) {
  1523.     const index = selectedFavorites.indexOf(id);
  1524.     
  1525.     if (index === -1) {
  1526.         // Ajouter à la sélection
  1527.         selectedFavorites.push(id);
  1528.         checkElement.css(\"background\", \"#F56040\");
  1529.         checkElement.html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  1530.     } else {
  1531.         // Retirer de la sélection
  1532.         selectedFavorites.splice(index, 1);
  1533.         checkElement.css(\"background\", \"transparent\");
  1534.         checkElement.html(\"\");
  1535.     }
  1536.     
  1537.     // Mettre à jour le compteur
  1538.     \$(\"#selection-count\").text(selectedFavorites.length);
  1539.     
  1540.     // Mettre à jour l'interface produits
  1541.     updateProductsView();
  1542. }
  1543. // Fonction pour mettre à jour la vue des produits
  1544. function updateProductsView() {
  1545.     const current = selectedFavorites.length;
  1546.     \$(\"#product-photo-count\").text(current);
  1547.     
  1548.     let remainingForAlbum = Math.max(0, 20 - current);
  1549.     let remainingForPochette = Math.max(0, 12 - current);
  1550.     let remainingForPack = Math.max(0, 12 - current);
  1551.     const progressBar = (count, total, color) => `
  1552.         <div style=\"margin: 5px 0;\">
  1553.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  1554.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  1555.             </div>
  1556.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  1557.         </div>
  1558.     `;
  1559.     // Liste des produits
  1560.     const products = [
  1561.         {
  1562.             name: \"Pack numérique (20 photos)\",
  1563.             required: 20,
  1564.             remaining: Math.max(0, 20 - current),
  1565.             image: \"/images/produit/photoNumerique.jpg\",
  1566.             color: \"#4caf50\",
  1567.             link: \"";
  1568.         // line 1093
  1569.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 20]);
  1570.         yield "\",
  1571.         },
  1572.        +
  1573.         {
  1574.             name: \"Pochette photo (12 photos)\",
  1575.             required: 12,
  1576.             remaining: Math.max(0, 12 - current),
  1577.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  1578.             color: \"#2196f3\",
  1579.             link: \"";
  1580.         // line 1102
  1581.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  1582.         yield "\",
  1583.         },
  1584.     ].sort((a, b) => a.remaining - b.remaining);
  1585.     const productList = products
  1586.         .map((product) => {
  1587.             const count = current;
  1588.             const total = product.required;
  1589.             const remaining = product.remaining;
  1590.             return `
  1591.                 <li style=\"margin-bottom: 20px;\">
  1592.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  1593.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  1594.                         <div style=\"flex: 1;\">
  1595.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  1596.                             \${progressBar(count, total, product.color)}
  1597.                             \${
  1598.                                 `<small style=\"color: \${product.color}; font-size: 12px;\">
  1599.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  1600.                                 </small>
  1601.                                 <button
  1602.                                     style=\"
  1603.                                         margin-top: 5px;
  1604.                                         padding: 6px 12px;
  1605.                                         background-color: \${product.color};
  1606.                                         color: white;
  1607.                                         border: none;
  1608.                                         border-radius: 5px;
  1609.                                         font-size: 13px;
  1610.                                         cursor: pointer;
  1611.                                     \"
  1612.                                     onclick=\"window.location.href='\${product.link}'\"
  1613.                                 >
  1614.                                     Commander
  1615.                                 </button>`
  1616.                             }
  1617.                         </div>
  1618.                     </div>
  1619.                 </li>
  1620.             `;
  1621.         })
  1622.         .join(\"\");
  1623.     const boutiqueButton = `
  1624.         <li style=\"margin-top: 25px; text-align: center;\">
  1625.             <button
  1626.                 style=\"
  1627.                     padding: 8px 15px;
  1628.                     background-color: #F56040;
  1629.                     color: white;
  1630.                     border: none;
  1631.                     border-radius: 5px;
  1632.                     font-size: 14px;
  1633.                     width: 170px;
  1634.                     height: 40px;
  1635.                     cursor: pointer;
  1636.                 \"
  1637.                 onclick=\"window.location.href='";
  1638.         // line 1160
  1639.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("boutique5sur5");
  1640.         yield "'\"
  1641.             >
  1642.                 Voir toute la boutique
  1643.             </button>
  1644.         </li>
  1645.     `;
  1646.     \$(\"#product-list\").html(productList + boutiqueButton);
  1647. }
  1648. // Modifications au script existant
  1649. \$(document).ready(function() {
  1650.     // Fonctions pour ouvrir/fermer la sidebar
  1651.     \$(\"#openFavoritesSidebar\").click(function() {
  1652.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  1653.         loadFavorites();
  1654.     });
  1655.     
  1656.     \$(\"#close-favorites-btn\").click(function() {
  1657.         closeFavoritesSidebar();
  1658.     });
  1659.     
  1660.     // Fonction pour fermer la sidebar
  1661.     window.closeFavoritesSidebar = function() {
  1662.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  1663.     };
  1664.     
  1665.     // Tout sélectionner / Tout désélectionner
  1666.     \$(\"#select-all-btn\").click(function() {
  1667.         if (selectedFavorites.length === allFavorites.length) {
  1668.             // Tout désélectionner
  1669.             selectedFavorites = [];
  1670.             \$(\".selection-overlay > div\").css(\"background\", \"transparent\").html(\"\");
  1671.             \$(this).text(\"Tout sélectionner\");
  1672.         } else {
  1673.             // Tout sélectionner
  1674.             selectedFavorites = allFavorites.map(fav => fav.id);
  1675.             \$(\".selection-overlay > div\").css(\"background\", \"#F56040\").html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  1676.             \$(this).text(\"Tout désélectionner\");
  1677.         }
  1678.         
  1679.         // Mettre à jour le compteur
  1680.         \$(\"#selection-count\").text(selectedFavorites.length);
  1681.         
  1682.         // Mettre à jour l'interface produits
  1683.         updateProductsView();
  1684.     });
  1685.     
  1686.     // Gestion des onglets
  1687.     \$(\".sidebar-tab\").click(function() {
  1688.         \$(\".sidebar-tab\").removeClass(\"active\").css({
  1689.             \"color\": \"#666\",
  1690.             \"border-bottom\": \"none\"
  1691.         });
  1692.         \$(this).addClass(\"active\").css({
  1693.             \"color\": \"#F56040\",
  1694.             \"border-bottom\": \"2px solid #F56040\"
  1695.         });
  1696.         
  1697.         const tabId = \$(this).attr(\"id\");
  1698.         \$(\".tab-content\").hide();
  1699.         
  1700.         if (tabId === \"tab-photos\") {
  1701.             \$(\"#photos-content\").show();
  1702.         } else if (tabId === \"tab-products\") {
  1703.             \$(\"#products-content\").show();
  1704.         }
  1705.     });
  1706.     
  1707.     // Modifier les fonctions existantes pour intercepter l'ajout/suppression de favoris
  1708.     const originalAddFavoris = window.AddFavoris;
  1709.     window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  1710.         if (originalAddFavoris) {
  1711.             originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  1712.         }
  1713.         
  1714.         // Recharger les favoris si la sidebar est ouverte
  1715.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1716.             loadFavorites();
  1717.         }
  1718.     };
  1719.     const originalSupprimerFavoris = window.supprimerFavoris;
  1720.     window.supprimerFavoris = function(\$id, \$idSejour) {
  1721.         if (originalSupprimerFavoris) {
  1722.             originalSupprimerFavoris(\$id, \$idSejour);
  1723.         }
  1724.         
  1725.         // Recharger les favoris si la sidebar est ouverte
  1726.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1727.             // Retirer de la sélection si présent
  1728.             selectedFavorites = selectedFavorites.filter(favId => favId != \$id);
  1729.             loadFavorites();
  1730.         }
  1731.     };
  1732.     
  1733.     // Fermer en cliquant en dehors
  1734.     \$(document).click(function(event) {
  1735.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  1736.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  1737.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1738.             closeFavoritesSidebar();
  1739.         }
  1740.     });
  1741. });
  1742. // Initialisation de la sidebar
  1743. \$(document).ready(function() {
  1744.     // Fonctions pour ouvrir/fermer la sidebar
  1745.     \$(\"#openFavoritesSidebar\").click(function() {
  1746.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  1747.         loadFavorites();
  1748.     });
  1749.     
  1750.     \$(\"#close-favorites-btn\").click(function() {
  1751.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  1752.     });
  1753.     
  1754.     // Fermer en cliquant en dehors
  1755.     \$(document).click(function(event) {
  1756.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  1757.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  1758.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  1759.             \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  1760.         }
  1761.     });
  1762. });
  1763.   </script>
  1764.   <script src=\"";
  1765.         // line 1287
  1766.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("js/splide.min.js"), "html"nulltrue);
  1767.         yield "\"></script>
  1768.    
  1769. <script>
  1770.   document.addEventListener('DOMContentLoaded', function () {
  1771.     const openBtn = document.getElementById('openFavoritesSidebar');
  1772.     const sidebar = document.getElementById('favorites-sidebar');
  1773.     const closeBtn = document.getElementById('favorites-close');
  1774.     if (openBtn && sidebar) {
  1775.       openBtn.addEventListener('click', () => sidebar.classList.add('active'));
  1776.     }
  1777.     if (closeBtn && sidebar) {
  1778.       closeBtn.addEventListener('click', () => sidebar.classList.remove('active'));
  1779.     }
  1780.   });
  1781. </script>
  1782.  
  1783. <script>
  1784. document.addEventListener('DOMContentLoaded', function() {
  1785.   const filterBadges = document.querySelectorAll('.filter-badge');
  1786.   filterBadges.forEach(badge => {
  1787.     badge.addEventListener('click', function() {
  1788.       // Désactiver tous les badges
  1789.       filterBadges.forEach(b => b.classList.remove('active'));
  1790.       // Activer le badge cliqué
  1791.       this.classList.add('active');
  1792.     });
  1793.   });
  1794. });
  1795. </script>
  1796.   <script
  1797.     type=\"text/javascript\"
  1798.     src=\"";
  1799.         // line 1326
  1800.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("Accueil/js/jquery.magnific-popup.min.js"), "html"nulltrue);
  1801.         yield "\"
  1802.   ></script>
  1803.   <script>
  1804. document.addEventListener('DOMContentLoaded', function () {
  1805.   const prevButtons = document.querySelectorAll('.btn-prev-day');
  1806.   const nextButtons = document.querySelectorAll('.btn-next-day');
  1807.   const dateCards = document.querySelectorAll('.date-card.modern-card');
  1808.   const collapseSections = document.querySelectorAll('.collapse');
  1809.   function navigateToDay(index) {
  1810.     if (index >= 0 && index < collapseSections.length) {
  1811.       // Fermer tous les jours
  1812.       collapseSections.forEach(s => s.classList.remove('show'));
  1813.       dateCards.forEach(c => c.classList.remove('active'));
  1814.       // Ouvrir le bon jour
  1815.       const targetCollapse = collapseSections[index];
  1816.       const targetCard = dateCards[index];
  1817.       if (targetCollapse && targetCard) {
  1818.         targetCollapse.classList.add('show');
  1819.         targetCard.classList.add('active');
  1820.       }
  1821.     }
  1822.   }
  1823.   prevButtons.forEach(button => {
  1824.     button.addEventListener('click', function () {
  1825.       const targetIndex = parseInt(this.dataset.target, 10);
  1826.       navigateToDay(targetIndex);
  1827.     });
  1828.   });
  1829.   nextButtons.forEach(button => {
  1830.     button.addEventListener('click', function () {
  1831.       const targetIndex = parseInt(this.dataset.target, 10);
  1832.       navigateToDay(targetIndex);
  1833.     });
  1834.   });
  1835. });
  1836. </script>
  1837.   <script>
  1838.     document.addEventListener('DOMContentLoaded', function() {
  1839.   const style = document.createElement('style');
  1840.   style.textContent = `
  1841.     .hidden {
  1842.       display: none !important;
  1843.     }
  1844.   `;
  1845.   document.head.appendChild(style);
  1846. });
  1847.     document.addEventListener('DOMContentLoaded', function() {
  1848.     // Get the favorite button
  1849.     const favoriteButton = document.querySelector('.fav-button');
  1850.     if (favoriteButton) {
  1851.       // Make it unclickable with JS too (belt and suspenders approach)
  1852.       favoriteButton.style.pointerEvents = 'none';
  1853.       
  1854.       // Override any existing click handlers
  1855.       favoriteButton.onclick = function(e) {
  1856.         e.preventDefault();
  1857.         e.stopPropagation();
  1858.         return false;
  1859.       };
  1860.       
  1861.       // Make sure hover still works
  1862.       favoriteButton.addEventListener('mouseover', function() {
  1863.         document.getElementById('purchase-alert').style.display = 'block';
  1864.       });
  1865.       
  1866.       // Keep any existing hover functionality
  1867.       if (typeof showSelection === 'function') {
  1868.         favoriteButton.onmouseover = showSelection;
  1869.       }
  1870.     }
  1871.     
  1872.     // Make sure the purchase alert remains interactive
  1873.     const purchaseAlert = document.getElementById('purchase-alert');
  1874.     if (purchaseAlert) {
  1875.       purchaseAlert.style.pointerEvents = 'auto';
  1876.     }
  1877.   });
  1878.     // Sélection des éléments
  1879.     const purchaseAlert = document.getElementById(\"purchase-alert\");
  1880.     const alertContent = document.getElementById(\"purchase-alert-content\");
  1881.     const likeCountLabel = document.getElementById(\"likeCount\");
  1882.     const favoriteCount = parseInt(likeCountLabel.textContent.trim(), 10); // Convertir en nombre
  1883.     // Fonction pour mettre à jour le contenu de l'alerte
  1884.     function updatePurchaseAlert(current) {
  1885.   let remainingForAlbum = Math.max(0, 20 - current);
  1886.   let remainingForPochette = Math.max(0, 12 - current);
  1887.   let remainingForPack = Math.max(0, 12 - current);
  1888.   const progressBar = (count, total, color) => `
  1889.   <div style=\"margin: 5px 0;\">
  1890.     <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  1891.       <div style=\"width: \${
  1892.         (count / total) * 100
  1893.       }%; background-color: \${color}; height: 100%;\"></div>
  1894.     </div>
  1895.     <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  1896.   </div>
  1897. `;
  1898.   // Use Twig paths here:
  1899.   const products = [
  1900.       {
  1901.       name: \"Pochette photo (12 photos)\",
  1902.       required: 12,
  1903.       remaining: remainingForPochette,
  1904.       image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  1905.       color: \"#2196f3\",
  1906.       link: \"";
  1907.         // line 1441
  1908.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  1909.         yield "\",
  1910.     },
  1911.        {
  1912.       name: \"Pack numérique (20 photos)\",
  1913.       required: 20,
  1914.       remaining: remainingForAlbum,
  1915.       image: \"/images/produit/photoNumerique.jpg\",
  1916.       color: \"#4caf50\",
  1917.       link: \"";
  1918.         // line 1449
  1919.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 20]);
  1920.         yield "\",
  1921.     }
  1922.   
  1923.   
  1924.     
  1925.   ].sort((a, b) => a.remaining - b.remaining);
  1926.   const productList = products
  1927.     .map((product) => {
  1928.       const count = current;
  1929.       const total = product.required;
  1930.       const remaining = product.remaining;
  1931.       return `
  1932.     <li style=\"margin-bottom: 15px;\">
  1933.       <div style=\"display: flex; align-items: center; gap: 10px;\">
  1934.         <img
  1935.           src=\"\${product.image}\"
  1936.           alt=\"\${product.name}\"
  1937.           style=\"width: 65px; height: 65px; border-radius: 5px; margin-top:-19px\"
  1938.         />
  1939.         <div style=\"flex: 1;\">
  1940.           <strong style=\"font-size: 14px;\">\${product.name}</strong>
  1941.           \${progressBar(count, total, product.color)}
  1942.           \${
  1943.             remaining > 0
  1944.               ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  1945.                    Encore \${remaining} photos ❤️ pour compléter \${product.name.toLowerCase()}
  1946.                  </small>`
  1947.               : `<button
  1948.                   style=\"
  1949.                     margin-top: 5px;
  1950.                     padding: 5px 8px;
  1951.                     background-color: \${product.color};
  1952.                     color: white;
  1953.                     border: none;
  1954.                     border-radius: 5px;
  1955.                     font-size: 12px;
  1956.                     cursor: pointer;
  1957.                   \"
  1958.                   onclick=\"window.location.href='\${product.link}'\"
  1959.                 >
  1960.                   Commander
  1961.                 </button>`
  1962.           }
  1963.         </div>
  1964.       </div>
  1965.     </li>
  1966.   `;
  1967.     })
  1968.     .join(\"\");
  1969.   const plusButton = `
  1970.     <li style=\"margin-bottom: 15px; text-align: center;\">
  1971.       <button
  1972.         style=\"
  1973.           padding: 5px 8px;
  1974.           background-color: #F56040;
  1975.           color: white;
  1976.           border: none;
  1977.           border-radius: 5px;
  1978.           font-size: 14px;
  1979.           line-height: 1;
  1980.           width: 150px;
  1981.           height: 40px;
  1982.           cursor: pointer;
  1983.         \"
  1984.         onclick=\"window.location.href='";
  1985.         // line 1516
  1986.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("boutique5sur5");
  1987.         yield "'\"
  1988.       >
  1989.         Aller à la boutique
  1990.       </button>
  1991.     </li>
  1992.   `;
  1993.   if (current === 0) {
  1994.     alertContent.innerHTML = `
  1995.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  1996.       Vous n'avez pas encore de photos favorites !
  1997.     </p>
  1998.     <p style=\"margin-bottom: 20px; color: #555;\">
  1999.       Commencez à ajouter vos moments préférés pour profiter de nos offres.
  2000.     </p>
  2001.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  2002.   `;
  2003.   } else {
  2004.     alertContent.innerHTML = `
  2005.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  2006.       Vous avez atteint \${current} photos favorites !
  2007.     </p>
  2008.     <p style=\"margin-bottom: 20px; color: #555;\">
  2009.       Profitez de nos offres spéciales :
  2010.     </p>
  2011.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  2012.   `;
  2013.   }
  2014.   purchaseAlert.classList.remove(\"hidden\");
  2015.   clearTimeout(purchaseAlertTimeout);
  2016.   purchaseAlertTimeout = setTimeout(() => {
  2017.     if (!purchaseAlert.matches(\":hover\")) {
  2018.       closePurchaseAlert();
  2019.     }
  2020.   }, 5000);
  2021. }
  2022.     // Fonction pour fermer l'alerte
  2023.     function closePurchaseAlert() {
  2024.       purchaseAlert.classList.add(\"hidden\");
  2025.     }
  2026.     // Événement pour mettre à jour le contenu et afficher la popover dynamiquement au hover
  2027.     document.querySelector(\".fav-button\").addEventListener(\"mouseover\", () => {
  2028.       updatePurchaseAlert(favoriteCount);
  2029.       purchaseAlert.classList.remove(\"cachee\"); // Réaffiche la popover
  2030.     });
  2031.     function showSelection() {
  2032.       document.getElementById(\"purchase-alert\").style.display = \"block\";
  2033.     }
  2034.     function hideSelection() {
  2035.       document.getElementById(\"selectionPopover\").style.display = \"none\";
  2036.     }
  2037.     document.addEventListener(\"DOMContentLoaded\", function () {
  2038.       const container = document.querySelector(\".date-container\");
  2039.       // Vérifie si le conteneur existe pour éviter les erreurs
  2040.       if (container) {
  2041.         container.scrollTo({
  2042.           left: container.scrollWidth, // Scroll directement à la position maximale
  2043.           behavior: \"smooth\", // Défilement fluide
  2044.         });
  2045.       }
  2046.     });
  2047.     document.addEventListener(\"DOMContentLoaded\", function () {
  2048.       const container = document.querySelector(\".date-container\");
  2049.       const leftArrow = document.querySelector(\".scroll-btn.left\");
  2050.       const rightArrow = document.querySelector(\".scroll-btn.right\");
  2051.       // Fonction pour vérifier le débordement et activer/désactiver les flèches
  2052.       function updateArrowsVisibility() {
  2053.         const isOverflowing = container.scrollWidth > container.clientWidth; // Vérifie si débordement
  2054.         leftArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  2055.         rightArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  2056.       }
  2057.       // Fonction pour défiler
  2058.       function scrollContainer(direction) {
  2059.         container.scrollBy({
  2060.           left: direction === \"left\" ? -200 : 200, // Défiler à gauche ou à droite
  2061.           behavior: \"smooth\",
  2062.         });
  2063.       }
  2064.       // Ajout des événements de clic pour les flèches
  2065.       leftArrow.addEventListener(\"click\", () => scrollContainer(\"left\"));
  2066.       rightArrow.addEventListener(\"click\", () => scrollContainer(\"right\"));
  2067.       // Vérification initiale et sur redimensionnement de la fenêtre
  2068.       updateArrowsVisibility();
  2069.       window.addEventListener(\"resize\", updateArrowsVisibility);
  2070.     });
  2071.     document.addEventListener(\"DOMContentLoaded\", function () {
  2072.       const container = document.querySelector(\".date-container\");
  2073.       const leftBtn = document.querySelector(\".scroll-btn.left\");
  2074.       const rightBtn = document.querySelector(\".scroll-btn.right\");
  2075.       leftBtn.addEventListener(\"click\", () => {
  2076.         container.scrollBy({
  2077.           left: -200, // Défile vers la gauche
  2078.           behavior: \"smooth\",
  2079.         });
  2080.       });
  2081.       rightBtn.addEventListener(\"click\", () => {
  2082.         container.scrollBy({
  2083.           left: 200, // Défile vers la droite
  2084.           behavior: \"smooth\",
  2085.         });
  2086.       });
  2087.     });
  2088.  document.addEventListener(\"DOMContentLoaded\", function () {
  2089.     // Sélectionnez tous les badges de filtre
  2090.     const filterBadges = document.querySelectorAll(\".filter-badge\");
  2091.     // Sélectionnez tous les éléments de la galerie
  2092.     const galleryItems = document.querySelectorAll(\".column\");
  2093.     // Sélectionnez tous les jours
  2094.     const days = document.querySelectorAll(\".collapse\");
  2095.     // Fonction pour réinitialiser les filtres
  2096.     function resetFilters() {
  2097.         // Réinitialisez tous les éléments de la galerie
  2098.         galleryItems.forEach((item) => {
  2099.             item.style.display = \"block\";
  2100.         });
  2101.         // Réinitialisez les états des badges
  2102.         filterBadges.forEach((badge) => badge.classList.remove(\"active\"));
  2103.     }
  2104.     // Ajoutez un gestionnaire d'événements pour chaque badge
  2105.     filterBadges.forEach((badge) => {
  2106.         badge.addEventListener(\"click\", function () {
  2107.             const filter = this.getAttribute(\"data-filter\");
  2108.             // Réinitialisez l'état actif pour tous les badges
  2109.             filterBadges.forEach((btn) => btn.classList.remove(\"active\"));
  2110.             // Ajoutez l'état actif au badge cliqué
  2111.             this.classList.add(\"active\");
  2112.             // Affichez ou masquez les éléments de la galerie
  2113.             galleryItems.forEach((item) => {
  2114.                 if (filter === \"all\") {
  2115.                     item.style.display = \"block\";
  2116.                 } else if (filter === \"photo\" && item.querySelector(\"img\")) {
  2117.                     item.style.display = \"block\";
  2118.                 } else if (filter === \"video\" && item.querySelector(\"video\")) {
  2119.                     item.style.display = \"block\";
  2120.                 } else if (filter === \"audio\" && item.classList.contains(\"audio-message-item\")) {
  2121.                     item.style.display = \"block\";
  2122.                 } else {
  2123.                     item.style.display = \"none\";
  2124.                 }
  2125.             });
  2126.         });
  2127.     });
  2128.     // Réinitialiser les filtres lors du changement de jour
  2129.     days.forEach((day) => {
  2130.         day.addEventListener(\"show.bs.collapse\", function () {
  2131.             resetFilters();
  2132.         });
  2133.     });
  2134. });
  2135.     \$(document).ready(function () {
  2136.       let zoomCounter = 0; // Initialize zoom counter
  2137.       let currentImageSrc = \"\"; // Track current image source
  2138.       let lastClickPosition = { x: 50, y: 50 }; // Default to center of image
  2139.       \$(\".container--gallery\").magnificPopup({
  2140.         delegate: \"a\",
  2141.         type: \"image\",
  2142.         mainClass: \"mfp-with-zoom mfp-img-mobile\",
  2143.         image: {
  2144.           verticalFit: true,
  2145.         },
  2146.         gallery: {
  2147.           enabled: true,
  2148.           tPrev: \"Previous (Left arrow key)\", // Alt text on left arrow
  2149.           tNext: \"Next (Right arrow key)\", // Alt text on right arrow
  2150.           tCounter: \"%curr% of %total%\", // Markup for \"1 of 7\" counter
  2151.         },
  2152.         zoom: {
  2153.           enabled: true,
  2154.           duration: 300,
  2155.           opener: function (element) {
  2156.             return element.find(\"img\");
  2157.           },
  2158.         },
  2159.         callbacks: {
  2160.           open: function () {
  2161.             // Get current image data from the link that was clicked
  2162.             const currentLink = this.currItem.el;
  2163.             const imageId =
  2164.               currentLink
  2165.                 .closest(\".photo-zoom\")
  2166.                 .find(\".heart-icon\")
  2167.                 .data(\"id\") || \"\";
  2168.             const sejourId =
  2169.               currentLink
  2170.                 .closest(\".photo-zoom\")
  2171.                 .find(\".heart-icon\")
  2172.                 .data(\"sejour-id\") || \"\";
  2173.             const imagePath =
  2174.               currentLink
  2175.                 .closest(\".photo-zoom\")
  2176.                 .find(\".heart-icon\")
  2177.                 .data(\"path\") || \"\";
  2178.             const imageDesc =
  2179.               currentLink
  2180.                 .closest(\".photo-zoom\")
  2181.                 .find(\".heart-icon\")
  2182.                 .data(\"description\") || \"\";
  2183.             const isFavorite = currentLink
  2184.               .closest(\".photo-zoom\")
  2185.               .find(\".heart-icon i\")
  2186.               .hasClass(\"bi-heart-fill\");
  2187.             const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  2188.             const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  2189.             const favoriteTooltip = isFavorite
  2190.               ? \"Retirer des favoris\"
  2191.               : \"Ajouter aux favoris\";
  2192.             const zoomControls = `
  2193.           <div class=\"mfp-zoom-controls\">
  2194.             <button class=\"zoom-btn zoom-out\" title=\"Zoom Out\"><i class=\"fa fa-search-minus\"></i></button>
  2195.             <button class=\"zoom-btn zoom-in\" title=\"Zoom In\"><i class=\"fa fa-search-plus\"></i></button>
  2196.           </div>
  2197.           <div class=\"mfp-favorite\">
  2198.             <button class=\"favorite-btn\" 
  2199.                     data-id=\"\${imageId}\" 
  2200.                     data-sejour-id=\"\${sejourId}\" 
  2201.                     data-path=\"\${imagePath}\" 
  2202.                     data-description=\"\${imageDesc}\"
  2203.                     title=\"\${favoriteTooltip}\">
  2204.               <i class=\"bi \${favoriteIconClass}\" style=\"color: \${favoriteIconColor}; text-shadow: 0px 0px 3px rgba(0,0,0,0.5);\"></i>
  2205.             </button>
  2206.           </div>
  2207.           <div class=\"mfp-counter\"></div>
  2208.         `;
  2209.             \$(\".mfp-content\").append(zoomControls);
  2210.             initializeZoomControls();
  2211.             initializeFavoriteButton();
  2212.             const intervalId = setInterval(() => {
  2213.               const newImageSrc = \$(\".mfp-img\").attr(\"src\");
  2214.               if (newImageSrc !== currentImageSrc) {
  2215.                 currentImageSrc = newImageSrc;
  2216.                 zoomCounter = 0;
  2217.                 lastClickPosition = { x: 50, y: 50 }; // Reset to center
  2218.                 attachZoomHandler(); // Reattach zoom handler to new image
  2219.                 \$(\".mfp-img\").css({
  2220.                   \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2221.                   transform: `scale(1)`,
  2222.                 });
  2223.                 // Update favorite button for the new image
  2224.                 updateFavoriteButton();
  2225.                 initializeZoomControls();
  2226.                 updateCounter();
  2227.               }
  2228.             }, 100);
  2229.             this.content.on(\"mfpClose\", function () {
  2230.               clearInterval(intervalId);
  2231.             });
  2232.             attachZoomHandler();
  2233.           },
  2234.           close: function () {
  2235.             \$(\".mfp-zoom-controls\").remove();
  2236.             \$(\".mfp-favorite\").remove();
  2237.             \$(\".mfp-counter\").remove();
  2238.             zoomCounter = 0;
  2239.           },
  2240.         },
  2241.       });
  2242.       function attachZoomHandler() {
  2243.         \$(\".mfp-img\")
  2244.           .off(\"click\")
  2245.           .on(\"click\", function (event) {
  2246.             event.stopPropagation(); // Prevent default navigation behavior
  2247.             // Calculate click coordinates relative to the image
  2248.             const imgOffset = \$(this).offset();
  2249.             const clickX = event.pageX - imgOffset.left;
  2250.             const clickY = event.pageY - imgOffset.top;
  2251.             const imgWidth = \$(this).width();
  2252.             const imgHeight = \$(this).height();
  2253.             // Calculate transform-origin based on click position
  2254.             lastClickPosition = {
  2255.               x: (clickX / imgWidth) * 100,
  2256.               y: (clickY / imgHeight) * 100,
  2257.             };
  2258.             // Cycle through zoom levels: 1x, 1.5x, 2x
  2259.             zoomCounter = (zoomCounter + 1) % 3;
  2260.             const zoomLevels = [1, 1.5, 2];
  2261.             const zoomLevel = zoomLevels[zoomCounter];
  2262.             \$(this).css({
  2263.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2264.               transform: `scale(\${zoomLevel})`,
  2265.             });
  2266.             updateZoomButtonState();
  2267.           });
  2268.       }
  2269.       function initializeZoomControls() {
  2270.         \$(\".mfp-zoom-controls .zoom-in\")
  2271.           .off(\"click\")
  2272.           .on(\"click\", function (event) {
  2273.             event.stopPropagation();
  2274.             zoomCounter = (zoomCounter + 1) % 3;
  2275.             const zoomLevels = [1, 1.5, 2];
  2276.             const zoomLevel = zoomLevels[zoomCounter];
  2277.             \$(\".mfp-img\").css({
  2278.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2279.               transform: `scale(\${zoomLevel})`,
  2280.             });
  2281.             updateZoomButtonState();
  2282.           });
  2283.         \$(\".mfp-zoom-controls .zoom-out\")
  2284.           .off(\"click\")
  2285.           .on(\"click\", function (event) {
  2286.             event.stopPropagation();
  2287.             if (zoomCounter > 0) {
  2288.               zoomCounter -= 1;
  2289.               const zoomLevels = [1, 1.5, 2];
  2290.               const zoomLevel = zoomLevels[zoomCounter];
  2291.               \$(\".mfp-img\").css({
  2292.                 \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2293.                 transform: `scale(\${zoomLevel})`,
  2294.               });
  2295.               updateZoomButtonState();
  2296.             } else {
  2297.               \$.magnificPopup.close();
  2298.             }
  2299.           });
  2300.       }
  2301.       function initializeFavoriteButton() {
  2302.         \$(\".mfp-favorite .favorite-btn\")
  2303.           .off(\"click\")
  2304.           .on(\"click\", function (event) {
  2305.             event.stopPropagation();
  2306.             const \$this = \$(this);
  2307.             const imageId = \$this.data(\"id\");
  2308.             const sejourId = \$this.data(\"sejour-id\");
  2309.             // Toggle favorite status
  2310.             const isFavorite = \$this.find(\"i\").hasClass(\"bi-heart-fill\");
  2311.             // Update the button appearance
  2312.             if (isFavorite) {
  2313.               \$this
  2314.                 .find(\"i\")
  2315.                 .removeClass(\"bi-heart-fill\")
  2316.                 .addClass(\"bi-heart\")
  2317.                 .css(\"color\", \"white\");
  2318.               \$this.attr(\"title\", \"Ajouter aux favoris\");
  2319.             } else {
  2320.               \$this
  2321.                 .find(\"i\")
  2322.                 .removeClass(\"bi-heart\")
  2323.                 .addClass(\"bi-heart-fill\")
  2324.                 .css(\"color\", \"#f56040\");
  2325.               \$this.attr(\"title\", \"Retirer des favoris\");
  2326.             }
  2327.             // Update the original heart icon in the gallery
  2328.             const originalHeartIcon = \$(
  2329.               `.heart-icon[data-id=\"\${imageId}\"]`
  2330.             ).find(\"i\");
  2331.             if (isFavorite) {
  2332.               originalHeartIcon
  2333.                 .removeClass(\"bi-heart-fill\")
  2334.                 .addClass(\"bi-heart\")
  2335.                 .css(\"color\", \"\");
  2336.             } else {
  2337.               originalHeartIcon
  2338.                 .removeClass(\"bi-heart\")
  2339.                 .addClass(\"bi-heart-fill\")
  2340.                 .css(\"color\", \"#f56040\");
  2341.             }
  2342.             // Make AJAX call to update favorite status in the backend using Parent routes
  2343.             \$.ajax({
  2344.               url: isFavorite ? \"/Parent/aSupprimerFav\" : \"/Parent/ajouterFav\",
  2345.               type: \"POST\",
  2346.               data: {
  2347.                 id: imageId,
  2348.                 idSejour: sejourId,
  2349.               },
  2350.               success: function (response) {
  2351.                 // Optional: Show a success message or handle response
  2352.                 console.log(\"Favorite status updated\", response);
  2353.               },
  2354.               error: function (error) {
  2355.                 console.error(\"Error updating favorite status\", error);
  2356.                 // Revert the icon change on error
  2357.                 if (isFavorite) {
  2358.                   \$this
  2359.                     .find(\"i\")
  2360.                     .removeClass(\"bi-heart\")
  2361.                     .addClass(\"bi-heart-fill\")
  2362.                     .css(\"color\", \"#f56040\");
  2363.                   originalHeartIcon
  2364.                     .removeClass(\"bi-heart\")
  2365.                     .addClass(\"bi-heart-fill\")
  2366.                     .css(\"color\", \"#f56040\");
  2367.                 } else {
  2368.                   \$this
  2369.                     .find(\"i\")
  2370.                     .removeClass(\"bi-heart-fill\")
  2371.                     .addClass(\"bi-heart\")
  2372.                     .css(\"color\", \"white\");
  2373.                   originalHeartIcon
  2374.                     .removeClass(\"bi-heart-fill\")
  2375.                     .addClass(\"bi-heart\")
  2376.                     .css(\"color\", \"\");
  2377.                 }
  2378.               },
  2379.             });
  2380.           });
  2381.       }
  2382.       function updateFavoriteButton() {
  2383.         // Get current image data from the current slide
  2384.         const currentSlide = \$.magnificPopup.instance.currItem.el;
  2385.         const photoZoom = currentSlide.closest(\".photo-zoom\");
  2386.         if (photoZoom.length) {
  2387.           const heartIcon = photoZoom.find(\".heart-icon\");
  2388.           const imageId = heartIcon.data(\"id\") || \"\";
  2389.           const sejourId = heartIcon.data(\"sejour-id\") || \"\";
  2390.           const imagePath = heartIcon.data(\"path\") || \"\";
  2391.           const imageDesc = heartIcon.data(\"description\") || \"\";
  2392.           const isFavorite = heartIcon.find(\"i\").hasClass(\"bi-heart-fill\");
  2393.           const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  2394.           const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  2395.           const favoriteTooltip = isFavorite
  2396.             ? \"Retirer des favoris\"
  2397.             : \"Ajouter aux favoris\";
  2398.           // Update the favorite button
  2399.           const \$favoriteBtn = \$(\".mfp-favorite .favorite-btn\");
  2400.           \$favoriteBtn.data(\"id\", imageId);
  2401.           \$favoriteBtn.data(\"sejour-id\", sejourId);
  2402.           \$favoriteBtn.data(\"path\", imagePath);
  2403.           \$favoriteBtn.data(\"description\", imageDesc);
  2404.           \$favoriteBtn.attr(\"title\", favoriteTooltip);
  2405.           \$favoriteBtn
  2406.             .find(\"i\")
  2407.             .removeClass(\"bi-heart bi-heart-fill\")
  2408.             .addClass(favoriteIconClass)
  2409.             .css(\"color\", favoriteIconColor);
  2410.         }
  2411.       }
  2412.       function updateZoomButtonState() {
  2413.         const zoomLevels = [1, 1.5, 2];
  2414.         const currentZoom = zoomLevels[zoomCounter];
  2415.         \$(\".zoom-in\").prop(\"disabled\", currentZoom === 2);
  2416.         \$(\".zoom-out\").prop(\"disabled\", currentZoom === 1);
  2417.       }
  2418.       function updateCounter() {
  2419.         const counterText = \$(\".mfp-counter\")
  2420.           .closest(\".mfp-content\")
  2421.           .find(\".mfp-counter\")
  2422.           .text();
  2423.         const matches = counterText.match(/(\\d+) of (\\d+)/);
  2424.         if (matches) {
  2425.           const currentIndex = matches[1];
  2426.           const totalImages = matches[2];
  2427.           \$(\".mfp-counter\").text(`\${currentIndex} of \${totalImages}`);
  2428.         }
  2429.       }
  2430.       // Add CSS for the favorite button and rounded image corners
  2431.       \$(\"<style>\")
  2432.         .prop(\"type\", \"text/css\")
  2433.         .html(
  2434.           `
  2435.       .mfp-favorite {
  2436.         position: absolute;
  2437.         top: 15px;
  2438.         left: 15px;
  2439.         z-index: 1046;
  2440.       }
  2441.       .favorite-btn {
  2442.         background: transparent;
  2443.         border: none;
  2444.         font-size: 24px;
  2445.         padding: 5px;
  2446.         cursor: pointer;
  2447.         outline: none;
  2448.       }
  2449.       .favorite-btn i {
  2450.         transition: all 0.3s ease;
  2451.       }
  2452.       .favorite-btn:hover i {
  2453.         transform: scale(1.2);
  2454.       }
  2455.       /* Rounded corners for zoomed images */
  2456.       .mfp-img {
  2457.         border-radius: 8px;
  2458.       }
  2459.       /* Make sure the container doesn't clip the rounded corners */
  2460.       .mfp-figure:after {
  2461.         border-radius: 8px;
  2462.       }
  2463.     `
  2464.         )
  2465.         .appendTo(\"head\");
  2466.     });
  2467.   </script>
  2468. <script>
  2469. document.addEventListener('DOMContentLoaded', function () {
  2470.   const openBtn = document.getElementById('openFavoritesBtn');
  2471.   const closeBtn = document.getElementById('closeSidebarBtn');
  2472.   const sidebar = document.getElementById('favoritesSidebar');
  2473.   const tbody = document.querySelector('#favoritesTable tbody');
  2474.   openBtn.addEventListener('click', async () => {
  2475.     try {
  2476.       const response = await fetch('/Parent/mes-favoris', {
  2477.         headers: {
  2478.           'Accept': 'application/json'
  2479.         }
  2480.       });
  2481.       const result = await response.json();
  2482.       if (!result.success || !Array.isArray(result.data)) {
  2483.         alert('Erreur lors du chargement des favoris.');
  2484.         return;
  2485.       }
  2486.       tbody.innerHTML = '';
  2487.       result.data.forEach((fav, index) => {
  2488.         const row = document.createElement('tr');
  2489.         row.innerHTML = `
  2490.           <td>\${index + 1}</td>
  2491.           <td><img src=\"\${fav.path}\" alt=\"favori\"></td>
  2492.           <td>\${fav.descreption || '—'}</td>
  2493.           <td>\${fav.created_at}</td>
  2494.         `;
  2495.         tbody.appendChild(row);
  2496.       });
  2497.       sidebar.classList.add('active');
  2498.     } catch (e) {
  2499.       console.error('Erreur réseau:', e);
  2500.       alert('Impossible de charger les favoris.');
  2501.     }
  2502.   });
  2503.   closeBtn.addEventListener('click', () => {
  2504.     sidebar.classList.remove('active');
  2505.   });
  2506. });
  2507. </script>
  2508.   <script>
  2509.         // Fonction pour vérifier et afficher l'alerte
  2510.         function checkFavorites() {
  2511.             if (favoriteCount >= 10) {
  2512.                 purchaseAlert.style.display = 'block'; // Affiche l'alerte
  2513.             } else {
  2514.                 purchaseAlert.style.display = 'none'; // Cache l'alerte si le nombre est réduit
  2515.             }
  2516.         }
  2517.         // Ajout d'un favori
  2518.         function addFavorite() {
  2519.             favoriteCount++;
  2520.             likeCountLabel.textContent = favoriteCount;
  2521.             checkFavorites();
  2522.         }
  2523.         // Suppression d'un favori
  2524.         function removeFavorite() {
  2525.             if (favoriteCount > 0) {
  2526.                 favoriteCount--;
  2527.                 likeCountLabel.textContent = favoriteCount;
  2528.                 checkFavorites();
  2529.             }
  2530.         }document.addEventListener('DOMContentLoaded', () => {
  2531.     const favoriteCount = ";
  2532.         // line 2129
  2533.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["nblikes"]) || array_key_exists("nblikes"$context) ? $context["nblikes"] : (function () { throw new RuntimeError('Variable "nblikes" does not exist.'2129$this->source); })()), "html"nulltrue);
  2534.         yield ";
  2535.     updateCardContent(favoriteCount);
  2536. });
  2537. function updateCardContent(favoriteCount) {
  2538.     const card = document.getElementById('dynamic-card');
  2539.     const cardContent = document.getElementById('dynamic-card-content');
  2540.     let produits = [];
  2541.     if (favoriteCount >= 20) {
  2542.         produits.push({
  2543.             titre: \"Album débloqué !\",
  2544.             bouton: \"Commander\",
  2545.             image: \"/images/produit/Album5sur5-3.jpg\",
  2546.             lien: \"";
  2547.         // line 2144
  2548.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("EditionAlbum");
  2549.         yield "\"
  2550.         });
  2551.     }
  2552.     if (favoriteCount >= 12) {
  2553.         produits.push({
  2554.             titre: \"Pochette débloquée !\",
  2555.             bouton: \"Commander\",
  2556.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  2557.             lien: \"";
  2558.         // line 2152
  2559.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  2560.         yield "\"
  2561.         });
  2562.     }
  2563.     if (favoriteCount >= 5) {
  2564.         produits.push({
  2565.             titre: \"Pack numérique débloqué !\",
  2566.             bouton: \"Commander\",
  2567.             image: \"/images/produit/photoNumerique.jpg\",
  2568.             lien: \"";
  2569.         // line 2160
  2570.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 15]);
  2571.         yield "\"
  2572.         });
  2573.     }
  2574.     if (produits.length === 0) {
  2575.         cardContent.innerHTML = `
  2576.             <div style=\"text-align: center; padding: 10px;\">
  2577.                 Ajoutez des favoris pour débloquer des surprises ✨
  2578.             </div>
  2579.         `;
  2580.         return;
  2581.     }
  2582.     cardContent.innerHTML = `
  2583.     <div class=\"splide\" id=\"dynamicSplide\">
  2584.       <div class=\"splide__track\">
  2585.         <ul class=\"splide__list\">
  2586.           \${produits.map(produit => `
  2587.             <li class=\"splide__slide\" style=\"position: relative;\">
  2588.               <img src=\"\${produit.image}\" alt=\"\${produit.titre}\" style=\"width: 100%; height: 150px; object-fit: cover; border-radius: 8px;\">
  2589.               <div style=\"position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.1); color: white; padding: 10px; text-align: center; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;\">
  2590.                 <div style=\"font-weight: bold; font-size: 14px;\">\${produit.titre}</div>
  2591.                 <button style=\"margin-top: 5px; padding: 5px 8px; background-color: #F56040; color: white; border: none; border-radius: 4px; font-size: 12px; cursor: pointer;\" onclick=\"window.location.href='\${produit.lien}'\">
  2592.                   \${produit.bouton}
  2593.                 </button>
  2594.               </div>
  2595.             </li>
  2596.           `).join('')}
  2597.         </ul>
  2598.       </div>
  2599.     </div>
  2600.     `;
  2601.     // Monte le carrousel
  2602.     new Splide('#dynamicSplide', {
  2603.         type: 'loop',
  2604.         arrows: true,
  2605.         pagination: false,
  2606.         autoplay: true,
  2607.         interval: 4000,
  2608.         speed: 800,
  2609.     }).mount();
  2610. }
  2611.         function supprimerFavoris(\$id, \$idSejour) {
  2612.             // Vider l'élément coeur pour ce favori
  2613.             const coeurElement = \$('#coeur' + \$id);
  2614.             coeurElement.empty();
  2615.             // Ajout d'une animation sur le bouton favori
  2616.             const favoriteButton = document.querySelector('.fav-button');
  2617.             if (favoriteButton) {
  2618.                 favoriteButton.classList.add('active');
  2619.                 // Retirer l'animation après qu'elle soit jouée
  2620.                 setTimeout(() => {
  2621.                     favoriteButton.classList.remove('active');
  2622.                 }, 600); // La durée doit correspondre à celle de l'animation
  2623.             }
  2624.             // Mise à jour de l'icône coeur
  2625.             const clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  2626.             coeurElement.html(
  2627.                 `<i class=\"bi bi-heart \${clas}\" onclick=\"AddFavoris(\${\$id}, \${\$idSejour})\"></i>`
  2628.             );
  2629.             // Mettre à jour le compteur des favoris
  2630.             const likeCountLabel = document.getElementById('likeCount');
  2631.            const likeMesFavLabel = document.getElementById('mesFavCount');
  2632.              if (likeMesFavLabel) {
  2633.                 let currentCount = parseInt(likeMesFavLabel.textContent.trim(), 10) || 0;
  2634.                 currentCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  2635.                 likeMesFavLabel.textContent = currentCount;
  2636.             }
  2637.             if (likeCountLabel) {
  2638.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  2639.                 currentCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  2640.                 likeCountLabel.textContent = currentCount;
  2641.                 // Mettre à jour la valeur dans l'input hidden
  2642.                 const nbFavCurrentInput = \$('#nbFavCurrent');
  2643.                 if (nbFavCurrentInput.length) {
  2644.                     nbFavCurrentInput.val(currentCount);
  2645.                 }
  2646.             }
  2647.             // Préparation des données pour l'Ajax
  2648.             const \$_data = { 'id': \$id, 'idSejour': \$idSejour };
  2649.             // Appel Ajax pour supprimer le favori
  2650.             \$.ajax({
  2651.                 type: \"POST\",
  2652.                 url: \"";
  2653.         // line 2253
  2654.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("Supprimer_fav");
  2655.         yield "\",
  2656.                 data: \$_data,
  2657.                 success: function () {
  2658.                     // Réactiver les icônes après succès
  2659.                     \$('.IconDelete').each(function () {
  2660.                         \$(this).css('pointer-events', '');
  2661.                     });
  2662.                 },
  2663.                 error: function (xhr, status, error) {
  2664.                     console.error('Erreur lors de la suppression du favori :', error);
  2665.                 }
  2666.             });
  2667.         }
  2668.         function AddFavoris(\$id, \$idSejour, \$urlimg, \$description) {
  2669.            // console.log('Adding favorite:', { attachmentId, sejourId, path, description });
  2670.   \$(\"#close-favorites-btn\").click()
  2671.             favoriteButton.classList.add('active');
  2672.    const likeMesFavLabel = document.getElementById('mesFavCount');
  2673.       
  2674.             const likeCountLabel = document.getElementById('likeCount');
  2675.             if (likeCountLabel) {
  2676.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  2677.                 likeCountLabel.textContent = currentCount + 1;
  2678.                      likeMesFavLabel.textContent = currentCount + 1;
  2679.             }
  2680.         // Retirer l'animation après qu'elle soit jouée
  2681.         setTimeout(() => {
  2682.             favoriteButton.classList.remove('active');
  2683.         }, 600); // La durée doit correspondre à celle de l'animation
  2684.             \$('#coeur' + \$id).empty();
  2685.             var clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  2686.             \$('#coeur' + \$id).html(\"<i class=\\\"bi bi-heart-fill favSelect \" + clas + \"\\\" onclick=\\\"supprimerFavoris(\" + \$id + \",\" + \$idSejour + \")\\\"></i>\");
  2687.             var \$total = parseInt(\$(\"#totalLike\").html()) + 1;
  2688.             \$(\"#totalLike\").html(\$total);
  2689.             \$(\"#totalLikeTitle\").html(\$total);
  2690.             \$(\"#totalLikeMobile\").html(\$total);
  2691.             var \$data = { 'id': \$id, 'idSejour': \$idSejour };
  2692.             \$.ajax({
  2693.                 type: \"POST\",
  2694.                 url: \"";
  2695.         // line 2298
  2696.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("Ajouter_fav");
  2697.         yield "\",
  2698.                 data: \$data,
  2699.                 success: function () {
  2700.                     \$('.IconDelete').each(function () {
  2701.                         \$(this).css('pointer-events', '');
  2702.                     });
  2703.                     if (\$description === undefined) {
  2704.                         \$description = ''; // Set it to an empty string
  2705.                     }
  2706.                     \$('.rowMaselection').append(
  2707.                         '<div class=\"column\" id=\"column-' + \$id + '\">'+
  2708.                         '<a style=\"position: relative;\" title=\"Enlever de ma sélection\" onclick=\"supprimerFavoris(' + \$id + ',' + \$idSejour + ')\" class=\"iconeSuppImg\"><i class=\"bi bi-x\" style=\"font-size:17px;cursor:pointer;color:#d30909;float:right;margin-top:-3%;margin-right:2%\"></i></a>'+
  2709.                         '<a class=\"photo-zoom\">'+
  2710.                         '<img data-idAtach=\"'+\$id+'\" id=\"'+\$idSejour+'\" src=\"'+\$urlimg+'\"></a>'+
  2711.                         (\$description ? '<h4 id=\"commint\" class=\"titleHeadPhoto\">'+\$description+'</h4>' : '')+ // Only add the <h4> if \$description is not empty
  2712.                         '</div>'
  2713.                     );
  2714.                     // Directly update nbLikes count in the header
  2715.                     var currentNbLikes = parseInt(\$('#favoris-link-Accueilpayment .nbrpanier').text());
  2716.                     var newNbLikes = currentNbLikes + 1;
  2717.                     \$('#favoris-link-Accueilpayment .nbrpanier').text(newNbLikes);
  2718.                 },
  2719.                 error: function (xhr, status, error) {
  2720.                     console.error('Error:', error);
  2721.                 }
  2722.             });
  2723.         }
  2724.         \$(document).on('click', '.bi-heart, .bi-heart-fill', function () {
  2725.         const heartIcon       = \$(this);
  2726.         const heartContainer  = heartIcon.closest('.heart-icon');
  2727.         // Extract data attributes
  2728.         const attachmentId    = heartContainer.data('id');
  2729.         const sejourId        = heartContainer.data('sejour-id');
  2730.         const path            = heartContainer.data('path');
  2731.         const description     = heartContainer.data('description');
  2732.         const isFavorite      = heartIcon.hasClass('bi-heart-fill');
  2733.         // Get the input that contains the favorite count
  2734.         const likeFavInput    = document.getElementById('nbFavCurrent');
  2735.         let favoriteNb        = parseInt(likeFavInput.value, 10);
  2736.         if (isFavorite) {
  2737.             // Remove from favorites
  2738.             supprimerFavoris(attachmentId, sejourId);
  2739.             favoriteNb = Math.max(0, favoriteNb - 1);
  2740.             likeFavInput.value = favoriteNb;
  2741.             updateCardContent(favoriteNb);
  2742.               updateFavoritesSidebar();
  2743.                  \$(\"#close-favorites-btn\").click()
  2744.         } else {
  2745.             // Add to favorites
  2746.             AddFavoris(attachmentId, sejourId, path, description);
  2747.             favoriteNb = favoriteNb + 1;
  2748.             likeFavInput.value = favoriteNb;
  2749.             updateCardContent(favoriteNb);
  2750.        
  2751.             updateFavoritesSidebar();
  2752.                \$(\"#close-favorites-btn\").click()
  2753.         }
  2754.         // **** SIMPLE STEP: Update the purchase alert ****
  2755.         // This will refresh the progress bars, count, etc.
  2756.         updatePurchaseAlert(favoriteNb);
  2757.     });
  2758.         // Gestion dynamique du clic sur les icônes cœur
  2759.         \$(document).on('click', '.bi-hsddddeart, .bi-hdddeart-fill', function () {
  2760.             const heartIcon = \$(this);
  2761.           //  const heartIcon = \$(this);
  2762.             //const attachmentId = heartIcon.data('id'); // Récupère l'ID directement
  2763.             const attachmentId = heartIcon.closest('.heart-icon').attr('id').replace('coeur', '');
  2764.             const sejourId = heartIcon.data('sejour-id'); // Store the sejour ID in a data attribute
  2765.             const isFavorite = heartIcon.hasClass('bi-heart-fill');
  2766.             // Récupérer l'input contenant le nombre de favoris
  2767.             const likeFavInput = document.getElementById('nbFavCurrent');
  2768.             let favoriteNb = parseInt(likeFavInput.value, 10); // Utiliser .value pour les inputs
  2769.             // Validation pour éviter les NaN
  2770.             if (isNaN(favoriteNb)) {
  2771.                 favoriteNb = 0;
  2772.             }
  2773.             if (isFavorite) {
  2774.                 // Si c'est un favori, le supprimer
  2775.                 supprimerFavoris(attachmentId, sejourId);
  2776.                 // Décrémenter le compteur
  2777.                 favoriteNb = Math.max(0, favoriteNb - 1);
  2778.                 likeFavInput.value = favoriteNb; // Mettre à jour la valeur de l'input
  2779.                 // Mettre à jour dynamiquement le contenu des cartes ou popovers
  2780.                 updateCardContent(favoriteNb);
  2781.             } else {
  2782.                 // Si ce n'est pas un favori, l'ajouter
  2783.                 const path = heartIcon.data('path'); // Path de l'attachement
  2784.                 const description = heartIcon.data('description'); // Description de l'attachement
  2785.                 AddFavoris(attachmentId, sejourId, path, description);
  2786.           // Décrémenter le compteur
  2787.                 favoriteNb = Math.max(0, favoriteNb + 1);
  2788.                 likeFavInput.value = favoriteNb; // Mettre à jour la valeur de l'input
  2789.                 // Incrémenter le compteur
  2790.                 // Mettre à jour dynamiquement le contenu des cartes ou popovers
  2791.                 updateCardContent(favoriteNb);
  2792.             }
  2793.             // Mettre à jour dynamiquement la popover ou d'autres éléments liés
  2794.         });
  2795.         // Ajoutez les événements sur les icônes de cœur
  2796.         document.querySelectorAll('.IconDelete').forEach((icon) => {
  2797.             icon.addEventListener('click', (event) => {
  2798.                 const isFavorite = icon.classList.contains('bi-heart-fill');
  2799.                 if (isFavorite) {
  2800.                     removeFavorite();
  2801.                     icon.classList.remove('bi-heart-fill');
  2802.                     icon.classList.add('bi-heart');
  2803.                 } else {
  2804.                     addFavorite();
  2805.                     icon.classList.remove('bi-heart');
  2806.                     icon.classList.add('bi-heart-fill');
  2807.                 }
  2808.             });
  2809.         });
  2810.         // Vérifie l'état initial
  2811.         checkFavorites();
  2812.   </script>
  2813.   <!-- Initialisation -->
  2814.   <script>
  2815.     AOS.init({
  2816.       duration: 800, // Duration of animations in milliseconds
  2817.       easing: \"ease-in-out\", // Animation timing function
  2818.     });
  2819.     document.addEventListener(\"DOMContentLoaded\", function () {
  2820.       const dateCards = document.querySelectorAll(\".date-card\");
  2821.       const sections = document.querySelectorAll(\".collapse\");
  2822.       dateCards.forEach((card) => {
  2823.         card.addEventListener(\"click\", function () {
  2824.           // Supprimer les classes actives des autres cartes et sections
  2825.           dateCards.forEach((c) => c.classList.remove(\"active\"));
  2826.           sections.forEach((s) => s.classList.remove(\"show\"));
  2827.           // Ajouter la classe active à la carte cliquée
  2828.           this.classList.add(\"active\");
  2829.           // Récupérer la cible et afficher la bonne section
  2830.           const targetId = this.getAttribute(\"data-bs-target\");
  2831.           const targetSection = document.querySelector(targetId);
  2832.           if (targetSection) {
  2833.             targetSection.classList.add(\"show\");
  2834.           }
  2835.         });
  2836.       });
  2837.     });
  2838.     document.addEventListener(\"DOMContentLoaded\", function () {
  2839.       // Initialisation du carrousel Splide
  2840.       var splide = new Splide(\"#imageSlider\", {
  2841.         type: \"loop\",
  2842.         perPage: 1,
  2843.         autoplay: true,
  2844.         interval: 6000,
  2845.         pauseOnHover: false,
  2846.         pauseOnFocus: false,
  2847.         pagination: false, // Désactive la pagination
  2848.         arrows: false,
  2849.       });
  2850.       splide.mount();
  2851.       // Fonction pour faire défiler automatiquement vers la section suivante avec un ajustement personnalisé de la hauteur
  2852.       function scrollToNextSection() {
  2853.         const targetSection = document.getElementById(\"scrollTarget\");
  2854.         if (targetSection) {
  2855.           const targetPosition =
  2856.             targetSection.getBoundingClientRect().top + window.scrollY; // Position de la section
  2857.           const adjustedPosition = targetPosition - 50; // Réduit la hauteur du scroll de 150px (ajustez selon vos besoins)
  2858.           // Scroll vers la position ajustée
  2859.           window.scrollTo({
  2860.             top: adjustedPosition,
  2861.             behavior: \"smooth\",
  2862.           });
  2863.         }
  2864.       }
  2865.       // Démarrer le timer pour le scroll automatique après 10 secondes
  2866.       setTimeout(scrollToNextSection, 5000); // 10 secondes
  2867.     });
  2868.   </script>
  2869.   <script>
  2870.         document.addEventListener('DOMContentLoaded', function () {
  2871.             var myModal = new bootstrap.Modal(document.getElementById('PubProd'));
  2872.             myModal.show();
  2873.         });
  2874.         // Function to close the modal
  2875.     function closeModal() {
  2876.         var myModal = bootstrap.Modal.getInstance(document.getElementById('PubProd'));
  2877.         if (myModal) {
  2878.             myModal.hide();
  2879.         }
  2880.     }
  2881.     const favoriteButton = document.querySelector('.fav-button');
  2882.     favoriteButton.addEventListener('click', () => {
  2883.         // Ajouter la classe 'active' pour déclencher l'éclat
  2884.         favoriteButton.classList.add('active');
  2885.         // Retirer l'animation après qu'elle soit jouée
  2886.         setTimeout(() => {
  2887.             favoriteButton.classList.remove('active');
  2888.         }, 600); // La durée doit correspondre à celle de l'animation
  2889.     });
  2890.     
  2891.     //const HeartAddButton = document.querySelector('.IconDelete');
  2892.     \$(\".IconDelete\").on('click', () => {
  2893.         // Ajouter la classe 'active' pour déclencher l'éclat
  2894.         favoriteButton.classList.add('active');
  2895.         // Retirer l'animation après qu'elle soit jouée
  2896.         setTimeout(() => {
  2897.             favoriteButton.classList.remove('active');
  2898.         }, 600); // La durée doit correspondre à celle de l'animation
  2899.     });
  2900.     \$(document).ready(function() {
  2901.         // Attach click event to collapse triggers
  2902.         const lastCard = \$('.date-card.modern-card.active');
  2903.         const lastTargetId = lastCard.attr('data-bs-target');
  2904.         if (lastTargetId) {
  2905.             \$(lastTargetId).collapse('show'); // Expand the last collapse section
  2906.             LoadImagesCloud(\$(lastTargetId)); // Load images for the last day
  2907.         }
  2908.         \$('[data-bs-toggle=\"collapse\"]').on('click', function() {
  2909.             var targetId = \$(this).attr('data-bs-target'); // Get the target ID
  2910.             \$('.date-card.modern-card').removeClass('active'); // Remove 'active' class from all cards
  2911.             \$(this).addClass('active'); // Add 'active' class to the clicked card
  2912.             LoadImagesCloud(\$(targetId)); // Ensure this function works as expected
  2913.                // Hide all other collapses except the one clicked
  2914.                \$('[data-bs-target]').each(function() {
  2915.                 var currentTargetId = \$(this).attr('data-bs-target');
  2916.                 // If the current collapse is not the one clicked, hide it
  2917.                 if (currentTargetId !== targetId) {
  2918.                     \$(currentTargetId).collapse('hide');
  2919.                     //\$('[data-bs-toggle=\"collapse\"]').removeClass('active'); // Remove active class from all cards
  2920.                     //Modifier leurs style en non active aussi
  2921.                 }
  2922.             });
  2923.         });
  2924.     });
  2925.     function rotateIcone(iconId) {
  2926.         // Use the icon ID to target the specific element
  2927.         var icon = \$('#' + iconId);
  2928.         // Toggle the rotate-right class to apply rotation
  2929.         if (icon.hasClass('rotate-right')) {
  2930.             icon.removeClass('rotate-right'); // Remove rotation class
  2931.         } else {
  2932.             icon.addClass('rotate-right'); // Add rotation class
  2933.         }
  2934.     }
  2935.             \$(document).ready(function () {
  2936.                 \$total1 = parseInt(\$(\"#esphoto\").find('strong').html().replace('(', '').replace(')', ''));
  2937.                 \$('[data-bs-toggle=\"tooltip\"]').tooltip();
  2938.                 ";
  2939.         // line 2600
  2940.         if ((($tmp CoreExtension::getAttribute($this->env$this->sourceCoreExtension::getAttribute($this->env$this->source, (isset($context["app"]) || array_key_exists("app"$context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.'2600$this->source); })()), "session", [], "any"falsefalsefalse2600), "get", ["paymentmoniteco"], "method"falsefalsefalse2600)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  2941.             // line 2601
  2942.             yield "                ";
  2943.             if ((CoreExtension::getAttribute($this->env$this->sourceCoreExtension::getAttribute($this->env$this->source, (isset($context["app"]) || array_key_exists("app"$context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.'2601$this->source); })()), "session", [], "any"falsefalsefalse2601), "get", ["paymentmoniteco"], "method"falsefalsefalse2601) == "succses")) {
  2944.                 // line 2602
  2945.                 yield "
  2946.                 Swal.fire({
  2947.                     icon: 'success',
  2948.                     title: ' succès ',
  2949.                     text: 'votre commande est validée'
  2950.                 });
  2951.                 ";
  2952.             }
  2953.             // line 2612
  2954.             yield "                ";
  2955.         }
  2956.         // line 2613
  2957.         yield "
  2958.                 if (\$total1 > 0) {
  2959.                     \$('.iconeFleche').first().click();
  2960.                     //  \$([document.documentElement, document.body]).animate({
  2961.                     //  scrollTop: \$('.iconeFleche').last().offset().top
  2962.                     //  }, );
  2963.                 }
  2964.                 else {
  2965.                     \$(window).scrollTop(0);
  2966.                 }
  2967.                 var slider = \$('.responsive').slick({
  2968.                     infinite: true,
  2969.                     slidesToShow: 1,
  2970.                     slidesToScroll: 1,
  2971.                     autoplay: true,
  2972.                     autoplaySpeed: 4000,
  2973.                     pauseOnFocus: false,
  2974.                     pauseOnHover: false,
  2975.                     draggable: false,
  2976.                     fade: true
  2977.                 });
  2978.                 \$('.responsive').css('display', 'block');
  2979.                 \$('.namePRD').css('display', 'block');
  2980.                 var currSlide = 0;
  2981.                 var nextSlide = 0;
  2982.                 slider.on('afterChange', function (event, slick, currentSlide) {
  2983.                     console.log(typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\");
  2984.                     if (typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\") {
  2985.                         setTimeout(function () {
  2986.                             \$('.slick-active .imgproduit1').removeClass('animated fadeIn');
  2987.                             \$('.slick-active .imgproduit1').addClass('animated fadeOut');
  2988.                             \$('.slick-active .imgproduit1').css('display', 'none');
  2989.                             \$('.slick-active .imgproduit2').css('display', 'block');
  2990.                             \$('.slick-active .imgproduit2').removeClass('animated fadeOut');
  2991.                             \$('.slick-active .imgproduit2').addClass('animated fadeIn');
  2992.                         }, 2000);
  2993.                     }
  2994.                 });
  2995.                 slider.on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  2996.                     currSlide = currentSlide;
  2997.                     \$('.imgproduit2').each(function () {
  2998.                         \$(this).removeClass('animated fadeIn');
  2999.                         \$(this).addClass('animated fadeOut');
  3000.                         \$(this).css('display', 'none');
  3001.                     });
  3002.                     \$('.imgproduit1').each(function () {
  3003.                         \$(this).css('display', 'block');
  3004.                         \$(this).removeClass('animated fadeOut');
  3005.                         \$(this).addClass('animated fadeIn');
  3006.                     });
  3007.                 });
  3008.                 \$('.columnPub').each(function () {
  3009.                     \$(this).slick({
  3010.                         infinite: true,
  3011.                         speed: 50,
  3012.                         fade: true,
  3013.                         slidesToShow: 1,
  3014.                         slidesToScroll: 1,
  3015.                         autoplay: true,
  3016.                         pauseOnFocus: false,
  3017.                         pauseOnHover: false,
  3018.                         draggable: false
  3019.                     });
  3020.                     \$(this).css('display', 'block');
  3021.                 });
  3022.                 \$(\"#offrePack\").click();
  3023.                 ";
  3024.         // line 2687
  3025.         if ((CoreExtension::getAttribute($this->env$this->sourceCoreExtension::getAttribute($this->env$this->source, (isset($context["app"]) || array_key_exists("app"$context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.'2687$this->source); })()), "user", [], "any"falsefalsefalse2687), "showpubprod", [], "any"falsefalsefalse2687) != "false")) {
  3026.             // line 2688
  3027.             yield "                \$('#btnPubProd').click();
  3028.                 \$('.modal-backdrop').css('background-color', 'rgba(0, 0, 0, 0.2)');
  3029.                 ";
  3030.         }
  3031.         // line 2691
  3032.         yield "            });
  3033.             \$(\"#closeImage\").click(function () {
  3034.                 \$('#myModalImage').css('display', \"none\");
  3035.             });
  3036.             \$.ajax({
  3037.                 type: \"POST\",
  3038.                 url: \"";
  3039.         // line 2697
  3040.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("delateSession_parent");
  3041.         yield "\",
  3042.                 success: function () { }
  3043.             });
  3044.             function afficheDiv(elem) {
  3045.                 \$('.nav-link').each(function () {
  3046.                     \$(this).removeClass('active');
  3047.                 });
  3048.                 elem.addClass('active');
  3049.                 if (elem.attr('id') === \"esphoto\" || elem.attr('id') === \"esphotoMobile\") {
  3050.                     \$(\"#espacphoto\").show();
  3051.                     \$(\"#espacemessage\").hide();
  3052.                     \$(\"#espaceMa_selection\").hide();
  3053.                     pageMenu = 'MonSejour'
  3054.                     \$(this).addClass('active');
  3055.                    \$('#imageActifphoto').css('display', 'block');
  3056.                      \$('#imagenoActifphoto').css('display', 'none');
  3057.                    \$('#VocalActivee').css('display', 'none');
  3058.                      \$('#noActifVocal').css('display', 'block');
  3059.                 }
  3060.                 if (elem.attr('id') === \"esmessage\" || elem.attr('id') === \"esmessageMobile\") {
  3061.                     \$(\"#espacphoto\").hide();
  3062.                     \$(\"#espaceMa_selection\").hide();
  3063.                     \$(\"#espacemessage\").show();
  3064.                     pageMenu = 'BoiteVocale'
  3065.                     \$(\"#espaceMa_selection\").hide();
  3066.                     \$(this).addClass('active');
  3067.                   \$('#imageActifphoto').css('display', 'none');
  3068.                      \$('#imagenoActifphoto').css('display', 'block');
  3069.                    \$('#VocalActivee').css('display', 'block');
  3070.                      \$('#noActifVocal').css('display', 'none');
  3071.                 }
  3072.                 if (elem.attr('id') === \"esselection\" || elem.attr('id') === \"esselectionMobile\") {
  3073.                     \$(\"#espacphoto\").hide();
  3074.                     \$(\"#espacemessage\").hide();
  3075.                     \$(\"#espaceMa_selection\").show();
  3076.                     \$(homeNavmob).removeClass('bi bi-house-door-fill');
  3077.                     \$(homeNavmob).addClass('bi bi-house-door');
  3078.                     \$(micromob).removeClass('bi bi-mic-fill');
  3079.                     \$(micromob).addClass('bi bi-mic');
  3080.                     \$(selecNavmob).removeClass('bi bi-heart');
  3081.                     \$(selecNavmob).addClass('bi bi-heart-fill');
  3082.                 }
  3083.             }
  3084.             function LoadImagesCloud(\$element) {
  3085.                 \$element.find('.photo-zoom img').each(function (\$this) {
  3086.                     if (\$(this).attr('data-src') != \$(this).attr('src')) {
  3087.                         \$(this).attr('src', \$(this).attr('data-src'));
  3088.                     }
  3089.                 });
  3090.             }
  3091.       function afficheDivFooterMobile(elem) {
  3092.              if(elem =='esphotoMobile') {
  3093.                    \$(\"#espacphoto\").show();
  3094.                     \$(\"#espacemessage\").hide();
  3095.                     \$(\"#espaceMa_selection\").hide();
  3096.                     \$(\"#storevide\").hide();
  3097.                     \$(\"#storefull\").show();
  3098.                     \$(\"#fullphoto\").show();
  3099.                     \$(\"#videphoto\").hide()
  3100.                     \$(\"#vocalfull\").hide();
  3101.                     \$(\"#vocalvide\").show();
  3102.                 }
  3103.                 if (elem === \"esmessageMobile\" ) {
  3104.                     \$(\"#espacphoto\").hide();
  3105.                     \$(\"#espacemessage\").show();
  3106.                     \$(\"#espaceMa_selection\").hide();
  3107.                     \$(\"#storefull\").hide();
  3108.                     \$(\"#storevide\").show();
  3109.                     \$(\"#fullphoto\").hide();
  3110.                     \$(\"#videphoto\").show()
  3111.                     \$(\"#vocalfull\").show();
  3112.                     \$(\"#vocalvide\").hide();
  3113.                 }
  3114.             }
  3115.             function permutation(elem) {
  3116.                 \$(\".IconImag\").each(function () {
  3117.                     \$(this).removeClass('active');
  3118.                 });
  3119.                 elem.addClass(\"active\");
  3120.             }
  3121.             function per(elem) {
  3122.                 \$(\".list-group-item \").each(function () {
  3123.                     \$(this).removeClass('show');
  3124.                 });
  3125.                 elem.addClass(\"active\");
  3126.                 \$(\"#iconeFleche\").addClass('active');
  3127.             }
  3128.            function setidattach(id) {
  3129.                 \$(\"#idattachipmut\").val(id)
  3130.             }
  3131.             var ParentAjouterALL_fav = \"";
  3132.         // line 2808
  3133.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentAjouterALL_fav");
  3134.         yield "\";
  3135.             function AllFavoris(\$idSejour) {
  3136.                 \$('#SelectALL').html('Désélectionner tout');
  3137.                 \$('#SelectALL').css('pointer-events', 'none');
  3138.                 \$('#SelectALL').css('opacity', '0.5');
  3139.                 \$('#SelectALL').css('cursor', 'no-drop');
  3140.                 \$('#SelectALL1').html('Désélectionner tout');
  3141.                 \$('#SelectALL1').css('pointer-events', 'none');
  3142.                 \$('#SelectALL1').css('opacity', '0.5');
  3143.                 \$('#SelectALL1').css('cursor', 'no-drop');
  3144.                 \$data = { 'idSejour': \$idSejour }
  3145.                 \$.ajax({
  3146.                     type: \"POST\",
  3147.                     url: \"";
  3148.         // line 2821
  3149.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentAjouterALL_fav");
  3150.         yield "\",
  3151.                     data: \$data,
  3152.                     success: function () {
  3153.                         location.reload();
  3154.                     }
  3155.                 });
  3156.             }
  3157.             function RemoveAllFavoris(\$idSejour) {
  3158.                 \$('#SelectALL').html('Sélectionner tout');
  3159.                 \$('#SelectALL').css('pointer-events', 'none');
  3160.                 \$('#SelectALL').css('opacity', '0.5');
  3161.                 \$('#SelectALL').css('cursor', 'no-drop');
  3162.                 \$('#SelectALL1').html('Sélectionner tout');
  3163.                 \$('#SelectALL1').css('pointer-events', 'none');
  3164.                 \$('#SelectALL1').css('opacity', '0.5');
  3165.                 \$('#SelectALL1').css('cursor', 'no-drop');
  3166.                 \$data = { 'idSejour': \$idSejour }
  3167.                 \$.ajax({
  3168.                     type: \"POST\",
  3169.                     url: \"";
  3170.         // line 2841
  3171.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentSupprimer_ALLfav");
  3172.         yield "\",
  3173.                     data: \$data,
  3174.                     success: function () {
  3175.                         location.reload();
  3176.                     }
  3177.                 });
  3178.             }
  3179.             // Get the elements with class=\"column\"
  3180.             var elements = document.getElementsByClassName(\"column\");
  3181.             // Declare a \"loop\" variable
  3182.             var i;
  3183.             // Full-width images
  3184.             function Four() {
  3185.                 for (i = 0; i < elements.length; i++) {
  3186.                     elements[i].style.flex = \"0 0 25%\";
  3187.                 }
  3188.                 \$('.IconDelete').attr('class', 'IconDelete ');
  3189.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  3190.                 \$('.localistaion').css('visibility', 'visible');
  3191.                 \$('.localistaion').attr('class', 'localistaion');
  3192.                 \$('.legend').css('visibility', 'visible');
  3193.                 \$('.columnPub').each(function () {
  3194.                     \$(this).css('max-width', '25%');
  3195.                     \$(this).find('.slick-list').removeClass('miniature');
  3196.                     \$(this).find('.single_service').removeClass('miniature');
  3197.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  3198.                 });
  3199.             }
  3200.             // Two images side by side
  3201.             function six() {
  3202.                 for (i = 0; i < elements.length; i++) {
  3203.                     elements[i].style.flex = \"0 0 15%\";
  3204.                 }
  3205.                 \$('.column').css('padding', '0px 10px 0px 0px');
  3206.                 \$('.localistaion').attr('class', 'localistaion localistaionsix');
  3207.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletesix');
  3208.                 \$('.legend').css('visibility', 'visible');
  3209.                 \$('.photo-zoom ').attr('class', 'photo-zoom heightimg');
  3210.                 \$('.columnPub').each(function () {
  3211.                     \$(this).css('max-width', '15%');
  3212.                     \$(this).find('.slick-list').addClass('miniature');
  3213.                     \$(this).find('.single_service').addClass('miniature');
  3214.                     \$(this).find('.bottomdivpub').addClass('miniature');
  3215.                 });
  3216.             }
  3217.             // Four images side by side
  3218.             function two() {
  3219.                 for (i = 0; i < elements.length; i++) {
  3220.                     elements[i].style.flex = \"0 0 40%\";
  3221.                 }
  3222.                 \$('.column').css('padding', '14px 10px');
  3223.                 \$('.column').css('max-width', '40%');
  3224.                 \$('.localistaion').css('visibility', 'visible');
  3225.                 \$('.legend').css('visibility', 'visible');
  3226.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  3227.                 \$('.localistaion').attr('class', 'localistaion localistaiontwo');
  3228.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletetwo');
  3229.                 \$('.legend').attr('class', 'legend legendtwo');
  3230.                 \$('.columnPub').each(function () {
  3231.                     \$(this).css('max-width', '40%');
  3232.                     \$(this).find('.slick-list').removeClass('miniature');
  3233.                     \$(this).find('.single_service').removeClass('miniature');
  3234.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  3235.                 });
  3236.             }
  3237.             function hidePopPub() {
  3238.                 \$('.modal-backdrop').css('background-color', 'rgb(0, 0, 0)');
  3239.             }
  3240.             function changeHref(elem, newhref) {
  3241.                 \$(elem).parent().attr('href', newhref);
  3242.             }
  3243.             function VerifNbLikes(nblikes) {
  3244.                 \$('#allerAlaBoutique').click();
  3245.             }
  3246.     function handleMenuClick(menuId, pageMenu) {
  3247.         // Reset all icons
  3248.         document.getElementById('imagenoActifphoto').style.display = 'block';
  3249.         document.getElementById('imageActifphoto').style.display = 'none';
  3250.         document.getElementById('nofavorisVocal').style.display = 'block';
  3251.         document.getElementById('favorisActive').style.display = 'none';
  3252.         document.getElementById('noActifVocal').style.display = 'block';
  3253.         document.getElementById('VocalActivee').style.display = 'none';
  3254.         // Set selected icon
  3255.         if (menuId === 'photo') {
  3256.             document.getElementById('imagenoActifphoto').style.display = 'none';
  3257.             document.getElementById('imageActifphoto').style.display = 'block';
  3258.         } else if (menuId === 'selection') {
  3259.             document.getElementById('nofavorisVocal').style.display = 'none';
  3260.             document.getElementById('favorisActive').style.display = 'block';
  3261.         } else if (menuId === 'message') {
  3262.             document.getElementById('noActifVocal').style.display = 'none';
  3263.             document.getElementById('VocalActivee').style.display = 'block';
  3264.         }
  3265.         // Handle any other necessary logic
  3266.         \$('#list-tab-photo').removeClass('show');
  3267.         \$('#list-tab-message').removeClass('show');
  3268.         afficheDiv(\$(`#\${menuId}`));
  3269.     }
  3270.   </script>
  3271.   <script>
  3272.     \$(document).ready(function () {
  3273.       \$(\"#PubProd\").on(\"hidden.bs.modal\", function () {
  3274.         \$(document).trigger(\"modalClosed\");
  3275.       });
  3276.     });
  3277.   </script>
  3278.   <script>
  3279.     \$(document).ready(function () {
  3280.       \$(\"#noShow\").on(\"change\", function () {
  3281.         if (\$(this).is(\":checked\")) {
  3282.           \$.ajax({
  3283.             url: \"/Parent/showpub\",
  3284.             type: \"POST\",
  3285.             dataType: \"json\",
  3286.             success: function (response) {
  3287.               if (response.status === \"success\") {
  3288.                 console.log(\"User showpubprod updated successfully.\");
  3289.               } else {
  3290.                 console.log(\"Error:\", response.message);
  3291.               }
  3292.             },
  3293.             error: function (xhr, status, error) {
  3294.               console.log(\"AJAX Error:\", error);
  3295.             },
  3296.           });
  3297.         }
  3298.       });
  3299.     });
  3300.   </script>
  3301. </div>
  3302. <!-- Script pour la sidebar des favoris -->
  3303. <script>
  3304.   \$(document).ready(function() {
  3305.     // Ouvrir la sidebar
  3306.     \$(\"#openFavoritesSidebar\").click(function() {
  3307.       \$(\".favorites-sidebar\").addClass(\"open\");
  3308.       loadFavorites();
  3309.     });
  3310.     
  3311.     // Fermer la sidebar
  3312.     \$(\".favorites-close\").click(function() {
  3313.       \$(\".favorites-sidebar\").removeClass(\"open\");
  3314.     });
  3315.     
  3316.     // Charger les favoris
  3317.     function loadFavorites() {
  3318.       \$.ajax({
  3319.         url: \"/Parent/mes-favoris\",
  3320.         type: \"GET\",
  3321.         dataType: \"json\",
  3322.         beforeSend: function() {
  3323.           \$(\"#favorites-grid\").html(\"<div style='text-align:center'>Chargement...</div>\");
  3324.         },
  3325.         success: function(data) {
  3326.           \$(\"#favorites-grid\").empty();
  3327.           
  3328.           if (data.data && data.data.length > 0) {
  3329.             \$(\"#favorites-empty-state\").hide();
  3330.             
  3331.             \$.each(data.data, function(i, fav) {
  3332.               var item = \$(\"<div class='favorite-item'></div>\");
  3333.               var img = \$(\"<img>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  3334.               var overlay = \$(\"<div class='favorite-overlay'></div>\");
  3335.         
  3336.               
  3337.               btn.click(function(e) {
  3338.                 e.preventDefault();
  3339.                 e.stopPropagation();
  3340.                 removeFavorite(fav.id);
  3341.               });
  3342.               
  3343.               overlay.append(btn);
  3344.               item.append(img).append(overlay);
  3345.               \$(\"#favorites-grid\").append(item);
  3346.             });
  3347.             
  3348.             \$(\"#favorites-counter\").text(data.data.length);
  3349.             var percentage = (data.data.length / 10) * 100;
  3350.             \$(\"#favorites-progress\").css(\"width\", percentage + \"%\");
  3351.             
  3352.           } else {
  3353.             \$(\"#favorites-empty-state\").show();
  3354.             \$(\"#favorites-counter\").text(\"0\");
  3355.             \$(\"#favorites-progress\").css(\"width\", \"0%\");
  3356.           }
  3357.         },
  3358.         error: function() {
  3359.           \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center'>Erreur de chargement</div>\");
  3360.         }
  3361.       });
  3362.     }
  3363.     
  3364.     // Supprimer un favori
  3365.     function removeFavorite(id) {
  3366.       \$.ajax({
  3367.         url: \"/Parent/remove-favorite/\" + id,
  3368.         type: \"POST\",
  3369.         success: function() {
  3370.           loadFavorites();
  3371.           
  3372.           // Mettre à jour le compteur global
  3373.           var count = parseInt(\$(\"#likeCount\").text());
  3374.           if (!isNaN(count)) {
  3375.             \$(\"#likeCount\").text(count - 1);
  3376.           }
  3377.           
  3378.           var countFav = parseInt(\$(\"#mesFavCount\").text());
  3379.           if (!isNaN(countFav)) {
  3380.             \$(\"#mesFavCount\").text(countFav - 1);
  3381.           }
  3382.         },
  3383.         error: function() {
  3384.           alert(\"Erreur lors de la suppression du favori\");
  3385.         }
  3386.       });
  3387.     }
  3388.   });
  3389. </script>
  3390. <!-- Script pour la sidebar des favoris -->
  3391. <script>
  3392. \$(document).ready(function() {
  3393.     // Fonctions pour ouvrir/fermer la sidebar
  3394.     \$(\"#openFavoritesSidebar\").click(function() {
  3395.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  3396.         loadFavorites();
  3397.     });
  3398.     
  3399.     \$(\"#close-favorites-btn\").click(function() {
  3400.         \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  3401.     });
  3402.     
  3403.     // Fermer en cliquant en dehors
  3404.     \$(document).click(function(event) {
  3405.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  3406.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  3407.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  3408.             \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  3409.         }
  3410.     });
  3411.     
  3412.    // Variables globales
  3413. let selectedFavorites = [];
  3414. let allFavorites = [];
  3415. let coverPhotoId = null; // ID de la photo de couverture
  3416. // Fonction pour mettre à jour la sidebar
  3417. function loadFavorites() {
  3418.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  3419.     
  3420.     \$.ajax({
  3421.         url: \"/Parent/mes-favoris\",
  3422.         type: \"GET\",
  3423.         dataType: \"json\",
  3424.         success: function(data) {
  3425.             \$(\"#favorites-grid\").empty();
  3426.             allFavorites = data.data || [];
  3427.             
  3428.             if (allFavorites.length > 0) {
  3429.                 \$(\"#favorites-empty-state\").hide();
  3430.                 
  3431.                 // Ajouter l'option de photo de couverture au-dessus de la grille
  3432.                 if (!\$(\"#cover-photo-section\").length) {
  3433.                     const coverSection = \$(`
  3434.                         <div id=\"cover-photo-section\" style=\"margin-bottom:15px;\">
  3435.                             <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;\">
  3436.                                 <h4 style=\"margin:0;font-size:15px;color:#333;\">Photo de couverture</h4>
  3437.                                 <span style=\"font-size:12px;color:#777;\">Pour la personnalisation des produits</span>
  3438.                             </div>
  3439.                             <div id=\"cover-photo-container\" style=\"height:120px;background:#f5f5f5;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border:1px dashed #ccc;\">
  3440.                                 <div id=\"cover-photo-placeholder\" style=\"text-align:center;padding:15px;color:#777;\">
  3441.                                     <i class=\"bi bi-image\" style=\"font-size:24px;display:block;margin-bottom:8px;\"></i>
  3442.                                     <p style=\"margin:0;font-size:13px;\">Sélectionnez une photo comme couverture</p>
  3443.                                 </div>
  3444.                                 <div id=\"cover-photo-preview\" style=\"display:none;width:100%;height:100%;position:relative;\">
  3445.                                     <img src=\"\" style=\"width:100%;height:100%;object-fit:cover;\" />
  3446.                                     <button id=\"remove-cover-photo\" style=\"position:absolute;top:5px;right:5px;background:#F56040;color:white;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;\">
  3447.                                         <i class=\"bi bi-x\"></i>
  3448.                                     </button>
  3449.                                 </div>
  3450.                             </div>
  3451.                         </div>
  3452.                     `);
  3453.                     
  3454.                     \$(\"#photos-content\").prepend(coverSection);
  3455.                     
  3456.                     // Événement pour retirer la photo de couverture
  3457.                     \$(\"#remove-cover-photo\").click(function(e) {
  3458.                         e.stopPropagation();
  3459.                         setCoverPhoto(null);
  3460.                     });
  3461.                 }
  3462.                 
  3463.                 // Mettre à jour l'affichage de la photo de couverture
  3464.                 updateCoverPhotoDisplay();
  3465.                 
  3466.                 // Générer la grille de photos
  3467.                 \$.each(allFavorites, function(i, fav) {
  3468.                     var isSelected = selectedFavorites.includes(fav.id);
  3469.                     var isCoverPhoto = (coverPhotoId === fav.id);
  3470.                     
  3471.                     // Conteneur principal avec styles conditionnels
  3472.                     var item = \$(\"<div class='favorite-item' data-id='\" + fav.id + \"' style='position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;transition:all 0.2s;border:3px solid \" + (isSelected ? \"#F56040\" : (isCoverPhoto ? \"#4CAF50\" : \"transparent\")) + \";'></div>\");
  3473.                     
  3474.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  3475.                     
  3476.                     // Badge de sélection
  3477.                     var selectionBadge = \$(\"<div class='selection-badge' style='position:absolute;top:5px;right:5px;width:22px;height:22px;border-radius:50%;background:#F56040;display:\" + (isSelected ? \"flex\" : \"none\") + \";align-items:center;justify-content:center;color:white;font-size:12px;z-index:10;'><i class='bi bi-check'></i></div>\");
  3478.                     
  3479.                     // Badge de photo de couverture
  3480.                     var coverBadge = \$(\"<div class='cover-badge' style='position:absolute;top:5px;left:5px;padding:2px 6px;background:#4CAF50;color:white;font-size:10px;border-radius:3px;display:\" + (isCoverPhoto ? \"block\" : \"none\") + \";z-index:10;'><i class='bi bi-star-fill' style='margin-right:3px;font-size:8px;'></i>Couverture</div>\");
  3481.                     
  3482.                     // Overlay simple pour effet au survol
  3483.                     var hoverOverlay = \$(\"<div class='hover-overlay' style='position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.2);opacity:0;transition:opacity 0.2s;z-index:5;'></div>\");
  3484.                     
  3485.                     // Actions sur hover
  3486.                     var actionsOverlay = \$(\"<div class='actions-overlay' style='position:absolute;bottom:5px;left:5px;right:5px;display:flex;justify-content:center;gap:8px;opacity:0;transition:opacity 0.2s;z-index:15;'></div>\");
  3487.                     
  3488.                     // Bouton pour définir comme photo de couverture
  3489.                     var setCoverBtn = \$(\"<button style='background:\" + (isCoverPhoto ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\") + \";color:\" + (isCoverPhoto ? \"white\" : \"#333\") + \";border:none;border-radius:3px;font-size:11px;padding:5px 8px;cursor:pointer;'><i class='bi bi-star\" + (isCoverPhoto ? \"-fill\" : \"\") + \"' style='margin-right:3px;'></i>Couverture</button>\");
  3490.                     
  3491.                     setCoverBtn.click(function(e) {
  3492.                         e.stopPropagation();
  3493.                         if (isCoverPhoto) {
  3494.                             setCoverPhoto(null);
  3495.                         } else {
  3496.                             setCoverPhoto(fav.id);
  3497.                         }
  3498.                     });
  3499.                     
  3500.                     actionsOverlay.append(setCoverBtn);
  3501.                     
  3502.                     // Ajouter effet de survol
  3503.                     item.hover(
  3504.                         function() { 
  3505.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"1\");
  3506.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"1\");
  3507.                         },
  3508.                         function() { 
  3509.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"0\");
  3510.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"0\");
  3511.                         }
  3512.                     );
  3513.                     
  3514.                     // Gérer le clic pour la sélection
  3515.                     item.click(function(e) {
  3516.                         e.stopPropagation();
  3517.                         toggleSelection(\$(this).data('id'));
  3518.                     });
  3519.                     
  3520.                     item.append(img).append(hoverOverlay).append(selectionBadge).append(coverBadge).append(actionsOverlay);
  3521.                     
  3522.                     // Ajouter explicitement une classe pour le style
  3523.                     item.addClass(\"no-trash-button\");
  3524.                     
  3525.                     \$(\"#favorites-grid\").append(item);
  3526.                 });
  3527.                 
  3528.                 // Supprimer tout bouton de suppression qui pourrait être ajouté dynamiquement
  3529.                 setTimeout(function() {
  3530.                     \$(\".favorite-item .remove-favorite, .favorite-item button:has(.bi-trash), .favorite-overlay button\").remove();
  3531.                 }, 100);
  3532.                 
  3533.                 \$(\"#favorites-counter\").text(allFavorites.length);
  3534.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  3535.                 updateProductsView();
  3536.                 
  3537.             } else {
  3538.                 \$(\"#favorites-empty-state\").show();
  3539.                 \$(\"#favorites-counter\").text(\"0\");
  3540.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  3541.                 \$(\"#selection-count\").text(\"0\");
  3542.                 updateProductsView();
  3543.             }
  3544.         },
  3545.         error: function() {
  3546.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  3547.         }
  3548.     });
  3549. }
  3550. // Fonction pour définir la photo de couverture
  3551. function setCoverPhoto(id) {
  3552.     coverPhotoId = id;
  3553.     
  3554.     // Mettre à jour l'affichage
  3555.     updateCoverPhotoDisplay();
  3556.     
  3557.     // Mettre à jour le style des photos dans la grille
  3558.     \$(\".favorite-item\").each(function() {
  3559.         const itemId = \$(this).data('id');
  3560.         const isSelected = selectedFavorites.includes(itemId);
  3561.         const isCover = (itemId === coverPhotoId);
  3562.         
  3563.         // Mettre à jour la bordure
  3564.         \$(this).css(\"border\", \"3px solid \" + (isSelected ? \"#F56040\" : (isCover ? \"#4CAF50\" : \"transparent\")));
  3565.         
  3566.         // Mettre à jour le badge de couverture
  3567.         \$(this).find(\".cover-badge\").css(\"display\", isCover ? \"block\" : \"none\");
  3568.         
  3569.         // Mettre à jour le bouton de couverture
  3570.         const coverBtn = \$(this).find(\".actions-overlay button:first\");
  3571.         coverBtn.css({
  3572.             \"background\": isCover ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\",
  3573.             \"color\": isCover ? \"white\" : \"#333\"
  3574.         });
  3575.         coverBtn.find(\"i\").attr(\"class\", \"bi bi-star\" + (isCover ? \"-fill\" : \"\"));
  3576.     });
  3577.     
  3578.     // Enregistrer l'ID de la photo de couverture (si nécessaire pour le backend)
  3579.     if (id) {
  3580.         console.log(\"Photo de couverture définie avec l'ID:\", id);
  3581.         // Ici vous pouvez ajouter une requête AJAX pour enregistrer ce choix sur le serveur
  3582.         
  3583.         // Ajouter automatiquement la photo de couverture à la sélection si elle n'y est pas déjà
  3584.         if (!selectedFavorites.includes(id)) {
  3585.             toggleSelection(id);
  3586.         }
  3587.     } else {
  3588.         console.log(\"Photo de couverture supprimée\");
  3589.     }
  3590. }
  3591. // Mettre à jour l'affichage de la photo de couverture
  3592. function updateCoverPhotoDisplay() {
  3593.     if (coverPhotoId) {
  3594.         // Trouver la photo correspondante
  3595.         const coverPhoto = allFavorites.find(fav => fav.id === coverPhotoId);
  3596.         if (coverPhoto) {
  3597.             \$(\"#cover-photo-placeholder\").hide();
  3598.             \$(\"#cover-photo-preview\").show();
  3599.             \$(\"#cover-photo-preview img\").attr(\"src\", coverPhoto.path);
  3600.         } else {
  3601.             // Si l'ID ne correspond à aucune photo (cas rare)
  3602.             coverPhotoId = null;
  3603.             \$(\"#cover-photo-placeholder\").show();
  3604.             \$(\"#cover-photo-preview\").hide();
  3605.         }
  3606.     } else {
  3607.         \$(\"#cover-photo-placeholder\").show();
  3608.         \$(\"#cover-photo-preview\").hide();
  3609.     }
  3610. }
  3611. // Modifier la fonction updateProductsView pour tenir compte de la photo de couverture
  3612. function updateProductsView() {
  3613.     const current = selectedFavorites.length;
  3614.     const hasCoverPhoto = coverPhotoId !== null;
  3615.     
  3616.     \$(\"#product-photo-count\").text(current);
  3617.     
  3618.     let remainingForAlbum = Math.max(0, 20 - current);
  3619.     let remainingForPochette = Math.max(0, 12 - current);
  3620.     let remainingForPack = Math.max(0, 12 - current);
  3621.     const progressBar = (count, total, color) => `
  3622.         <div style=\"margin: 5px 0;\">
  3623.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  3624.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  3625.             </div>
  3626.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  3627.         </div>
  3628.     `;
  3629.     // Liste des produits
  3630.     const products = [
  3631.         {
  3632.             name: \"Pochette photo (12 photos)\",
  3633.             required: 12,
  3634.             remaining: Math.max(0, 12 - current),
  3635.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  3636.             color: \"#2196f3\",
  3637.             link: \"";
  3638.         // line 3326
  3639.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  3640.         yield "\",
  3641.             needsCover: true
  3642.         },
  3643.         {
  3644.             name: \"Pack numérique (20 photos)\",
  3645.             required: 20,
  3646.             remaining: Math.max(0, 20 - current),
  3647.             image: \"/images/produit/photoNumerique.jpg\",
  3648.             color: \"#4caf50\",
  3649.             link: \"";
  3650.         // line 3335
  3651.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 20]);
  3652.         yield "\",
  3653.             needsCover: false
  3654.         },
  3655.        
  3656.       
  3657.     ].sort((a, b) => a.remaining - b.remaining);
  3658.     const productList = products
  3659.         .map((product) => {
  3660.             const count = current;
  3661.             const total = product.required;
  3662.             const remaining = product.remaining;
  3663.             const coverRequired = product.needsCover && !hasCoverPhoto;
  3664.             return `
  3665.                 <li style=\"margin-bottom: 20px; position: relative;\">
  3666.                     \${coverRequired ? `<div style=\"position: absolute; top: 0; right: 0; background: #FFC107; color: #333; font-size: 10px; padding: 2px 6px; border-radius: 3px; z-index: 5;\">
  3667.                         <i class=\"bi bi-exclamation-triangle\"></i> Photo de couverture requise
  3668.                     </div>` : ''}
  3669.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  3670.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  3671.                         <div style=\"flex: 1;\">
  3672.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  3673.                             \${progressBar(count, total, product.color)}
  3674.                             \${
  3675.                                 remaining > 0
  3676.                                 ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  3677.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  3678.                                 </small>`
  3679.                                 : coverRequired
  3680.                                 ? `<button
  3681.                                     style=\"
  3682.                                         margin-top: 5px;
  3683.                                         padding: 6px 12px;
  3684.                                         background-color: #FFC107;
  3685.                                         color: #333;
  3686.                                         border: none;
  3687.                                         border-radius: 5px;
  3688.                                         font-size: 13px;
  3689.                                         cursor: pointer;
  3690.                                     \"
  3691.                                     onclick=\"\$('#tab-photos').click(); /* Rediriger vers l'onglet photos */\"
  3692.                                 >
  3693.                                     Choisir une couverture
  3694.                                 </button>`
  3695.                                 : `<button
  3696.                                     style=\"
  3697.                                         margin-top: 5px;
  3698.                                         padding: 6px 12px;
  3699.                                         background-color: \${product.color};
  3700.                                         color: white;
  3701.                                         border: none;
  3702.                                         border-radius: 5px;
  3703.                                         font-size: 13px;
  3704.                                         cursor: pointer;
  3705.                                     \"
  3706.                                     onclick=\"window.location.href='\${product.link}'\"
  3707.                                 >
  3708.                                     Commander
  3709.                                 </button>`
  3710.                             }
  3711.                         </div>
  3712.                     </div>
  3713.                 </li>
  3714.             `;
  3715.         })
  3716.         .join(\"\");
  3717.     const boutiqueButton = `
  3718.         <li style=\"margin-top: 25px; text-align: center;\">
  3719.             <button
  3720.                 style=\"
  3721.                     padding: 8px 15px;
  3722.                     background-color: #F56040;
  3723.                     color: white;
  3724.                     border: none;
  3725.                     border-radius: 5px;
  3726.                     font-size: 14px;
  3727.                     width: 170px;
  3728.                     height: 40px;
  3729.                     cursor: pointer;
  3730.                 \"
  3731.                 onclick=\"window.location.href='";
  3732.         // line 3417
  3733.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("boutique5sur5");
  3734.         yield "'\"
  3735.             >
  3736.                 Voir toute la boutique
  3737.             </button>
  3738.         </li>
  3739.     `;
  3740.     \$(\"#product-list\").html(productList + boutiqueButton);
  3741. }
  3742. });
  3743. </script>
  3744. ";
  3745.         
  3746.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  3747.         
  3748.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  3749.         yield from [];
  3750.     }
  3751.     /**
  3752.      * @codeCoverageIgnore
  3753.      */
  3754.     public function getTemplateName(): string
  3755.     {
  3756.         return "Parent/DetailsSejour.html.twig";
  3757.     }
  3758.     /**
  3759.      * @codeCoverageIgnore
  3760.      */
  3761.     public function isTraitable(): bool
  3762.     {
  3763.         return false;
  3764.     }
  3765.     /**
  3766.      * @codeCoverageIgnore
  3767.      */
  3768.     public function getDebugInfo(): array
  3769.     {
  3770.         return array (  4055 => 3417,  3970 => 3335,  3958 => 3326,  3470 => 2841,  3447 => 2821,  3431 => 2808,  3317 => 2697,  3309 => 2691,  3304 => 2688,  3302 => 2687,  3226 => 2613,  3223 => 2612,  3211 => 2602,  3208 => 2601,  3206 => 2600,  2901 => 2298,  2853 => 2253,  2757 => 2160,  2746 => 2152,  2735 => 2144,  2717 => 2129,  2101 => 1516,  2031 => 1449,  2020 => 1441,  1902 => 1326,  1860 => 1287,  1730 => 1160,  1669 => 1102,  1657 => 1093,  1407 => 847,  1394 => 846,  1380 => 843,  1370 => 836,  1365 => 834,  1356 => 828,  1349 => 823,  1347 => 822,  1343 => 820,  1306 => 785,  1303 => 784,  1289 => 783,  1283 => 779,  1279 => 777,  1275 => 775,  1269 => 774,  1265 => 772,  1258 => 768,  1254 => 766,  1252 => 765,  1245 => 761,  1239 => 757,  1236 => 756,  1232 => 755,  1225 => 750,  1223 => 749,  1221 => 748,  1217 => 746,  1211 => 745,  1207 => 743,  1200 => 739,  1196 => 737,  1194 => 736,  1187 => 732,  1181 => 728,  1178 => 727,  1174 => 726,  1171 => 725,  1169 => 724,  1167 => 723,  1163 => 721,  1157 => 720,  1153 => 718,  1146 => 714,  1142 => 712,  1140 => 711,  1133 => 707,  1127 => 703,  1124 => 702,  1120 => 701,  1117 => 700,  1115 => 699,  1113 => 698,  1107 => 695,  1102 => 692,  1100 => 691,  1095 => 688,  1087 => 685,  1083 => 684,  1077 => 682,  1075 => 681,  1067 => 676,  1059 => 671,  1056 => 670,  1054 => 669,  1049 => 666,  1042 => 662,  1036 => 660,  1034 => 659,  1018 => 645,  1015 => 644,  1011 => 643,  1003 => 637,  999 => 636,  994 => 634,  990 => 633,  986 => 632,  982 => 631,  978 => 630,  967 => 624,  963 => 623,  956 => 619,  953 => 618,  950 => 617,  946 => 616,  929 => 601,  923 => 600,  917 => 599,  915 => 598,  910 => 597,  898 => 587,  894 => 585,  873 => 568,  871 => 567,  864 => 562,  858 => 559,  855 => 558,  853 => 557,  850 => 556,  844 => 553,  841 => 552,  839 => 551,  836 => 550,  830 => 547,  827 => 546,  825 => 545,  814 => 536,  812 => 528,  798 => 516,  794 => 514,  773 => 497,  771 => 496,  748 => 478,  744 => 477,  741 => 476,  738 => 475,  735 => 474,  732 => 473,  729 => 472,  726 => 471,  708 => 470,  705 => 469,  703 => 468,  675 => 455,  669 => 451,  663 => 448,  659 => 446,  656 => 445,  650 => 442,  646 => 440,  643 => 439,  637 => 436,  633 => 434,  631 => 433,  626 => 430,  624 => 417,  620 => 415,  616 => 413,  613 => 405,  608 => 403,  604 => 402,  597 => 398,  593 => 397,  585 => 394,  582 => 393,  579 => 392,  576 => 391,  573 => 390,  556 => 389,  544 => 380,  535 => 376,  527 => 371,  522 => 369,  513 => 365,  478 => 333,  451 => 309,  420 => 281,  411 => 275,  407 => 274,  403 => 273,  395 => 268,  344 => 220,  321 => 199,  308 => 197,  112 => 12,  110 => 11,  106 => 10,  102 => 9,  98 => 8,  94 => 7,  90 => 6,  86 => 5,  80 => 2,  57 => 1,  55 => 197,  42 => 1,);
  3771.     }
  3772.     public function getSourceContext(): Source
  3773.     {
  3774.         return new Source("{% extends \"Parent/LayoutParent.html.twig\" %} {% block LinksCss %}
  3775. {{ parent() }}
  3776. <script src=\"https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.js\"></script>
  3777. <link rel=\"stylesheet\" href=\"{{ '/css/Parent/css/premiercnx.css' }}\" />
  3778. <link href=\"{{ asset('css/Parent/css/detailsejour.css') }}\" type=\"text/css\" rel=\"stylesheet\" />
  3779. <link rel=\"stylesheet\" href=\"{{ '/css/Accompagnateur/imgzoom.css' }}\" />
  3780. <link rel=\"stylesheet\" href=\"{{ asset('Plugins/css/dropzone.css') }}\" />
  3781. <link rel=\"stylesheet\" href=\"{{ asset('css/splide.min.css') }}\" />
  3782. <link rel=\"stylesheet\" href=\"{{ asset('css/favorites-sidebar.css') }}\" />
  3783. {% set destination = \"detailsejour\" %}
  3784. <style>
  3785. .btn-cmdFav {
  3786.   background-color: #F56040;
  3787.   color: white;
  3788.   padding: 10px 20px;
  3789.   border-radius: 6px;
  3790.   font-size: 1rem;
  3791.   box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  3792.   transition: all 0.3s ease;
  3793. }
  3794. .btn-cmdFav:hover {
  3795.   background-color: #e64a30;
  3796.   transform: scale(1.05);
  3797.   box-shadow: 0 6px 12px rgba(0,0,0,0.2);
  3798. }
  3799. .filter-badge {
  3800.   background-color: #ccc;
  3801.   color: white;
  3802.   font-size: 12px;
  3803.   padding: 2px 10px;
  3804.   border-radius: 20px;
  3805.   display: flex;
  3806.   align-items: center;
  3807.   cursor: pointer;
  3808.   transition: all 0.3s ease;
  3809. }
  3810. .filter-badge:hover {
  3811.   background-color: #aaa;
  3812. }
  3813. /* Quand le filtre est actif */
  3814. .filter-badge.active {
  3815.   background-color: #3BA39B; /* Vert plus vif */
  3816.   box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  3817.   font-weight: bold;
  3818.   color: white;
  3819. }
  3820.   .close-btn-purchase {
  3821.     position: absolute;
  3822.     padding: 2px;
  3823.     top: 10px;
  3824.     right: 10px;
  3825.     background: none;
  3826.     border: none;
  3827.     font-size: 35px;
  3828.     cursor: pointer;
  3829.   }
  3830.   .close-btn-purchase :hover {
  3831.     color: red;
  3832.   }
  3833.   .rowimag.no-margin {
  3834.     display: grid;
  3835.     grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  3836.     /* auto-fill + minmax ensures they fill the row and wrap automatically */
  3837.     gap: 8px; /* spacing between items, optional */
  3838.     margin: 0; /* override default margin if you want */
  3839.     padding: 0;
  3840.   }
  3841.   /* Each cell is 200px tall (or pick your own dimension). */
  3842.   .photo-item {
  3843.     width: 100%;
  3844.     height: 250px; /* fixed height: 200px */
  3845.     position: relative;
  3846.     overflow: hidden; /* hide any overflow if the image is bigger */
  3847.     border-radius: 4px; /* optional rounding corners */
  3848.     background: #f0f0f0; /* fallback background color while image loads */
  3849.     margin-bottom: 20px;
  3850.   }
  3851.   /* For images, we want them to fill the box and maintain a cover aspect. */
  3852.   .photo-item img,
  3853.   .photo-item video {
  3854.     width: 100%;
  3855.     height: 100%;
  3856.     object-fit: cover; /* ensures image or video is cropped rather than distorted */
  3857.     display: block;
  3858.   }
  3859.   .fav-button {
  3860.     pointer-events: none; /* Makes the entire button unclickable */
  3861.   }
  3862.   
  3863.   /* Enable hover effects only */
  3864.   .fav-button * {
  3865.     pointer-events: auto; /* Re-enable events for children */
  3866.     pointer-events: hover; /* Only allow hover events, not clicks */
  3867.   }
  3868.   
  3869.   /* Add this class to the purchase alert to ensure it remains interactive */
  3870.   #purchase-alert {
  3871.     pointer-events: auto;
  3872.   
  3873.   }
  3874.   /* Réduit l'espace autour du header */
  3875.   .header {
  3876.     padding: 15px 15px 5px 15px;
  3877.     background: #f9f9f9;
  3878.   }
  3879.   /* Réduit l'espace sous le titre et le sous-titre */
  3880.   .titreDetailSej {
  3881.     margin-bottom: 8px;
  3882.   }
  3883.   .media-counts {
  3884.     margin-bottom: 8px;
  3885.   }
  3886.   /* Centre la navigation des dates */
  3887.   .date-navigation {
  3888.     display: flex;
  3889.     align-items: center;
  3890.     justify-content: center;
  3891.     gap: 8px;
  3892.     width: 100%;
  3893.     margin-top: 0;
  3894.   }
  3895.   /* Centre le conteneur des cartes */
  3896.   .date-container {
  3897.     display: flex;
  3898.     justify-content: center;
  3899.     width: 100%;
  3900.   }
  3901.   .media-list-horizontal {
  3902.     gap: 4px;
  3903.     font-size: 11px;
  3904.     margin-top: 2px;
  3905.     display: flex;
  3906.     justify-content: center;
  3907.     list-style: none;
  3908.     margin-bottom: 0;
  3909.     padding-left: 0;
  3910.   }
  3911.   .sejour-title h1 {
  3912.     font-size: 1.5rem;
  3913.     font-weight: bold;
  3914.     color: #3BA39B;
  3915.     display: flex;
  3916.     align-items: center;
  3917.     gap: 10px;
  3918.   }
  3919.   .sejour-dates {
  3920.     font-size: 14px;
  3921.     color: #777;
  3922.     margin-top: 5px;
  3923.   }
  3924.   .sejour-medias {
  3925.     display: flex;
  3926.     gap: 20px;
  3927.     align-items: center;
  3928.     font-size: 14px;
  3929.     color: #555;
  3930.   }
  3931.   .media-info {
  3932.     display: flex;
  3933.     align-items: center;
  3934.     gap: 5px;
  3935.   }
  3936.   /* Responsive Mobile */
  3937.   @media (max-width: 768px) {
  3938.     .sejour-header {
  3939.       flex-direction: column;
  3940.       align-items: center;
  3941.       text-align: center;
  3942.     }
  3943.     .sejour-medias {
  3944.       margin-top: 10px;
  3945.       gap: 10px;
  3946.     }
  3947.   }
  3948. </style>
  3949. {% endblock %} {% set pageMenu = app.session.get('pageMenu') %} {% block Content
  3950. %}
  3951. <!-- Alerte pour inciter à acheter -->
  3952. <div id=\"purchase-alert\" class=\"purchase-alert hidden\" style=\"display: none;\">
  3953.   <button class=\"close-btn\" onclick=\"closePurchaseAlert()\">&times;</button>
  3954.   <div id=\"purchase-alert-content\">
  3955.     <!-- Le contenu de l'alerte sera mis à jour dynamiquement en fonction du nombre de favoris -->
  3956.   </div>
  3957. </div>
  3958. <div
  3959.   id=\"verifImg\"
  3960.   class=\"modal fade\"
  3961.   role=\"dialog\"
  3962.   style=\"background-color: rgba(112, 112, 112, 0.56); z-index: 1000000\"
  3963. >
  3964.   <div class=\"modal-dialog dialogUploadImg\">
  3965.     <div class=\"row modal-content no-margin contentdialogNoImg\">
  3966.       <div class=\"headerdialogUploadImg\">
  3967.         <h1 class=\"titledialogUploadImg\"></h1>
  3968.         <img
  3969.           src=\"{{ '/images/Accompagnateur/CroixFermeture.svg' }}\"
  3970.           class=\"closeNOUploadImg\"
  3971.           data-dismiss=\"modal\"
  3972.         />
  3973.       </div>
  3974.       <div class=\"ContenudetailsSejour\">
  3975.         <div class=\"row no-margin detailsSejour\">
  3976.           <div class=\"ContentUpload\">
  3977.             <h1 class=\"titleTelechargement\">
  3978.               Oulala, patience, avant tout sélectionnez vos photos préférées à
  3979.               l'aide de ce bouton
  3980.               <i
  3981.                 class=\"bi bi-heart\"
  3982.                 style=\"font-size: 1.3rem\"
  3983.                 title=\"Ajouter à  ma sélection\"
  3984.               ></i>
  3985.               sous les photos  <br /><br /><a style=\"color: #f09e7a\"
  3986.                 >Pensez à commander des tirages... pour leurs offrir un beau
  3987.                 souvenir !
  3988.               </a>
  3989.             </h1>
  3990.           </div>
  3991.         </div>
  3992.       </div>
  3993.       <div class=\"BottomNoUploadImg\">
  3994.         <button class=\"BtnUploadImg btnAnnulerUpload\" data-dismiss=\"modal\">
  3995.           OK
  3996.         </button>
  3997.       </div>
  3998.     </div>
  3999.   </div>
  4000. </div>
  4001. <div class=\"main-content\">
  4002.   <div class=\"row no-margin\">
  4003.     <!-- Chat button -->
  4004.     <div
  4005.       class=\"fav-button\"
  4006.       onmouseover=\"showSelection()\"
  4007.       onmouseout=\"hideSelection()\"
  4008.     >
  4009.       <i id=\"favoris-icon-Accueilpayment\" class=\"bi bi-heart-fill CoeurEclat\"></i
  4010.       ><label
  4011.         id=\"likeCount\"
  4012.         class=\"labelFavCount\"
  4013.         style=\"background-color: #f56040\"
  4014.       >
  4015.         {{ likes | length }}</label
  4016.       >
  4017.     </div>
  4018.     <div class=\"selection-popover\" id=\"selectionPopover\">
  4019.       <h4>Votre sélection</h4>
  4020.       <p>Tirages : {{ likes | length }} / 12</p>
  4021.       <p>Numériques : {{ likes | length }} / 15</p>
  4022.       <p>Album : {{ likes | length }} / 20</p>
  4023.       <button class=\"finalize-button\">Finaliser ma commande</button>
  4024.     </div>
  4025.   </div>
  4026.   <div class=\"divSliderModern\">
  4027.     <input type=\"hidden\" id=\"nbFavCurrent\" value=\"{{ nblikes }}\" />
  4028.     <div
  4029.       class=\"splide no-padding no-margin\"
  4030.       id=\"imageSlider\"
  4031.       style=\"max-height: 200px\"
  4032.     >
  4033.       <div class=\"splide__track\">
  4034.         <ul class=\"splide__list\">
  4035.           <!-- Slide 1 -->
  4036.           <li class=\"splide__slide\">
  4037.             <div class=\"slider-content\" style=\"background: white\">
  4038.               <div class=\"namePRD\" style=\"display: block\">
  4039.                 <h4
  4040.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  4041.                   style=\"color: #41a2aa\"
  4042.                 >
  4043.                   Ajoutez vos favoris dès maintenant
  4044.                 </h4>
  4045.                 <h4
  4046.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  4047.                   style=\"color: #f09e7a\"
  4048.                 >
  4049.                   et profitez de nos produits souvenirs personnalisés !
  4050.                 </h4>
  4051.               </div>
  4052.               <img
  4053.                 src=\"{{ asset('/images/imgSliderEmpty2.png') }}\"
  4054.                 class=\"imgslider\"
  4055.                 alt=\"Image 1\"
  4056.               />
  4057.             </div>
  4058.           </li>
  4059.           <!-- Slide 2 -->
  4060.           <li class=\"splide__slide\">
  4061.             <div class=\"slider-content\" style=\"background: white\">
  4062.               <div class=\"namePRD\" style=\"display: block\">
  4063.                 <h4
  4064.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  4065.                   style=\"color: #f09e7a\"
  4066.                 >
  4067.                   Pensez à commander le livre du séjour
  4068.                 </h4>
  4069.                 <h4
  4070.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  4071.                   style=\"color: #41a2aa\"
  4072.                 >
  4073.                   et offrez lui le plus beau des cadeaux !
  4074.                 </h4>
  4075.               </div>
  4076.               <img
  4077.                 src=\"{{ asset('/images/imgSliderEmpty1.png') }}\"
  4078.                 class=\"imgslider\"
  4079.                 alt=\"Image 2\"
  4080.               />
  4081.             </div>
  4082.           </li>
  4083.         </ul>
  4084.       </div>
  4085.     </div>
  4086.   </div>
  4087.   <!-- Section de contenu à atteindre après le scroll -->
  4088.   <div
  4089.     class=\"no-margin\"
  4090.     id=\"scrollTarget\"
  4091.     style=\"width: 100%; background: #f9f9f9; padding-top: 30px\"
  4092.   >
  4093.     <div class=\"no-margin\" id=\"scrollTarget\" style=\"width: 100%\">
  4094.       <!-- Conteneur principal en ligne -->
  4095.       <div
  4096.         class=\"header d-flex align-items-center justify-content-between\"
  4097.         style=\"padding: 15px;\"
  4098.       >
  4099.         <!-- Bloc titre -->
  4100.         <div class=\"box divInfosSejour\" style=\"width: 95%;\">
  4101.           <img
  4102.             class=\"imageTitreSej\"
  4103.             src=\"/Accueil/imagesAccueil/sejour.png\"
  4104.             alt=\"Icône séjour\"
  4105.             style=\"width: 40px; height: auto\"
  4106.           />
  4107.           <h1 class=\"titreDetailSej\">
  4108.             Séjour {{sejour.codeSejour}} {{ sejour.themSejour }}
  4109.             <span class=\"spnTitleSej\">
  4110.               du
  4111.               {{ sejour.dateDebutSejour|date(\"d M Y\")|replace({\"Jan\": \"janv.\", \"Feb\": \"fév.\", \"Mar\": \"mars\", \"Apr\": \"avr.\", \"May\": \"mai\", \"Jun\": \"juin\", \"Jul\": \"juil.\", \"Aug\": \"août\", \"Sep\": \"sept.\", \"Oct.\": \"oct.\", \"Nov.\": \"nov.\", \"Dec.\": \"déc.\"}) }}
  4112.               au
  4113.               {{ sejour.dateFinSejour|date(\"d M Y\")|replace({\"Jan\": \"janv.\", \"Feb\": \"fév.\", \"Mar\": \"mars\", \"Apr\": \"avr.\", \"May\": \"mai\", \"Jun\": \"juin\", \"Jul\": \"juil.\", \"Aug\": \"août\", \"Sep\": \"sept.\", \"Oct.\": \"oct.\", \"Nov.\": \"nov.\", \"Dec.\": \"déc.\"}) }}
  4114.             </span>
  4115.           </h1>
  4116.           <span class=\"spnTitleSej\" style=\"color:black\">
  4117.         
  4118.             (📷 {{ attachementsCount }} Photos/Vidéos | 🎵 {{ nbmessages }} Audios  ❤️  <label
  4119.         id=\"mesFavCount\" style=\"color:black;margin-right:5px\"
  4120.       
  4121.     >
  4122.     {{ nblikes }}   </label> Favoris )
  4123.   
  4124.           </span>
  4125.           <div class=\"date-navigation\">
  4126.           
  4127.      
  4128.             <div class=\"date-container\">
  4129.               {% for x, groupAttach in listeattach %}
  4130.                 {% set xDate = date(x) %}
  4131.                 {% set finDate = date(sejour.dateFinSejour) %}
  4132.                 {% if xDate <= finDate %}
  4133.                   <div
  4134.                     class=\"date-card modern-card {% if loop.last and xDate <= finDate %} active {% endif %}\"
  4135.                     data-aos=\"fade-up\"
  4136.                     data-bs-toggle=\"collapse\"
  4137.                     data-bs-target=\"#demP{{ loop.index }}\"
  4138.                     id=\"iconedemoP{{ loop.index }}\"
  4139.                   >
  4140.                     <div class=\"card-content text-center\">
  4141.                       <span class=\"day\">
  4142.                         {% if groupAttach.isFirstDay == \"yes\" %} Premier jour
  4143.                         {% elseif groupAttach.isLastDay == \"yes\" %} Dernier jour
  4144.                         {% else %}
  4145.                           {{ xDate|date(\"D\")|replace({
  4146.                             \"Mon\": \"lun.\",
  4147.                             \"Tue\": \"mar.\",
  4148.                             \"Wed\": \"mer.\",
  4149.                             \"Thu\": \"jeu.\",
  4150.                             \"Fri\": \"ven.\",
  4151.                             \"Sat\": \"sam.\",
  4152.                             \"Sun\": \"dim.\"
  4153.                           }) }}
  4154.                         {% endif %}
  4155.                       </span>
  4156.                       <span class=\"full-date\">
  4157.                         {{ xDate|date(\"d M Y\")|replace({
  4158.                           \"Jan\": \"janv.\",
  4159.                           \"Feb\": \"fév.\",
  4160.                           \"Mar\": \"mars\",
  4161.                           \"Apr\": \"avr.\",
  4162.                           \"May\": \"mai\",
  4163.                           \"Jun\": \"juin\",
  4164.                           \"Jul\": \"juil.\",
  4165.                           \"Aug\": \"août\",
  4166.                           \"Sep\": \"sept.\",
  4167.                           \"Oct.\": \"oct.\",
  4168.                           \"Nov.\": \"nov.\",
  4169.                           \"Dec.\": \"déc.\"
  4170.                         }) }}
  4171.                       </span>
  4172.                       <ul class=\"media-list-horizontal\">
  4173.                         {% if groupAttach.countPhotos > 0 %}
  4174.                         <li>
  4175.                           <i class=\"bi bi-images\" style=\"color: #f56040; font-size: 0.7rem; margin-right: 3px\"></i>
  4176.                           {{ groupAttach.countPhotos }}
  4177.                         </li>
  4178.                         {% endif %}
  4179.                         {% if groupAttach.countAudio > 0 %}
  4180.                         <li>
  4181.                           <i class=\"bi bi-mic-fill\" style=\"color: #ffa500; font-size: 0.7rem; margin-right: 5px\"></i>
  4182.                           {{ groupAttach.countAudio }}
  4183.                         </li>
  4184.                         {% endif %}
  4185.                         {% if groupAttach.countVideos > 0 %}
  4186.                         <li>
  4187.                           <i class=\"bi bi-camera-video-fill\" style=\"color: #41a2aa; font-size: 0.7rem; margin-right: 5px\"></i>
  4188.                           {{ groupAttach.countVideos }}
  4189.                         </li>
  4190.                         {% endif %}
  4191.                       </ul>
  4192.                     </div>
  4193.                   </div>
  4194.                 {% endif %}
  4195.               {% endfor %} <div id=\"dynamic-card\" class=\"dynamic-card\">
  4196.       <div id=\"dynamic-card-content\" class=\"dynamic-card-content\">
  4197.         <!-- Le contenu dynamique (album, pochette, montage vidéo) sera injecté ici -->
  4198.       </div>
  4199.     </div>
  4200.             </div>
  4201.           </div>
  4202.         </div>
  4203.       </div>
  4204.     </div>
  4205.     <!-- Descriptions and Attachments -->
  4206.     <div class=\"container--gallery modern\">
  4207.       {% set lastValidIndex = 0 %}
  4208.       {% set hasAttachments = false %}
  4209.       {% for x, groupAttach in listeattach %}
  4210.       {% set xDate = date(x) %}
  4211.       {% set finDate = date(sejour.dateFinSejour) %}
  4212.       {% if xDate <= finDate %}
  4213.       {% set lastValidIndex = loop.index %}
  4214.       {% set hasAttachments = true %}
  4215.       <div
  4216.         id=\"demP{{ loop.index }}\"
  4217.         class=\"collapse {% if loop.last and xDate <= finDate %}show{% endif %}\"
  4218.         style=\"padding: 2%; padding-top: 0%\"
  4219.       >
  4220.         <div class=\"journal-entry\">
  4221.         <div class=\"entry-header\" style=\"
  4222.     display: flex;
  4223.     align-items: center;
  4224.     justify-content: space-between;
  4225.     background: #ffffff;
  4226.     padding: 8px 15px;
  4227.     border-radius: 10px;
  4228.     margin-bottom: 20px;
  4229.     box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  4230.     border-bottom: 1px solid #eee;
  4231.     flex-wrap: wrap;
  4232. \">
  4233.   <!-- Bouton Jour Précédent -->
  4234.   {% if not loop.first %}
  4235.   <button class=\"btn-prev-day\" data-target=\"{{ loop.index0 - 1 }}\" style=\"
  4236.       background-color: #3BA39B;
  4237.       border: none;
  4238.       padding: 5px 10px;
  4239.       border-radius: 8px;
  4240.       font-weight: bold;
  4241.       font-size: 14px;
  4242.       height: 36px;
  4243.       display: flex;
  4244.       align-items: center;
  4245.       color: white;
  4246.       cursor: pointer;
  4247.       transition: all 0.3s ease;
  4248.   \">
  4249.     <i class=\"bi bi-chevron-left\" style=\"font-size: 18px;\"></i>
  4250.   </button>
  4251.   {% else %}
  4252.   <div style=\"width: 36px;\"></div>
  4253.   {% endif %}
  4254.   <!-- Centre : Date + Médias -->
  4255.   <div style=\"
  4256.       flex-grow: 1;
  4257.       display: flex;
  4258.       align-items: center;
  4259.       justify-content: center;
  4260.       flex-wrap: wrap;
  4261.       gap: 12px;
  4262.   \">
  4263.     <!-- Date -->
  4264.     <div style=\"font-weight: bold; font-size: 16px; color: #333;\">
  4265.       {{ x|date(\"l d F Y\")|replace({
  4266.           \"Monday\": \"Lundi\", \"Tuesday\": \"Mardi\", \"Wednesday\": \"Mercredi\",
  4267.           \"Thursday\": \"Jeudi\", \"Friday\": \"Vendredi\", \"Saturday\": \"Samedi\",
  4268.           \"Sunday\": \"Dimanche\",
  4269.           \"January\": \"Janvier\", \"February\": \"Février\", \"March\": \"Mars\",
  4270.           \"April\": \"Avril\", \"May\": \"Mai\", \"June\": \"Juin\",
  4271.           \"July\": \"Juillet\", \"August\": \"Août\", \"September\": \"Septembre\",
  4272.           \"October\": \"Octobre\", \"November\": \"Novembre\", \"December\": \"Décembre\"
  4273.       }) }}
  4274.     </div>
  4275.   <!-- Filtres Médias -->
  4276. <div class=\"filter-icons\" style=\"display: flex; gap: 8px; flex-wrap: wrap;\">
  4277.     <span class=\"filter-badge active\" data-filter=\"all\" title=\"Afficher tout\">
  4278.         <i class=\"bi bi-grid-3x3-gap-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> Tout
  4279.     </span>
  4280.     {% if groupAttach.countPhotos > 0 %}
  4281.     <span class=\"filter-badge\" data-filter=\"photo\" title=\"Filtrer les photos\">
  4282.         <i class=\"bi bi-image\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countPhotos }}
  4283.     </span>
  4284.     {% endif %}
  4285.     {% if groupAttach.countVideos > 0 %}
  4286.     <span class=\"filter-badge\" data-filter=\"video\" title=\"Filtrer les vidéos\">
  4287.         <i class=\"bi bi-camera-video-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countVideos }}
  4288.     </span>
  4289.     {% endif %}
  4290.     {% if groupAttach.countAudio > 0 %}
  4291.     <span class=\"filter-badge\" data-filter=\"audio\" title=\"Filtrer les messages audio\">
  4292.         <i class=\"bi bi-mic-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countAudio }}
  4293.     </span>
  4294.     {% endif %}
  4295. </div>
  4296.   </div>
  4297.   <!-- Bouton Jour Suivant -->
  4298.   {% if not loop.last %}
  4299.   <button class=\"btn-next-day\" data-target=\"{{ loop.index0 + 1 }}\" style=\"
  4300.       background-color: #3BA39B;
  4301.       border: none;
  4302.       padding: 5px 10px;
  4303.       border-radius: 8px;
  4304.       font-weight: bold;
  4305.       font-size: 14px;
  4306.       height: 36px;
  4307.       display: flex;
  4308.       align-items: center;
  4309.       color: white;
  4310.       cursor: pointer;
  4311.       transition: all 0.3s ease;
  4312.   \">
  4313.     <i class=\"bi bi-chevron-right\" style=\"font-size: 18px;\"></i>
  4314.   </button>
  4315.   {% else %}
  4316.   <div style=\"width: 36px;\"></div>
  4317.   {% endif %}
  4318.    
  4319.    
  4320.         </div>
  4321.         <!-- Contenu -->
  4322.         <div class=\"entry-content\" id=\"TourContent\">
  4323.       
  4324.           <p class=\"description\" style=\"margin-left:2%;width:95%;margin-top:1%;margin-bottom:1%;text-align:left\">
  4325.             {% for description in sejour.jourdescripdate %} {% if
  4326.             description.datejourphoto|date(\"m/d/Y\") == x|date(\"m/d/Y\") %}
  4327.             {{ description.description | nl2br }}
  4328.             {% endif %} {% endfor %}
  4329.           </p>
  4330.  
  4331.           <!-- Conteneur des photos et vidéos -->
  4332.           <div
  4333.             class=\"rowimag no-margin\"
  4334.             style=\"
  4335.               width: 100%;
  4336.               display: flex;
  4337.               flex-wrap: wrap;
  4338.               margin: 0;
  4339.               box-sizing: border-box;
  4340.             \"
  4341.           >
  4342.             <!-- Afficher les Photos et Vidéos -->
  4343.             {% for attach in groupAttach.attachments %}
  4344.               {% if attach.libiller == 'photo' %}
  4345.            
  4346.             <div class=\"column\" data-type=\"{{ attach.libiller }}\">
  4347.             
  4348.               <div class=\"photo-zoom photo-item\">
  4349.          
  4350.                 <a href=\"{{ attach.path }}\">
  4351.                   <img src=\"{{ attach.path }}\" alt=\"{{ attach.descreption }}\" />
  4352.                 </a>
  4353.                 <!-- Icône du cœur avec logique existante -->
  4354.                 <div
  4355.                   class=\"heart-icon\"
  4356.                   id=\"coeur{{ attach.id_attchment }}\"
  4357.                   data-id=\"{{ attach.id_attchment }}\"
  4358.                   data-sejour-id=\"{{ sejour.id }}\"
  4359.                   data-path=\"{{ attach.path }}\"
  4360.                   data-description=\"{{ attach.descreption }}\"
  4361.                 >
  4362.                   {% if app.user %} {% if attach.is_favorite %}
  4363.                   <i
  4364.                     class=\"bi bi-heart-fill\"
  4365.                     title=\"Sélectionnée\"
  4366.                     style=\"color: #f56040\"
  4367.                   ></i>
  4368.                   {% else %}
  4369.                   <i class=\"bi bi-heart\" title=\"Ajouter à ma sélection\"></i>
  4370.                   {% endif %} {% endif %}
  4371.                 </div>
  4372.                 <div class=\"photo-actions\" style=\"display: none\">
  4373.                   <button class=\"menu-btn\">⋮</button>
  4374.                   <div class=\"menu-options\">
  4375.                     <button onclick=\"addToPack('tirage')\">
  4376.                       🖨️ Ajouter au tirage
  4377.                     </button>
  4378.                     <button onclick=\"addToPack('numerique')\">
  4379.                       💾 Ajouter au numérique
  4380.                     </button>
  4381.                   </div>
  4382.                 </div>
  4383.               
  4384.               </div>
  4385.               {% if attach.descreption != \"\" %}
  4386.               <h4 class=\"description\">{{ attach.descreption }}</h4>
  4387.               {% endif %}
  4388.             </div>
  4389.             {% endif %} 
  4390.              {% if attach.libiller == 'video' %}
  4391.            
  4392.             <div class=\"column\" data-type=\"{{ attach.libiller }}\">
  4393.                  
  4394.             
  4395.                  <div class=\"video-container\" style=\"position: relative; display: inline-block; width: 100%; border-radius: 8px; overflow: hidden;\">
  4396.                         <video class=\"photo-zoom\" controls controlslist=\"nodownload noplaybackrate\" style=\"width: 100%;\">
  4397.                           <source src=\"{{ attach.path }}\" type=\"video/mp4\" />
  4398.                           Votre navigateur ne supporte pas la lecture vidéo.
  4399.                         </video>
  4400.                       
  4401.                       </div>
  4402.               {% if attach.descreption != \"\" %}
  4403.               <h4 class=\"description\">{{ attach.descreption }}</h4>
  4404.               {% endif %}
  4405.             </div>
  4406.             {% endif %} 
  4407.             
  4408.             {% endfor %}
  4409.           </div>
  4410.           <!-- Section séparée pour les messages audio -->
  4411.           {% if groupAttach.countAudio > 0 %}
  4412.           <div class=\"audio-messages-section\" style=\"margin-top:15px; border-top: 1px solid #eee; padding: 30px;\">
  4413.             <h4 style=\"margin-bottom: 15px; color: #555\">
  4414.               <i class=\"bi bi-mic-fill\" style=\"margin-right: 8px; color: #ffa500\"></i>
  4415.               Messages vocaux ({{ groupAttach.countAudio }})
  4416.             </h4>
  4417.             
  4418.             {% if sejour.codeSejour|slice(0, 2) == 'PF' %}
  4419.               {# Les séjours commençant par PF ont toujours accès #}
  4420.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  4421.                 {% for attach in groupAttach.attachments %}
  4422.                   {% if attach.libiller == 'message' %}
  4423.                     <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  4424.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4425.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4426.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  4427.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4428.                           Votre navigateur ne supporte pas la lecture audio.
  4429.                         </audio>
  4430.                       </div>
  4431.                       {% if attach.descreption != \"\" %}
  4432.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4433.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4434.                             {{ attach.descreption }}
  4435.                           </p>
  4436.                         </div>
  4437.                       {% endif %}
  4438.                     </div>
  4439.                   {% endif %}
  4440.                 {% endfor %}
  4441.               </div>
  4442.             
  4443.             {% elseif sejour.codeSejour|slice(0, 2) == 'PP' and parentsejour.payment  == 1 or sejour.codeSejour|slice(0, 2) == 'EF' and parentsejour.payment  == 1 %}
  4444.               {# PP ou EF avec paiement effectué #}
  4445.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  4446.                 {% for attach in groupAttach.attachments %}
  4447.                   {% if attach.libiller == 'message' %}
  4448.                     <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  4449.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4450.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4451.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  4452.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4453.                           Votre navigateur ne supporte pas la lecture audio.
  4454.                         </audio>
  4455.                       </div>
  4456.                       {% if attach.descreption != \"\" %}
  4457.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4458.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4459.                             {{ attach.descreption }}
  4460.                           </p>
  4461.                         </div>
  4462.                       {% endif %}
  4463.                     </div>
  4464.                   {% endif %}
  4465.                 {% endfor %}
  4466.               </div>
  4467.             
  4468.             {% elseif sejour.codeSejour|slice(0, 2) == 'PP' and parentsejour.payment == 0 or sejour.codeSejour|slice(0, 2) == 'EF' and parentsejour.payment == 0 %}
  4469.               {# PP ou EF sans paiement - message d'accès limité et audio désactivés #}
  4470.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px; opacity: 0.5; pointer-events: none; filter: grayscale(100%);\">
  4471.                 <div class=\"audio-messages-restricted\" style=\"padding: 20px; background: #f0f0f0; border-radius: 8px; text-align: center; margin-bottom: 15px; width: 100%;\">
  4472.                   <i class=\"bi bi-lock-fill\" style=\"font-size: 24px; color: #808080; margin-bottom: 10px;\"></i>
  4473.                   <p style=\"margin: 0; color: #555;\">Pour accéder aux messages vocaux, veuillez effectuer le paiement de votre séjour.</p>
  4474.                 </div>
  4475.                 {% for attach in groupAttach.attachments %}
  4476.                   {% if attach.libiller == 'message' %}
  4477.                     <div class=\"audio-message-item\" style=\"background: #f9f9f9; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; width: calc(33.33% - 10px); min-width: 250px; flex-grow: 1;\">
  4478.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4479.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4480.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\" disabled>
  4481.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4482.                           Votre navigateur ne supporte pas la lecture audio.
  4483.                         </audio>
  4484.                       </div>
  4485.                       {% if attach.descreption != \"\" %}
  4486.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4487.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4488.                             {{ attach.descreption }}
  4489.                           </p>
  4490.                         </div>
  4491.                       {% endif %}
  4492.                     </div>
  4493.                   {% endif %}
  4494.                 {% endfor %}
  4495.               </div>
  4496.             {% endif %}
  4497.           </div>
  4498.         {% endif %}
  4499.         </div>
  4500.       </div>
  4501.     </div>
  4502.     {% endif %}
  4503.     {% endfor %}
  4504.     {% if not hasAttachments %}
  4505.     <div class=\"welcome-message\" style=\"padding: 50px 20px; text-align: center; background: #f9f9f9; border-radius: 15px; margin: 30px auto; max-width: 800px; box-shadow: 0 5px 15px rgba(0,0,0,0.05);\">
  4506.       <img src=\"/images/welcome-icon.svg\" alt=\"Bienvenue\" style=\"width: 80px; margin-bottom: 20px;\" onerror=\"this.src='/images/Accompagnateur/Picto5sur5.svg'; this.style.width='120px';\">
  4507.       
  4508.       <h2 style=\"color: #41a2aa; margin-bottom: 20px; font-size: 24px;\">Bienvenue sur votre espace séjour !</h2>
  4509.       
  4510.       <p style=\"font-size: 18px; color: #555; margin-bottom: 15px;\">
  4511.         Aucun contenu n'a encore été partagé pour ce séjour.
  4512.       </p>
  4513.       
  4514.       <p style=\"font-size: 16px; color: #666; margin-bottom: 25px;\">
  4515.         L'accompagnateur partagera bientôt des photos, vidéos et messages vocaux.
  4516.         <br>Revenez consulter cette page régulièrement pour suivre les aventures du séjour !
  4517.       </p>
  4518.       
  4519.       <div style=\"display: flex; justify-content: center; gap: 15px; flex-wrap: wrap;\">
  4520.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  4521.           <i class=\"bi bi-images\" style=\"font-size: 24px; color: #f56040; margin-right: 10px;\"></i>
  4522.           <span>Photos du séjour</span>
  4523.         </div>
  4524.         
  4525.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  4526.           <i class=\"bi bi-camera-video-fill\" style=\"font-size: 24px; color: #41a2aa; margin-right: 10px;\"></i>
  4527.           <span>Vidéos des activités</span>
  4528.         </div>
  4529.         
  4530.         <div style=\"display: flex; align-items: center; background: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);\">
  4531.           <i class=\"bi bi-mic-fill\" style=\"font-size: 24px; color: #ffa500; margin-right: 10px;\"></i>
  4532.           <span>Messages vocaux</span>
  4533.         </div>
  4534.       </div>
  4535.     </div>
  4536.     
  4537.     <!-- Espace supplémentaire pour déplacer le footer vers le bas -->
  4538.     <div style=\"height: 300px;\"></div>
  4539.     {% endif %}
  4540.     
  4541.     <!-- Make sure we're showing the right content by default if no valid content is marked 'show' -->
  4542.     {% if lastValidIndex > 0 %}
  4543.     <script>
  4544.       document.addEventListener('DOMContentLoaded', function() {
  4545.         // Check if no content is showing
  4546.         if (document.querySelectorAll('.container--gallery .collapse.show').length === 0) {
  4547.           // Show the content for the last valid date
  4548.           var lastValidContent = document.getElementById('demP{{ lastValidIndex }}');
  4549.           if (lastValidContent) {
  4550.             lastValidContent.classList.add('show');
  4551.             
  4552.             // Also mark the corresponding date card as active
  4553.             var dateCards = document.querySelectorAll('.date-card');
  4554.             if (dateCards.length >= {{ lastValidIndex }}) {
  4555.               dateCards.forEach(card => card.classList.remove('active'));
  4556.               dateCards[{{ lastValidIndex - 1 }}].classList.add('active');
  4557.             }
  4558.           }
  4559.         }
  4560.       });
  4561.     </script>
  4562.     {% endif %}
  4563.   </div>
  4564. </div>
  4565.   {% endblock %} {% block Javascript %}
  4566.   {{ parent() }}
  4567.   <script>// Gestion de la sidebar des favoris
  4568. document.addEventListener('DOMContentLoaded', function() {
  4569.     const sidebar = document.getElementById('favorites-sidebar');
  4570.     const openBtn = document.getElementById('openFavoritesSidebar');
  4571.     const closeBtn = document.querySelector('.favorites-close');
  4572.     const favButton = document.querySelector('.fav-button');
  4573.     function openSidebar() {
  4574.         sidebar.classList.add('active');
  4575.         updateFavoritesSidebar();
  4576.     }
  4577.     function closeSidebar() {
  4578.         sidebar.classList.remove('active');
  4579.     }
  4580.     function updateFavoritesSidebar() {
  4581.         const grid = document.getElementById('favorites-grid');
  4582.         const counter = document.getElementById('favorites-counter');
  4583.         const emptyState = document.getElementById('favorites-empty-state');
  4584.         const progress = document.getElementById('favorites-progress');
  4585.         
  4586.         const count = parseInt(document.getElementById('likeCount').textContent);
  4587.         counter.textContent = count +1;
  4588.         
  4589.         if (count === 0) {
  4590.             emptyState.style.display = 'flex';
  4591.             grid.style.display = 'none';
  4592.         } else {
  4593.             emptyState.style.display = 'none';
  4594.             grid.style.display = 'grid';
  4595.             const percentage = (count / 20) * 100;
  4596.             progress.style.width = `\${percentage}%`;
  4597.         }
  4598.     }
  4599.     if (openBtn) {
  4600.         openBtn.addEventListener('click', openSidebar);
  4601.     }
  4602.     if (favButton) {
  4603.         favButton.addEventListener('click', openSidebar);
  4604.     }
  4605.     if (closeBtn) {
  4606.         closeBtn.addEventListener('click', closeSidebar);
  4607.     }
  4608.     document.addEventListener('click', (e) => {
  4609.         if (sidebar.classList.contains('active') && 
  4610.             !sidebar.contains(e.target) && 
  4611.             !favButton.contains(e.target) && 
  4612.             !openBtn.contains(e.target)) {
  4613.             closeSidebar();
  4614.         }
  4615.     });
  4616. });
  4617. // Modification des fonctions existantes
  4618. const originalAddFavoris = window.AddFavoris;
  4619. window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  4620.     if (originalAddFavoris) {
  4621.         originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  4622.     }
  4623.     
  4624.     // Vérifier si la sidebar est ouverte - noter que nous vérifions la valeur CSS right: 0
  4625.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4626.         // Recharger les favoris
  4627.         loadFavorites();
  4628.     }
  4629. };
  4630. const originalSupprimerFavoris = window.supprimerFavoris;
  4631. window.supprimerFavoris = function(\$id, \$idSejour) {
  4632.     if (originalSupprimerFavoris) {
  4633.         originalSupprimerFavoris(\$id, \$idSejour);
  4634.     }
  4635.     
  4636.     // Vérifier si la sidebar est ouverte
  4637.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4638.         // Recharger les favoris
  4639.         loadFavorites();
  4640.     }
  4641. };
  4642. // Variables globales
  4643. let selectedFavorites = [];
  4644. let allFavorites = [];
  4645. // Fonction pour mettre à jour la sidebar
  4646. function loadFavorites() {
  4647.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  4648.     
  4649.     \$.ajax({
  4650.         url: \"/Parent/mes-favoris\",
  4651.         type: \"GET\",
  4652.         dataType: \"json\",
  4653.         success: function(data) {
  4654.             \$(\"#favorites-grid\").empty();
  4655.             allFavorites = data.data || [];
  4656.             
  4657.             if (allFavorites.length > 0) {
  4658.                 \$(\"#favorites-empty-state\").hide();
  4659.                 
  4660.                 \$.each(allFavorites, function(i, fav) {
  4661.                     var isSelected = selectedFavorites.includes(fav.id);
  4662.                     
  4663.                     var item = \$(\"<div class='favorite-item' style='position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;'></div>\");
  4664.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  4665.                     
  4666.                     // Overlay de sélection
  4667.                     var selectionOverlay = \$(\"<div class='selection-overlay' style='position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;'></div>\");
  4668.                     
  4669.                     // Icône de sélection
  4670.                     var checkIcon = \$(\"<div style='width:25px;height:25px;border-radius:50%;border:2px solid white;display:flex;align-items:center;justify-content:center;background:\" + (isSelected ? \"#F56040\" : \"transparent\") + \";transition:background 0.2s;'></div>\");
  4671.                     if (isSelected) {
  4672.                         checkIcon.append(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4673.                     }
  4674.                     
  4675.                     selectionOverlay.append(checkIcon);
  4676.                     
  4677.                     // Overlay d'action (bouton supprimer)
  4678.                     var actionOverlay = \$(\"<div class='action-overlay' style='position:absolute;top:5px;right:5px;opacity:0;transition:opacity 0.2s;'></div>\");
  4679.                   
  4680.                     actionOverlay.append(deleteBtn);
  4681.                     
  4682.                     // Ajouter les événements
  4683.                     item.hover(
  4684.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"1\"); },
  4685.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"0\"); }
  4686.                     );
  4687.                     
  4688.                     item.click(function() {
  4689.                         toggleSelection(fav.id, \$(this).find(\".selection-overlay > div\"));
  4690.                     });
  4691.                     
  4692.                     item.append(img).append(selectionOverlay).append(actionOverlay);
  4693.                     \$(\"#favorites-grid\").append(item);
  4694.                 });
  4695.                 
  4696.                 \$(\"#favorites-counter\").text(allFavorites.length);
  4697.                 
  4698.                 // Mettre à jour le compteur sur le bouton également
  4699.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  4700.                 
  4701.                 // Mettre à jour l'interface produits
  4702.                 updateProductsView();
  4703.                 
  4704.             } else {
  4705.                 \$(\"#favorites-empty-state\").show();
  4706.                 \$(\"#favorites-counter\").text(\"0\");
  4707.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  4708.                 \$(\"#selection-count\").text(\"0\");
  4709.                 updateProductsView();
  4710.             }
  4711.         },
  4712.         error: function() {
  4713.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  4714.         }
  4715.     });
  4716. }
  4717. // Fonction pour supprimer un favori
  4718. function removeFavorite(id) {
  4719.     \$.ajax({
  4720.         url: \"/Parent/remove-favorite/\" + id,
  4721.         type: \"POST\",
  4722.         success: function() {
  4723.             // Retirer de la sélection si présent
  4724.             selectedFavorites = selectedFavorites.filter(favId => favId != id);
  4725.             
  4726.             // Mettre à jour le compteur de sélection
  4727.             \$(\"#selection-count\").text(selectedFavorites.length);
  4728.             
  4729.             // Recharger les favoris
  4730.             loadFavorites();
  4731.             
  4732.             // Mettre à jour les compteurs globaux
  4733.             var count = parseInt(\$(\"#likeCount\").text());
  4734.             if (!isNaN(count)) {
  4735.                 \$(\"#likeCount\").text(count - 1);
  4736.             }
  4737.             
  4738.             var countFav = parseInt(\$(\"#mesFavCount\").text());
  4739.             if (!isNaN(countFav)) {
  4740.                 \$(\"#mesFavCount\").text(countFav - 1);
  4741.             }
  4742.             
  4743.             // Mettre à jour l'interface produits
  4744.             updateProductsView();
  4745.         },
  4746.         error: function() {
  4747.             alert(\"Erreur lors de la suppression du favori\");
  4748.         }
  4749.     });
  4750. }
  4751. // Fonction pour basculer la sélection d'une photo
  4752. function toggleSelection(id, checkElement) {
  4753.     const index = selectedFavorites.indexOf(id);
  4754.     
  4755.     if (index === -1) {
  4756.         // Ajouter à la sélection
  4757.         selectedFavorites.push(id);
  4758.         checkElement.css(\"background\", \"#F56040\");
  4759.         checkElement.html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4760.     } else {
  4761.         // Retirer de la sélection
  4762.         selectedFavorites.splice(index, 1);
  4763.         checkElement.css(\"background\", \"transparent\");
  4764.         checkElement.html(\"\");
  4765.     }
  4766.     
  4767.     // Mettre à jour le compteur
  4768.     \$(\"#selection-count\").text(selectedFavorites.length);
  4769.     
  4770.     // Mettre à jour l'interface produits
  4771.     updateProductsView();
  4772. }
  4773. // Fonction pour mettre à jour la vue des produits
  4774. function updateProductsView() {
  4775.     const current = selectedFavorites.length;
  4776.     \$(\"#product-photo-count\").text(current);
  4777.     
  4778.     let remainingForAlbum = Math.max(0, 20 - current);
  4779.     let remainingForPochette = Math.max(0, 12 - current);
  4780.     let remainingForPack = Math.max(0, 12 - current);
  4781.     const progressBar = (count, total, color) => `
  4782.         <div style=\"margin: 5px 0;\">
  4783.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  4784.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  4785.             </div>
  4786.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  4787.         </div>
  4788.     `;
  4789.     // Liste des produits
  4790.     const products = [
  4791.         {
  4792.             name: \"Pack numérique (20 photos)\",
  4793.             required: 20,
  4794.             remaining: Math.max(0, 20 - current),
  4795.             image: \"/images/produit/photoNumerique.jpg\",
  4796.             color: \"#4caf50\",
  4797.             link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr':20}) }}\",
  4798.         },
  4799.        +
  4800.         {
  4801.             name: \"Pochette photo (12 photos)\",
  4802.             required: 12,
  4803.             remaining: Math.max(0, 12 - current),
  4804.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  4805.             color: \"#2196f3\",
  4806.             link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  4807.         },
  4808.     ].sort((a, b) => a.remaining - b.remaining);
  4809.     const productList = products
  4810.         .map((product) => {
  4811.             const count = current;
  4812.             const total = product.required;
  4813.             const remaining = product.remaining;
  4814.             return `
  4815.                 <li style=\"margin-bottom: 20px;\">
  4816.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  4817.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  4818.                         <div style=\"flex: 1;\">
  4819.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  4820.                             \${progressBar(count, total, product.color)}
  4821.                             \${
  4822.                                 `<small style=\"color: \${product.color}; font-size: 12px;\">
  4823.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  4824.                                 </small>
  4825.                                 <button
  4826.                                     style=\"
  4827.                                         margin-top: 5px;
  4828.                                         padding: 6px 12px;
  4829.                                         background-color: \${product.color};
  4830.                                         color: white;
  4831.                                         border: none;
  4832.                                         border-radius: 5px;
  4833.                                         font-size: 13px;
  4834.                                         cursor: pointer;
  4835.                                     \"
  4836.                                     onclick=\"window.location.href='\${product.link}'\"
  4837.                                 >
  4838.                                     Commander
  4839.                                 </button>`
  4840.                             }
  4841.                         </div>
  4842.                     </div>
  4843.                 </li>
  4844.             `;
  4845.         })
  4846.         .join(\"\");
  4847.     const boutiqueButton = `
  4848.         <li style=\"margin-top: 25px; text-align: center;\">
  4849.             <button
  4850.                 style=\"
  4851.                     padding: 8px 15px;
  4852.                     background-color: #F56040;
  4853.                     color: white;
  4854.                     border: none;
  4855.                     border-radius: 5px;
  4856.                     font-size: 14px;
  4857.                     width: 170px;
  4858.                     height: 40px;
  4859.                     cursor: pointer;
  4860.                 \"
  4861.                 onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  4862.             >
  4863.                 Voir toute la boutique
  4864.             </button>
  4865.         </li>
  4866.     `;
  4867.     \$(\"#product-list\").html(productList + boutiqueButton);
  4868. }
  4869. // Modifications au script existant
  4870. \$(document).ready(function() {
  4871.     // Fonctions pour ouvrir/fermer la sidebar
  4872.     \$(\"#openFavoritesSidebar\").click(function() {
  4873.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  4874.         loadFavorites();
  4875.     });
  4876.     
  4877.     \$(\"#close-favorites-btn\").click(function() {
  4878.         closeFavoritesSidebar();
  4879.     });
  4880.     
  4881.     // Fonction pour fermer la sidebar
  4882.     window.closeFavoritesSidebar = function() {
  4883.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  4884.     };
  4885.     
  4886.     // Tout sélectionner / Tout désélectionner
  4887.     \$(\"#select-all-btn\").click(function() {
  4888.         if (selectedFavorites.length === allFavorites.length) {
  4889.             // Tout désélectionner
  4890.             selectedFavorites = [];
  4891.             \$(\".selection-overlay > div\").css(\"background\", \"transparent\").html(\"\");
  4892.             \$(this).text(\"Tout sélectionner\");
  4893.         } else {
  4894.             // Tout sélectionner
  4895.             selectedFavorites = allFavorites.map(fav => fav.id);
  4896.             \$(\".selection-overlay > div\").css(\"background\", \"#F56040\").html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4897.             \$(this).text(\"Tout désélectionner\");
  4898.         }
  4899.         
  4900.         // Mettre à jour le compteur
  4901.         \$(\"#selection-count\").text(selectedFavorites.length);
  4902.         
  4903.         // Mettre à jour l'interface produits
  4904.         updateProductsView();
  4905.     });
  4906.     
  4907.     // Gestion des onglets
  4908.     \$(\".sidebar-tab\").click(function() {
  4909.         \$(\".sidebar-tab\").removeClass(\"active\").css({
  4910.             \"color\": \"#666\",
  4911.             \"border-bottom\": \"none\"
  4912.         });
  4913.         \$(this).addClass(\"active\").css({
  4914.             \"color\": \"#F56040\",
  4915.             \"border-bottom\": \"2px solid #F56040\"
  4916.         });
  4917.         
  4918.         const tabId = \$(this).attr(\"id\");
  4919.         \$(\".tab-content\").hide();
  4920.         
  4921.         if (tabId === \"tab-photos\") {
  4922.             \$(\"#photos-content\").show();
  4923.         } else if (tabId === \"tab-products\") {
  4924.             \$(\"#products-content\").show();
  4925.         }
  4926.     });
  4927.     
  4928.     // Modifier les fonctions existantes pour intercepter l'ajout/suppression de favoris
  4929.     const originalAddFavoris = window.AddFavoris;
  4930.     window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  4931.         if (originalAddFavoris) {
  4932.             originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  4933.         }
  4934.         
  4935.         // Recharger les favoris si la sidebar est ouverte
  4936.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4937.             loadFavorites();
  4938.         }
  4939.     };
  4940.     const originalSupprimerFavoris = window.supprimerFavoris;
  4941.     window.supprimerFavoris = function(\$id, \$idSejour) {
  4942.         if (originalSupprimerFavoris) {
  4943.             originalSupprimerFavoris(\$id, \$idSejour);
  4944.         }
  4945.         
  4946.         // Recharger les favoris si la sidebar est ouverte
  4947.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4948.             // Retirer de la sélection si présent
  4949.             selectedFavorites = selectedFavorites.filter(favId => favId != \$id);
  4950.             loadFavorites();
  4951.         }
  4952.     };
  4953.     
  4954.     // Fermer en cliquant en dehors
  4955.     \$(document).click(function(event) {
  4956.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  4957.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  4958.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4959.             closeFavoritesSidebar();
  4960.         }
  4961.     });
  4962. });
  4963. // Initialisation de la sidebar
  4964. \$(document).ready(function() {
  4965.     // Fonctions pour ouvrir/fermer la sidebar
  4966.     \$(\"#openFavoritesSidebar\").click(function() {
  4967.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  4968.         loadFavorites();
  4969.     });
  4970.     
  4971.     \$(\"#close-favorites-btn\").click(function() {
  4972.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  4973.     });
  4974.     
  4975.     // Fermer en cliquant en dehors
  4976.     \$(document).click(function(event) {
  4977.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  4978.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  4979.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4980.             \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  4981.         }
  4982.     });
  4983. });
  4984.   </script>
  4985.   <script src=\"{{ asset('js/splide.min.js') }}\"></script>
  4986.    
  4987. <script>
  4988.   document.addEventListener('DOMContentLoaded', function () {
  4989.     const openBtn = document.getElementById('openFavoritesSidebar');
  4990.     const sidebar = document.getElementById('favorites-sidebar');
  4991.     const closeBtn = document.getElementById('favorites-close');
  4992.     if (openBtn && sidebar) {
  4993.       openBtn.addEventListener('click', () => sidebar.classList.add('active'));
  4994.     }
  4995.     if (closeBtn && sidebar) {
  4996.       closeBtn.addEventListener('click', () => sidebar.classList.remove('active'));
  4997.     }
  4998.   });
  4999. </script>
  5000.  
  5001. <script>
  5002. document.addEventListener('DOMContentLoaded', function() {
  5003.   const filterBadges = document.querySelectorAll('.filter-badge');
  5004.   filterBadges.forEach(badge => {
  5005.     badge.addEventListener('click', function() {
  5006.       // Désactiver tous les badges
  5007.       filterBadges.forEach(b => b.classList.remove('active'));
  5008.       // Activer le badge cliqué
  5009.       this.classList.add('active');
  5010.     });
  5011.   });
  5012. });
  5013. </script>
  5014.   <script
  5015.     type=\"text/javascript\"
  5016.     src=\"{{ asset('Accueil/js/jquery.magnific-popup.min.js') }}\"
  5017.   ></script>
  5018.   <script>
  5019. document.addEventListener('DOMContentLoaded', function () {
  5020.   const prevButtons = document.querySelectorAll('.btn-prev-day');
  5021.   const nextButtons = document.querySelectorAll('.btn-next-day');
  5022.   const dateCards = document.querySelectorAll('.date-card.modern-card');
  5023.   const collapseSections = document.querySelectorAll('.collapse');
  5024.   function navigateToDay(index) {
  5025.     if (index >= 0 && index < collapseSections.length) {
  5026.       // Fermer tous les jours
  5027.       collapseSections.forEach(s => s.classList.remove('show'));
  5028.       dateCards.forEach(c => c.classList.remove('active'));
  5029.       // Ouvrir le bon jour
  5030.       const targetCollapse = collapseSections[index];
  5031.       const targetCard = dateCards[index];
  5032.       if (targetCollapse && targetCard) {
  5033.         targetCollapse.classList.add('show');
  5034.         targetCard.classList.add('active');
  5035.       }
  5036.     }
  5037.   }
  5038.   prevButtons.forEach(button => {
  5039.     button.addEventListener('click', function () {
  5040.       const targetIndex = parseInt(this.dataset.target, 10);
  5041.       navigateToDay(targetIndex);
  5042.     });
  5043.   });
  5044.   nextButtons.forEach(button => {
  5045.     button.addEventListener('click', function () {
  5046.       const targetIndex = parseInt(this.dataset.target, 10);
  5047.       navigateToDay(targetIndex);
  5048.     });
  5049.   });
  5050. });
  5051. </script>
  5052.   <script>
  5053.     document.addEventListener('DOMContentLoaded', function() {
  5054.   const style = document.createElement('style');
  5055.   style.textContent = `
  5056.     .hidden {
  5057.       display: none !important;
  5058.     }
  5059.   `;
  5060.   document.head.appendChild(style);
  5061. });
  5062.     document.addEventListener('DOMContentLoaded', function() {
  5063.     // Get the favorite button
  5064.     const favoriteButton = document.querySelector('.fav-button');
  5065.     if (favoriteButton) {
  5066.       // Make it unclickable with JS too (belt and suspenders approach)
  5067.       favoriteButton.style.pointerEvents = 'none';
  5068.       
  5069.       // Override any existing click handlers
  5070.       favoriteButton.onclick = function(e) {
  5071.         e.preventDefault();
  5072.         e.stopPropagation();
  5073.         return false;
  5074.       };
  5075.       
  5076.       // Make sure hover still works
  5077.       favoriteButton.addEventListener('mouseover', function() {
  5078.         document.getElementById('purchase-alert').style.display = 'block';
  5079.       });
  5080.       
  5081.       // Keep any existing hover functionality
  5082.       if (typeof showSelection === 'function') {
  5083.         favoriteButton.onmouseover = showSelection;
  5084.       }
  5085.     }
  5086.     
  5087.     // Make sure the purchase alert remains interactive
  5088.     const purchaseAlert = document.getElementById('purchase-alert');
  5089.     if (purchaseAlert) {
  5090.       purchaseAlert.style.pointerEvents = 'auto';
  5091.     }
  5092.   });
  5093.     // Sélection des éléments
  5094.     const purchaseAlert = document.getElementById(\"purchase-alert\");
  5095.     const alertContent = document.getElementById(\"purchase-alert-content\");
  5096.     const likeCountLabel = document.getElementById(\"likeCount\");
  5097.     const favoriteCount = parseInt(likeCountLabel.textContent.trim(), 10); // Convertir en nombre
  5098.     // Fonction pour mettre à jour le contenu de l'alerte
  5099.     function updatePurchaseAlert(current) {
  5100.   let remainingForAlbum = Math.max(0, 20 - current);
  5101.   let remainingForPochette = Math.max(0, 12 - current);
  5102.   let remainingForPack = Math.max(0, 12 - current);
  5103.   const progressBar = (count, total, color) => `
  5104.   <div style=\"margin: 5px 0;\">
  5105.     <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  5106.       <div style=\"width: \${
  5107.         (count / total) * 100
  5108.       }%; background-color: \${color}; height: 100%;\"></div>
  5109.     </div>
  5110.     <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  5111.   </div>
  5112. `;
  5113.   // Use Twig paths here:
  5114.   const products = [
  5115.       {
  5116.       name: \"Pochette photo (12 photos)\",
  5117.       required: 12,
  5118.       remaining: remainingForPochette,
  5119.       image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  5120.       color: \"#2196f3\",
  5121.       link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  5122.     },
  5123.        {
  5124.       name: \"Pack numérique (20 photos)\",
  5125.       required: 20,
  5126.       remaining: remainingForAlbum,
  5127.       image: \"/images/produit/photoNumerique.jpg\",
  5128.       color: \"#4caf50\",
  5129.       link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 20}) }}\",
  5130.     }
  5131.   
  5132.   
  5133.     
  5134.   ].sort((a, b) => a.remaining - b.remaining);
  5135.   const productList = products
  5136.     .map((product) => {
  5137.       const count = current;
  5138.       const total = product.required;
  5139.       const remaining = product.remaining;
  5140.       return `
  5141.     <li style=\"margin-bottom: 15px;\">
  5142.       <div style=\"display: flex; align-items: center; gap: 10px;\">
  5143.         <img
  5144.           src=\"\${product.image}\"
  5145.           alt=\"\${product.name}\"
  5146.           style=\"width: 65px; height: 65px; border-radius: 5px; margin-top:-19px\"
  5147.         />
  5148.         <div style=\"flex: 1;\">
  5149.           <strong style=\"font-size: 14px;\">\${product.name}</strong>
  5150.           \${progressBar(count, total, product.color)}
  5151.           \${
  5152.             remaining > 0
  5153.               ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  5154.                    Encore \${remaining} photos ❤️ pour compléter \${product.name.toLowerCase()}
  5155.                  </small>`
  5156.               : `<button
  5157.                   style=\"
  5158.                     margin-top: 5px;
  5159.                     padding: 5px 8px;
  5160.                     background-color: \${product.color};
  5161.                     color: white;
  5162.                     border: none;
  5163.                     border-radius: 5px;
  5164.                     font-size: 12px;
  5165.                     cursor: pointer;
  5166.                   \"
  5167.                   onclick=\"window.location.href='\${product.link}'\"
  5168.                 >
  5169.                   Commander
  5170.                 </button>`
  5171.           }
  5172.         </div>
  5173.       </div>
  5174.     </li>
  5175.   `;
  5176.     })
  5177.     .join(\"\");
  5178.   const plusButton = `
  5179.     <li style=\"margin-bottom: 15px; text-align: center;\">
  5180.       <button
  5181.         style=\"
  5182.           padding: 5px 8px;
  5183.           background-color: #F56040;
  5184.           color: white;
  5185.           border: none;
  5186.           border-radius: 5px;
  5187.           font-size: 14px;
  5188.           line-height: 1;
  5189.           width: 150px;
  5190.           height: 40px;
  5191.           cursor: pointer;
  5192.         \"
  5193.         onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  5194.       >
  5195.         Aller à la boutique
  5196.       </button>
  5197.     </li>
  5198.   `;
  5199.   if (current === 0) {
  5200.     alertContent.innerHTML = `
  5201.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  5202.       Vous n'avez pas encore de photos favorites !
  5203.     </p>
  5204.     <p style=\"margin-bottom: 20px; color: #555;\">
  5205.       Commencez à ajouter vos moments préférés pour profiter de nos offres.
  5206.     </p>
  5207.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  5208.   `;
  5209.   } else {
  5210.     alertContent.innerHTML = `
  5211.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  5212.       Vous avez atteint \${current} photos favorites !
  5213.     </p>
  5214.     <p style=\"margin-bottom: 20px; color: #555;\">
  5215.       Profitez de nos offres spéciales :
  5216.     </p>
  5217.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  5218.   `;
  5219.   }
  5220.   purchaseAlert.classList.remove(\"hidden\");
  5221.   clearTimeout(purchaseAlertTimeout);
  5222.   purchaseAlertTimeout = setTimeout(() => {
  5223.     if (!purchaseAlert.matches(\":hover\")) {
  5224.       closePurchaseAlert();
  5225.     }
  5226.   }, 5000);
  5227. }
  5228.     // Fonction pour fermer l'alerte
  5229.     function closePurchaseAlert() {
  5230.       purchaseAlert.classList.add(\"hidden\");
  5231.     }
  5232.     // Événement pour mettre à jour le contenu et afficher la popover dynamiquement au hover
  5233.     document.querySelector(\".fav-button\").addEventListener(\"mouseover\", () => {
  5234.       updatePurchaseAlert(favoriteCount);
  5235.       purchaseAlert.classList.remove(\"cachee\"); // Réaffiche la popover
  5236.     });
  5237.     function showSelection() {
  5238.       document.getElementById(\"purchase-alert\").style.display = \"block\";
  5239.     }
  5240.     function hideSelection() {
  5241.       document.getElementById(\"selectionPopover\").style.display = \"none\";
  5242.     }
  5243.     document.addEventListener(\"DOMContentLoaded\", function () {
  5244.       const container = document.querySelector(\".date-container\");
  5245.       // Vérifie si le conteneur existe pour éviter les erreurs
  5246.       if (container) {
  5247.         container.scrollTo({
  5248.           left: container.scrollWidth, // Scroll directement à la position maximale
  5249.           behavior: \"smooth\", // Défilement fluide
  5250.         });
  5251.       }
  5252.     });
  5253.     document.addEventListener(\"DOMContentLoaded\", function () {
  5254.       const container = document.querySelector(\".date-container\");
  5255.       const leftArrow = document.querySelector(\".scroll-btn.left\");
  5256.       const rightArrow = document.querySelector(\".scroll-btn.right\");
  5257.       // Fonction pour vérifier le débordement et activer/désactiver les flèches
  5258.       function updateArrowsVisibility() {
  5259.         const isOverflowing = container.scrollWidth > container.clientWidth; // Vérifie si débordement
  5260.         leftArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  5261.         rightArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  5262.       }
  5263.       // Fonction pour défiler
  5264.       function scrollContainer(direction) {
  5265.         container.scrollBy({
  5266.           left: direction === \"left\" ? -200 : 200, // Défiler à gauche ou à droite
  5267.           behavior: \"smooth\",
  5268.         });
  5269.       }
  5270.       // Ajout des événements de clic pour les flèches
  5271.       leftArrow.addEventListener(\"click\", () => scrollContainer(\"left\"));
  5272.       rightArrow.addEventListener(\"click\", () => scrollContainer(\"right\"));
  5273.       // Vérification initiale et sur redimensionnement de la fenêtre
  5274.       updateArrowsVisibility();
  5275.       window.addEventListener(\"resize\", updateArrowsVisibility);
  5276.     });
  5277.     document.addEventListener(\"DOMContentLoaded\", function () {
  5278.       const container = document.querySelector(\".date-container\");
  5279.       const leftBtn = document.querySelector(\".scroll-btn.left\");
  5280.       const rightBtn = document.querySelector(\".scroll-btn.right\");
  5281.       leftBtn.addEventListener(\"click\", () => {
  5282.         container.scrollBy({
  5283.           left: -200, // Défile vers la gauche
  5284.           behavior: \"smooth\",
  5285.         });
  5286.       });
  5287.       rightBtn.addEventListener(\"click\", () => {
  5288.         container.scrollBy({
  5289.           left: 200, // Défile vers la droite
  5290.           behavior: \"smooth\",
  5291.         });
  5292.       });
  5293.     });
  5294.  document.addEventListener(\"DOMContentLoaded\", function () {
  5295.     // Sélectionnez tous les badges de filtre
  5296.     const filterBadges = document.querySelectorAll(\".filter-badge\");
  5297.     // Sélectionnez tous les éléments de la galerie
  5298.     const galleryItems = document.querySelectorAll(\".column\");
  5299.     // Sélectionnez tous les jours
  5300.     const days = document.querySelectorAll(\".collapse\");
  5301.     // Fonction pour réinitialiser les filtres
  5302.     function resetFilters() {
  5303.         // Réinitialisez tous les éléments de la galerie
  5304.         galleryItems.forEach((item) => {
  5305.             item.style.display = \"block\";
  5306.         });
  5307.         // Réinitialisez les états des badges
  5308.         filterBadges.forEach((badge) => badge.classList.remove(\"active\"));
  5309.     }
  5310.     // Ajoutez un gestionnaire d'événements pour chaque badge
  5311.     filterBadges.forEach((badge) => {
  5312.         badge.addEventListener(\"click\", function () {
  5313.             const filter = this.getAttribute(\"data-filter\");
  5314.             // Réinitialisez l'état actif pour tous les badges
  5315.             filterBadges.forEach((btn) => btn.classList.remove(\"active\"));
  5316.             // Ajoutez l'état actif au badge cliqué
  5317.             this.classList.add(\"active\");
  5318.             // Affichez ou masquez les éléments de la galerie
  5319.             galleryItems.forEach((item) => {
  5320.                 if (filter === \"all\") {
  5321.                     item.style.display = \"block\";
  5322.                 } else if (filter === \"photo\" && item.querySelector(\"img\")) {
  5323.                     item.style.display = \"block\";
  5324.                 } else if (filter === \"video\" && item.querySelector(\"video\")) {
  5325.                     item.style.display = \"block\";
  5326.                 } else if (filter === \"audio\" && item.classList.contains(\"audio-message-item\")) {
  5327.                     item.style.display = \"block\";
  5328.                 } else {
  5329.                     item.style.display = \"none\";
  5330.                 }
  5331.             });
  5332.         });
  5333.     });
  5334.     // Réinitialiser les filtres lors du changement de jour
  5335.     days.forEach((day) => {
  5336.         day.addEventListener(\"show.bs.collapse\", function () {
  5337.             resetFilters();
  5338.         });
  5339.     });
  5340. });
  5341.     \$(document).ready(function () {
  5342.       let zoomCounter = 0; // Initialize zoom counter
  5343.       let currentImageSrc = \"\"; // Track current image source
  5344.       let lastClickPosition = { x: 50, y: 50 }; // Default to center of image
  5345.       \$(\".container--gallery\").magnificPopup({
  5346.         delegate: \"a\",
  5347.         type: \"image\",
  5348.         mainClass: \"mfp-with-zoom mfp-img-mobile\",
  5349.         image: {
  5350.           verticalFit: true,
  5351.         },
  5352.         gallery: {
  5353.           enabled: true,
  5354.           tPrev: \"Previous (Left arrow key)\", // Alt text on left arrow
  5355.           tNext: \"Next (Right arrow key)\", // Alt text on right arrow
  5356.           tCounter: \"%curr% of %total%\", // Markup for \"1 of 7\" counter
  5357.         },
  5358.         zoom: {
  5359.           enabled: true,
  5360.           duration: 300,
  5361.           opener: function (element) {
  5362.             return element.find(\"img\");
  5363.           },
  5364.         },
  5365.         callbacks: {
  5366.           open: function () {
  5367.             // Get current image data from the link that was clicked
  5368.             const currentLink = this.currItem.el;
  5369.             const imageId =
  5370.               currentLink
  5371.                 .closest(\".photo-zoom\")
  5372.                 .find(\".heart-icon\")
  5373.                 .data(\"id\") || \"\";
  5374.             const sejourId =
  5375.               currentLink
  5376.                 .closest(\".photo-zoom\")
  5377.                 .find(\".heart-icon\")
  5378.                 .data(\"sejour-id\") || \"\";
  5379.             const imagePath =
  5380.               currentLink
  5381.                 .closest(\".photo-zoom\")
  5382.                 .find(\".heart-icon\")
  5383.                 .data(\"path\") || \"\";
  5384.             const imageDesc =
  5385.               currentLink
  5386.                 .closest(\".photo-zoom\")
  5387.                 .find(\".heart-icon\")
  5388.                 .data(\"description\") || \"\";
  5389.             const isFavorite = currentLink
  5390.               .closest(\".photo-zoom\")
  5391.               .find(\".heart-icon i\")
  5392.               .hasClass(\"bi-heart-fill\");
  5393.             const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  5394.             const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  5395.             const favoriteTooltip = isFavorite
  5396.               ? \"Retirer des favoris\"
  5397.               : \"Ajouter aux favoris\";
  5398.             const zoomControls = `
  5399.           <div class=\"mfp-zoom-controls\">
  5400.             <button class=\"zoom-btn zoom-out\" title=\"Zoom Out\"><i class=\"fa fa-search-minus\"></i></button>
  5401.             <button class=\"zoom-btn zoom-in\" title=\"Zoom In\"><i class=\"fa fa-search-plus\"></i></button>
  5402.           </div>
  5403.           <div class=\"mfp-favorite\">
  5404.             <button class=\"favorite-btn\" 
  5405.                     data-id=\"\${imageId}\" 
  5406.                     data-sejour-id=\"\${sejourId}\" 
  5407.                     data-path=\"\${imagePath}\" 
  5408.                     data-description=\"\${imageDesc}\"
  5409.                     title=\"\${favoriteTooltip}\">
  5410.               <i class=\"bi \${favoriteIconClass}\" style=\"color: \${favoriteIconColor}; text-shadow: 0px 0px 3px rgba(0,0,0,0.5);\"></i>
  5411.             </button>
  5412.           </div>
  5413.           <div class=\"mfp-counter\"></div>
  5414.         `;
  5415.             \$(\".mfp-content\").append(zoomControls);
  5416.             initializeZoomControls();
  5417.             initializeFavoriteButton();
  5418.             const intervalId = setInterval(() => {
  5419.               const newImageSrc = \$(\".mfp-img\").attr(\"src\");
  5420.               if (newImageSrc !== currentImageSrc) {
  5421.                 currentImageSrc = newImageSrc;
  5422.                 zoomCounter = 0;
  5423.                 lastClickPosition = { x: 50, y: 50 }; // Reset to center
  5424.                 attachZoomHandler(); // Reattach zoom handler to new image
  5425.                 \$(\".mfp-img\").css({
  5426.                   \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5427.                   transform: `scale(1)`,
  5428.                 });
  5429.                 // Update favorite button for the new image
  5430.                 updateFavoriteButton();
  5431.                 initializeZoomControls();
  5432.                 updateCounter();
  5433.               }
  5434.             }, 100);
  5435.             this.content.on(\"mfpClose\", function () {
  5436.               clearInterval(intervalId);
  5437.             });
  5438.             attachZoomHandler();
  5439.           },
  5440.           close: function () {
  5441.             \$(\".mfp-zoom-controls\").remove();
  5442.             \$(\".mfp-favorite\").remove();
  5443.             \$(\".mfp-counter\").remove();
  5444.             zoomCounter = 0;
  5445.           },
  5446.         },
  5447.       });
  5448.       function attachZoomHandler() {
  5449.         \$(\".mfp-img\")
  5450.           .off(\"click\")
  5451.           .on(\"click\", function (event) {
  5452.             event.stopPropagation(); // Prevent default navigation behavior
  5453.             // Calculate click coordinates relative to the image
  5454.             const imgOffset = \$(this).offset();
  5455.             const clickX = event.pageX - imgOffset.left;
  5456.             const clickY = event.pageY - imgOffset.top;
  5457.             const imgWidth = \$(this).width();
  5458.             const imgHeight = \$(this).height();
  5459.             // Calculate transform-origin based on click position
  5460.             lastClickPosition = {
  5461.               x: (clickX / imgWidth) * 100,
  5462.               y: (clickY / imgHeight) * 100,
  5463.             };
  5464.             // Cycle through zoom levels: 1x, 1.5x, 2x
  5465.             zoomCounter = (zoomCounter + 1) % 3;
  5466.             const zoomLevels = [1, 1.5, 2];
  5467.             const zoomLevel = zoomLevels[zoomCounter];
  5468.             \$(this).css({
  5469.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5470.               transform: `scale(\${zoomLevel})`,
  5471.             });
  5472.             updateZoomButtonState();
  5473.           });
  5474.       }
  5475.       function initializeZoomControls() {
  5476.         \$(\".mfp-zoom-controls .zoom-in\")
  5477.           .off(\"click\")
  5478.           .on(\"click\", function (event) {
  5479.             event.stopPropagation();
  5480.             zoomCounter = (zoomCounter + 1) % 3;
  5481.             const zoomLevels = [1, 1.5, 2];
  5482.             const zoomLevel = zoomLevels[zoomCounter];
  5483.             \$(\".mfp-img\").css({
  5484.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5485.               transform: `scale(\${zoomLevel})`,
  5486.             });
  5487.             updateZoomButtonState();
  5488.           });
  5489.         \$(\".mfp-zoom-controls .zoom-out\")
  5490.           .off(\"click\")
  5491.           .on(\"click\", function (event) {
  5492.             event.stopPropagation();
  5493.             if (zoomCounter > 0) {
  5494.               zoomCounter -= 1;
  5495.               const zoomLevels = [1, 1.5, 2];
  5496.               const zoomLevel = zoomLevels[zoomCounter];
  5497.               \$(\".mfp-img\").css({
  5498.                 \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5499.                 transform: `scale(\${zoomLevel})`,
  5500.               });
  5501.               updateZoomButtonState();
  5502.             } else {
  5503.               \$.magnificPopup.close();
  5504.             }
  5505.           });
  5506.       }
  5507.       function initializeFavoriteButton() {
  5508.         \$(\".mfp-favorite .favorite-btn\")
  5509.           .off(\"click\")
  5510.           .on(\"click\", function (event) {
  5511.             event.stopPropagation();
  5512.             const \$this = \$(this);
  5513.             const imageId = \$this.data(\"id\");
  5514.             const sejourId = \$this.data(\"sejour-id\");
  5515.             // Toggle favorite status
  5516.             const isFavorite = \$this.find(\"i\").hasClass(\"bi-heart-fill\");
  5517.             // Update the button appearance
  5518.             if (isFavorite) {
  5519.               \$this
  5520.                 .find(\"i\")
  5521.                 .removeClass(\"bi-heart-fill\")
  5522.                 .addClass(\"bi-heart\")
  5523.                 .css(\"color\", \"white\");
  5524.               \$this.attr(\"title\", \"Ajouter aux favoris\");
  5525.             } else {
  5526.               \$this
  5527.                 .find(\"i\")
  5528.                 .removeClass(\"bi-heart\")
  5529.                 .addClass(\"bi-heart-fill\")
  5530.                 .css(\"color\", \"#f56040\");
  5531.               \$this.attr(\"title\", \"Retirer des favoris\");
  5532.             }
  5533.             // Update the original heart icon in the gallery
  5534.             const originalHeartIcon = \$(
  5535.               `.heart-icon[data-id=\"\${imageId}\"]`
  5536.             ).find(\"i\");
  5537.             if (isFavorite) {
  5538.               originalHeartIcon
  5539.                 .removeClass(\"bi-heart-fill\")
  5540.                 .addClass(\"bi-heart\")
  5541.                 .css(\"color\", \"\");
  5542.             } else {
  5543.               originalHeartIcon
  5544.                 .removeClass(\"bi-heart\")
  5545.                 .addClass(\"bi-heart-fill\")
  5546.                 .css(\"color\", \"#f56040\");
  5547.             }
  5548.             // Make AJAX call to update favorite status in the backend using Parent routes
  5549.             \$.ajax({
  5550.               url: isFavorite ? \"/Parent/aSupprimerFav\" : \"/Parent/ajouterFav\",
  5551.               type: \"POST\",
  5552.               data: {
  5553.                 id: imageId,
  5554.                 idSejour: sejourId,
  5555.               },
  5556.               success: function (response) {
  5557.                 // Optional: Show a success message or handle response
  5558.                 console.log(\"Favorite status updated\", response);
  5559.               },
  5560.               error: function (error) {
  5561.                 console.error(\"Error updating favorite status\", error);
  5562.                 // Revert the icon change on error
  5563.                 if (isFavorite) {
  5564.                   \$this
  5565.                     .find(\"i\")
  5566.                     .removeClass(\"bi-heart\")
  5567.                     .addClass(\"bi-heart-fill\")
  5568.                     .css(\"color\", \"#f56040\");
  5569.                   originalHeartIcon
  5570.                     .removeClass(\"bi-heart\")
  5571.                     .addClass(\"bi-heart-fill\")
  5572.                     .css(\"color\", \"#f56040\");
  5573.                 } else {
  5574.                   \$this
  5575.                     .find(\"i\")
  5576.                     .removeClass(\"bi-heart-fill\")
  5577.                     .addClass(\"bi-heart\")
  5578.                     .css(\"color\", \"white\");
  5579.                   originalHeartIcon
  5580.                     .removeClass(\"bi-heart-fill\")
  5581.                     .addClass(\"bi-heart\")
  5582.                     .css(\"color\", \"\");
  5583.                 }
  5584.               },
  5585.             });
  5586.           });
  5587.       }
  5588.       function updateFavoriteButton() {
  5589.         // Get current image data from the current slide
  5590.         const currentSlide = \$.magnificPopup.instance.currItem.el;
  5591.         const photoZoom = currentSlide.closest(\".photo-zoom\");
  5592.         if (photoZoom.length) {
  5593.           const heartIcon = photoZoom.find(\".heart-icon\");
  5594.           const imageId = heartIcon.data(\"id\") || \"\";
  5595.           const sejourId = heartIcon.data(\"sejour-id\") || \"\";
  5596.           const imagePath = heartIcon.data(\"path\") || \"\";
  5597.           const imageDesc = heartIcon.data(\"description\") || \"\";
  5598.           const isFavorite = heartIcon.find(\"i\").hasClass(\"bi-heart-fill\");
  5599.           const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  5600.           const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  5601.           const favoriteTooltip = isFavorite
  5602.             ? \"Retirer des favoris\"
  5603.             : \"Ajouter aux favoris\";
  5604.           // Update the favorite button
  5605.           const \$favoriteBtn = \$(\".mfp-favorite .favorite-btn\");
  5606.           \$favoriteBtn.data(\"id\", imageId);
  5607.           \$favoriteBtn.data(\"sejour-id\", sejourId);
  5608.           \$favoriteBtn.data(\"path\", imagePath);
  5609.           \$favoriteBtn.data(\"description\", imageDesc);
  5610.           \$favoriteBtn.attr(\"title\", favoriteTooltip);
  5611.           \$favoriteBtn
  5612.             .find(\"i\")
  5613.             .removeClass(\"bi-heart bi-heart-fill\")
  5614.             .addClass(favoriteIconClass)
  5615.             .css(\"color\", favoriteIconColor);
  5616.         }
  5617.       }
  5618.       function updateZoomButtonState() {
  5619.         const zoomLevels = [1, 1.5, 2];
  5620.         const currentZoom = zoomLevels[zoomCounter];
  5621.         \$(\".zoom-in\").prop(\"disabled\", currentZoom === 2);
  5622.         \$(\".zoom-out\").prop(\"disabled\", currentZoom === 1);
  5623.       }
  5624.       function updateCounter() {
  5625.         const counterText = \$(\".mfp-counter\")
  5626.           .closest(\".mfp-content\")
  5627.           .find(\".mfp-counter\")
  5628.           .text();
  5629.         const matches = counterText.match(/(\\d+) of (\\d+)/);
  5630.         if (matches) {
  5631.           const currentIndex = matches[1];
  5632.           const totalImages = matches[2];
  5633.           \$(\".mfp-counter\").text(`\${currentIndex} of \${totalImages}`);
  5634.         }
  5635.       }
  5636.       // Add CSS for the favorite button and rounded image corners
  5637.       \$(\"<style>\")
  5638.         .prop(\"type\", \"text/css\")
  5639.         .html(
  5640.           `
  5641.       .mfp-favorite {
  5642.         position: absolute;
  5643.         top: 15px;
  5644.         left: 15px;
  5645.         z-index: 1046;
  5646.       }
  5647.       .favorite-btn {
  5648.         background: transparent;
  5649.         border: none;
  5650.         font-size: 24px;
  5651.         padding: 5px;
  5652.         cursor: pointer;
  5653.         outline: none;
  5654.       }
  5655.       .favorite-btn i {
  5656.         transition: all 0.3s ease;
  5657.       }
  5658.       .favorite-btn:hover i {
  5659.         transform: scale(1.2);
  5660.       }
  5661.       /* Rounded corners for zoomed images */
  5662.       .mfp-img {
  5663.         border-radius: 8px;
  5664.       }
  5665.       /* Make sure the container doesn't clip the rounded corners */
  5666.       .mfp-figure:after {
  5667.         border-radius: 8px;
  5668.       }
  5669.     `
  5670.         )
  5671.         .appendTo(\"head\");
  5672.     });
  5673.   </script>
  5674. <script>
  5675. document.addEventListener('DOMContentLoaded', function () {
  5676.   const openBtn = document.getElementById('openFavoritesBtn');
  5677.   const closeBtn = document.getElementById('closeSidebarBtn');
  5678.   const sidebar = document.getElementById('favoritesSidebar');
  5679.   const tbody = document.querySelector('#favoritesTable tbody');
  5680.   openBtn.addEventListener('click', async () => {
  5681.     try {
  5682.       const response = await fetch('/Parent/mes-favoris', {
  5683.         headers: {
  5684.           'Accept': 'application/json'
  5685.         }
  5686.       });
  5687.       const result = await response.json();
  5688.       if (!result.success || !Array.isArray(result.data)) {
  5689.         alert('Erreur lors du chargement des favoris.');
  5690.         return;
  5691.       }
  5692.       tbody.innerHTML = '';
  5693.       result.data.forEach((fav, index) => {
  5694.         const row = document.createElement('tr');
  5695.         row.innerHTML = `
  5696.           <td>\${index + 1}</td>
  5697.           <td><img src=\"\${fav.path}\" alt=\"favori\"></td>
  5698.           <td>\${fav.descreption || '—'}</td>
  5699.           <td>\${fav.created_at}</td>
  5700.         `;
  5701.         tbody.appendChild(row);
  5702.       });
  5703.       sidebar.classList.add('active');
  5704.     } catch (e) {
  5705.       console.error('Erreur réseau:', e);
  5706.       alert('Impossible de charger les favoris.');
  5707.     }
  5708.   });
  5709.   closeBtn.addEventListener('click', () => {
  5710.     sidebar.classList.remove('active');
  5711.   });
  5712. });
  5713. </script>
  5714.   <script>
  5715.         // Fonction pour vérifier et afficher l'alerte
  5716.         function checkFavorites() {
  5717.             if (favoriteCount >= 10) {
  5718.                 purchaseAlert.style.display = 'block'; // Affiche l'alerte
  5719.             } else {
  5720.                 purchaseAlert.style.display = 'none'; // Cache l'alerte si le nombre est réduit
  5721.             }
  5722.         }
  5723.         // Ajout d'un favori
  5724.         function addFavorite() {
  5725.             favoriteCount++;
  5726.             likeCountLabel.textContent = favoriteCount;
  5727.             checkFavorites();
  5728.         }
  5729.         // Suppression d'un favori
  5730.         function removeFavorite() {
  5731.             if (favoriteCount > 0) {
  5732.                 favoriteCount--;
  5733.                 likeCountLabel.textContent = favoriteCount;
  5734.                 checkFavorites();
  5735.             }
  5736.         }document.addEventListener('DOMContentLoaded', () => {
  5737.     const favoriteCount = {{ nblikes }};
  5738.     updateCardContent(favoriteCount);
  5739. });
  5740. function updateCardContent(favoriteCount) {
  5741.     const card = document.getElementById('dynamic-card');
  5742.     const cardContent = document.getElementById('dynamic-card-content');
  5743.     let produits = [];
  5744.     if (favoriteCount >= 20) {
  5745.         produits.push({
  5746.             titre: \"Album débloqué !\",
  5747.             bouton: \"Commander\",
  5748.             image: \"/images/produit/Album5sur5-3.jpg\",
  5749.             lien: \"{{ path('EditionAlbum') }}\"
  5750.         });
  5751.     }
  5752.     if (favoriteCount >= 12) {
  5753.         produits.push({
  5754.             titre: \"Pochette débloquée !\",
  5755.             bouton: \"Commander\",
  5756.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  5757.             lien: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\"
  5758.         });
  5759.     }
  5760.     if (favoriteCount >= 5) {
  5761.         produits.push({
  5762.             titre: \"Pack numérique débloqué !\",
  5763.             bouton: \"Commander\",
  5764.             image: \"/images/produit/photoNumerique.jpg\",
  5765.             lien: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 15}) }}\"
  5766.         });
  5767.     }
  5768.     if (produits.length === 0) {
  5769.         cardContent.innerHTML = `
  5770.             <div style=\"text-align: center; padding: 10px;\">
  5771.                 Ajoutez des favoris pour débloquer des surprises ✨
  5772.             </div>
  5773.         `;
  5774.         return;
  5775.     }
  5776.     cardContent.innerHTML = `
  5777.     <div class=\"splide\" id=\"dynamicSplide\">
  5778.       <div class=\"splide__track\">
  5779.         <ul class=\"splide__list\">
  5780.           \${produits.map(produit => `
  5781.             <li class=\"splide__slide\" style=\"position: relative;\">
  5782.               <img src=\"\${produit.image}\" alt=\"\${produit.titre}\" style=\"width: 100%; height: 150px; object-fit: cover; border-radius: 8px;\">
  5783.               <div style=\"position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.1); color: white; padding: 10px; text-align: center; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;\">
  5784.                 <div style=\"font-weight: bold; font-size: 14px;\">\${produit.titre}</div>
  5785.                 <button style=\"margin-top: 5px; padding: 5px 8px; background-color: #F56040; color: white; border: none; border-radius: 4px; font-size: 12px; cursor: pointer;\" onclick=\"window.location.href='\${produit.lien}'\">
  5786.                   \${produit.bouton}
  5787.                 </button>
  5788.               </div>
  5789.             </li>
  5790.           `).join('')}
  5791.         </ul>
  5792.       </div>
  5793.     </div>
  5794.     `;
  5795.     // Monte le carrousel
  5796.     new Splide('#dynamicSplide', {
  5797.         type: 'loop',
  5798.         arrows: true,
  5799.         pagination: false,
  5800.         autoplay: true,
  5801.         interval: 4000,
  5802.         speed: 800,
  5803.     }).mount();
  5804. }
  5805.         function supprimerFavoris(\$id, \$idSejour) {
  5806.             // Vider l'élément coeur pour ce favori
  5807.             const coeurElement = \$('#coeur' + \$id);
  5808.             coeurElement.empty();
  5809.             // Ajout d'une animation sur le bouton favori
  5810.             const favoriteButton = document.querySelector('.fav-button');
  5811.             if (favoriteButton) {
  5812.                 favoriteButton.classList.add('active');
  5813.                 // Retirer l'animation après qu'elle soit jouée
  5814.                 setTimeout(() => {
  5815.                     favoriteButton.classList.remove('active');
  5816.                 }, 600); // La durée doit correspondre à celle de l'animation
  5817.             }
  5818.             // Mise à jour de l'icône coeur
  5819.             const clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  5820.             coeurElement.html(
  5821.                 `<i class=\"bi bi-heart \${clas}\" onclick=\"AddFavoris(\${\$id}, \${\$idSejour})\"></i>`
  5822.             );
  5823.             // Mettre à jour le compteur des favoris
  5824.             const likeCountLabel = document.getElementById('likeCount');
  5825.            const likeMesFavLabel = document.getElementById('mesFavCount');
  5826.              if (likeMesFavLabel) {
  5827.                 let currentCount = parseInt(likeMesFavLabel.textContent.trim(), 10) || 0;
  5828.                 currentCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  5829.                 likeMesFavLabel.textContent = currentCount;
  5830.             }
  5831.             if (likeCountLabel) {
  5832.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  5833.                 currentCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  5834.                 likeCountLabel.textContent = currentCount;
  5835.                 // Mettre à jour la valeur dans l'input hidden
  5836.                 const nbFavCurrentInput = \$('#nbFavCurrent');
  5837.                 if (nbFavCurrentInput.length) {
  5838.                     nbFavCurrentInput.val(currentCount);
  5839.                 }
  5840.             }
  5841.             // Préparation des données pour l'Ajax
  5842.             const \$_data = { 'id': \$id, 'idSejour': \$idSejour };
  5843.             // Appel Ajax pour supprimer le favori
  5844.             \$.ajax({
  5845.                 type: \"POST\",
  5846.                 url: \"{{ path('Supprimer_fav') }}\",
  5847.                 data: \$_data,
  5848.                 success: function () {
  5849.                     // Réactiver les icônes après succès
  5850.                     \$('.IconDelete').each(function () {
  5851.                         \$(this).css('pointer-events', '');
  5852.                     });
  5853.                 },
  5854.                 error: function (xhr, status, error) {
  5855.                     console.error('Erreur lors de la suppression du favori :', error);
  5856.                 }
  5857.             });
  5858.         }
  5859.         function AddFavoris(\$id, \$idSejour, \$urlimg, \$description) {
  5860.            // console.log('Adding favorite:', { attachmentId, sejourId, path, description });
  5861.   \$(\"#close-favorites-btn\").click()
  5862.             favoriteButton.classList.add('active');
  5863.    const likeMesFavLabel = document.getElementById('mesFavCount');
  5864.       
  5865.             const likeCountLabel = document.getElementById('likeCount');
  5866.             if (likeCountLabel) {
  5867.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  5868.                 likeCountLabel.textContent = currentCount + 1;
  5869.                      likeMesFavLabel.textContent = currentCount + 1;
  5870.             }
  5871.         // Retirer l'animation après qu'elle soit jouée
  5872.         setTimeout(() => {
  5873.             favoriteButton.classList.remove('active');
  5874.         }, 600); // La durée doit correspondre à celle de l'animation
  5875.             \$('#coeur' + \$id).empty();
  5876.             var clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  5877.             \$('#coeur' + \$id).html(\"<i class=\\\"bi bi-heart-fill favSelect \" + clas + \"\\\" onclick=\\\"supprimerFavoris(\" + \$id + \",\" + \$idSejour + \")\\\"></i>\");
  5878.             var \$total = parseInt(\$(\"#totalLike\").html()) + 1;
  5879.             \$(\"#totalLike\").html(\$total);
  5880.             \$(\"#totalLikeTitle\").html(\$total);
  5881.             \$(\"#totalLikeMobile\").html(\$total);
  5882.             var \$data = { 'id': \$id, 'idSejour': \$idSejour };
  5883.             \$.ajax({
  5884.                 type: \"POST\",
  5885.                 url: \"{{ path('Ajouter_fav') }}\",
  5886.                 data: \$data,
  5887.                 success: function () {
  5888.                     \$('.IconDelete').each(function () {
  5889.                         \$(this).css('pointer-events', '');
  5890.                     });
  5891.                     if (\$description === undefined) {
  5892.                         \$description = ''; // Set it to an empty string
  5893.                     }
  5894.                     \$('.rowMaselection').append(
  5895.                         '<div class=\"column\" id=\"column-' + \$id + '\">'+
  5896.                         '<a style=\"position: relative;\" title=\"Enlever de ma sélection\" onclick=\"supprimerFavoris(' + \$id + ',' + \$idSejour + ')\" class=\"iconeSuppImg\"><i class=\"bi bi-x\" style=\"font-size:17px;cursor:pointer;color:#d30909;float:right;margin-top:-3%;margin-right:2%\"></i></a>'+
  5897.                         '<a class=\"photo-zoom\">'+
  5898.                         '<img data-idAtach=\"'+\$id+'\" id=\"'+\$idSejour+'\" src=\"'+\$urlimg+'\"></a>'+
  5899.                         (\$description ? '<h4 id=\"commint\" class=\"titleHeadPhoto\">'+\$description+'</h4>' : '')+ // Only add the <h4> if \$description is not empty
  5900.                         '</div>'
  5901.                     );
  5902.                     // Directly update nbLikes count in the header
  5903.                     var currentNbLikes = parseInt(\$('#favoris-link-Accueilpayment .nbrpanier').text());
  5904.                     var newNbLikes = currentNbLikes + 1;
  5905.                     \$('#favoris-link-Accueilpayment .nbrpanier').text(newNbLikes);
  5906.                 },
  5907.                 error: function (xhr, status, error) {
  5908.                     console.error('Error:', error);
  5909.                 }
  5910.             });
  5911.         }
  5912.         \$(document).on('click', '.bi-heart, .bi-heart-fill', function () {
  5913.         const heartIcon       = \$(this);
  5914.         const heartContainer  = heartIcon.closest('.heart-icon');
  5915.         // Extract data attributes
  5916.         const attachmentId    = heartContainer.data('id');
  5917.         const sejourId        = heartContainer.data('sejour-id');
  5918.         const path            = heartContainer.data('path');
  5919.         const description     = heartContainer.data('description');
  5920.         const isFavorite      = heartIcon.hasClass('bi-heart-fill');
  5921.         // Get the input that contains the favorite count
  5922.         const likeFavInput    = document.getElementById('nbFavCurrent');
  5923.         let favoriteNb        = parseInt(likeFavInput.value, 10);
  5924.         if (isFavorite) {
  5925.             // Remove from favorites
  5926.             supprimerFavoris(attachmentId, sejourId);
  5927.             favoriteNb = Math.max(0, favoriteNb - 1);
  5928.             likeFavInput.value = favoriteNb;
  5929.             updateCardContent(favoriteNb);
  5930.               updateFavoritesSidebar();
  5931.                  \$(\"#close-favorites-btn\").click()
  5932.         } else {
  5933.             // Add to favorites
  5934.             AddFavoris(attachmentId, sejourId, path, description);
  5935.             favoriteNb = favoriteNb + 1;
  5936.             likeFavInput.value = favoriteNb;
  5937.             updateCardContent(favoriteNb);
  5938.        
  5939.             updateFavoritesSidebar();
  5940.                \$(\"#close-favorites-btn\").click()
  5941.         }
  5942.         // **** SIMPLE STEP: Update the purchase alert ****
  5943.         // This will refresh the progress bars, count, etc.
  5944.         updatePurchaseAlert(favoriteNb);
  5945.     });
  5946.         // Gestion dynamique du clic sur les icônes cœur
  5947.         \$(document).on('click', '.bi-hsddddeart, .bi-hdddeart-fill', function () {
  5948.             const heartIcon = \$(this);
  5949.           //  const heartIcon = \$(this);
  5950.             //const attachmentId = heartIcon.data('id'); // Récupère l'ID directement
  5951.             const attachmentId = heartIcon.closest('.heart-icon').attr('id').replace('coeur', '');
  5952.             const sejourId = heartIcon.data('sejour-id'); // Store the sejour ID in a data attribute
  5953.             const isFavorite = heartIcon.hasClass('bi-heart-fill');
  5954.             // Récupérer l'input contenant le nombre de favoris
  5955.             const likeFavInput = document.getElementById('nbFavCurrent');
  5956.             let favoriteNb = parseInt(likeFavInput.value, 10); // Utiliser .value pour les inputs
  5957.             // Validation pour éviter les NaN
  5958.             if (isNaN(favoriteNb)) {
  5959.                 favoriteNb = 0;
  5960.             }
  5961.             if (isFavorite) {
  5962.                 // Si c'est un favori, le supprimer
  5963.                 supprimerFavoris(attachmentId, sejourId);
  5964.                 // Décrémenter le compteur
  5965.                 favoriteNb = Math.max(0, favoriteNb - 1);
  5966.                 likeFavInput.value = favoriteNb; // Mettre à jour la valeur de l'input
  5967.                 // Mettre à jour dynamiquement le contenu des cartes ou popovers
  5968.                 updateCardContent(favoriteNb);
  5969.             } else {
  5970.                 // Si ce n'est pas un favori, l'ajouter
  5971.                 const path = heartIcon.data('path'); // Path de l'attachement
  5972.                 const description = heartIcon.data('description'); // Description de l'attachement
  5973.                 AddFavoris(attachmentId, sejourId, path, description);
  5974.           // Décrémenter le compteur
  5975.                 favoriteNb = Math.max(0, favoriteNb + 1);
  5976.                 likeFavInput.value = favoriteNb; // Mettre à jour la valeur de l'input
  5977.                 // Incrémenter le compteur
  5978.                 // Mettre à jour dynamiquement le contenu des cartes ou popovers
  5979.                 updateCardContent(favoriteNb);
  5980.             }
  5981.             // Mettre à jour dynamiquement la popover ou d'autres éléments liés
  5982.         });
  5983.         // Ajoutez les événements sur les icônes de cœur
  5984.         document.querySelectorAll('.IconDelete').forEach((icon) => {
  5985.             icon.addEventListener('click', (event) => {
  5986.                 const isFavorite = icon.classList.contains('bi-heart-fill');
  5987.                 if (isFavorite) {
  5988.                     removeFavorite();
  5989.                     icon.classList.remove('bi-heart-fill');
  5990.                     icon.classList.add('bi-heart');
  5991.                 } else {
  5992.                     addFavorite();
  5993.                     icon.classList.remove('bi-heart');
  5994.                     icon.classList.add('bi-heart-fill');
  5995.                 }
  5996.             });
  5997.         });
  5998.         // Vérifie l'état initial
  5999.         checkFavorites();
  6000.   </script>
  6001.   <!-- Initialisation -->
  6002.   <script>
  6003.     AOS.init({
  6004.       duration: 800, // Duration of animations in milliseconds
  6005.       easing: \"ease-in-out\", // Animation timing function
  6006.     });
  6007.     document.addEventListener(\"DOMContentLoaded\", function () {
  6008.       const dateCards = document.querySelectorAll(\".date-card\");
  6009.       const sections = document.querySelectorAll(\".collapse\");
  6010.       dateCards.forEach((card) => {
  6011.         card.addEventListener(\"click\", function () {
  6012.           // Supprimer les classes actives des autres cartes et sections
  6013.           dateCards.forEach((c) => c.classList.remove(\"active\"));
  6014.           sections.forEach((s) => s.classList.remove(\"show\"));
  6015.           // Ajouter la classe active à la carte cliquée
  6016.           this.classList.add(\"active\");
  6017.           // Récupérer la cible et afficher la bonne section
  6018.           const targetId = this.getAttribute(\"data-bs-target\");
  6019.           const targetSection = document.querySelector(targetId);
  6020.           if (targetSection) {
  6021.             targetSection.classList.add(\"show\");
  6022.           }
  6023.         });
  6024.       });
  6025.     });
  6026.     document.addEventListener(\"DOMContentLoaded\", function () {
  6027.       // Initialisation du carrousel Splide
  6028.       var splide = new Splide(\"#imageSlider\", {
  6029.         type: \"loop\",
  6030.         perPage: 1,
  6031.         autoplay: true,
  6032.         interval: 6000,
  6033.         pauseOnHover: false,
  6034.         pauseOnFocus: false,
  6035.         pagination: false, // Désactive la pagination
  6036.         arrows: false,
  6037.       });
  6038.       splide.mount();
  6039.       // Fonction pour faire défiler automatiquement vers la section suivante avec un ajustement personnalisé de la hauteur
  6040.       function scrollToNextSection() {
  6041.         const targetSection = document.getElementById(\"scrollTarget\");
  6042.         if (targetSection) {
  6043.           const targetPosition =
  6044.             targetSection.getBoundingClientRect().top + window.scrollY; // Position de la section
  6045.           const adjustedPosition = targetPosition - 50; // Réduit la hauteur du scroll de 150px (ajustez selon vos besoins)
  6046.           // Scroll vers la position ajustée
  6047.           window.scrollTo({
  6048.             top: adjustedPosition,
  6049.             behavior: \"smooth\",
  6050.           });
  6051.         }
  6052.       }
  6053.       // Démarrer le timer pour le scroll automatique après 10 secondes
  6054.       setTimeout(scrollToNextSection, 5000); // 10 secondes
  6055.     });
  6056.   </script>
  6057.   <script>
  6058.         document.addEventListener('DOMContentLoaded', function () {
  6059.             var myModal = new bootstrap.Modal(document.getElementById('PubProd'));
  6060.             myModal.show();
  6061.         });
  6062.         // Function to close the modal
  6063.     function closeModal() {
  6064.         var myModal = bootstrap.Modal.getInstance(document.getElementById('PubProd'));
  6065.         if (myModal) {
  6066.             myModal.hide();
  6067.         }
  6068.     }
  6069.     const favoriteButton = document.querySelector('.fav-button');
  6070.     favoriteButton.addEventListener('click', () => {
  6071.         // Ajouter la classe 'active' pour déclencher l'éclat
  6072.         favoriteButton.classList.add('active');
  6073.         // Retirer l'animation après qu'elle soit jouée
  6074.         setTimeout(() => {
  6075.             favoriteButton.classList.remove('active');
  6076.         }, 600); // La durée doit correspondre à celle de l'animation
  6077.     });
  6078.     
  6079.     //const HeartAddButton = document.querySelector('.IconDelete');
  6080.     \$(\".IconDelete\").on('click', () => {
  6081.         // Ajouter la classe 'active' pour déclencher l'éclat
  6082.         favoriteButton.classList.add('active');
  6083.         // Retirer l'animation après qu'elle soit jouée
  6084.         setTimeout(() => {
  6085.             favoriteButton.classList.remove('active');
  6086.         }, 600); // La durée doit correspondre à celle de l'animation
  6087.     });
  6088.     \$(document).ready(function() {
  6089.         // Attach click event to collapse triggers
  6090.         const lastCard = \$('.date-card.modern-card.active');
  6091.         const lastTargetId = lastCard.attr('data-bs-target');
  6092.         if (lastTargetId) {
  6093.             \$(lastTargetId).collapse('show'); // Expand the last collapse section
  6094.             LoadImagesCloud(\$(lastTargetId)); // Load images for the last day
  6095.         }
  6096.         \$('[data-bs-toggle=\"collapse\"]').on('click', function() {
  6097.             var targetId = \$(this).attr('data-bs-target'); // Get the target ID
  6098.             \$('.date-card.modern-card').removeClass('active'); // Remove 'active' class from all cards
  6099.             \$(this).addClass('active'); // Add 'active' class to the clicked card
  6100.             LoadImagesCloud(\$(targetId)); // Ensure this function works as expected
  6101.                // Hide all other collapses except the one clicked
  6102.                \$('[data-bs-target]').each(function() {
  6103.                 var currentTargetId = \$(this).attr('data-bs-target');
  6104.                 // If the current collapse is not the one clicked, hide it
  6105.                 if (currentTargetId !== targetId) {
  6106.                     \$(currentTargetId).collapse('hide');
  6107.                     //\$('[data-bs-toggle=\"collapse\"]').removeClass('active'); // Remove active class from all cards
  6108.                     //Modifier leurs style en non active aussi
  6109.                 }
  6110.             });
  6111.         });
  6112.     });
  6113.     function rotateIcone(iconId) {
  6114.         // Use the icon ID to target the specific element
  6115.         var icon = \$('#' + iconId);
  6116.         // Toggle the rotate-right class to apply rotation
  6117.         if (icon.hasClass('rotate-right')) {
  6118.             icon.removeClass('rotate-right'); // Remove rotation class
  6119.         } else {
  6120.             icon.addClass('rotate-right'); // Add rotation class
  6121.         }
  6122.     }
  6123.             \$(document).ready(function () {
  6124.                 \$total1 = parseInt(\$(\"#esphoto\").find('strong').html().replace('(', '').replace(')', ''));
  6125.                 \$('[data-bs-toggle=\"tooltip\"]').tooltip();
  6126.                 {% if app.session.get(\"paymentmoniteco\") %}
  6127.                 {% if app.session.get(\"paymentmoniteco\") == \"succses\" %}
  6128.                 Swal.fire({
  6129.                     icon: 'success',
  6130.                     title: ' succès ',
  6131.                     text: 'votre commande est validée'
  6132.                 });
  6133.                 {% endif %}
  6134.                 {% endif %}
  6135.                 if (\$total1 > 0) {
  6136.                     \$('.iconeFleche').first().click();
  6137.                     //  \$([document.documentElement, document.body]).animate({
  6138.                     //  scrollTop: \$('.iconeFleche').last().offset().top
  6139.                     //  }, );
  6140.                 }
  6141.                 else {
  6142.                     \$(window).scrollTop(0);
  6143.                 }
  6144.                 var slider = \$('.responsive').slick({
  6145.                     infinite: true,
  6146.                     slidesToShow: 1,
  6147.                     slidesToScroll: 1,
  6148.                     autoplay: true,
  6149.                     autoplaySpeed: 4000,
  6150.                     pauseOnFocus: false,
  6151.                     pauseOnHover: false,
  6152.                     draggable: false,
  6153.                     fade: true
  6154.                 });
  6155.                 \$('.responsive').css('display', 'block');
  6156.                 \$('.namePRD').css('display', 'block');
  6157.                 var currSlide = 0;
  6158.                 var nextSlide = 0;
  6159.                 slider.on('afterChange', function (event, slick, currentSlide) {
  6160.                     console.log(typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\");
  6161.                     if (typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\") {
  6162.                         setTimeout(function () {
  6163.                             \$('.slick-active .imgproduit1').removeClass('animated fadeIn');
  6164.                             \$('.slick-active .imgproduit1').addClass('animated fadeOut');
  6165.                             \$('.slick-active .imgproduit1').css('display', 'none');
  6166.                             \$('.slick-active .imgproduit2').css('display', 'block');
  6167.                             \$('.slick-active .imgproduit2').removeClass('animated fadeOut');
  6168.                             \$('.slick-active .imgproduit2').addClass('animated fadeIn');
  6169.                         }, 2000);
  6170.                     }
  6171.                 });
  6172.                 slider.on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  6173.                     currSlide = currentSlide;
  6174.                     \$('.imgproduit2').each(function () {
  6175.                         \$(this).removeClass('animated fadeIn');
  6176.                         \$(this).addClass('animated fadeOut');
  6177.                         \$(this).css('display', 'none');
  6178.                     });
  6179.                     \$('.imgproduit1').each(function () {
  6180.                         \$(this).css('display', 'block');
  6181.                         \$(this).removeClass('animated fadeOut');
  6182.                         \$(this).addClass('animated fadeIn');
  6183.                     });
  6184.                 });
  6185.                 \$('.columnPub').each(function () {
  6186.                     \$(this).slick({
  6187.                         infinite: true,
  6188.                         speed: 50,
  6189.                         fade: true,
  6190.                         slidesToShow: 1,
  6191.                         slidesToScroll: 1,
  6192.                         autoplay: true,
  6193.                         pauseOnFocus: false,
  6194.                         pauseOnHover: false,
  6195.                         draggable: false
  6196.                     });
  6197.                     \$(this).css('display', 'block');
  6198.                 });
  6199.                 \$(\"#offrePack\").click();
  6200.                 {%if app.user.showpubprod != 'false' %}
  6201.                 \$('#btnPubProd').click();
  6202.                 \$('.modal-backdrop').css('background-color', 'rgba(0, 0, 0, 0.2)');
  6203.                 {% endif %}
  6204.             });
  6205.             \$(\"#closeImage\").click(function () {
  6206.                 \$('#myModalImage').css('display', \"none\");
  6207.             });
  6208.             \$.ajax({
  6209.                 type: \"POST\",
  6210.                 url: \"{{ path(\"delateSession_parent\") }}\",
  6211.                 success: function () { }
  6212.             });
  6213.             function afficheDiv(elem) {
  6214.                 \$('.nav-link').each(function () {
  6215.                     \$(this).removeClass('active');
  6216.                 });
  6217.                 elem.addClass('active');
  6218.                 if (elem.attr('id') === \"esphoto\" || elem.attr('id') === \"esphotoMobile\") {
  6219.                     \$(\"#espacphoto\").show();
  6220.                     \$(\"#espacemessage\").hide();
  6221.                     \$(\"#espaceMa_selection\").hide();
  6222.                     pageMenu = 'MonSejour'
  6223.                     \$(this).addClass('active');
  6224.                    \$('#imageActifphoto').css('display', 'block');
  6225.                      \$('#imagenoActifphoto').css('display', 'none');
  6226.                    \$('#VocalActivee').css('display', 'none');
  6227.                      \$('#noActifVocal').css('display', 'block');
  6228.                 }
  6229.                 if (elem.attr('id') === \"esmessage\" || elem.attr('id') === \"esmessageMobile\") {
  6230.                     \$(\"#espacphoto\").hide();
  6231.                     \$(\"#espaceMa_selection\").hide();
  6232.                     \$(\"#espacemessage\").show();
  6233.                     pageMenu = 'BoiteVocale'
  6234.                     \$(\"#espaceMa_selection\").hide();
  6235.                     \$(this).addClass('active');
  6236.                   \$('#imageActifphoto').css('display', 'none');
  6237.                      \$('#imagenoActifphoto').css('display', 'block');
  6238.                    \$('#VocalActivee').css('display', 'block');
  6239.                      \$('#noActifVocal').css('display', 'none');
  6240.                 }
  6241.                 if (elem.attr('id') === \"esselection\" || elem.attr('id') === \"esselectionMobile\") {
  6242.                     \$(\"#espacphoto\").hide();
  6243.                     \$(\"#espacemessage\").hide();
  6244.                     \$(\"#espaceMa_selection\").show();
  6245.                     \$(homeNavmob).removeClass('bi bi-house-door-fill');
  6246.                     \$(homeNavmob).addClass('bi bi-house-door');
  6247.                     \$(micromob).removeClass('bi bi-mic-fill');
  6248.                     \$(micromob).addClass('bi bi-mic');
  6249.                     \$(selecNavmob).removeClass('bi bi-heart');
  6250.                     \$(selecNavmob).addClass('bi bi-heart-fill');
  6251.                 }
  6252.             }
  6253.             function LoadImagesCloud(\$element) {
  6254.                 \$element.find('.photo-zoom img').each(function (\$this) {
  6255.                     if (\$(this).attr('data-src') != \$(this).attr('src')) {
  6256.                         \$(this).attr('src', \$(this).attr('data-src'));
  6257.                     }
  6258.                 });
  6259.             }
  6260.       function afficheDivFooterMobile(elem) {
  6261.              if(elem =='esphotoMobile') {
  6262.                    \$(\"#espacphoto\").show();
  6263.                     \$(\"#espacemessage\").hide();
  6264.                     \$(\"#espaceMa_selection\").hide();
  6265.                     \$(\"#storevide\").hide();
  6266.                     \$(\"#storefull\").show();
  6267.                     \$(\"#fullphoto\").show();
  6268.                     \$(\"#videphoto\").hide()
  6269.                     \$(\"#vocalfull\").hide();
  6270.                     \$(\"#vocalvide\").show();
  6271.                 }
  6272.                 if (elem === \"esmessageMobile\" ) {
  6273.                     \$(\"#espacphoto\").hide();
  6274.                     \$(\"#espacemessage\").show();
  6275.                     \$(\"#espaceMa_selection\").hide();
  6276.                     \$(\"#storefull\").hide();
  6277.                     \$(\"#storevide\").show();
  6278.                     \$(\"#fullphoto\").hide();
  6279.                     \$(\"#videphoto\").show()
  6280.                     \$(\"#vocalfull\").show();
  6281.                     \$(\"#vocalvide\").hide();
  6282.                 }
  6283.             }
  6284.             function permutation(elem) {
  6285.                 \$(\".IconImag\").each(function () {
  6286.                     \$(this).removeClass('active');
  6287.                 });
  6288.                 elem.addClass(\"active\");
  6289.             }
  6290.             function per(elem) {
  6291.                 \$(\".list-group-item \").each(function () {
  6292.                     \$(this).removeClass('show');
  6293.                 });
  6294.                 elem.addClass(\"active\");
  6295.                 \$(\"#iconeFleche\").addClass('active');
  6296.             }
  6297.            function setidattach(id) {
  6298.                 \$(\"#idattachipmut\").val(id)
  6299.             }
  6300.             var ParentAjouterALL_fav = \"{{ path('ParentAjouterALL_fav') }}\";
  6301.             function AllFavoris(\$idSejour) {
  6302.                 \$('#SelectALL').html('Désélectionner tout');
  6303.                 \$('#SelectALL').css('pointer-events', 'none');
  6304.                 \$('#SelectALL').css('opacity', '0.5');
  6305.                 \$('#SelectALL').css('cursor', 'no-drop');
  6306.                 \$('#SelectALL1').html('Désélectionner tout');
  6307.                 \$('#SelectALL1').css('pointer-events', 'none');
  6308.                 \$('#SelectALL1').css('opacity', '0.5');
  6309.                 \$('#SelectALL1').css('cursor', 'no-drop');
  6310.                 \$data = { 'idSejour': \$idSejour }
  6311.                 \$.ajax({
  6312.                     type: \"POST\",
  6313.                     url: \"{{ path('ParentAjouterALL_fav') }}\",
  6314.                     data: \$data,
  6315.                     success: function () {
  6316.                         location.reload();
  6317.                     }
  6318.                 });
  6319.             }
  6320.             function RemoveAllFavoris(\$idSejour) {
  6321.                 \$('#SelectALL').html('Sélectionner tout');
  6322.                 \$('#SelectALL').css('pointer-events', 'none');
  6323.                 \$('#SelectALL').css('opacity', '0.5');
  6324.                 \$('#SelectALL').css('cursor', 'no-drop');
  6325.                 \$('#SelectALL1').html('Sélectionner tout');
  6326.                 \$('#SelectALL1').css('pointer-events', 'none');
  6327.                 \$('#SelectALL1').css('opacity', '0.5');
  6328.                 \$('#SelectALL1').css('cursor', 'no-drop');
  6329.                 \$data = { 'idSejour': \$idSejour }
  6330.                 \$.ajax({
  6331.                     type: \"POST\",
  6332.                     url: \"{{ path('ParentSupprimer_ALLfav') }}\",
  6333.                     data: \$data,
  6334.                     success: function () {
  6335.                         location.reload();
  6336.                     }
  6337.                 });
  6338.             }
  6339.             // Get the elements with class=\"column\"
  6340.             var elements = document.getElementsByClassName(\"column\");
  6341.             // Declare a \"loop\" variable
  6342.             var i;
  6343.             // Full-width images
  6344.             function Four() {
  6345.                 for (i = 0; i < elements.length; i++) {
  6346.                     elements[i].style.flex = \"0 0 25%\";
  6347.                 }
  6348.                 \$('.IconDelete').attr('class', 'IconDelete ');
  6349.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  6350.                 \$('.localistaion').css('visibility', 'visible');
  6351.                 \$('.localistaion').attr('class', 'localistaion');
  6352.                 \$('.legend').css('visibility', 'visible');
  6353.                 \$('.columnPub').each(function () {
  6354.                     \$(this).css('max-width', '25%');
  6355.                     \$(this).find('.slick-list').removeClass('miniature');
  6356.                     \$(this).find('.single_service').removeClass('miniature');
  6357.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  6358.                 });
  6359.             }
  6360.             // Two images side by side
  6361.             function six() {
  6362.                 for (i = 0; i < elements.length; i++) {
  6363.                     elements[i].style.flex = \"0 0 15%\";
  6364.                 }
  6365.                 \$('.column').css('padding', '0px 10px 0px 0px');
  6366.                 \$('.localistaion').attr('class', 'localistaion localistaionsix');
  6367.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletesix');
  6368.                 \$('.legend').css('visibility', 'visible');
  6369.                 \$('.photo-zoom ').attr('class', 'photo-zoom heightimg');
  6370.                 \$('.columnPub').each(function () {
  6371.                     \$(this).css('max-width', '15%');
  6372.                     \$(this).find('.slick-list').addClass('miniature');
  6373.                     \$(this).find('.single_service').addClass('miniature');
  6374.                     \$(this).find('.bottomdivpub').addClass('miniature');
  6375.                 });
  6376.             }
  6377.             // Four images side by side
  6378.             function two() {
  6379.                 for (i = 0; i < elements.length; i++) {
  6380.                     elements[i].style.flex = \"0 0 40%\";
  6381.                 }
  6382.                 \$('.column').css('padding', '14px 10px');
  6383.                 \$('.column').css('max-width', '40%');
  6384.                 \$('.localistaion').css('visibility', 'visible');
  6385.                 \$('.legend').css('visibility', 'visible');
  6386.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  6387.                 \$('.localistaion').attr('class', 'localistaion localistaiontwo');
  6388.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletetwo');
  6389.                 \$('.legend').attr('class', 'legend legendtwo');
  6390.                 \$('.columnPub').each(function () {
  6391.                     \$(this).css('max-width', '40%');
  6392.                     \$(this).find('.slick-list').removeClass('miniature');
  6393.                     \$(this).find('.single_service').removeClass('miniature');
  6394.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  6395.                 });
  6396.             }
  6397.             function hidePopPub() {
  6398.                 \$('.modal-backdrop').css('background-color', 'rgb(0, 0, 0)');
  6399.             }
  6400.             function changeHref(elem, newhref) {
  6401.                 \$(elem).parent().attr('href', newhref);
  6402.             }
  6403.             function VerifNbLikes(nblikes) {
  6404.                 \$('#allerAlaBoutique').click();
  6405.             }
  6406.     function handleMenuClick(menuId, pageMenu) {
  6407.         // Reset all icons
  6408.         document.getElementById('imagenoActifphoto').style.display = 'block';
  6409.         document.getElementById('imageActifphoto').style.display = 'none';
  6410.         document.getElementById('nofavorisVocal').style.display = 'block';
  6411.         document.getElementById('favorisActive').style.display = 'none';
  6412.         document.getElementById('noActifVocal').style.display = 'block';
  6413.         document.getElementById('VocalActivee').style.display = 'none';
  6414.         // Set selected icon
  6415.         if (menuId === 'photo') {
  6416.             document.getElementById('imagenoActifphoto').style.display = 'none';
  6417.             document.getElementById('imageActifphoto').style.display = 'block';
  6418.         } else if (menuId === 'selection') {
  6419.             document.getElementById('nofavorisVocal').style.display = 'none';
  6420.             document.getElementById('favorisActive').style.display = 'block';
  6421.         } else if (menuId === 'message') {
  6422.             document.getElementById('noActifVocal').style.display = 'none';
  6423.             document.getElementById('VocalActivee').style.display = 'block';
  6424.         }
  6425.         // Handle any other necessary logic
  6426.         \$('#list-tab-photo').removeClass('show');
  6427.         \$('#list-tab-message').removeClass('show');
  6428.         afficheDiv(\$(`#\${menuId}`));
  6429.     }
  6430.   </script>
  6431.   <script>
  6432.     \$(document).ready(function () {
  6433.       \$(\"#PubProd\").on(\"hidden.bs.modal\", function () {
  6434.         \$(document).trigger(\"modalClosed\");
  6435.       });
  6436.     });
  6437.   </script>
  6438.   <script>
  6439.     \$(document).ready(function () {
  6440.       \$(\"#noShow\").on(\"change\", function () {
  6441.         if (\$(this).is(\":checked\")) {
  6442.           \$.ajax({
  6443.             url: \"/Parent/showpub\",
  6444.             type: \"POST\",
  6445.             dataType: \"json\",
  6446.             success: function (response) {
  6447.               if (response.status === \"success\") {
  6448.                 console.log(\"User showpubprod updated successfully.\");
  6449.               } else {
  6450.                 console.log(\"Error:\", response.message);
  6451.               }
  6452.             },
  6453.             error: function (xhr, status, error) {
  6454.               console.log(\"AJAX Error:\", error);
  6455.             },
  6456.           });
  6457.         }
  6458.       });
  6459.     });
  6460.   </script>
  6461. </div>
  6462. <!-- Script pour la sidebar des favoris -->
  6463. <script>
  6464.   \$(document).ready(function() {
  6465.     // Ouvrir la sidebar
  6466.     \$(\"#openFavoritesSidebar\").click(function() {
  6467.       \$(\".favorites-sidebar\").addClass(\"open\");
  6468.       loadFavorites();
  6469.     });
  6470.     
  6471.     // Fermer la sidebar
  6472.     \$(\".favorites-close\").click(function() {
  6473.       \$(\".favorites-sidebar\").removeClass(\"open\");
  6474.     });
  6475.     
  6476.     // Charger les favoris
  6477.     function loadFavorites() {
  6478.       \$.ajax({
  6479.         url: \"/Parent/mes-favoris\",
  6480.         type: \"GET\",
  6481.         dataType: \"json\",
  6482.         beforeSend: function() {
  6483.           \$(\"#favorites-grid\").html(\"<div style='text-align:center'>Chargement...</div>\");
  6484.         },
  6485.         success: function(data) {
  6486.           \$(\"#favorites-grid\").empty();
  6487.           
  6488.           if (data.data && data.data.length > 0) {
  6489.             \$(\"#favorites-empty-state\").hide();
  6490.             
  6491.             \$.each(data.data, function(i, fav) {
  6492.               var item = \$(\"<div class='favorite-item'></div>\");
  6493.               var img = \$(\"<img>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  6494.               var overlay = \$(\"<div class='favorite-overlay'></div>\");
  6495.         
  6496.               
  6497.               btn.click(function(e) {
  6498.                 e.preventDefault();
  6499.                 e.stopPropagation();
  6500.                 removeFavorite(fav.id);
  6501.               });
  6502.               
  6503.               overlay.append(btn);
  6504.               item.append(img).append(overlay);
  6505.               \$(\"#favorites-grid\").append(item);
  6506.             });
  6507.             
  6508.             \$(\"#favorites-counter\").text(data.data.length);
  6509.             var percentage = (data.data.length / 10) * 100;
  6510.             \$(\"#favorites-progress\").css(\"width\", percentage + \"%\");
  6511.             
  6512.           } else {
  6513.             \$(\"#favorites-empty-state\").show();
  6514.             \$(\"#favorites-counter\").text(\"0\");
  6515.             \$(\"#favorites-progress\").css(\"width\", \"0%\");
  6516.           }
  6517.         },
  6518.         error: function() {
  6519.           \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center'>Erreur de chargement</div>\");
  6520.         }
  6521.       });
  6522.     }
  6523.     
  6524.     // Supprimer un favori
  6525.     function removeFavorite(id) {
  6526.       \$.ajax({
  6527.         url: \"/Parent/remove-favorite/\" + id,
  6528.         type: \"POST\",
  6529.         success: function() {
  6530.           loadFavorites();
  6531.           
  6532.           // Mettre à jour le compteur global
  6533.           var count = parseInt(\$(\"#likeCount\").text());
  6534.           if (!isNaN(count)) {
  6535.             \$(\"#likeCount\").text(count - 1);
  6536.           }
  6537.           
  6538.           var countFav = parseInt(\$(\"#mesFavCount\").text());
  6539.           if (!isNaN(countFav)) {
  6540.             \$(\"#mesFavCount\").text(countFav - 1);
  6541.           }
  6542.         },
  6543.         error: function() {
  6544.           alert(\"Erreur lors de la suppression du favori\");
  6545.         }
  6546.       });
  6547.     }
  6548.   });
  6549. </script>
  6550. <!-- Script pour la sidebar des favoris -->
  6551. <script>
  6552. \$(document).ready(function() {
  6553.     // Fonctions pour ouvrir/fermer la sidebar
  6554.     \$(\"#openFavoritesSidebar\").click(function() {
  6555.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  6556.         loadFavorites();
  6557.     });
  6558.     
  6559.     \$(\"#close-favorites-btn\").click(function() {
  6560.         \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  6561.     });
  6562.     
  6563.     // Fermer en cliquant en dehors
  6564.     \$(document).click(function(event) {
  6565.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  6566.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  6567.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  6568.             \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  6569.         }
  6570.     });
  6571.     
  6572.    // Variables globales
  6573. let selectedFavorites = [];
  6574. let allFavorites = [];
  6575. let coverPhotoId = null; // ID de la photo de couverture
  6576. // Fonction pour mettre à jour la sidebar
  6577. function loadFavorites() {
  6578.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  6579.     
  6580.     \$.ajax({
  6581.         url: \"/Parent/mes-favoris\",
  6582.         type: \"GET\",
  6583.         dataType: \"json\",
  6584.         success: function(data) {
  6585.             \$(\"#favorites-grid\").empty();
  6586.             allFavorites = data.data || [];
  6587.             
  6588.             if (allFavorites.length > 0) {
  6589.                 \$(\"#favorites-empty-state\").hide();
  6590.                 
  6591.                 // Ajouter l'option de photo de couverture au-dessus de la grille
  6592.                 if (!\$(\"#cover-photo-section\").length) {
  6593.                     const coverSection = \$(`
  6594.                         <div id=\"cover-photo-section\" style=\"margin-bottom:15px;\">
  6595.                             <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;\">
  6596.                                 <h4 style=\"margin:0;font-size:15px;color:#333;\">Photo de couverture</h4>
  6597.                                 <span style=\"font-size:12px;color:#777;\">Pour la personnalisation des produits</span>
  6598.                             </div>
  6599.                             <div id=\"cover-photo-container\" style=\"height:120px;background:#f5f5f5;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border:1px dashed #ccc;\">
  6600.                                 <div id=\"cover-photo-placeholder\" style=\"text-align:center;padding:15px;color:#777;\">
  6601.                                     <i class=\"bi bi-image\" style=\"font-size:24px;display:block;margin-bottom:8px;\"></i>
  6602.                                     <p style=\"margin:0;font-size:13px;\">Sélectionnez une photo comme couverture</p>
  6603.                                 </div>
  6604.                                 <div id=\"cover-photo-preview\" style=\"display:none;width:100%;height:100%;position:relative;\">
  6605.                                     <img src=\"\" style=\"width:100%;height:100%;object-fit:cover;\" />
  6606.                                     <button id=\"remove-cover-photo\" style=\"position:absolute;top:5px;right:5px;background:#F56040;color:white;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;\">
  6607.                                         <i class=\"bi bi-x\"></i>
  6608.                                     </button>
  6609.                                 </div>
  6610.                             </div>
  6611.                         </div>
  6612.                     `);
  6613.                     
  6614.                     \$(\"#photos-content\").prepend(coverSection);
  6615.                     
  6616.                     // Événement pour retirer la photo de couverture
  6617.                     \$(\"#remove-cover-photo\").click(function(e) {
  6618.                         e.stopPropagation();
  6619.                         setCoverPhoto(null);
  6620.                     });
  6621.                 }
  6622.                 
  6623.                 // Mettre à jour l'affichage de la photo de couverture
  6624.                 updateCoverPhotoDisplay();
  6625.                 
  6626.                 // Générer la grille de photos
  6627.                 \$.each(allFavorites, function(i, fav) {
  6628.                     var isSelected = selectedFavorites.includes(fav.id);
  6629.                     var isCoverPhoto = (coverPhotoId === fav.id);
  6630.                     
  6631.                     // Conteneur principal avec styles conditionnels
  6632.                     var item = \$(\"<div class='favorite-item' data-id='\" + fav.id + \"' style='position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;transition:all 0.2s;border:3px solid \" + (isSelected ? \"#F56040\" : (isCoverPhoto ? \"#4CAF50\" : \"transparent\")) + \";'></div>\");
  6633.                     
  6634.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  6635.                     
  6636.                     // Badge de sélection
  6637.                     var selectionBadge = \$(\"<div class='selection-badge' style='position:absolute;top:5px;right:5px;width:22px;height:22px;border-radius:50%;background:#F56040;display:\" + (isSelected ? \"flex\" : \"none\") + \";align-items:center;justify-content:center;color:white;font-size:12px;z-index:10;'><i class='bi bi-check'></i></div>\");
  6638.                     
  6639.                     // Badge de photo de couverture
  6640.                     var coverBadge = \$(\"<div class='cover-badge' style='position:absolute;top:5px;left:5px;padding:2px 6px;background:#4CAF50;color:white;font-size:10px;border-radius:3px;display:\" + (isCoverPhoto ? \"block\" : \"none\") + \";z-index:10;'><i class='bi bi-star-fill' style='margin-right:3px;font-size:8px;'></i>Couverture</div>\");
  6641.                     
  6642.                     // Overlay simple pour effet au survol
  6643.                     var hoverOverlay = \$(\"<div class='hover-overlay' style='position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.2);opacity:0;transition:opacity 0.2s;z-index:5;'></div>\");
  6644.                     
  6645.                     // Actions sur hover
  6646.                     var actionsOverlay = \$(\"<div class='actions-overlay' style='position:absolute;bottom:5px;left:5px;right:5px;display:flex;justify-content:center;gap:8px;opacity:0;transition:opacity 0.2s;z-index:15;'></div>\");
  6647.                     
  6648.                     // Bouton pour définir comme photo de couverture
  6649.                     var setCoverBtn = \$(\"<button style='background:\" + (isCoverPhoto ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\") + \";color:\" + (isCoverPhoto ? \"white\" : \"#333\") + \";border:none;border-radius:3px;font-size:11px;padding:5px 8px;cursor:pointer;'><i class='bi bi-star\" + (isCoverPhoto ? \"-fill\" : \"\") + \"' style='margin-right:3px;'></i>Couverture</button>\");
  6650.                     
  6651.                     setCoverBtn.click(function(e) {
  6652.                         e.stopPropagation();
  6653.                         if (isCoverPhoto) {
  6654.                             setCoverPhoto(null);
  6655.                         } else {
  6656.                             setCoverPhoto(fav.id);
  6657.                         }
  6658.                     });
  6659.                     
  6660.                     actionsOverlay.append(setCoverBtn);
  6661.                     
  6662.                     // Ajouter effet de survol
  6663.                     item.hover(
  6664.                         function() { 
  6665.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"1\");
  6666.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"1\");
  6667.                         },
  6668.                         function() { 
  6669.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"0\");
  6670.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"0\");
  6671.                         }
  6672.                     );
  6673.                     
  6674.                     // Gérer le clic pour la sélection
  6675.                     item.click(function(e) {
  6676.                         e.stopPropagation();
  6677.                         toggleSelection(\$(this).data('id'));
  6678.                     });
  6679.                     
  6680.                     item.append(img).append(hoverOverlay).append(selectionBadge).append(coverBadge).append(actionsOverlay);
  6681.                     
  6682.                     // Ajouter explicitement une classe pour le style
  6683.                     item.addClass(\"no-trash-button\");
  6684.                     
  6685.                     \$(\"#favorites-grid\").append(item);
  6686.                 });
  6687.                 
  6688.                 // Supprimer tout bouton de suppression qui pourrait être ajouté dynamiquement
  6689.                 setTimeout(function() {
  6690.                     \$(\".favorite-item .remove-favorite, .favorite-item button:has(.bi-trash), .favorite-overlay button\").remove();
  6691.                 }, 100);
  6692.                 
  6693.                 \$(\"#favorites-counter\").text(allFavorites.length);
  6694.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  6695.                 updateProductsView();
  6696.                 
  6697.             } else {
  6698.                 \$(\"#favorites-empty-state\").show();
  6699.                 \$(\"#favorites-counter\").text(\"0\");
  6700.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  6701.                 \$(\"#selection-count\").text(\"0\");
  6702.                 updateProductsView();
  6703.             }
  6704.         },
  6705.         error: function() {
  6706.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  6707.         }
  6708.     });
  6709. }
  6710. // Fonction pour définir la photo de couverture
  6711. function setCoverPhoto(id) {
  6712.     coverPhotoId = id;
  6713.     
  6714.     // Mettre à jour l'affichage
  6715.     updateCoverPhotoDisplay();
  6716.     
  6717.     // Mettre à jour le style des photos dans la grille
  6718.     \$(\".favorite-item\").each(function() {
  6719.         const itemId = \$(this).data('id');
  6720.         const isSelected = selectedFavorites.includes(itemId);
  6721.         const isCover = (itemId === coverPhotoId);
  6722.         
  6723.         // Mettre à jour la bordure
  6724.         \$(this).css(\"border\", \"3px solid \" + (isSelected ? \"#F56040\" : (isCover ? \"#4CAF50\" : \"transparent\")));
  6725.         
  6726.         // Mettre à jour le badge de couverture
  6727.         \$(this).find(\".cover-badge\").css(\"display\", isCover ? \"block\" : \"none\");
  6728.         
  6729.         // Mettre à jour le bouton de couverture
  6730.         const coverBtn = \$(this).find(\".actions-overlay button:first\");
  6731.         coverBtn.css({
  6732.             \"background\": isCover ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\",
  6733.             \"color\": isCover ? \"white\" : \"#333\"
  6734.         });
  6735.         coverBtn.find(\"i\").attr(\"class\", \"bi bi-star\" + (isCover ? \"-fill\" : \"\"));
  6736.     });
  6737.     
  6738.     // Enregistrer l'ID de la photo de couverture (si nécessaire pour le backend)
  6739.     if (id) {
  6740.         console.log(\"Photo de couverture définie avec l'ID:\", id);
  6741.         // Ici vous pouvez ajouter une requête AJAX pour enregistrer ce choix sur le serveur
  6742.         
  6743.         // Ajouter automatiquement la photo de couverture à la sélection si elle n'y est pas déjà
  6744.         if (!selectedFavorites.includes(id)) {
  6745.             toggleSelection(id);
  6746.         }
  6747.     } else {
  6748.         console.log(\"Photo de couverture supprimée\");
  6749.     }
  6750. }
  6751. // Mettre à jour l'affichage de la photo de couverture
  6752. function updateCoverPhotoDisplay() {
  6753.     if (coverPhotoId) {
  6754.         // Trouver la photo correspondante
  6755.         const coverPhoto = allFavorites.find(fav => fav.id === coverPhotoId);
  6756.         if (coverPhoto) {
  6757.             \$(\"#cover-photo-placeholder\").hide();
  6758.             \$(\"#cover-photo-preview\").show();
  6759.             \$(\"#cover-photo-preview img\").attr(\"src\", coverPhoto.path);
  6760.         } else {
  6761.             // Si l'ID ne correspond à aucune photo (cas rare)
  6762.             coverPhotoId = null;
  6763.             \$(\"#cover-photo-placeholder\").show();
  6764.             \$(\"#cover-photo-preview\").hide();
  6765.         }
  6766.     } else {
  6767.         \$(\"#cover-photo-placeholder\").show();
  6768.         \$(\"#cover-photo-preview\").hide();
  6769.     }
  6770. }
  6771. // Modifier la fonction updateProductsView pour tenir compte de la photo de couverture
  6772. function updateProductsView() {
  6773.     const current = selectedFavorites.length;
  6774.     const hasCoverPhoto = coverPhotoId !== null;
  6775.     
  6776.     \$(\"#product-photo-count\").text(current);
  6777.     
  6778.     let remainingForAlbum = Math.max(0, 20 - current);
  6779.     let remainingForPochette = Math.max(0, 12 - current);
  6780.     let remainingForPack = Math.max(0, 12 - current);
  6781.     const progressBar = (count, total, color) => `
  6782.         <div style=\"margin: 5px 0;\">
  6783.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  6784.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  6785.             </div>
  6786.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  6787.         </div>
  6788.     `;
  6789.     // Liste des produits
  6790.     const products = [
  6791.         {
  6792.             name: \"Pochette photo (12 photos)\",
  6793.             required: 12,
  6794.             remaining: Math.max(0, 12 - current),
  6795.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  6796.             color: \"#2196f3\",
  6797.             link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  6798.             needsCover: true
  6799.         },
  6800.         {
  6801.             name: \"Pack numérique (20 photos)\",
  6802.             required: 20,
  6803.             remaining: Math.max(0, 20 - current),
  6804.             image: \"/images/produit/photoNumerique.jpg\",
  6805.             color: \"#4caf50\",
  6806.             link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 20}) }}\",
  6807.             needsCover: false
  6808.         },
  6809.        
  6810.       
  6811.     ].sort((a, b) => a.remaining - b.remaining);
  6812.     const productList = products
  6813.         .map((product) => {
  6814.             const count = current;
  6815.             const total = product.required;
  6816.             const remaining = product.remaining;
  6817.             const coverRequired = product.needsCover && !hasCoverPhoto;
  6818.             return `
  6819.                 <li style=\"margin-bottom: 20px; position: relative;\">
  6820.                     \${coverRequired ? `<div style=\"position: absolute; top: 0; right: 0; background: #FFC107; color: #333; font-size: 10px; padding: 2px 6px; border-radius: 3px; z-index: 5;\">
  6821.                         <i class=\"bi bi-exclamation-triangle\"></i> Photo de couverture requise
  6822.                     </div>` : ''}
  6823.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  6824.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  6825.                         <div style=\"flex: 1;\">
  6826.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  6827.                             \${progressBar(count, total, product.color)}
  6828.                             \${
  6829.                                 remaining > 0
  6830.                                 ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  6831.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  6832.                                 </small>`
  6833.                                 : coverRequired
  6834.                                 ? `<button
  6835.                                     style=\"
  6836.                                         margin-top: 5px;
  6837.                                         padding: 6px 12px;
  6838.                                         background-color: #FFC107;
  6839.                                         color: #333;
  6840.                                         border: none;
  6841.                                         border-radius: 5px;
  6842.                                         font-size: 13px;
  6843.                                         cursor: pointer;
  6844.                                     \"
  6845.                                     onclick=\"\$('#tab-photos').click(); /* Rediriger vers l'onglet photos */\"
  6846.                                 >
  6847.                                     Choisir une couverture
  6848.                                 </button>`
  6849.                                 : `<button
  6850.                                     style=\"
  6851.                                         margin-top: 5px;
  6852.                                         padding: 6px 12px;
  6853.                                         background-color: \${product.color};
  6854.                                         color: white;
  6855.                                         border: none;
  6856.                                         border-radius: 5px;
  6857.                                         font-size: 13px;
  6858.                                         cursor: pointer;
  6859.                                     \"
  6860.                                     onclick=\"window.location.href='\${product.link}'\"
  6861.                                 >
  6862.                                     Commander
  6863.                                 </button>`
  6864.                             }
  6865.                         </div>
  6866.                     </div>
  6867.                 </li>
  6868.             `;
  6869.         })
  6870.         .join(\"\");
  6871.     const boutiqueButton = `
  6872.         <li style=\"margin-top: 25px; text-align: center;\">
  6873.             <button
  6874.                 style=\"
  6875.                     padding: 8px 15px;
  6876.                     background-color: #F56040;
  6877.                     color: white;
  6878.                     border: none;
  6879.                     border-radius: 5px;
  6880.                     font-size: 14px;
  6881.                     width: 170px;
  6882.                     height: 40px;
  6883.                     cursor: pointer;
  6884.                 \"
  6885.                 onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  6886.             >
  6887.                 Voir toute la boutique
  6888.             </button>
  6889.         </li>
  6890.     `;
  6891.     \$(\"#product-list\").html(productList + boutiqueButton);
  6892. }
  6893. });
  6894. </script>
  6895. {% endblock %}
  6896. ""Parent/DetailsSejour.html.twig""/var/www/5sur5sejour/templates/Parent/DetailsSejour.html.twig");
  6897.     }
  6898. }